/* TRIHAWER'SAC — estilos del sitio */
:root{
  --ink:#161A1D;--paper:#F4F5F1;--field:#FBFBF9;--muted:#4A5157;--muted2:#3A4146;
  --err:#A8261C;--ink-hover:#2B3136;
  --display:'Archivo',sans-serif;--body:'Instrument Sans',sans-serif;
  --pad:clamp(20px,4vw,56px);--header-h:208px;
  --ease:cubic-bezier(.7,0,.2,1);--ease-out:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box}
html{scroll-padding-top:calc(var(--header-h) + 24px)}
html,body{margin:0;background:var(--paper);color:var(--ink)}
body{font-family:var(--body);font-size:17px;line-height:1.55;min-height:100vh;display:flex;flex-direction:column}
main{flex:1}
a{color:var(--ink)}
a:hover{color:#3B4CCA}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
input,textarea,button{font:inherit}
img{max-width:100%}
.wrap{max-width:1320px;margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.justify{text-align:justify;hyphens:auto}
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--ink);color:var(--paper);padding:12px 18px}
.skip:focus{left:12px;top:12px;color:var(--paper)}

@keyframes th-pulse{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes th-drive{0%{transform:translateX(-6px)}50%{transform:translateX(6px)}100%{transform:translateX(-6px)}}
@keyframes th-road{to{stroke-dashoffset:-16}}
@keyframes th-spin{to{transform:rotate(360deg)}}
@keyframes th-bar{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
@keyframes th-bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-2px) rotate(-6deg)}}
@keyframes th-talk{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}
@keyframes th-dot{0%,100%{opacity:.2}50%{opacity:1}}
@keyframes th-print{0%{transform:translateY(-14px)}60%,100%{transform:translateY(0)}}
@keyframes th-check{0%,20%{stroke-dashoffset:24}60%,100%{stroke-dashoffset:0}}
@keyframes th-move{0%{transform:translateX(0)}100%{transform:translateX(28px)}}
@keyframes th-glow{0%,100%{opacity:.15}50%{opacity:1}}
@keyframes th-tick{0%,15%{transform:rotate(0)}35%,100%{transform:rotate(90deg)}}
@keyframes th-tilt{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(8deg)}}
@keyframes th-morph{0%,100%{rx:3px}50%{rx:16px}}
.icon{display:block;flex:none}

