/* Denticate · maqueta de landing (25-oct-2026). Sistema de agendadental.mx: colores lisos, portada en turquesa vivo,
   cabecera un poco más clara, botón blanco sobre oscuro, WhatsApp verde, palomitas amarillas, barra fija en celular.
   DentiKids lleva su propia piel (coral / cielo / sol) para que contraste con el resto. */
:root{--marca:#1A8C92;--marca-osc:#0F6F74;--hero:#0E767C;--tinta:#062C30;--texto:#22363A;--suave:#56696D;
 --aqua:#A8E9F2;--aqua-suave:#E7F7F8;--crema:#F4F7F6;--borde:rgba(6,44,48,.10);--amarillo:#FACC15;
 --coral:#FF6F4F;--coral-osc:#E2553A;--cielo:#5BC0EB;--sol:#FFD166;--rosa:#FFE8E1;--radio:22px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:'Inter',system-ui,sans-serif;color:var(--texto);background:#fff;-webkit-font-smoothing:antialiased;line-height:1.6;overflow-x:hidden}
h1,h2,h3,h4{font-family:'Figtree','Inter',sans-serif;letter-spacing:-.02em;margin:0;color:var(--tinta);line-height:1.12}
p{margin:0}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{width:min(1160px,100% - 32px);margin-inline:auto}
.angosto{width:min(780px,100% - 32px);margin-inline:auto}
section{padding:88px 0}
.c{text-align:center}
.eyebrow{display:inline-block;font-size:.8rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--marca)}
h2{font-size:clamp(1.9rem,3.6vw,2.7rem);margin:.5rem 0 .9rem}
.sub{font-size:1.1rem;color:var(--suave);max-width:660px}
.c .sub{margin-inline:auto}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;padding:.95rem 1.5rem;border-radius:999px;font-weight:700;text-decoration:none;transition:transform .15s ease,background .15s;font-size:1rem;line-height:1.2}
.btn:hover{transform:translateY(-1px)}
.btn svg{width:1.25em;height:1.25em;fill:currentColor;flex:none}
.btn-primario{background:var(--marca);color:#fff}.btn-primario:hover{background:var(--marca-osc)}
.oscura .btn-primario,.hero .btn-primario,.cierre .btn-primario,.franja .btn-primario{background:#fff;color:var(--tinta)}
.btn-wa{background:#25D366;color:#fff;box-shadow:0 12px 26px -12px rgba(37,211,102,.75)}.btn-wa:hover{background:#1EBE5B}
.btn-vidrio{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.55)}.btn-vidrio:hover{border-color:#fff}
.btn-borde{border:2px solid var(--marca);color:var(--marca-osc)}
.btn-coral{background:var(--coral);color:#fff;box-shadow:0 10px 24px -12px rgba(226,85,58,.8)}.btn-coral:hover{background:var(--coral-osc)}
.btn-tinta{background:var(--tinta);color:#fff}
.btns{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.8rem}
.c .btns{justify-content:center}
.micro{font-size:.88rem;margin-top:.9rem;opacity:.85}
.palomitas{list-style:none;padding:0;margin:1.2rem 0 0;display:grid;gap:.7rem}
.palomitas li{display:flex;align-items:flex-start;gap:.7rem}
.palomitas li::before{content:'';flex:none;width:1.45em;height:1.45em;margin-top:.1em;border-radius:50%;background:var(--amarillo) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='%23062C30' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/68% no-repeat}

/* Barra superior + cabecera */
.tel{background:var(--tinta);color:rgba(255,255,255,.75);font-size:.84rem}
.tel .wrap{display:flex;gap:1.6rem;align-items:center;height:38px}
.tel b{color:#fff;font-weight:600}.tel a{text-decoration:none}
.tel .der{margin-left:auto}
.nav{position:sticky;top:0;z-index:30;background:color-mix(in srgb,#fff 9%,var(--hero));border-bottom:1px solid rgba(255,255,255,.14)}
.nav-in{display:flex;align-items:center;height:70px;gap:1.4rem}
.logo{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:#fff}
.logo img{width:44px;height:44px;border-radius:50%;background:#fff}
.logo b{font-family:'Figtree';font-weight:800;letter-spacing:.16em;font-size:1.05rem;display:block;line-height:1}
.logo small{display:block;font-size:.62rem;letter-spacing:.42em;color:var(--aqua);font-weight:600;margin-top:4px}
.links{display:flex;gap:1.6rem;margin-left:auto;color:rgba(255,255,255,.85);font-weight:600;font-size:.95rem}
.links a{text-decoration:none}.links a:hover{color:#fff}
.pill-kids{background:var(--sol);color:var(--tinta)!important;padding:.35rem .85rem;border-radius:999px;font-weight:800}
.idioma{display:flex;border:1px solid rgba(255,255,255,.35);border-radius:999px;overflow:hidden;font-size:.82rem;font-weight:700}
.idioma a,.idioma span{padding:.35rem .7rem;text-decoration:none;color:#fff}
.idioma .on{background:#fff;color:var(--tinta)}

/* Portada */
.hero{background:var(--hero);color:#fff;padding:64px 0 78px}
.hero .wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:3.2rem;align-items:center}
.hero h1{color:#fff;font-size:clamp(2.3rem,4.8vw,3.6rem);margin:.9rem 0 1.1rem}
.hero h1 em{font-style:normal;color:var(--aqua)}
.hero .lead{font-size:1.18rem;color:rgba(255,255,255,.88);max-width:540px}
.chip{display:inline-flex;align-items:center;gap:.45rem;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.22);padding:.35rem .9rem;border-radius:999px;font-size:.86rem;font-weight:600}
.estrellas{color:var(--amarillo);letter-spacing:2px}
.hero-foto{position:relative}
.hero-foto img{border-radius:26px;width:100%;aspect-ratio:4/3.1;object-fit:cover;object-position:top;box-shadow:0 30px 60px -28px rgba(0,0,0,.55)}
.flota{position:absolute;background:#fff;color:var(--tinta);border-radius:18px;padding:.85rem 1.1rem;box-shadow:0 18px 40px -16px rgba(0,0,0,.45);font-size:.85rem;line-height:1.35}
.flota b{display:block;font-family:'Figtree';font-size:1.35rem}
.flota.f1{left:-26px;bottom:26px}.flota.f2{right:-18px;top:22px}

/* Cifras */
.cifras{background:var(--aqua);padding:30px 0}
.cifras .wrap{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem;text-align:center}
.cifras b{display:block;font-family:'Figtree';font-size:2rem;color:var(--tinta);font-weight:800}
.cifras span{font-size:.9rem;color:#24484c;font-weight:500}
.cifras .nota{grid-column:1/-1;font-size:.78rem;color:#3d6266;margin-top:.2rem}

/* Recuadro DentiKids (contraste) */
.kids-band{background:var(--rosa);padding:70px 0}
.kids-box{background:var(--coral);color:#fff;border-radius:34px;display:grid;grid-template-columns:1.1fr 1fr;overflow:hidden;position:relative;box-shadow:0 30px 60px -30px rgba(226,85,58,.75)}
.kids-box .txt{padding:52px 50px}
.kids-box h2{color:#fff;font-size:clamp(2rem,3.8vw,2.9rem)}
.kids-box p{color:rgba(255,255,255,.92);font-size:1.1rem}
.kids-box img{width:100%;height:100%;object-fit:cover}
.kids-tag{display:inline-block;background:var(--sol);color:var(--tinta);font-weight:800;border-radius:999px;padding:.35rem 1rem;font-size:.85rem;transform:rotate(-2deg)}
.kids-box .palomitas li{color:#fff;font-weight:600}
.flecha{position:absolute;left:52%;top:28px;background:var(--sol);color:var(--tinta);font-weight:800;border-radius:16px;padding:.6rem 1rem;font-size:.9rem;transform:rotate(3deg);box-shadow:0 10px 24px -10px rgba(0,0,0,.4)}

/* Dolor / tres momentos */
.tres{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;margin-top:2.6rem;text-align:left}
.momento{background:#fff;border:1px solid var(--borde);border-radius:var(--radio);padding:1.7rem}
.momento .n{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--aqua-suave);color:var(--marca-osc);font-weight:800;font-family:'Figtree';margin-bottom:.9rem}
.momento h3{font-size:1.2rem;margin-bottom:.4rem}.momento p{color:var(--suave);font-size:.98rem}
.momento .sol{margin-top:1rem;padding-top:.9rem;border-top:1px dashed var(--borde);font-size:.92rem;font-weight:600;color:var(--marca-osc)}

/* Bloque entidad */
.entidad{background:var(--crema)}
.entidad p{font-size:1.07rem;margin-top:1rem;color:var(--texto)}

/* Especialidades */
.cream{background:var(--crema)}
.tarjetas{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem;margin-top:2.6rem}
.tarjeta{background:#fff;border-radius:var(--radio);padding:1.4rem 1.3rem 1.3rem;border:1px solid var(--borde);display:flex;flex-direction:column;text-decoration:none}
.tarjeta img{width:76px;height:76px;object-fit:contain;margin:-.3rem 0 .6rem -.3rem}
.tarjeta h3{font-size:1.15rem;margin-bottom:.35rem}
.tarjeta p{font-size:.93rem;color:var(--suave)}
.tarjeta .quien{margin-top:auto;padding-top:.9rem;font-size:.84rem;font-weight:600;color:var(--tinta)}
.tarjeta .quien i{font-style:normal;color:var(--marca-osc)}
.tarjeta .ir{margin-top:.7rem;font-weight:700;font-size:.9rem;color:var(--marca-osc)}
.tarjeta.kids{background:var(--coral);border-color:var(--coral)}
.tarjeta.kids h3,.tarjeta.kids p,.tarjeta.kids .quien,.tarjeta.kids .quien i,.tarjeta.kids .ir{color:#fff}

/* Franjas */
.oscura{background:var(--tinta);color:rgba(255,255,255,.85)}
.oscura h2,.oscura h3{color:#fff}
.oscura .sub{color:rgba(255,255,255,.75)}
.franja{padding:56px 0}
.franja .wrap{display:flex;align-items:center;justify-content:space-between;gap:2rem}
.franja h2{font-size:clamp(1.6rem,3vw,2.2rem);margin:0 0 .4rem}
.amarilla{background:var(--amarillo)}
.amarilla h2,.amarilla p{color:var(--tinta)}

/* Equipo */
.equipo .wrap{display:grid;grid-template-columns:380px 1fr;gap:3.2rem;align-items:start}
.directora{background:var(--aqua-suave);border-radius:26px;overflow:hidden;position:sticky;top:96px}
.directora img{aspect-ratio:1/1.05;object-fit:cover;object-position:top;width:100%}
.directora div{padding:1.2rem 1.4rem 1.5rem}
.directora b{font-family:'Figtree';font-size:1.3rem;color:var(--tinta)}
.directora span{display:block;color:var(--suave);font-size:.93rem}
.grupo{margin-top:1.6rem}
.grupo h3{font-size:1rem;letter-spacing:.06em;text-transform:uppercase;color:var(--marca-osc);margin-bottom:.7rem;display:flex;gap:.5rem;align-items:center}
.grupo h3 .k{background:var(--coral);color:#fff;font-size:.7rem;padding:.15rem .5rem;border-radius:6px;letter-spacing:.04em}
.docs{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem}
.doc{display:flex;align-items:center;gap:.7rem;background:#fff;border:1px solid var(--borde);border-radius:16px;padding:.7rem .9rem;font-weight:600;font-size:.95rem;color:var(--tinta)}
.av{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:.95rem;font-family:'Figtree'}

/* Galería */
.galeria{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:240px 240px;gap:1rem;margin-top:2.4rem}
.galeria figure{margin:0;border-radius:20px;overflow:hidden;position:relative}
.galeria figure:first-child{grid-row:1/3}
.galeria img{width:100%;height:100%;object-fit:cover}
.galeria figcaption{position:absolute;left:12px;bottom:12px;background:rgba(6,44,48,.78);color:#fff;font-size:.82rem;font-weight:600;padding:.3rem .7rem;border-radius:999px}

/* Sección en inglés */
.english{background:var(--hero);color:#fff}
.english .wrap{display:grid;grid-template-columns:1.2fr 1fr;gap:3rem;align-items:center}
.english h2{color:#fff}.english .sub{color:rgba(255,255,255,.85)}
.english .palomitas li{color:#fff}
.seguros{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}
.seguros span{background:#fff;color:var(--tinta);border-radius:14px;padding:.95rem .5rem;text-align:center;font-weight:700;font-size:.92rem}
.seguros .mas{background:var(--amarillo)}

/* Cómo agendar */
.pasos{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:2.4rem}
.paso{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:var(--radio);padding:1.6rem}
.paso .n{width:44px;height:44px;border-radius:50%;background:var(--amarillo);color:var(--tinta);display:grid;place-items:center;font-weight:800;font-family:'Figtree';margin-bottom:1rem}
.paso h3{font-size:1.2rem;margin-bottom:.4rem}.paso p{font-size:.97rem}

/* Reseñas */
.resenas{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:2.4rem;text-align:left}
.resena{background:var(--aqua-suave);border-radius:var(--radio);padding:1.6rem}
.resena p{font-family:'Figtree';font-size:1.18rem;color:var(--tinta);font-weight:600;margin:.6rem 0 .9rem;line-height:1.35}
.resena small{color:var(--suave)}
.gran-nota{display:inline-flex;align-items:center;gap:1rem;background:var(--tinta);color:#fff;border-radius:999px;padding:.6rem 1.3rem .6rem .7rem;margin-top:1rem}
.gran-nota b{background:var(--amarillo);color:var(--tinta);border-radius:999px;padding:.35rem .8rem;font-family:'Figtree';font-size:1.2rem}

/* FAQ */
.faq{margin-top:2.2rem;display:grid;gap:.7rem}
.faq details{border:1px solid var(--borde);border-radius:16px;padding:1rem 1.3rem;background:#fff}
.faq summary{cursor:pointer;font-weight:700;color:var(--tinta);list-style:none;display:flex;justify-content:space-between;gap:1rem;font-size:1.02rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font-size:1.4rem;line-height:1;color:var(--marca)}
.faq details[open] summary::after{content:'–'}
.faq details p{margin-top:.7rem;color:var(--suave)}
.faq a{color:var(--marca-osc);font-weight:600}

/* Ubicación */
.visita .wrap{display:grid;grid-template-columns:1fr 1.15fr;gap:3rem;align-items:center}
.horario{display:grid;gap:.5rem;margin:1.4rem 0;font-size:1rem}
.horario div{display:flex;justify-content:space-between;border-bottom:1px solid var(--borde);padding-bottom:.5rem}
.horario b{color:var(--tinta)}
.mapa{position:relative;border-radius:24px;overflow:hidden;border:1px solid var(--borde)}
.mapa img{width:100%;filter:saturate(.8)}
.pin{position:absolute;left:50%;top:50%;transform:translate(-50%,-100%);background:var(--marca-osc);color:#fff;font-weight:700;font-size:.9rem;padding:.55rem .9rem;border-radius:12px;white-space:nowrap;box-shadow:0 10px 24px rgba(0,0,0,.3)}
.pin::after{content:'';position:absolute;left:50%;bottom:-8px;margin-left:-8px;border:8px solid transparent;border-bottom:0;border-top-color:var(--marca-osc)}

/* Cierre */
.cierre{background:var(--marca-osc);color:#fff;padding:80px 0}
.cierre h2{color:#fff;font-size:clamp(2rem,4vw,3rem)}
.cierre .sub{color:rgba(255,255,255,.85)}

/* Pie */
.pie{background:var(--tinta);color:rgba(255,255,255,.72);padding:3.2rem 0 1.5rem;font-size:.93rem}
.pie-in{display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem}
.pie h4{color:#fff;margin:0 0 .8rem;font-size:.95rem}
.pie a{display:block;text-decoration:none;margin:.35rem 0}.pie a:hover{color:#fff}
.copy{font-size:.8rem;margin-top:2.2rem;color:rgba(255,255,255,.45)}

/* DentiKids: piel propia */
.k-hero{background:var(--coral);color:#fff;padding:60px 0 76px}
.k-hero .wrap{display:grid;grid-template-columns:1fr 1.05fr;gap:3rem;align-items:center}
.k-hero h1{color:#fff;font-size:clamp(2.3rem,4.8vw,3.6rem);margin:.9rem 0 1rem}
.k-hero h1 em{font-style:normal;color:var(--sol)}
.k-hero .lead{font-size:1.15rem;color:rgba(255,255,255,.92);max-width:520px}
.k-foto img{border-radius:40px 40px 40px 120px;border:8px solid #fff;width:100%;aspect-ratio:4/3;object-fit:cover;box-shadow:0 30px 60px -28px rgba(0,0,0,.5)}
.k-cifras{background:var(--sol);padding:28px 0}
.k-cifras .wrap{display:grid;grid-template-columns:repeat(4,1fr);text-align:center;gap:1rem}
.k-cifras b{display:block;font-family:'Figtree';font-size:1.8rem;color:var(--tinta)}
.k-cifras span{font-size:.9rem;color:#5a4300;font-weight:600}
.k-pasos{background:var(--cielo);color:var(--tinta)}
.k-pasos .paso{background:#fff;border:0}
.k-pasos .paso .n{background:var(--coral);color:#fff}
.k-pasos h2{color:var(--tinta)}
.k-tx .tarjeta{border-width:2px}
.k-tx .tarjeta:nth-child(4n+1){background:#EAF7FD}.k-tx .tarjeta:nth-child(4n+2){background:var(--rosa)}
.k-tx .tarjeta:nth-child(4n+3){background:#FFF4D6}.k-tx .tarjeta:nth-child(4n+4){background:#E8F6E9}
.consejos{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.consejos img{border-radius:28px;aspect-ratio:1/1;object-fit:cover}
.k-cierre{background:var(--coral)}

/* Barra fija en celular */
.barra-movil{display:none}
@media (max-width:760px){
 section{padding:58px 0}
 .tel{display:none}
 .links{display:none}
 .nav-in{height:62px}.logo img{width:38px;height:38px}.logo b{font-size:.95rem}
 .idioma{margin-left:auto}
 .hero{padding:30px 0 56px}.hero .wrap,.k-hero .wrap{grid-template-columns:1fr;gap:2rem}
 .hero .lead,.k-hero .lead{font-size:1.04rem}
 .btns .btn{flex:1 1 100%}
 .flota.f1{left:10px;bottom:-18px}.flota.f2{display:none}
 .cifras .wrap{grid-template-columns:repeat(2,1fr)}.cifras .wrap>div:last-of-type{grid-column:1/-1}
 .kids-band{padding:46px 0}
 .kids-box{grid-template-columns:1fr;border-radius:26px}.kids-box .txt{padding:30px 24px}.kids-box>a{order:-1}.kids-box img{aspect-ratio:4/3}
 .flecha{left:auto;right:14px;top:14px}
 .tres,.pasos,.resenas{grid-template-columns:1fr}
 .tarjetas{grid-template-columns:1fr 1fr;gap:.7rem}.tarjeta{padding:1rem .9rem}.tarjeta img{width:56px;height:56px}.tarjeta h3{font-size:1rem}.tarjeta p{font-size:.85rem}.tarjeta .quien{font-size:.78rem}
 .franja .wrap{flex-direction:column;align-items:stretch;text-align:left}
 .equipo .wrap{grid-template-columns:1fr}.directora{position:static}.docs{grid-template-columns:1fr 1fr}.doc{font-size:.85rem;padding:.6rem}.av{width:32px;height:32px;font-size:.8rem}
 .galeria{grid-template-columns:1fr 1fr;grid-template-rows:200px 140px 140px}.galeria figure:first-child{grid-column:1/3;grid-row:auto}
 .english .wrap,.visita .wrap,.consejos{grid-template-columns:1fr}
 .k-hero{padding:24px 0 52px}.k-foto{order:-1}.k-foto img{border-radius:28px 28px 28px 70px;border-width:5px}
 .k-cifras .wrap{grid-template-columns:repeat(2,1fr)}
 .pie-in{grid-template-columns:1fr 1fr}.pie-in>div:first-child{grid-column:1/-1}
 .barra-movil{display:grid;grid-template-columns:1fr 1fr 54px;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.97);border-top:1px solid var(--borde);box-shadow:0 -10px 30px -18px rgba(6,44,48,.45);transform:translateY(110%);transition:transform .25s ease}
 .barra-movil.ver{transform:none}
 .barra-movil a{border-radius:14px;padding:.7rem .4rem;text-align:center;font-weight:700;font-size:.88rem;line-height:1.15;color:#fff;background:#25D366;text-decoration:none}
 .barra-movil a small{display:block;font-weight:500;font-size:.72rem;opacity:.92}
 .barra-movil a.llamar{background:var(--tinta);display:grid;place-items:center}
 .barra-movil a.llamar svg{width:22px;height:22px;fill:#fff}
 .pie{padding-bottom:calc(90px + env(safe-area-inset-bottom))}
}