:root{
  --bg:#FAF8F4;
  --surface:#FFFFFF;
  --ink:#1B2430;
  --muted:#5A6472;
  --navy:#0B2545;
  --navy-deep:#071A33;
  --sky:#4C8EDA;
  --ice:#EAF3FB;
  --amber:#F2A93B;
  --amber-deep:#C97F14;
  --line:#E1E7EF;
  --radius:14px;
  --maxw:1100px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0A1220; --surface:#101A2C; --ink:#EDF2F8; --muted:#9FB0C3; --ice:#132238; --line:#213248; --navy:#12335F; --navy-deep:#0A1F3D;
  }
}
:root[data-theme="dark"]{
  --bg:#0A1220; --surface:#101A2C; --ink:#EDF2F8; --muted:#9FB0C3; --ice:#132238; --line:#213248; --navy:#12335F; --navy-deep:#0A1F3D;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth; scroll-padding-top:calc(70px + env(safe-area-inset-top,0px));}
html,body{height:100%;}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  line-height:1.6; -webkit-font-smoothing:antialiased;
  padding-bottom:env(safe-area-inset-bottom,0px);
}
h1,h2,h3,h4{ font-family:'Sora','Inter',sans-serif; margin:0; color:var(--ink); }
p{margin:0;}
a{color:inherit;}
img,svg{display:block; max-width:100%;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px;}
.lang{display:none;}
.lang.active{display:block;}