/* Botones */
.btn{display:inline-block;padding:16px 24px;font-weight:600;text-decoration:none;text-align:center}
.btn-sm{padding:11px 18px}
.btn-lg{padding:17px 26px}
.btn-ink{background:var(--ink);color:var(--paper)}
.btn-ink:hover{background:var(--ink-hover);color:var(--paper)}
.btn-white{padding:15px 22px;background:#fff;border:1px solid #fff;color:var(--ink)}
.btn-white:hover{background:#E8EAE5;color:var(--ink)}
.btn-outline-white{padding:15px 22px;border:1px solid #fff;color:#fff}
.btn-outline-white:hover{background:rgba(255,255,255,.12);color:#fff}
.btn-row{display:flex;flex-wrap:wrap;gap:12px}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:var(--paper);border-bottom:1px solid rgba(22,26,29,.12)}
.header-row{height:var(--header-h);display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center}
.brand img{height:192px;width:auto;display:block;mix-blend-mode:multiply}
.nav-desktop{display:flex;align-items:center;gap:32px;font-size:15px;font-weight:500}
.nav-link{position:relative;padding:25px 0;text-decoration:none;background:none;border:0;color:var(--ink);cursor:pointer;font-weight:500;font-size:15px;display:flex;align-items:center;gap:6px}
.nav-link::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;background:var(--bar,transparent)}
.caret{font-size:11px}
.dropdown{position:relative}
.dropdown-menu{display:none;position:absolute;top:100%;left:-20px;width:340px;background:var(--paper);border:1px solid rgba(22,26,29,.14);padding:10px;flex-direction:column;gap:2px}
.dropdown.is-open .dropdown-menu{display:flex}
.dropdown-menu a{display:grid;grid-template-columns:34px 1fr;gap:14px;align-items:center;padding:12px;text-decoration:none;color:var(--ink)}
.dropdown-menu a.is-current{background:rgba(22,26,29,.06)}
.dropdown-menu a:hover{background:rgba(22,26,29,.05);color:var(--ink)}
.dropdown-menu svg{display:block}
.dropdown-menu span{display:flex;flex-direction:column;gap:2px}
.dropdown-menu strong{font-weight:600}
.dropdown-menu small{font-size:13.5px;line-height:1.4;color:var(--muted)}
.menu-toggle{display:none;min-height:44px;padding:0 16px;background:none;border:1px solid var(--ink);color:var(--ink);font-weight:600;cursor:pointer}
.nav-mobile{display:none;border-top:1px solid rgba(22,26,29,.12);padding:12px var(--pad) 24px;flex-direction:column;gap:4px;font-size:18px;font-weight:500}
.nav-mobile a{padding:12px 0;text-decoration:none;display:flex;align-items:center;gap:12px}
.nav-mobile .dot{width:12px;height:12px;flex:none}
.nav-mobile .btn{margin-top:8px;padding:14px 18px;justify-content:center}
@media (max-width:859px){
  :root{--header-h:128px}
  .brand img{height:112px}
  .nav-desktop{display:none}
  .menu-toggle{display:block}
  .site-header.is-open .nav-mobile{display:flex}
  .site-header.is-open{max-height:100vh;overflow-y:auto}
}

/* Hero */
.hero{position:relative;overflow:hidden;background:var(--ink);color:#fff}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(4px);transform:scale(1.06)}
.hero-shade{position:absolute;inset:0;background:rgba(22,26,29,.62)}
.hero-inner{position:relative;padding-top:clamp(56px,8vw,120px);padding-bottom:clamp(56px,7vw,104px)}
.hero h1{margin:0;max-width:1120px;font-family:var(--display);font-stretch:125%;font-weight:650;font-size:clamp(36px,5.2vw,78px);line-height:1.02;letter-spacing:-0.025em;text-wrap:balance}
.hero-foot{margin-top:clamp(28px,3.5vw,44px);display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:28px}
.hero-foot p{margin:0;max-width:54ch;font-size:clamp(17px,1.4vw,20px);color:#E8EAE5;text-wrap:pretty}

/* Paneles de frentes */
.panels{margin-top:clamp(36px,5vw,64px);display:flex;gap:10px;height:clamp(440px,60vh,660px)}
.panel{flex:1 1 0;transition:flex 520ms var(--ease);min-width:0;background:var(--c);color:var(--fg);border-radius:10px;padding:clamp(20px,2.2vw,32px);display:flex;flex-direction:column;justify-content:space-between;gap:20px;text-decoration:none;overflow:hidden}
.panel:hover{color:var(--fg)}
.panels.has-hover .panel{flex:.75 1 0}
.panels.has-hover .panel.is-hover{flex:2.4 1 0}
.panel-top{display:flex;flex-direction:column;gap:18px}
.panel h2{margin:0;font-family:var(--display);font-stretch:100%;font-weight:650;font-size:clamp(20px,1.7vw,28px);line-height:1.08;letter-spacing:-0.015em;overflow-wrap:normal}
.panel-bottom{display:flex;flex-direction:column;gap:14px}
.panel-detail{display:none;margin:0;padding:0;list-style:none;flex-direction:column;gap:6px;font-size:15px;font-weight:500}
.panel.is-hover .panel-detail{display:flex}
.panel-detail li{padding-top:6px;border-top:1px solid var(--rule);display:flex;align-items:baseline;gap:10px}
.panel-detail li span:first-child{flex:none;width:6px;height:6px;border-radius:50%;background:currentColor;transform:translateY(-2px)}
.panel-bottom p{margin:0;font-size:15.5px;line-height:1.45;max-width:34ch}
.panel-more{font-weight:600;font-size:15px;text-decoration:underline;text-underline-offset:4px}
@media (max-width:859px){
  .panels{flex-direction:column;height:auto}
  .panel,.panels.has-hover .panel,.panels.has-hover .panel.is-hover{flex:0 0 auto;min-height:140px}
  .panel.is-hover .panel-detail{display:none}
}

/* Overlay de expansión */
.expand-overlay{position:fixed;z-index:100;pointer-events:none}
html.th-expanding body::after{content:"";position:fixed;inset:0;z-index:100;background:var(--expand)}

/* Por qué / cierre */
.section-why{padding-top:clamp(80px,10vw,140px);padding-bottom:clamp(80px,10vw,140px)}
.why-head{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));gap:clamp(28px,5vw,80px);align-items:start}
.h2{margin:0;font-family:var(--display);font-stretch:125%;font-weight:650;font-size:clamp(32px,3.8vw,56px);line-height:1.04;letter-spacing:-0.02em}
.lead{margin:0;font-size:clamp(18px,1.5vw,21px);line-height:1.55}
.why-grid{margin-top:clamp(48px,6vw,80px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:24px}
.why-item{border-top:2px solid var(--ink);padding-top:18px;font-family:var(--display);font-stretch:112%;font-weight:600;font-size:22px;line-height:1.2;display:flex;flex-direction:column;gap:16px}
.section-cta{padding-bottom:clamp(80px,10vw,140px)}
.stripe{display:grid;grid-template-columns:repeat(4,1fr);height:10px}
.cta-row{padding-top:clamp(40px,5vw,64px);display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:28px}
.h2-cta{margin:0;max-width:16ch;font-family:var(--display);font-stretch:125%;font-weight:650;font-size:clamp(32px,4.4vw,64px);line-height:1.02;letter-spacing:-0.02em;text-wrap:balance}

/* Nosotros */
.page-pad{padding-top:clamp(48px,7vw,104px);padding-bottom:clamp(80px,10vw,140px)}
.h1-nosotros{margin:0;font-family:var(--display);font-stretch:125%;font-weight:650;font-size:clamp(44px,7vw,108px);line-height:1;letter-spacing:-0.03em}
.intro{margin:clamp(28px,4vw,48px) 0 0;max-width:58ch;font-size:clamp(19px,1.8vw,26px);line-height:1.45}
.office{display:block;margin-top:clamp(48px,6vw,80px);width:100%;height:auto;aspect-ratio:16/7;object-fit:cover;border-radius:10px}
.stripe-nosotros{margin-top:clamp(56px,7vw,96px)}
.mv-grid{margin-top:clamp(40px,5vw,64px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:clamp(32px,5vw,72px)}
.mv-grid p{margin:0;font-size:18px}
.h2-sm{margin:0 0 14px;font-family:var(--display);font-stretch:125%;font-weight:650;font-size:clamp(26px,2.6vw,36px);letter-spacing:-0.015em}
.h2-valores{margin-top:clamp(72px,9vw,120px)}
.vals-grid{margin-top:clamp(28px,3vw,40px);display:grid;grid-template-columns:1fr;gap:clamp(20px,2.4vw,36px)}
@media (min-width:480px){.vals-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:720px){.vals-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.val{border-top:2px solid var(--ink);padding-top:18px;display:flex;flex-direction:column;gap:14px}
.val h3{margin:0 0 8px;font-family:var(--display);font-stretch:112%;font-weight:650;font-size:21px}
.val p{margin:0}

/* Páginas de frente */
.unit-head{background:var(--c);color:var(--fg)}
.unit-head-inner{padding-top:clamp(48px,7vw,104px);padding-bottom:clamp(48px,6vw,80px);min-height:min(68vh,720px);display:flex;flex-direction:column;justify-content:space-between;gap:48px}
.unit-back{align-self:flex-start;color:var(--fg);font-weight:500;font-size:15px;text-underline-offset:4px}
.unit-back:hover{color:var(--fg)}
.unit-head h1{margin:0;max-width:1100px;font-family:var(--display);font-stretch:125%;font-weight:650;font-size:clamp(40px,7vw,112px);line-height:.98;letter-spacing:-0.03em;text-wrap:balance}
.unit-foot{margin-top:clamp(28px,3.5vw,44px);display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:28px}
.unit-foot p{margin:0;max-width:44ch;font-size:clamp(19px,1.7vw,24px);line-height:1.4;text-wrap:pretty}
.btn-unit{background:var(--bb);color:var(--bf)}
.btn-unit:hover{color:var(--bf);opacity:.9}
.svc-list{padding-top:clamp(64px,8vw,112px);display:flex;flex-direction:column;gap:clamp(48px,6vw,80px)}
.svc{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:clamp(24px,4vw,64px);align-items:center}
.svc-img{overflow:hidden;border-radius:10px;background:#E5E7E1}
.svc-img img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;transition:transform 600ms var(--ease-out)}
.svc:hover .svc-img img{transform:scale(1.06)}
.svc-title{display:inline-block;max-width:100%}
.svc-bar{display:block;width:44px;height:6px;background:var(--c);margin-bottom:22px;transition:width 500ms var(--ease-out)}
.svc:hover .svc-bar{width:100%}
.svc h2{margin:0 0 14px;font-family:var(--display);font-stretch:118%;font-weight:650;font-size:clamp(26px,2.6vw,38px);line-height:1.08;letter-spacing:-0.015em;text-wrap:balance}
.svc p{margin:0;max-width:46ch;font-size:clamp(17px,1.4vw,19px);color:var(--muted2);text-wrap:pretty}
.unit-close{padding-top:clamp(72px,9vw,120px);padding-bottom:clamp(72px,9vw,120px)}
.unit-cta{border-top:2px solid var(--ink);padding-top:clamp(32px,4vw,48px);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px}
.unit-cta p{margin:0;font-family:var(--display);font-stretch:118%;font-weight:600;font-size:clamp(22px,2.2vw,30px);line-height:1.15}
.others-title{margin:clamp(72px,9vw,120px) 0 24px}
.others{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:10px}
.others a{min-height:200px;background:var(--c);color:var(--fg);border-radius:10px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;gap:20px;text-decoration:none;font-size:15px;line-height:1.45}
.others a:hover{color:var(--fg);filter:brightness(1.06)}
.others-name{font-family:var(--display);font-stretch:112%;font-weight:650;font-size:24px;line-height:1.08}

/* Contacto */
.h1-contacto{margin:0;max-width:16ch;font-family:var(--display);font-stretch:125%;font-weight:650;font-size:clamp(38px,5.6vw,84px);line-height:1.02;letter-spacing:-0.025em;text-wrap:balance}
.contact-grid{margin-top:clamp(40px,5vw,72px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:clamp(40px,6vw,96px);align-items:start}
.sel-bar{height:10px;background:var(--sel,var(--ink));transition:background .3s}
form[data-form]{padding-top:32px;display:flex;flex-direction:column;gap:22px}
fieldset{border:0;margin:0;padding:0}
legend{padding:0;margin-bottom:10px;font-weight:600;font-size:15px}
.chips{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:8px}
.chip{min-height:52px;display:flex;align-items:center;gap:12px;padding:12px 14px;text-align:left;cursor:pointer;border:1px solid rgba(22,26,29,.3);background:var(--field);color:var(--ink);font-weight:500;font-size:15.5px}
.chip-dot{flex:none;width:12px;height:12px;background:var(--c)}
.chip[aria-checked="true"]{background:var(--c);border-color:var(--c);color:var(--fg)}
.chip[aria-checked="true"] .chip-dot{background:var(--fg)}
.field{display:flex;flex-direction:column;gap:8px;font-weight:600;font-size:15px}
.field input,.field textarea{padding:14px 16px;border:1px solid rgba(22,26,29,.3);background:var(--field);color:var(--ink);font-weight:400;font-size:17px;border-radius:0}
.field textarea{resize:vertical}
.field .is-invalid{border-color:var(--err)}
.field-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:22px}
.field-col{display:flex;flex-direction:column;gap:8px}
.err{margin:8px 0 0;color:var(--err);font-size:14.5px}
.field-col .err{margin:0}
.err-up{margin:-12px 0 0}
.err[hidden],.form-error[hidden],.sent[hidden],form[hidden]{display:none}
.form-error{margin:0;padding:14px 16px;border:1px solid var(--err);color:var(--err);font-size:15.5px}
.btn-submit{min-height:52px;padding:0 28px;background:var(--ink);color:var(--paper);border:0;font-weight:600;font-size:16px;cursor:pointer}
.btn-submit:disabled{opacity:.6;cursor:default}
.hp{position:absolute;left:-9999px}
.sent{padding-top:40px}
.sent p{margin:0;font-family:var(--display);font-stretch:118%;font-weight:650;font-size:clamp(26px,2.6vw,36px);line-height:1.15}
.btn-again{margin-top:28px;min-height:48px;padding:0 22px;background:none;border:1px solid var(--ink);color:var(--ink);font-weight:600;cursor:pointer}
.contact-aside{display:flex;flex-direction:column;gap:10px}
.contact-aside h2{margin:0;font-family:var(--display);font-stretch:118%;font-weight:650;font-size:22px}
.contact-aside a{font-size:18px;text-underline-offset:4px;overflow-wrap:anywhere}

/* Footer */
.site-footer{background:var(--ink);color:var(--paper)}
.site-footer .wrap{padding-top:clamp(56px,7vw,88px);padding-bottom:32px}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:40px}
.footer-grid>*{display:flex;flex-direction:column;gap:10px;font-size:15px;color:#C9CDC6}
.footer-grid .footer-brand{gap:16px}
.footer-brand img{align-self:flex-start;height:120px;width:auto;display:block;filter:grayscale(1) invert(1) contrast(3);mix-blend-mode:screen}
.footer-brand p{margin:0;max-width:30ch}
.footer-title{font-weight:600;color:var(--paper)}
.site-footer a{color:#C9CDC6;text-decoration:none}
.site-footer a:hover{color:var(--paper);text-decoration:underline}
.footer-bottom{margin-top:56px;padding-top:24px;border-top:1px solid rgba(244,245,241,.16);display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;font-size:14px;color:#C9CDC6}

@media (prefers-reduced-motion: reduce){
  .th-anim,.th-anim *{animation:none !important}
  .panel{transition:none}
  .svc:hover .svc-img img{transform:none}
  html{scroll-behavior:auto}
}
