:root{
    --verde:#1d3a2e; --verde-med:#234636; --verde-osc:#152b22;
    --dorado:#c9a15c; --dorado-osc:#b08d57;
    --crema:#f7f4ee; --crema2:#efe9dd; --hueso:#f2ede2;
    --tinta:#1b2b24; --gris:#5c6b64;
    --whatsapp:#25d366;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  body{font-family:'Inter',sans-serif;background:var(--crema);color:var(--tinta);overflow-x:clip;}
  .wrap{max-width:1060px;margin:0 auto;padding:0 28px;}
  .eyebrow{font-size:11px;letter-spacing:2.5px;text-transform:uppercase;font-weight:600;color:var(--verde);}
  .btn{display:inline-flex;align-items:center;gap:9px;font-size:14px;font-weight:600;padding:14px 26px;border-radius:6px;text-decoration:none;transition:all .2s;}
  .btn-oro{background:var(--dorado);color:var(--verde-osc);}
  .btn-oro:hover{background:#d9b26c;}
  .btn-borde{border:1px solid rgba(242,237,226,.45);color:var(--hueso);}
  .btn-borde:hover{border-color:var(--hueso);}
  .btn-verde{background:var(--verde);color:var(--hueso);}
  .btn-verde:hover{background:var(--verde-osc);}
  .punto-wa{width:8px;height:8px;border-radius:50%;background:var(--whatsapp);display:inline-block;}
  .icn{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;}
  .icn-fill{width:18px;height:18px;fill:currentColor;flex-shrink:0;}

  /* NAV — integrada al hero oscuro */
  nav{background:var(--verde);position:sticky;top:0;z-index:10;border-bottom:1px solid rgba(255,255,255,.07);}
  nav .wrap{display:flex;align-items:center;justify-content:space-between;height:66px;}
  .logo{font-family:'Playfair Display',serif;font-size:19px;font-weight:700;color:var(--hueso);}
  .logo em{color:var(--dorado);font-style:normal;}
  nav ul{display:flex;gap:26px;list-style:none;font-size:13px;font-weight:500;}
  nav a{color:rgba(242,237,226,.75);text-decoration:none;}
  nav a:hover{color:var(--hueso);}
  .nav-cta{background:var(--dorado);color:var(--verde-osc) !important;padding:9px 16px;border-radius:6px;font-weight:700;}

  /* HERO — como la referencia del usuario */
  .hero{background:var(--verde);padding:72px 0 84px;}
  .hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:center;}
  .hero .eyebrow{color:var(--dorado);}
  .hero h1{font-family:'Playfair Display',serif;font-size:54px;line-height:1.14;font-weight:500;color:var(--hueso);margin:20px 0 22px;}
  .hero h1 em{color:var(--dorado);}
  .hero p.lead{font-size:16.5px;line-height:1.7;color:rgba(242,237,226,.72);max-width:470px;margin-bottom:34px;}
  .hero-botones{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:30px;}
  .hero-resenas{display:flex;align-items:center;gap:12px;font-size:13.5px;}
  .hero-resenas .estrellas{color:var(--dorado);letter-spacing:3px;font-size:15px;}
  .hero-resenas a{color:rgba(242,237,226,.8);text-decoration:underline;text-underline-offset:3px;}

  /* FILOSOFIA */
  .filosofia{background:#fff;padding:80px 0;}
  .filosofia .wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center;}
  .filosofia blockquote{font-family:'Playfair Display',serif;font-size:28px;line-height:1.4;font-style:italic;color:var(--verde);}
  .filosofia blockquote span{color:var(--dorado-osc);}
  .filosofia p{font-size:15px;line-height:1.75;color:var(--gris);margin-top:16px;}
  .firma{font-family:'Playfair Display',serif;font-size:17px;color:var(--tinta);margin-top:22px;}
  .firma small{display:block;font-family:'Inter',sans-serif;font-size:12px;color:var(--gris);margin-top:2px;}

  /* TRATAMIENTOS */
  .tratamientos{padding:80px 0;}
  .trat-head{text-align:center;max-width:560px;margin:0 auto 46px;}
  .trat-head h2{font-family:'Playfair Display',serif;font-size:34px;font-weight:600;margin:14px 0 12px;color:var(--tinta);}
  .trat-head p{color:var(--gris);font-size:15px;line-height:1.6;}
  .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
  .tcard{background:#fff;border:1px solid #e6e0d1;border-radius:8px;padding:28px 24px;display:flex;flex-direction:column;}
  .tcard.destacada{border-top:3px solid var(--dorado);}
  .tcard .icono{width:42px;height:42px;border-radius:50%;background:var(--crema2);display:flex;align-items:center;justify-content:center;font-size:19px;margin-bottom:16px;}
  .tcard h3{font-family:'Playfair Display',serif;font-size:19px;font-weight:600;margin-bottom:8px;}
  .tcard p{font-size:13.5px;line-height:1.6;color:var(--gris);flex:1;}
  .tcard a{font-size:13px;font-weight:600;color:var(--verde);text-decoration:none;margin-top:16px;}
  .tcard a::after{content:" →";color:var(--dorado-osc);}

  /* TESTIMONIOS */
  .testimonios{background:var(--crema2);padding:80px 0;}
  .quote{background:#fff;border-radius:8px;padding:26px 24px;font-size:14px;line-height:1.65;}
  .quote .estrellas{color:var(--dorado-osc);font-size:15px;letter-spacing:2px;margin-bottom:12px;}
  .quote footer{margin-top:14px;font-size:12px;color:var(--gris);font-weight:600;}

  /* UBICACION */
  .ubicacion{padding:80px 0;background:#fff;}
  .ubicacion .wrap{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
  .mapa{background:linear-gradient(140deg,#e2e8e2,#d2ded4);border-radius:8px;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;color:#7d928c;font-size:13px;}
  .ubicacion h2{font-family:'Playfair Display',serif;font-size:30px;font-weight:600;margin:14px 0 18px;}
  .dato{display:flex;gap:14px;margin-bottom:16px;font-size:14px;line-height:1.55;color:var(--gris);}
  .dato .pin{color:var(--dorado-osc);font-size:16px;}
  .dato strong{color:var(--tinta);display:block;font-size:14px;}

  /* CIERRE */
  .cierre{background:linear-gradient(150deg,var(--verde-osc),var(--verde));padding:90px 0;text-align:center;}
  .cierre h2{font-family:'Playfair Display',serif;font-size:38px;font-weight:500;color:var(--hueso);margin-bottom:14px;}
  .cierre h2 em{color:var(--dorado);}
  .cierre p{color:rgba(242,237,226,.65);font-size:15px;max-width:440px;margin:0 auto 32px;line-height:1.65;}

  footer.pie{background:var(--verde-osc);border-top:1px solid rgba(255,255,255,.07);padding:28px 0;text-align:center;font-size:12px;color:rgba(242,237,226,.62);}
  footer.pie a{color:rgba(242,237,226,.7);text-decoration:underline;text-underline-offset:2px;}

  .wa-flotante{position:fixed;bottom:24px;right:24px;width:56px;height:56px;border-radius:50%;background:var(--whatsapp);display:flex;align-items:center;justify-content:center;font-size:26px;box-shadow:0 6px 18px rgba(0,0,0,.25);z-index:20;text-decoration:none;}
  @media(max-width:800px){
    .hero .wrap,.filosofia .wrap,.ubicacion .wrap{grid-template-columns:1fr;}
    .grid{grid-template-columns:1fr;}
    .grid-caminos{grid-template-columns:1fr !important;}
    .grid-pasos{grid-template-columns:1fr !important;}
    .grid-intl{grid-template-columns:1fr !important;}
    .grid-otros{grid-template-columns:1fr !important;}
    .grid-tech{grid-template-columns:1fr !important;}
    .grid-mde{grid-template-columns:1fr !important;}
    .hero h1{font-size:38px;}
  }

  /* Dinámica tipo Apple */
  html{scroll-behavior:smooth;overflow-x:clip;}
  nav{transition:box-shadow .35s;}
  nav.scrolled{box-shadow:0 8px 28px rgba(0,0,0,.28);}
  .tech-card{position:relative;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);border-radius:14px;padding:26px 22px;overflow:hidden;}
  .tech-card::before{content:"";position:absolute;inset:0;background:radial-gradient(230px 230px at var(--mx,50%) var(--my,50%),rgba(201,161,92,.17),transparent 70%);opacity:0;transition:opacity .4s;pointer-events:none;}
  .tech-card .tico{width:52px;height:52px;border-radius:14px;background:rgba(201,161,92,.14);border:1px solid rgba(201,161,92,.35);display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
  .tech-card .tico svg{width:24px;height:24px;color:var(--dorado);stroke-width:1.75;}
  .tech-card h3{font-family:'Playfair Display',serif;font-size:18px;font-weight:600;color:var(--hueso);margin-bottom:8px;}
  .tech-card p{font-size:13px;line-height:1.65;color:rgba(242,237,226,.66);}
  .grid-mde>div{position:relative;overflow:hidden;}
  .grid-mde>div::before{content:"";position:absolute;inset:0;background:radial-gradient(230px 230px at var(--mx,50%) var(--my,50%),rgba(201,161,92,.14),transparent 70%);opacity:0;transition:opacity .4s;pointer-events:none;}
  .shimmer{background:linear-gradient(100deg,var(--dorado) 20%,#f2ddb0 40%,var(--dorado) 60%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;}
  @media(prefers-reduced-motion:no-preference){
    .reveal{opacity:0;transform:translateY(30px);filter:blur(7px);transition:opacity .95s cubic-bezier(.16,1,.3,1),transform .95s cubic-bezier(.16,1,.3,1),filter .95s cubic-bezier(.16,1,.3,1);transition-delay:var(--d,0s);will-change:opacity,transform,filter;}
    .reveal[data-rv="zoom"]{transform:translateY(18px) scale(.93);}
    .reveal[data-rv="right"]{transform:translateX(44px);}
    .reveal.on{opacity:1;transform:none;filter:none;}
    .shimmer{animation:shimmer 3.5s linear infinite;}
    @keyframes shimmer{to{background-position:-200% 0;}}
    @keyframes numpop{0%{transform:scale(.55);opacity:0;}60%{transform:scale(1.1);}100%{transform:scale(1);opacity:1;}}
    .reveal.on .num{animation:numpop .9s cubic-bezier(.34,1.56,.64,1) .2s both;}
    .num{display:inline-block;}
    .btn{position:relative;overflow:hidden;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s cubic-bezier(.16,1,.3,1),background .25s,border-color .25s;}
    .btn::after{content:"";position:absolute;top:0;left:-80%;width:55%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);transition:left .6s ease;pointer-events:none;}
    .btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.16);}
    .btn:hover::after{left:135%;}
    .btn:active{transform:translateY(0) scale(.97);box-shadow:none;}
    .nav-cta{transition:transform .35s cubic-bezier(.16,1,.3,1),background .25s;display:inline-block;}
    .nav-cta:hover{transform:translateY(-1px);}
    .quote,.grid-caminos>div,.grid-otros>div,.grid-mde>div{transition:transform .5s cubic-bezier(.16,1,.3,1),box-shadow .5s cubic-bezier(.16,1,.3,1),border-color .4s,background .4s;}
    .quote:hover,.grid-caminos>div:hover,.grid-otros>div:hover{transform:translateY(-5px);box-shadow:0 18px 38px rgba(27,43,36,.12);}
    .tech-card{transition:transform .5s cubic-bezier(.16,1,.3,1),border-color .4s,background .4s;}
    .tech-card:hover,.grid-mde>div:hover{transform:translateY(-6px);border-color:rgba(201,161,92,.55);background:rgba(255,255,255,.08);}
    .tech-card:hover::before,.grid-mde>div:hover::before{opacity:1;}
    .tech-card .tico{transition:transform .5s cubic-bezier(.34,1.56,.64,1),background .4s;}
    .tech-card:hover .tico{transform:scale(1.12) rotate(-5deg);background:rgba(201,161,92,.24);}
    .wa-flotante{transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s;}
    .wa-flotante:hover{transform:scale(1.1);box-shadow:0 10px 26px rgba(0,0,0,.3);}
  }

  /* ===== reemplazos de estilos inline del mockup ===== */
  .franja{background:var(--dorado);padding:14px 0;}
  .franja .wrap{display:flex;justify-content:center;align-items:center;gap:18px;flex-wrap:wrap;font-size:13.5px;font-weight:600;color:var(--verde-osc);text-align:center;}
  .franja .sep{opacity:.55;}
  .cred-card{margin-top:18px;display:inline-block;background:#fff;border:1px solid #e6e0d1;border-radius:8px;padding:14px;max-width:330px;}
  .cred-card img{width:100%;height:auto;display:block;border-radius:4px;border:1px solid #eee6d8;}
  .cred-card figcaption{font-size:12px;color:var(--gris);margin-top:10px;line-height:1.55;}
  .cred-card figcaption strong{color:var(--tinta);}
  .filosofia h2{font-family:'Playfair Display',serif;font-size:30px;line-height:1.25;font-weight:600;color:var(--tinta);margin:16px 0 20px;}
  .filosofia .firma-dorada{font-family:'Playfair Display',serif;font-style:italic;font-size:16px;color:#8f6d38;}
  .hero-foto{aspect-ratio:1/1;max-width:400px;justify-self:end;width:100%;border-radius:50%;background-size:cover;background-position:center;background-repeat:no-repeat;background-image:url(../img/retrato.jpg);background-image:image-set(url(../img/retrato.webp) type("image/webp"),url(../img/retrato.jpg) type("image/jpeg"));}
  .tecnologia{background:radial-gradient(1100px 520px at 50% -12%, #2a5240 0%, var(--verde) 48%, var(--verde-osc) 100%);padding:80px 0 76px;}
  .tecnologia .eyebrow{color:var(--dorado);}
  .tecnologia h2{font-family:'Playfair Display',serif;font-size:34px;font-weight:600;margin:14px 0 12px;color:var(--hueso);}
  .tecnologia .trat-head p{color:rgba(242,237,226,.62);}
  .grid-tech{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
  .pasos{background:var(--crema);padding:54px 0;border-top:1px solid #e6e0d1;border-bottom:1px solid #e6e0d1;}
  .pasos h2{font-family:'Playfair Display',serif;font-size:34px;font-weight:500;color:var(--tinta);text-align:center;margin-bottom:34px;}
  .grid-pasos{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;text-align:center;max-width:960px;margin:0 auto;}
  .paso-num{font-family:'Playfair Display',serif;font-size:32px;color:var(--dorado-osc);margin-bottom:8px;}
  .grid-pasos strong{font-size:15.5px;color:var(--tinta);display:block;margin-bottom:8px;}
  .grid-pasos p{font-size:14px;line-height:1.65;color:var(--gris);}
  .intl{background:var(--verde-med);padding:64px 0;}
  .grid-intl{display:grid;grid-template-columns:1.2fr .8fr;gap:48px;align-items:center;}
  .intl .eyebrow{color:var(--dorado);}
  .intl h2{font-family:'Playfair Display',serif;font-size:30px;line-height:1.25;font-weight:500;color:var(--hueso);margin:16px 0 16px;}
  .intl .lead-intl{font-size:15px;line-height:1.7;color:rgba(242,237,226,.72);margin-bottom:22px;}
  .intl-cards{display:flex;flex-direction:column;gap:14px;}
  .intl-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:16px 18px;color:var(--hueso);font-size:13.5px;display:flex;align-items:center;gap:12px;}
  .intl-card .icn{color:var(--dorado);}
  .agencia-strip{margin-top:30px;background:rgba(201,161,92,.13);border:1px solid rgba(201,161,92,.5);border-radius:10px;padding:20px 24px;display:flex;align-items:center;gap:16px;color:var(--hueso);font-size:14.5px;line-height:1.65;}
  .agencia-strip .icn{color:var(--dorado);width:26px;height:26px;flex-shrink:0;}
  .agencia-strip strong{color:var(--dorado);}
  .agencia-strip em{opacity:.75;}
  .medellin{background:linear-gradient(160deg,var(--verde-osc) 0%,#16382a 55%,#1f4939 100%);padding:72px 0;border-top:1px solid rgba(255,255,255,.07);}
  .medellin .wrap{text-align:center;}
  .medellin .eyebrow{color:var(--dorado);}
  .medellin h2{font-family:'Playfair Display',serif;font-size:36px;line-height:1.22;font-weight:500;color:var(--hueso);margin:18px auto 14px;max-width:640px;}
  .medellin h2 em{color:var(--dorado);}
  .medellin .lead-mde{font-size:15px;line-height:1.7;color:rgba(242,237,226,.7);max-width:560px;margin:0 auto 42px;}
  .grid-mde{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:920px;margin:0 auto 36px;text-align:center;}
  .grid-mde>div{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:26px 20px;}
  .num{font-family:'Playfair Display',serif;font-size:34px;color:var(--dorado);margin-bottom:6px;}
  .grid-mde p{font-size:13.5px;line-height:1.6;color:rgba(242,237,226,.8);}
  .medellin .coda{font-size:14px;color:rgba(242,237,226,.75);}
  .medellin .coda a{color:var(--dorado);font-weight:600;text-decoration:none;}
  .tratamientos h2{font-family:'Playfair Display',serif;font-size:36px;font-weight:600;color:var(--tinta);margin-bottom:10px;}
  .tratamientos .sub{color:var(--gris);font-size:15px;margin-bottom:38px;}
  .grid-caminos{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:28px;}
  .camino{background:#faf7f0;border:1px solid #e8e1d2;border-radius:10px;overflow:hidden;display:flex;flex-direction:column;}
  .camino .foto{aspect-ratio:16/7;background-size:cover;background-repeat:no-repeat;}
  .foto-profilaxis{background-position:center 22%;background-image:url(../img/profilaxis.jpg);background-image:image-set(url(../img/profilaxis.webp) type("image/webp"),url(../img/profilaxis.jpg) type("image/jpeg"));}
  .foto-diseno{background-position:center 30%;background-image:url(../img/diseno.jpg);background-image:image-set(url(../img/diseno.webp) type("image/webp"),url(../img/diseno.jpg) type("image/jpeg"));}
  .camino .cuerpo{padding:28px 28px 30px;}
  .camino h3{font-family:'Playfair Display',serif;font-size:23px;font-weight:600;color:var(--tinta);margin-bottom:12px;}
  .camino p{font-size:14.5px;line-height:1.65;color:var(--gris);margin-bottom:20px;}
  .camino a{font-size:14px;font-weight:700;color:var(--dorado-osc);text-decoration:none;}
  .grid-otros{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
  .otro{background:#faf7f0;border:1px solid #e8e1d2;border-radius:10px;padding:22px 22px 20px;display:flex;flex-direction:column;}
  .otro h3{font-family:'Playfair Display',serif;font-size:17.5px;font-weight:600;color:var(--tinta);margin-bottom:8px;}
  .otro p{font-size:13px;line-height:1.6;color:var(--gris);flex:1;}
  .otro a{font-size:13px;font-weight:700;color:var(--dorado-osc);text-decoration:none;margin-top:14px;}
  .nota-urgencias{margin-top:26px;font-size:12.5px;color:#9a958a;text-align:center;}
  .nota-urgencias a{color:#9a958a;text-decoration:underline;text-underline-offset:2px;}
  .link-resenas{text-align:center;margin-top:28px;font-size:13.5px;}
  .link-resenas a{color:var(--verde);font-weight:600;text-decoration:none;}
  .link-resenas .estrellas{color:var(--dorado-osc);}
  .ubicacion .foto-edificio{border-radius:8px;aspect-ratio:1/1;background-size:cover;background-position:center;background-repeat:no-repeat;background-image:url(../img/starnova.jpg);background-image:image-set(url(../img/starnova.webp) type("image/webp"),url(../img/starnova.jpg) type("image/jpeg"));}
  .cierre-botones{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
  .btn-pill{font-size:16px;padding:16px 34px;border-radius:40px;}
  /* páginas de tratamiento */
  .hero-trat{background:var(--verde);padding:56px 0 60px;}
  .hero-trat .eyebrow{color:var(--dorado);}
  .hero-trat .eyebrow a{color:inherit;text-decoration:none;}
  .hero-trat h1{font-family:'Playfair Display',serif;font-size:42px;line-height:1.18;font-weight:500;color:var(--hueso);margin:18px 0 18px;}
  .hero-trat .lead{font-size:16px;line-height:1.7;color:rgba(242,237,226,.72);max-width:560px;margin-bottom:30px;}
  .seccion{padding:64px 0;}
  .seccion h2{font-family:'Playfair Display',serif;font-size:30px;font-weight:600;color:var(--tinta);margin-bottom:18px;}
  .seccion p{font-size:15px;line-height:1.75;color:var(--gris);margin-bottom:14px;max-width:720px;}
  .seccion-alt{background:#fff;}
  .grid-beneficios{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:26px;}
  .beneficio{background:#faf7f0;border:1px solid #e8e1d2;border-radius:10px;padding:20px;}
  .beneficio h3{font-family:'Playfair Display',serif;font-size:16.5px;font-weight:600;color:var(--tinta);margin:10px 0 6px;}
  .beneficio p{font-size:13px;line-height:1.6;color:var(--gris);margin:0;}
  .beneficio .icn{color:var(--dorado-osc);width:22px;height:22px;}
  .faq details{background:#fff;border:1px solid #e6e0d1;border-radius:8px;padding:16px 20px;margin-bottom:10px;}
  .faq summary{font-weight:600;font-size:14.5px;color:var(--tinta);cursor:pointer;}
  .faq p{font-size:14px;line-height:1.65;color:var(--gris);margin:10px 0 0;}
  /* nav móvil */
  .nav-burger{display:none;background:none;border:none;color:var(--hueso);cursor:pointer;padding:8px;}
  .nav-burger .icn{width:24px;height:24px;}
  @media(max-width:800px){
    nav ul{display:none;position:absolute;top:66px;left:0;right:0;background:var(--verde-osc);flex-direction:column;gap:0;padding:10px 28px 18px;border-bottom:1px solid rgba(255,255,255,.1);}
    nav ul.abierto{display:flex;}
    nav ul li{padding:10px 0;}
    .nav-burger{display:block;}
    .grid-tech,.grid-mde,.grid-beneficios{grid-template-columns:1fr;}
    .hero-trat h1{font-size:32px;}
    .reveal[data-rv="right"]{transform:translateY(30px);}
  }
  .wa-flotante .icn-fill{width:28px;height:28px;color:#fff;}
  .logo a{color:inherit;text-decoration:none;}
  a.beneficio{text-decoration:none;transition:border-color .3s,transform .3s;}
  a.beneficio:hover{border-color:var(--dorado);transform:translateY(-3px);}
  .medellin .coda a,.link-resenas a{text-decoration:underline;text-underline-offset:2px;}