:root{
    --grafito:#1B222A;
    --cobre:#C27741;
    --cobre-suave:#d69368;
    --turquesa:#5C9EAD;
    --bg:#FFFFFF;
    --bg-alt:#F5F4F1;
    --linea:#D6D8D6;
    --texto-sec:#5D6268;
    --gradiente: linear-gradient(180deg,#C27741 0%,#C77742 30%,#8B7062 55%,#5C9EAD 100%);
    --serif-display:'Manrope', sans-serif;
    --sans-body:'Manrope', sans-serif;
    --maxw: 1180px;
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
  }

  body{
    margin:0;
    font-family:var(--sans-body);
    color:var(--grafito);
    background:var(--bg);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }

  img{max-width:100%; display:block;}
  a{color:inherit;}

  .wrap{max-width:var(--maxw); margin:0 auto; padding:0 32px;}
  @media (max-width:640px){ .wrap{padding:0 20px;} }

  h1,h2,h3{
    font-family:var(--serif-display);
    font-weight:700;
    letter-spacing:-0.01em;
    margin:0;
    line-height:1.08;
  }

  h2{ font-size:clamp(2.1rem, 1.6rem + 2vw, 3.4rem); font-weight:700; }
  h3{ font-size:clamp(1.35rem, 1.2rem + 0.8vw, 1.9rem); font-weight:600; }

  p{margin:0;}

  .eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-family:var(--sans-body);
    font-size:13px;
    font-weight:600;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--cobre);
    margin-bottom:20px;
  }
  .eyebrow::before{
    content:"";
    width:22px; height:1px;
    background:var(--cobre);
    display:inline-block;
  }
  .eyebrow.on-gradient{ color:#fff; }
  .eyebrow.on-gradient::before{ background:rgba(255,255,255,0.75); }

  .btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:15px 28px;
    border-radius:2px;
    font-family:var(--sans-body);
    font-weight:600;
    font-size:15.5px;
    text-decoration:none;
    border:1px solid transparent;
    cursor:pointer;
    transition:transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
    min-height:44px;
  }
  .btn:focus-visible{ outline:2px solid var(--turquesa); outline-offset:3px; }
  .btn-primary{
    background:linear-gradient(135deg, #C27741 0%, #C77742 35%, #6f7a7f 60%, #5C9EAD 100%);
    color:#fff;
  }
  .btn-primary:hover{ filter:brightness(0.93); transform:translateY(-1px); }
  .btn-outline{ background:transparent; color:var(--grafito); border-color:var(--grafito); }
  .btn-outline:hover{ background:var(--grafito); color:#fff; }
  .btn-outline.on-dark{ color:#fff; border-color:rgba(255,255,255,0.55); }
  .btn-outline.on-dark:hover{ background:#fff; color:var(--grafito); }

  /* ---------- HEADER ---------- */
  header{
    position:sticky; top:0; z-index:100;
    background:rgba(255,255,255,0.92);
    backdrop-filter:blur(8px);
    border-bottom:1px solid transparent;
    transition:border-color .25s ease, box-shadow .25s ease;
  }
  header.scrolled{ border-bottom-color:var(--linea); box-shadow:0 1px 0 rgba(0,0,0,0.02); }

  .nav{
    display:flex; align-items:center; justify-content:space-between;
    padding:16px 0;
  }
  .nav-logo{ height:26px; }
  .nav-links{
    display:flex; align-items:center; gap:36px;
    list-style:none; margin:0; padding:0;
    font-size:15px; font-weight:500;
  }
  .nav-links a{ text-decoration:none; position:relative; padding:4px 0; }
  .nav-links a:not(.btn)::after{
    content:""; position:absolute; left:0; bottom:-2px; width:0; height:1px;
    background:var(--cobre); transition:width .2s ease;
  }
  .nav-links a:not(.btn):hover::after{ width:100%; }

  .nav-dropdown{ position:relative; }
  .nav-dropdown-panel{
    position:absolute; top:calc(100% + 16px); left:50%; transform:translateX(-50%);
    background:#fff; border:1px solid var(--linea); border-radius:2px;
    box-shadow:0 18px 40px rgba(27,34,42,0.1);
    padding:10px; width:280px;
    opacity:0; visibility:hidden; translate:0 6px;
    transition:opacity .18s ease, translate .18s ease, visibility .18s ease;
  }
  .nav-dropdown:hover .nav-dropdown-panel,
  .nav-dropdown:focus-within .nav-dropdown-panel{
    opacity:1; visibility:visible; translate:0 0;
  }
  .nav-dropdown-panel a{
    display:block; padding:12px 14px; border-radius:2px; text-decoration:none;
    font-size:14.5px;
  }
  .nav-dropdown-panel a:hover{ background:var(--bg-alt); }
  .nav-dropdown-panel .sol-name{ font-weight:600; display:block; }
  .nav-dropdown-panel .sol-sub{ display:block; font-size:12.5px; color:var(--texto-sec); font-weight:400; margin-top:2px; }

  .nav-cta{ display:flex; align-items:center; gap:24px; }
  .nav-cta .btn{ padding:12px 22px; font-size:14.5px; }

  .burger{
    display:none; background:none; border:none; cursor:pointer; padding:8px;
    width:44px; height:44px; align-items:center; justify-content:center;
  }
  .burger span, .burger span::before, .burger span::after{
    content:""; display:block; width:22px; height:2px; background:var(--grafito);
    position:relative; transition:transform .2s ease, opacity .2s ease;
  }
  .burger span::before{ position:absolute; top:-7px; }
  .burger span::after{ position:absolute; top:7px; }
  .burger.active span{ background:transparent; }
  .burger.active span::before{ transform:rotate(45deg); top:0; }
  .burger.active span::after{ transform:rotate(-45deg); top:0; }

  .mobile-panel{
    display:none;
    position:fixed; inset:0; top:0; z-index:99;
    background:#fff;
    padding:100px 24px 40px;
    overflow-y:auto;
  }
  .mobile-panel.open{ display:block; }
  .mobile-panel ul{ list-style:none; margin:0; padding:0; }
  .mobile-panel li{ border-bottom:1px solid var(--linea); }
  .mobile-panel a{ display:block; padding:18px 4px; text-decoration:none; font-size:19px; font-weight:600; }
  .mobile-panel .sub{ padding-left:14px; }
  .mobile-panel .sub a{ font-size:16px; font-weight:500; color:var(--texto-sec); padding:12px 4px; }
  .mobile-panel .mob-cta{ margin-top:28px; }
  .mobile-panel .mob-cta .btn{ width:100%; justify-content:center; }

  @media (max-width:960px){
    .nav-links{ display:none; }
    .nav-cta .btn-outline{ display:none; }
    .burger{ display:flex; }
  }

  /* ---------- HERO ---------- */
  .hero{
    padding:min(14vh,140px) 0 100px;
    text-align:center;
    position:relative;
  }
  .hero-mark{
    width:230px; margin:0 auto 44px;
  }
  .hero h1{
    font-size:clamp(2.6rem, 1.9rem + 3.4vw, 5rem);
    max-width:22ch;
    margin:0 auto;
  }
  .hero-title-line{ display:block; white-space:nowrap; }
  @media (max-width:760px){
    .hero h1{ max-width:16ch; }
    .hero-title-line{ display:inline; white-space:normal; }
  }
  .hero .peak-rule{
    width:64px; height:34px; margin:32px auto;
  }
  .hero p.sub{
    max-width:640px; margin:0 auto;
    font-size:clamp(1.05rem,1rem + .3vw,1.3rem);
    color:var(--texto-sec);
    font-weight:400;
  }
  .hero-ctas{
    display:flex; gap:18px; justify-content:center; flex-wrap:wrap;
    margin-top:44px;
  }
  @media (max-width:560px){
    .hero-ctas{ flex-direction:column; align-items:stretch; }
    .hero-ctas .btn{ justify-content:center; }
  }

  /* ---------- GENERIC SECTION ---------- */
  section{ padding:110px 0; }
  @media (max-width:720px){ section{ padding:76px 0; } }
  .section-alt{ background:var(--bg-alt); }

  .section-head{ max-width:760px; margin-bottom:56px; }
  .section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
  .section-head p{ margin-top:20px; font-size:1.05rem; color:var(--texto-sec); }

  .quote{
    font-family:var(--serif-display);
    font-weight:600;
    font-size:clamp(1.4rem, 1.2rem + 1vw, 2.05rem);
    line-height:1.32;
    color:var(--grafito);
    max-width:820px;
  }
  .quote .accent{ color:var(--cobre); }

  /* ---------- PROBLEMA (bloque 2) ---------- */
  .noise-list{
    list-style:none; margin:36px 0 44px; padding:0;
    display:flex; flex-wrap:wrap; gap:12px 16px;
  }
  .noise-list li{
    font-size:14.5px; color:#9aa0a6;
    padding:9px 16px;
    border:1px solid var(--linea);
    border-radius:2px;
    text-decoration:line-through;
    text-decoration-color:#c7cac8;
  }
  .closing-line{
    margin-top:40px;
    padding-top:36px;
    border-top:1px solid var(--linea);
  }
  .brand-line{
    margin-top:22px;
    font-size:15px;
    color:var(--texto-sec);
    font-style:italic;
  }

  /* ---------- QUE ES DIRA (bloque 3) two-col ---------- */
  .two-col{
    display:grid; grid-template-columns:1.1fr 0.9fr; gap:70px; align-items:center;
  }
  @media (max-width:860px){ .two-col{ grid-template-columns:1fr; gap:44px; } }
  .flow-diagram{
    display:flex; flex-direction:column; gap:0; align-items:flex-start;
  }
  .flow-step{
    display:flex; align-items:center; gap:16px;
    padding:20px 0; width:100%;
  }
  .flow-step + .flow-step{ border-top:1px solid var(--linea); }
  .flow-dot{ width:9px; height:9px; border-radius:50%; background:var(--cobre); flex:none; }
  .flow-step:nth-child(2) .flow-dot{ background:var(--turquesa); }
  .flow-step:nth-child(3) .flow-dot{ background:var(--grafito); }
  .flow-label{ font-weight:600; font-size:15.5px; }
  .flow-desc{ font-size:13.5px; color:var(--texto-sec); }

  /* ---------- PILARES (bloque 4) ---------- */
  .pilares-intro{ max-width:700px; margin-bottom:60px; }
  .pilares-carousel{ position:relative; max-width:1104px; margin:0 auto; }
  .pilares-viewport{
    overflow:hidden;
    border-top:1px solid var(--linea);
    border-bottom:1px solid var(--linea);
  }
  .pilares-track{
    display:flex; gap:1px;
    background:var(--linea);
    transition:transform .5s cubic-bezier(.65,0,.35,1);
    will-change:transform;
  }
  .pilar-card{
    background:#fff; padding:34px 26px; min-height:250px;
    display:flex; flex-direction:column;
    transition:background .2s ease;
    flex:0 0 220px; width:220px;
    box-sizing:border-box;
  }
  .pilar-card:hover{ background:var(--bg-alt); }
  .pilar-num{ font-size:12.5px; color:var(--texto-sec); letter-spacing:.08em; margin-bottom:22px; }
  .pilar-q{ font-family:var(--serif-display); font-weight:600; font-size:1.05rem; margin-bottom:12px; }
  .pilar-desc{ font-size:13.5px; color:var(--texto-sec); flex:1; }

  .pilares-nav{
    display:flex; align-items:center; justify-content:center; gap:18px;
    margin-top:28px;
  }
  .pilar-arrow{
    width:44px; height:44px; border-radius:50%; border:1px solid var(--linea);
    background:#fff; cursor:pointer; font-size:18px; line-height:1; color:var(--grafito);
    display:flex; align-items:center; justify-content:center;
    transition:background .18s ease, border-color .18s ease, color .18s ease;
  }
  .pilar-arrow:hover{ background:var(--grafito); color:#fff; border-color:var(--grafito); }
  .pilar-arrow:focus-visible{ outline:2px solid var(--turquesa); outline-offset:2px; }
  @media (max-width:960px){
    .pilares-viewport{ max-width:100%; }
    .pilares-carousel{ max-width:100%; }
  }

  .pilares-footline{
    margin-top:40px; text-align:center; font-family:var(--serif-display); font-weight:600;
    font-size:1.15rem; color:var(--grafito);
  }

  /* ---------- SOLUCIONES (bloque 5) ---------- */
  .section-turquesa{ background:#689CA9; color:#fff; }
  .section-turquesa .eyebrow{ color:#fff; }
  .section-turquesa .eyebrow::before{ background:rgba(255,255,255,0.75); }
  .section-turquesa .section-head p{ color:rgba(255,255,255,0.78); }

  .soluciones-grid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:28px;
    align-items:stretch;
  }
  @media (max-width:900px){ .soluciones-grid{ grid-template-columns:1fr; } }
  .sol-card{
    border:1px solid var(--linea);
    padding:40px 32px;
    background:#fff;
    color:var(--grafito);
    display:flex; flex-direction:column;
    min-height:400px;
  }
  .sol-card.middle{
    border:6px solid var(--cobre);
  }
  .sol-tag{ font-size:12.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--texto-sec); font-weight:600; }
  .sol-name{ font-family:var(--serif-display); font-weight:800; font-size:1.9rem; margin-top:8px; }
  .sol-sub{ font-family:var(--serif-display); font-weight:600; font-size:1.02rem; margin-top:16px; color:var(--grafito); }
  .sol-desc{ margin-top:12px; font-size:14px; color:var(--texto-sec); }
  .sol-lleva{
    margin-top:18px; padding-top:18px; border-top:1px solid var(--linea);
    flex:1;
  }
  .sol-lleva-label{ font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--turquesa); font-weight:700; margin-bottom:10px; }
  .sol-lleva p{ font-size:13.5px; color:var(--texto-sec); line-height:1.65; }
  .sol-cta{ margin-top:24px; }
  .sol-cta .btn{ width:100%; justify-content:center; padding:13px 20px; font-size:14px; }

  /* ---------- DIAGNOSTICO (bloque 6, sobre crema) ---------- */
  .diag-grid{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
  @media (max-width:860px){ .diag-grid{ grid-template-columns:1fr; } }
  .diag-list{ list-style:none; margin:28px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:10px; }
  .diag-list li{
    font-size:13.5px; padding:8px 14px; border:1px solid var(--linea); border-radius:2px;
    color:var(--texto-sec);
    background:#fff;
  }
  .diag-panel{
    border:1px solid var(--linea);
    padding:38px 34px;
    background:#fff;
  }
  .diag-panel-title{ font-size:12.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--cobre); margin-bottom:20px; }
  .diag-panel ul{ list-style:none; margin:0; padding:0; }
  .diag-panel li{
    padding:13px 0; border-bottom:1px solid var(--linea);
    font-size:14.5px; color:var(--grafito);
    display:flex; justify-content:space-between; gap:12px;
  }
  .diag-panel li:last-child{ border-bottom:none; }
  .diag-panel li span:last-child{ color:var(--texto-sec); font-size:13px; }
  .diag-micro{ margin-top:26px; font-size:14px; color:var(--texto-sec); font-style:italic; }

  /* ---------- COMPARACION (bloque 7) ---------- */
  .compare{ display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--linea); }
  @media (max-width:760px){ .compare{ grid-template-columns:1fr; } }
  .compare-col{ padding:0; }
  .compare-col-head{
    padding:24px 30px; font-family:var(--serif-display); font-weight:700; font-size:1.1rem;
    border-bottom:1px solid var(--linea);
  }
  .compare-col.trad .compare-col-head{ color:var(--texto-sec); background:var(--bg-alt); }
  .compare-col.dira .compare-col-head{ color:#fff; background:var(--turquesa); }
  .compare-col ul{ list-style:none; margin:0; padding:0; }
  .compare-col li{ padding:20px 30px; border-bottom:1px solid var(--linea); font-size:15px; }
  .compare-col li:last-child{ border-bottom:none; }
  .compare-col.trad li{ color:var(--texto-sec); }
  .compare-col.dira li{ font-weight:500; }
  @media (max-width:760px){ .compare-col.trad{ border-bottom:1px solid var(--linea); } }

  /* ---------- IMPLANTACION (bloque 8) ---------- */
  .implant-central{ text-align:center; max-width:640px; margin:0 auto 60px; }
  .implant-central .lead{ font-size:1.15rem; color:var(--texto-sec); margin-top:18px; }
  .implant-central .strong{ font-family:var(--serif-display); font-weight:700; font-size:1.6rem; color:var(--cobre); margin-top:16px; display:block; }
  .cap-list{
    display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--linea); border:1px solid var(--linea);
  }
  @media (max-width:900px){ .cap-list{ grid-template-columns:repeat(2,1fr);} }
  @media (max-width:560px){ .cap-list{ grid-template-columns:1fr;} }
  .cap-item{ background:#fff; padding:26px 22px; font-size:14px; color:var(--grafito); position:relative; padding-left:34px; }
  .cap-item::before{ content:""; position:absolute; left:22px; top:30px; width:8px; height:2px; background:var(--turquesa); }

  /* ---------- PRUEBA (bloque 9) ---------- */
  .cases-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
  @media (max-width:820px){ .cases-grid{ grid-template-columns:1fr; } }
  .case-card{
    border:1px dashed var(--linea);
    background:var(--bg-alt);
    padding:30px;
  }
  .case-row{ display:flex; justify-content:space-between; gap:14px; padding:10px 0; border-bottom:1px solid var(--linea); font-size:13.5px; }
  .case-row:last-child{ border-bottom:none; }
  .case-row .k{ color:var(--texto-sec); flex:none; width:44%; }
  .case-row .v{ color:#b8bcb9; font-style:italic; text-align:right; }
  .case-pilar{ display:inline-block; margin-bottom:16px; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--cobre); font-weight:700; }
  .stats-row{ display:flex; gap:40px; margin-top:56px; flex-wrap:wrap; }
  .stat{ font-family:var(--serif-display); }
  .stat .num{ font-size:2.4rem; font-weight:800; color:var(--turquesa); }
  .stat .lbl{ font-size:13px; color:var(--texto-sec); font-family:var(--sans-body); margin-top:4px; }

  /* ---------- RECURSOS (bloque 10) ---------- */
  .res-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
  @media (max-width:900px){ .res-grid{ grid-template-columns:1fr; } }
  .res-card{ border:1px solid var(--linea); padding:28px; background:#fff; }
  .res-tags{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:16px; }
  .res-tag{ font-size:11px; letter-spacing:.06em; text-transform:uppercase; font-weight:700; padding:4px 9px; border-radius:2px; }
  .res-tag.pilar{ background:rgba(191,117,69,0.12); color:var(--cobre); }
  .res-tag.sol{ background:rgba(45,118,135,0.12); color:var(--turquesa); }
  .res-type{ font-size:12.5px; color:var(--texto-sec); margin-bottom:8px; }
  .res-title{ font-family:var(--serif-display); font-weight:700; font-size:1.15rem; }

  /* ---------- MANU (bloque 11) ---------- */
  .manu-grid{ display:grid; grid-template-columns:0.8fr 1.2fr; gap:64px; align-items:center; }
  @media (max-width:860px){ .manu-grid{ grid-template-columns:1fr; gap:36px; } }
  .manu-portrait{
    aspect-ratio:4/5;
    background:var(--bg-alt);
    border:1px solid var(--linea);
    overflow:hidden;
  }
  .manu-portrait img{
    width:100%; height:100%; object-fit:cover; object-position:center 18%;
    display:block;
  }
  .manu-copy p{ font-size:1.02rem; color:var(--texto-sec); margin-bottom:18px; }
  .manu-idea{ font-family:var(--serif-display); font-weight:600; font-size:1.25rem; color:var(--grafito); margin:26px 0; }

  /* ---------- CIERRE (bloque 12) ---------- */
  .cierre{ text-align:center; }
  .cierre h2{ max-width:15ch; margin:0 auto; }
  .cierre .lead{ max-width:520px; margin:22px auto 0; color:var(--texto-sec); font-size:1.05rem; }
  .cierre-final{ margin-top:52px; font-family:var(--serif-display); font-style:italic; font-size:1.05rem; color:var(--texto-sec); }

  /* ---------- FOOTER ---------- */
  footer{ background:var(--grafito); color:rgba(255,255,255,0.72); padding:80px 0 32px; }
  .footer-top{ display:grid; grid-template-columns:1.3fr repeat(4,1fr); gap:36px; padding-bottom:56px; }
  @media (max-width:900px){ .footer-top{ grid-template-columns:repeat(2,1fr); } }
  @media (max-width:560px){ .footer-top{ grid-template-columns:1fr; gap:40px; } }
  .footer-logo{ width:120px; margin-bottom:18px; }
  .footer-top p{ font-size:13.5px; line-height:1.7; max-width:32ch; color:rgba(255,255,255,0.5); }
  .footer-col h4{ font-family:var(--sans-body); font-size:12.5px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,0.4); margin-bottom:18px; font-weight:600; }
  .footer-col ul{ list-style:none; margin:0; padding:0; }
  .footer-col li{ margin-bottom:12px; }
  .footer-col a{ font-size:14px; text-decoration:none; color:rgba(255,255,255,0.78); }
  .footer-col a:hover{ color:#fff; }
  .footer-bottom{
    border-top:1px solid rgba(255,255,255,0.12);
    padding-top:26px;
    display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;
    font-size:12.5px; color:rgba(255,255,255,0.4);
  }
  .footer-social{ display:flex; gap:16px; }
  .footer-social a{ text-decoration:none; color:rgba(255,255,255,0.55); font-size:12.5px; }
  .footer-social a:hover{ color:#fff; }

  /* ---------- reveal on scroll ---------- */
  .reveal{ opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
  .reveal.in{ opacity:1; transform:none; }

  /* skip link */
  .skip-link{
    position:absolute; left:-9999px; top:0; background:var(--cobre); color:#fff;
    padding:12px 18px; z-index:200;
  }
  .skip-link:focus{ left:16px; top:16px; }

/* Enlaces de profundidad y firma GONCÍA · Método 5P */
.pilares-method-link{display:flex;justify-content:center;margin-top:26px}
.manu-more{margin-top:28px}
.footer-goncia{display:flex;align-items:center;gap:14px;padding:24px 0;border-top:1px solid rgba(255,255,255,.10);border-bottom:1px solid rgba(255,255,255,.10);margin-bottom:24px}
.footer-goncia span{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.42)}
.footer-goncia a{display:inline-flex;align-items:center}
.footer-goncia img{display:block;width:112px;height:auto;opacity:.9;transition:opacity .2s ease}
.footer-goncia a:hover img{opacity:1}
@media(max-width:560px){.footer-goncia{justify-content:flex-start}.footer-goncia img{width:104px}}