/* ---------- NAV ---------- */
.nav{
  position:sticky; top:0; top:env(safe-area-inset-top,0px);
  z-index:50; background:var(--surface); border-bottom:1px solid var(--line);
}
.nav-inner{
  max-width:var(--maxw); margin:0 auto; padding:14px 24px;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.brand{display:flex; align-items:center; gap:10px; font-family:'Sora',sans-serif; font-weight:800; font-size:1.25rem; letter-spacing:0.2px; color:var(--navy); text-decoration:none;}
.brand .dot{width:9px; height:9px; border-radius:50%; background:var(--amber); flex:none;}
.nav-links{display:flex; gap:18px; list-style:none; margin:0; padding:0; flex-wrap:wrap;}
.nav-links a{
  font-size:0.88rem; text-decoration:none; color:var(--muted); padding:6px 0; border-bottom:2px solid transparent;
}
.nav-links a:hover, .nav-links a.current{color:var(--navy); border-bottom-color:var(--amber);}
.lang-switch{display:flex; gap:6px; background:var(--ice); border-radius:999px; padding:4px; flex:none;}
.lang-switch button{
  border:none; background:none; cursor:pointer; font:inherit; font-weight:600; font-size:0.8rem;
  padding:6px 11px; border-radius:999px; color:var(--muted);
}
.lang-switch button.on{background:var(--navy); color:#fff;}
@media (max-width:900px){ .nav-links{display:none;} }

/* ---------- BREADCRUMB ---------- */
.breadcrumb{padding:18px 0 0; font-size:0.86rem; color:var(--muted);}
.breadcrumb a{text-decoration:none; color:var(--navy); font-weight:600;}

/* ---------- HERO (image-led product/page hero) ---------- */
.hero-img-section{background:var(--navy);}
.hero-img-grid{display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:0;}
.hero-img-copy{padding:56px 0; padding-left:24px; padding-right:36px; color:#fff;}
.hero-img-copy .kicker{color:var(--amber); font-weight:700; font-size:0.85rem; margin-bottom:10px;}
.hero-img-copy h1{font-size:clamp(1.7rem,3.4vw,2.5rem); font-weight:700; line-height:1.2;}
.hero-img-copy .sub{margin-top:16px; color:#C9D6E8; font-size:1.02rem; max-width:46ch;}
.hero-img-photo{background:#fff; overflow:hidden; display:flex; align-items:center; justify-content:center; min-height:280px;}
.hero-img-photo img{width:100%; height:100%; object-fit:cover;}
@media (max-width:860px){
  .hero-img-grid{grid-template-columns:1fr;}
  .hero-img-copy{padding:40px 24px 28px;}
}

/* ---------- LANDING HERO ---------- */
.hero{background:var(--navy); color:#fff;}
.hero-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:0; align-items:center;}
.hero-copy{padding:60px 0 48px; padding-left:24px; padding-right:32px;}
.hero-copy h1{font-size:clamp(1.9rem, 4vw, 2.7rem); font-weight:700; line-height:1.18; max-width:16ch;}
.hero-copy .sub{margin-top:18px; color:#C9D6E8; font-size:1.04rem; max-width:46ch;}
.hero-cta{display:flex; gap:12px; margin-top:28px; flex-wrap:wrap;}
.btn{display:inline-flex; align-items:center; gap:8px; padding:13px 22px; border-radius:10px; font-weight:600; font-size:0.95rem; text-decoration:none; border:1px solid transparent; cursor:pointer;}
.btn-primary{background:var(--amber); color:var(--navy-deep);}
.btn-primary:hover{background:#e69a25;}
.btn-ghost{border-color:rgba(255,255,255,0.35); color:#fff;}
.btn-ghost:hover{border-color:#fff;}
.btn-navy{border:1px solid var(--navy); color:var(--navy); background:transparent;}
.btn-navy:hover{background:var(--navy); color:#fff;}
.btn-whatsapp{background:#25D366; color:#fff;}
.btn-whatsapp:hover{background:#20bd5a;}
.btn-whatsapp svg{width:18px; height:18px;}

/* ---------- FLOATING WHATSAPP BUTTON ---------- */
.wa-float{
  position:fixed; right:18px; bottom:calc(18px + env(safe-area-inset-bottom,0px)); z-index:80;
  width:56px; height:56px; border-radius:50%; background:#25D366;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 20px rgba(0,0,0,0.25); text-decoration:none;
}
.wa-float:hover{background:#20bd5a;}
.wa-float svg{width:28px; height:28px; color:#fff;}
.hero-photo{overflow:hidden;}
.hero-photo img{width:100%; height:100%; object-fit:cover; display:block; min-height:260px;}
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr;}
  .hero-copy{padding:44px 24px 28px;}
}

/* ---------- GENERIC SECTION ---------- */
section{padding:64px 0;}
.section-head{max-width:62ch; margin-bottom:36px;}
.section-head h2{font-size:clamp(1.4rem,3vw,2rem); font-weight:700;}
.section-head p{margin-top:12px; color:var(--muted); font-size:1.02rem;}
.band-ice{background:var(--ice);}
.band-surface{background:var(--surface);}

/* ---------- TEASER GRID (index -> product pages) ---------- */
.teaser-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.teaser-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; text-decoration:none; color:var(--ink); display:flex; flex-direction:column;}
.teaser-card .thumb{height:150px; overflow:hidden; background:var(--ice);}
.teaser-card .thumb img{width:100%; height:100%; object-fit:cover;}
.teaser-card .thumb.icon{display:flex; align-items:center; justify-content:center;}
.teaser-card .thumb.icon svg{width:52px; height:52px; color:var(--navy);}
.teaser-body{padding:18px 20px 22px;}
.teaser-body h3{font-size:1.05rem; font-weight:700; margin-bottom:8px;}
.teaser-body p{color:var(--muted); font-size:0.9rem;}
.teaser-body .go{margin-top:12px; font-size:0.85rem; font-weight:700; color:var(--navy);}
@media (max-width:820px){ .teaser-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .teaser-grid{grid-template-columns:1fr;} }

/* ---------- ABOUT ---------- */
.about-grid{display:grid; grid-template-columns:1.3fr 0.7fr; gap:48px; align-items:start;}
.about-grid p{color:var(--muted); font-size:1.02rem;}
.about-side{border-left:3px solid var(--amber); padding-left:22px; display:flex; flex-direction:column; gap:16px;}
.about-side .fact{font-family:'Sora',sans-serif; font-weight:700; color:var(--navy); font-size:1.05rem;}
.about-side .fact + p{margin-top:-8px; color:var(--muted); font-size:0.92rem;}
@media (max-width:800px){ .about-grid{grid-template-columns:1fr;} }

/* ---------- FEATURE ICON GRID (product pages) ---------- */
.feat-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:18px; text-align:center;}
.feat-item{display:flex; flex-direction:column; align-items:center; gap:10px;}
.feat-item .ic{width:52px; height:52px; border-radius:50%; background:var(--ice); display:flex; align-items:center; justify-content:center; color:var(--navy);}
.feat-item .ic svg{width:24px; height:24px;}
.feat-item span{font-size:0.85rem; font-weight:600; color:var(--ink);}
@media (max-width:760px){ .feat-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:480px){ .feat-grid{grid-template-columns:repeat(2,1fr);} }

/* ---------- PRODUCT ROWS (used on baby page, home page) ---------- */
.product-row{display:grid; grid-template-columns:64px 1fr; gap:22px; padding:28px 0; border-top:1px solid var(--line);}
.product-row:last-child{border-bottom:1px solid var(--line);}
.product-icon{width:56px; height:56px; border-radius:12px; background:var(--ice); display:flex; align-items:center; justify-content:center; color:var(--navy);}
.product-icon svg{width:28px; height:28px;}
.product-row h3{font-size:1.15rem; font-weight:700; margin-bottom:8px;}
.product-row p{color:var(--muted); font-size:0.98rem; max-width:65ch;}
@media (max-width:560px){
  .product-row{grid-template-columns:48px 1fr; gap:14px;}
  .product-icon{width:44px; height:44px; border-radius:10px;}
  .product-icon svg{width:22px; height:22px;}
}

/* ---------- WHY US ---------- */
.why-grid{display:grid; grid-template-columns:1fr 1fr; gap:32px 40px;}
.why-item{display:flex; gap:16px;}
.why-icon{flex:none; width:44px; height:44px; border-radius:50%; background:var(--navy); display:flex; align-items:center; justify-content:center; color:#fff;}
.why-icon svg{width:20px; height:20px;}
.why-item h4{font-size:1.02rem; font-weight:700; margin-bottom:6px;}
.why-item p{color:var(--muted); font-size:0.93rem;}
@media (max-width:760px){ .why-grid{grid-template-columns:1fr;} }

/* ---------- PRICE TABLE ---------- */
.price-wrap{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
.price-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:26px; display:flex; flex-direction:column; gap:16px;}
.price-card h3{font-size:1.15rem; font-weight:700;}
.price-card .tagline{color:var(--muted); font-size:0.88rem; margin-top:-10px;}
.price-row{display:flex; justify-content:space-between; align-items:baseline; border-top:1px dashed var(--line); padding-top:12px;}
.price-row:first-of-type{border-top:none; padding-top:0;}
.price-row .plan{font-size:0.9rem; color:var(--muted);}
.price-row .amount{font-family:'Sora',sans-serif; font-weight:800; color:var(--navy); font-size:1.15rem;}
.price-row .amount small{font-family:'Inter',sans-serif; font-weight:500; font-size:0.72rem; color:var(--muted);}
.price-badge{display:inline-flex; align-self:flex-start; background:var(--amber); color:var(--navy-deep); font-weight:700; font-size:0.76rem; padding:4px 10px; border-radius:999px;}
.price-note{font-size:0.8rem; color:var(--muted); margin-top:4px;}
@media (max-width:760px){ .price-wrap{grid-template-columns:1fr;} }

/* ---------- STEP LIST (promotions / how to apply) ---------- */
.step-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; counter-reset:step;}
.step-item{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:22px; position:relative;}
.step-item .num{width:32px; height:32px; border-radius:50%; background:var(--navy); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Sora',sans-serif; font-weight:700; font-size:0.9rem; margin-bottom:14px;}
.step-item h4{font-size:0.98rem; font-weight:700; margin-bottom:6px;}
.step-item p{font-size:0.86rem; color:var(--muted);}
@media (max-width:820px){ .step-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:480px){ .step-grid{grid-template-columns:1fr;} }

/* ---------- PROMO STRIP ---------- */
.promo{background:var(--navy-deep); color:#fff;}
.promo .section-head p{color:#B9C6DA;}
.promo .section-head h2{color:#fff;}
.promo-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:22px;}
.promo-card{background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.14); border-radius:var(--radius); padding:22px;}
.promo-card svg{width:24px; height:24px; color:var(--amber); margin-bottom:14px;}
.promo-card p{font-size:0.92rem; color:#E4EAF3;}
.promo-note{margin-top:24px; font-size:0.85rem; color:#8FA1BB;}
@media (max-width:900px){ .promo-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .promo-grid{grid-template-columns:1fr;} }

/* ---------- CONTACT ---------- */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:48px;}
.contact-left h2{font-size:clamp(1.5rem,3vw,2.1rem); font-weight:700; max-width:14ch;}
.contact-left p{margin-top:14px; color:var(--muted); max-width:42ch;}
.contact-left .hero-cta{margin-top:26px;}
.contact-card{background:var(--ice); border-radius:var(--radius); padding:28px; display:flex; flex-direction:column; gap:18px;}
.contact-row{display:flex; gap:14px; align-items:flex-start;}
.contact-row svg{flex:none; width:20px; height:20px; margin-top:2px; color:var(--navy);}
.contact-row .label{font-size:0.78rem; color:var(--muted); margin-bottom:2px;}
.contact-row .val{font-weight:600; color:var(--ink); font-size:0.98rem;}
.contact-row .val a{text-decoration:none; border-bottom:1px solid var(--line);}
@media (max-width:800px){ .contact-grid{grid-template-columns:1fr;} }

/* ---------- SOCIAL / FACEBOOK CARD ---------- */
.social-card{display:flex; align-items:center; gap:18px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:20px 24px; text-decoration:none; color:var(--ink); max-width:480px;}
.social-card .fb-ic{flex:none; width:46px; height:46px; border-radius:50%; background:#1877F2; display:flex; align-items:center; justify-content:center;}
.social-card .fb-ic svg{width:24px; height:24px; color:#fff;}
.social-card h4{font-size:0.98rem; font-weight:700;}
.social-card p{font-size:0.85rem; color:var(--muted); margin-top:2px;}

/* ---------- FOOTER ---------- */
footer{background:var(--navy-deep); color:#9FB0C3; padding:32px 0;}
.foot-inner{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; font-size:0.85rem;}
.foot-inner .brand{color:#fff; font-size:1rem;}
.foot-links{display:flex; gap:14px; align-items:center;}
.foot-links a{color:#9FB0C3; text-decoration:none;}
.foot-links a:hover{color:#fff;}
.foot-links .fb-dot{width:30px; height:30px; border-radius:50%; background:rgba(255,255,255,0.1); display:flex; align-items:center; justify-content:center;}
.foot-links .fb-dot svg{width:15px; height:15px; color:#fff;}

/* ---------- COPY PANEL ---------- */
.copy-panel{background:var(--surface); border-top:1px dashed var(--line);}
.copy-panel .section-head p{color:var(--muted);}
.copybox{border:1px solid var(--line); border-radius:var(--radius); padding:18px 18px 16px; margin-bottom:16px; background:var(--bg);}
.copybox-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; gap:12px;}
.copybox-head h4{font-size:0.95rem; font-weight:700; color:var(--navy);}
.copy-btn{flex:none; border:1px solid var(--navy); background:var(--surface); color:var(--navy); font:inherit; font-weight:600; font-size:0.82rem; padding:7px 14px; border-radius:8px; cursor:pointer;}
.copy-btn:hover{background:var(--navy); color:#fff;}
.copy-btn.copied{background:var(--amber); border-color:var(--amber); color:var(--navy-deep);}
.copybox textarea{width:100%; resize:vertical; min-height:64px; border:none; background:transparent; color:var(--ink); font:inherit; font-size:0.9rem; line-height:1.55; padding:0;}
.copybox textarea:focus{outline:none;}