/* ============================================================
   Oksenberg Abogados Litigantes — Static site stylesheet
   Design tokens + component styles. Self-contained.
   ============================================================ */

@font-face{font-family:'Glacial Indifference';src:url('fonts/GlacialIndifference-Regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Glacial Indifference';src:url('fonts/GlacialIndifference-Bold.otf') format('opentype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Glacial Indifference';src:url('fonts/GlacialIndifference-Italic.otf') format('opentype');font-weight:400;font-style:italic;font-display:swap}
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&display=swap');

:root{
  --oa-navy-900:#0E1C2C;--oa-navy-800:#142840;--oa-navy-700:#1C344E;--oa-navy-650:#243746;--oa-navy-600:#2B4868;--oa-navy-500:#44608A;--oa-navy-400:#6E84A6;--oa-navy-300:#9CADC5;--oa-navy-200:#C9D4E2;--oa-navy-100:#E6ECF3;--oa-navy-50:#F2F5F9;
  --oa-paper:#F6F2EA;--oa-paper-soft:#FBF8F2;--oa-paper-deep:#ECE5D6;--oa-bone:#E8E1D1;
  --oa-slate-700:#4A4A4A;--oa-slate-500:#858585;--oa-slate-300:#BDC3C8;--oa-slate-100:#DCDFE2;
  --oa-ink-900:#14181E;--oa-ink-800:#1F2530;--oa-ink-700:#2E3744;--oa-ink-500:#5A6573;--oa-ink-400:#7E8896;--oa-ink-300:#A8B0BB;--oa-ink-200:#CDD2DA;--oa-ink-100:#E5E8ED;--oa-ink-50:#F4F6F8;--oa-white:#FFFFFF;
  --oa-gold-700:#8C6B33;--oa-gold-600:#A8853F;--oa-gold-500:#BC9954;--oa-gold-400:#CBAA6A;--oa-gold-300:#D6BC83;--oa-gold-100:#EEE2C5;
  --fg-1:var(--oa-navy-900);--fg-2:var(--oa-ink-700);--fg-3:var(--oa-ink-500);--fg-4:var(--oa-ink-400);--fg-accent:var(--oa-gold-600);--fg-brand:var(--oa-navy-700);--fg-link:var(--oa-navy-700);--fg-link-hover:var(--oa-navy-900);
  --bg-page:var(--oa-paper);--bg-page-alt:var(--oa-paper-soft);--bg-surface:var(--oa-white);--bg-inverse:var(--oa-navy-700);
  --border-1:var(--oa-bone);--border-2:var(--oa-ink-100);
  --font-sans:'Glacial Indifference',ui-sans-serif,system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
  --font-serif:'Cormorant Garamond','Source Serif Pro',Georgia,serif;
  --shadow-1:0 1px 2px rgba(14,28,44,.05),0 1px 1px rgba(14,28,44,.04);
  --shadow-2:0 2px 6px rgba(14,28,44,.06),0 1px 2px rgba(14,28,44,.04);
  --shadow-3:0 8px 24px rgba(14,28,44,.08),0 2px 6px rgba(14,28,44,.04);
  --shadow-4:0 20px 48px rgba(14,28,44,.14),0 4px 12px rgba(14,28,44,.06);
  --ease-standard:cubic-bezier(.2,0,0,1);
  --container:1280px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg-page);color:var(--fg-1);font-family:var(--font-sans);-webkit-font-smoothing:antialiased}
::selection{background:var(--oa-gold-100);color:var(--oa-navy-900)}
img{max-width:100%}
a{color:var(--fg-link);text-decoration:none;border-bottom:1px solid transparent;transition:border-color 140ms var(--ease-standard),color 140ms var(--ease-standard)}
a:hover{color:var(--fg-link-hover);border-bottom-color:var(--oa-gold-600)}
.wrap{max-width:var(--container);margin:0 auto;padding:0 40px}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--oa-gold-600)}
.eyebrow--gold{color:var(--oa-gold-300)}
.rule{width:72px;height:2px;background:var(--oa-gold-600);margin:14px 0 20px}

/* ── Header ─────────────────────────────────────────────── */
.hdr{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(246,242,234,.97);border-bottom:1px solid transparent;transition:border-color 260ms;backdrop-filter:blur(2px)}
.hdr.scrolled{border-bottom-color:var(--oa-bone)}
.hdr-inner{max-width:var(--container);margin:0 auto;padding:0 40px;height:72px;display:flex;align-items:center;gap:16px}
.brand{display:flex;align-items:center;gap:12px;background:none;border:none;cursor:pointer;padding:0;color:#1C364F;flex-shrink:0;border-bottom:none}
.brand:hover{border-bottom:none}
.brand svg{display:block;flex-shrink:0}
.brand-text{display:flex;flex-direction:column;align-items:stretch;gap:4px}
.brand-word{font-size:16px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;line-height:1;color:currentColor}
.brand-line{height:1px;width:100%;background:currentColor;opacity:.32}
.brand-sub{font-size:7px;font-weight:400;letter-spacing:.30em;text-transform:uppercase;line-height:1;display:flex;gap:.30em}
.brand-sub span:last-child{opacity:.65}
.nav{display:flex;gap:32px;align-items:center;margin-left:auto}
.nav-item{position:relative}
.nav-link{font-size:13px;font-weight:400;color:var(--fg-2);background:none;border:none;cursor:pointer;padding:4px 0;border-bottom:1.5px solid transparent;transition:color 140ms,border-color 140ms;letter-spacing:.02em;font-family:var(--font-sans)}
.nav-link:hover{color:#1C364F}
.nav-link.active{font-weight:700;color:#1C364F;border-bottom-color:var(--oa-gold-600)}
.nav-menu{position:absolute;top:100%;left:0;min-width:260px;background:var(--oa-navy-900);overflow:hidden;box-shadow:0 16px 32px rgba(14,28,44,.28);padding:20px 22px;opacity:0;visibility:hidden;transform:translateY(4px);transition:opacity 160ms,transform 160ms,visibility 160ms}
.nav-item:hover .nav-menu{opacity:1;visibility:visible;transform:translateY(0)}
.nav-menu-slashes{position:absolute;top:0;right:0;bottom:0;width:55%;overflow:hidden;pointer-events:none}
.nav-menu-slashes i{position:absolute;top:-20%;bottom:-20%;width:30px;transform:skewX(-18deg);display:block}
.nav-menu-label{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--oa-gold-300);margin-bottom:12px;position:relative;z-index:1}
.nav-menu a{display:block;font-size:14px;color:var(--oa-navy-200);padding:7px 0;white-space:nowrap;position:relative;z-index:1;border-bottom:none;cursor:pointer}
.nav-menu a:hover{color:#fff;border-bottom:none}
.btn-cta{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:var(--oa-navy-700);color:#fff;border:none;border-radius:5px;height:36px;padding:0 18px;cursor:pointer;transition:background 140ms;font-family:var(--font-sans)}
.btn-cta:hover{background:var(--oa-navy-800)}
.hdr-toggle{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:8px;margin-left:auto}
.hdr-toggle span{display:block;width:24px;height:2px;background:#1C364F;transition:transform 220ms,opacity 160ms}

/* ── Hero ───────────────────────────────────────────────── */
.hero{position:relative;overflow:hidden;background:var(--oa-navy-700);min-height:680px;display:flex;align-items:center}
.hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.hero-overlay{position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,rgba(14,28,44,.86) 0%,rgba(28,52,78,.70) 60%,rgba(14,28,44,.75) 100%)}
.hero-slashes{position:absolute;top:0;left:0;bottom:0;width:45%;overflow:hidden;pointer-events:none;z-index:1}
.hero-slash{position:absolute;top:-20%;bottom:-20%;width:52px;animation:slashLoop 7s ease-in-out infinite}
.hero-slash-1{left:28%;background:rgba(133,133,133,.55);animation-delay:0s}
.hero-slash-2{left:calc(28% - 46px);background:rgba(189,195,200,.50);animation-delay:.55s}
.hero-slash-3{left:calc(28% - 92px);background:rgba(255,255,255,.22);animation-delay:1.1s}
@keyframes slashLoop{0%{transform:skewX(-18deg) translateX(-280%);opacity:0}14%{opacity:1}18%,66%{transform:skewX(-18deg) translateX(0);opacity:1}80%{transform:skewX(-18deg) translateX(0);opacity:0}81%,100%{transform:skewX(-18deg) translateX(-280%);opacity:0}}
.hero-mark{position:absolute;right:80px;top:50%;transform:translateY(-50%);height:300px;opacity:.22;pointer-events:none;z-index:1;filter:brightness(0) invert(1)}
.hero-content{position:relative;z-index:2;max-width:var(--container);margin:0 auto;padding:120px 40px 100px;width:100%}
.hero-eyebrow{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--oa-gold-300);margin-bottom:20px}
.hero-content .rule{margin:0 0 28px}
.hero h1{font-size:clamp(48px,5.5vw,80px);font-weight:400;line-height:1.06;letter-spacing:-.02em;color:#fff;max-width:820px;margin:0 0 28px}
.hero-sub{font-size:20px;color:rgba(255,255,255,.88);line-height:1.7;max-width:620px;margin:0 0 44px;text-shadow:0 1px 8px rgba(14,28,44,.5)}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap}
.btn{font-size:15px;font-weight:700;border-radius:6px;height:48px;padding:0 28px;cursor:pointer;letter-spacing:.01em;font-family:var(--font-sans);border:none;transition:background 140ms,border-color 140ms}
.btn-light{background:var(--oa-white);color:var(--oa-navy-700)}
.btn-light:hover{background:var(--oa-paper)}
.btn-ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.5)}
.btn-ghost:hover{border-color:rgba(255,255,255,.9)}

/* ── Sections ───────────────────────────────────────────── */
.section{padding:96px 0}
.section-head{margin-bottom:60px}
.section-head h2{font-size:48px;font-weight:400;letter-spacing:-.015em;color:var(--oa-navy-700);line-height:1.1}

/* Practice areas */
#areas{background:var(--oa-paper)}
.areas-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.area-card{background:var(--oa-white);border-radius:10px;padding:32px 28px;border:1px solid var(--border-2);box-shadow:var(--shadow-1);cursor:pointer;display:flex;flex-direction:column;gap:12px;transition:box-shadow 220ms,background 140ms,transform 220ms}
.area-card:hover{box-shadow:var(--shadow-3);transform:translateY(-2px)}
.area-card .tag{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--oa-gold-600)}
.area-card h3{font-size:22px;font-weight:700;color:var(--oa-navy-700);line-height:1.2}
.area-card p{font-size:15px;line-height:1.65;color:var(--fg-3);flex:1}
.area-card .more{font-size:13px;font-weight:700;letter-spacing:.02em;color:var(--fg-4);display:flex;align-items:center;gap:6px;margin-top:4px;transition:color 140ms}
.area-card:hover .more{color:var(--oa-navy-700)}
.area-card.highlight{background:var(--oa-navy-700);border:none;box-shadow:var(--shadow-2)}
.area-card.highlight:hover{background:var(--oa-navy-800)}
.area-card.highlight .tag{color:var(--oa-gold-300)}
.area-card.highlight h3{color:#fff}
.area-card.highlight p{color:var(--oa-navy-200)}
.area-card.highlight .more{color:var(--oa-gold-300)}

/* Clients marquee */
#clientes{background:var(--oa-white);padding:56px 0;border-top:1px solid var(--border-2);border-bottom:1px solid var(--border-2)}
.clients-label{text-align:center;margin-bottom:36px}
.clients-strip{position:relative;overflow:hidden}
.clients-fade{position:absolute;top:0;bottom:0;width:120px;z-index:2;pointer-events:none}
.clients-fade.l{left:0;background:linear-gradient(to right,var(--oa-white),transparent)}
.clients-fade.r{right:0;background:linear-gradient(to left,var(--oa-white),transparent)}
.clients-track{display:flex;align-items:center;width:max-content;animation:marquee 32s linear infinite;will-change:transform}
.clients-track:hover{animation-play-state:paused}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.client{flex-shrink:0;height:112px;padding:0 52px;display:flex;align-items:center;justify-content:center;border-right:1px solid var(--border-1)}
.client img{width:auto;display:block;max-width:140px;object-fit:contain;opacity:.72;filter:grayscale(30%);transition:opacity 200ms,filter 200ms}
.client:hover img{opacity:1;filter:grayscale(0)}

/* About / team */
#equipo{background:var(--oa-paper-soft)}
.about-intro{display:grid;grid-template-columns:5fr 7fr;gap:80px;margin-bottom:72px;align-items:start}
.about-intro h2{font-size:42px;font-weight:400;letter-spacing:-.015em;color:var(--oa-navy-700);line-height:1.12}
.about-intro p{font-size:18px;line-height:1.72;color:var(--fg-2)}
.about-intro p+p{margin-top:24px}
.team-label{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--fg-3);margin-bottom:32px}
.team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:24px}
.member{background:var(--oa-white);border:1px solid var(--border-2);border-radius:10px;box-shadow:var(--shadow-1);cursor:pointer;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow 220ms,transform 220ms}
.member:hover{box-shadow:var(--shadow-3);transform:translateY(-2px)}
.member-photo{width:100%;height:240px;background:var(--oa-navy-100);position:relative;overflow:hidden}
.member-photo img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
.member-photo::after{content:"";position:absolute;inset:0;background:var(--oa-navy-700);opacity:0;transition:opacity 220ms}
.member:hover .member-photo::after{opacity:.12}
.member-body{padding:22px 22px 20px}
.member-role{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--oa-gold-600);margin-bottom:6px}
.member-name{font-size:17px;font-weight:700;color:var(--oa-navy-700);margin-bottom:6px;line-height:1.2}
.member-spec{font-size:12px;color:var(--fg-3);line-height:1.5}
.member-more{margin-top:12px;font-size:12px;font-weight:700;color:var(--fg-4);letter-spacing:.02em;display:flex;align-items:center;gap:4px;transition:color 140ms}
.member:hover .member-more{color:var(--oa-navy-700)}

/* Recognition */
#reconocimientos{background:var(--oa-navy-700);padding:64px 0;position:relative;overflow:hidden}
.recog-mark{position:absolute;right:80px;top:50%;transform:translateY(-50%);height:340px;opacity:.05;pointer-events:none;filter:brightness(0) invert(1)}
#reconocimientos .wrap{position:relative;z-index:1}
#reconocimientos h2{font-size:40px;font-weight:400;color:#fff;letter-spacing:-.01em}
.recog-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:28px 36px;display:grid;grid-template-columns:auto 1fr;gap:40px;align-items:center}
.recog-bigyear{font-size:96px;font-weight:700;color:rgba(255,255,255,.05);line-height:1;user-select:none;flex-shrink:0}
.recog-year{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--oa-gold-300);margin-bottom:12px}
.recog-area{font-size:26px;font-weight:400;color:#fff;line-height:1.15;letter-spacing:-.01em;margin-bottom:10px}
.recog-tier{display:inline-flex;align-items:center;gap:8px;background:rgba(168,133,63,.2);border:1px solid rgba(168,133,63,.4);border-radius:4px;padding:5px 14px;margin-bottom:18px}
.recog-tier .dot{width:6px;height:6px;border-radius:50%;background:var(--oa-gold-400)}
.recog-tier span{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--oa-gold-300)}
.recog-body{font-size:15px;color:var(--oa-navy-200);line-height:1.65;max-width:560px}
.recog-content{animation:fadeSlide 400ms ease both}
@keyframes fadeSlide{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.recog-nav{display:flex;align-items:center;justify-content:space-between;margin-top:28px}
.recog-dots{display:flex;gap:8px;align-items:center}
.recog-dot{width:8px;height:8px;border-radius:4px;background:rgba(255,255,255,.25);border:none;cursor:pointer;transition:width 300ms,background 200ms;padding:0}
.recog-dot.active{width:24px;background:var(--oa-gold-500)}
.recog-arrows{display:flex;gap:12px}
.recog-arrow{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:#fff;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background 140ms}
.recog-arrow:hover{background:rgba(255,255,255,.18)}

/* Contact */
#contacto{background:var(--oa-paper)}
.contact-grid{display:grid;grid-template-columns:5fr 7fr;gap:80px;align-items:start}
#contacto h2{font-size:40px;font-weight:400;letter-spacing:-.01em;color:var(--oa-navy-700);line-height:1.12;margin-bottom:28px}
.contact-info-row+.contact-info-row{margin-top:20px}
.contact-info-label{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-4);margin-bottom:4px}
.contact-info-val{font-size:16px;color:var(--fg-2);line-height:1.5}
.contact-info-val a{border-bottom:none}
.contact-card{background:var(--oa-white);border:1px solid var(--border-2);border-radius:12px;padding:40px;box-shadow:var(--shadow-2)}
.contact-card h3{font-size:22px;font-weight:700;color:var(--oa-navy-700);margin-bottom:24px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.field{margin-bottom:16px}
.field label{font-size:12px;font-weight:700;color:var(--fg-1);display:block;margin-bottom:5px}
.field input,.field textarea{font-family:var(--font-sans);font-size:14px;color:var(--fg-1);background:var(--oa-white);border:1.5px solid var(--border-2);border-radius:6px;padding:10px 14px;outline:none;width:100%;transition:border-color 140ms,box-shadow 140ms}
.field textarea{resize:vertical;min-height:100px}
.field input:focus,.field textarea:focus{border-color:var(--oa-navy-700);box-shadow:0 0 0 3px rgba(28,52,78,.15)}
.form-submit{font-size:14px;font-weight:700;background:var(--oa-navy-700);color:#fff;border:none;border-radius:6px;height:44px;padding:0 28px;cursor:pointer;width:100%;letter-spacing:.01em;transition:background 140ms;font-family:var(--font-sans)}
.form-submit:hover{background:var(--oa-navy-800)}
.contact-sent{text-align:center;padding:40px 0}
.contact-sent .ic{width:60px;height:60px;border-radius:50%;background:var(--oa-gold-100);margin:0 auto 20px;display:flex;align-items:center;justify-content:center}
.contact-sent .ic i{width:24px;height:24px;border-radius:50%;background:var(--oa-gold-600);display:block}
.contact-sent h3{font-size:24px;font-weight:700;color:var(--oa-navy-700);margin-bottom:10px}
.contact-sent p{font-size:15px;color:var(--fg-3)}
.contact-sent button{margin-top:24px;font-size:13px;font-weight:700;background:var(--oa-navy-700);color:#fff;border:none;border-radius:6px;height:38px;padding:0 20px;cursor:pointer;font-family:var(--font-sans)}

/* Footer */
.footer{background:var(--oa-navy-900);position:relative;overflow:hidden;padding:64px 40px 32px}
.footer-slashes{position:absolute;top:0;right:0;bottom:0;width:40%;overflow:hidden;pointer-events:none}
.footer-slashes i{position:absolute;top:-20%;bottom:-20%;width:52px;transform:skewX(-18deg);display:block}
.footer-inner{max-width:var(--container);margin:0 auto;position:relative;z-index:1}
.footer-cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:60px;margin-bottom:56px}
.footer-brand-row{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.footer-brand-text{display:flex;flex-direction:column;align-items:stretch;gap:4px}
.footer-brand-word{font-size:14px;font-weight:400;color:#fff;letter-spacing:.16em;text-transform:uppercase;line-height:1}
.footer-brand-line{height:1px;width:100%;background:rgba(255,255,255,.32)}
.footer-brand-sub{font-size:6.5px;font-weight:400;letter-spacing:.30em;text-transform:uppercase;line-height:1;display:flex;gap:.30em}
.footer-brand-sub span:first-child{color:#fff}
.footer-brand-sub span:last-child{color:var(--oa-navy-300)}
.footer p{font-size:14px;color:var(--oa-navy-300);line-height:1.65;max-width:360px}
.footer-col-title{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--oa-gold-300);margin-bottom:16px}
.footer-col a{display:block;font-size:14px;color:var(--oa-navy-200);margin-bottom:10px;border-bottom:none}
.footer-col a:hover{color:#fff;border-bottom:none}
.footer-col .line{font-size:14px;color:var(--oa-navy-200);margin-bottom:8px;line-height:1.4}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding-top:24px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.footer-bottom div{font-size:12px;color:var(--oa-navy-400)}

/* Drawers */
.drawer-root{position:fixed;inset:0;z-index:500;display:flex;justify-content:flex-end;visibility:hidden}
.drawer-root.open{visibility:visible}
.drawer-bd{position:absolute;inset:0;background:rgba(14,28,44,.5);opacity:0;transition:opacity 220ms}
.drawer-root.open .drawer-bd{opacity:1}
.drawer-panel{position:relative;z-index:1;width:580px;max-width:92vw;height:100%;background:var(--oa-paper-soft);box-shadow:var(--shadow-4);overflow-y:auto;display:flex;flex-direction:column;transform:translateX(100%);transition:transform 280ms cubic-bezier(.16,1,.3,1)}
.drawer-root.open .drawer-panel{transform:translateX(0)}
.drawer-head{background:var(--oa-navy-700);padding:40px 44px 36px;position:relative;flex-shrink:0;overflow:hidden}
.drawer-head.deep{background:var(--oa-navy-900)}
.drawer-head-slashes{position:absolute;top:0;right:0;bottom:0;width:45%;overflow:hidden;pointer-events:none}
.drawer-head-slashes i{position:absolute;top:-20%;bottom:-20%;width:52px;transform:skewX(-18deg);display:block}
.drawer-close{position:absolute;top:20px;right:20px;z-index:2;background:rgba(255,255,255,.12);border:none;width:36px;height:36px;border-radius:50%;cursor:pointer;color:#fff;font-size:16px;display:flex;align-items:center;justify-content:center;transition:background 140ms}
.drawer-close:hover{background:rgba(255,255,255,.24)}
.drawer-head-inner{position:relative;z-index:1}
.drawer-tag{font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--oa-gold-300);margin-bottom:14px}
.drawer-head .rule{width:48px;margin:0 0 20px}
.drawer-title{font-size:32px;font-weight:700;color:#fff;line-height:1.15;letter-spacing:-.01em}
.drawer-desc{font-size:16px;color:var(--oa-navy-200);margin-top:12px;line-height:1.6;max-width:400px}
.drawer-body{padding:40px 44px;display:flex;flex-direction:column;gap:36px;flex:1}
.drawer-body h4{font-size:18px;font-weight:700;color:var(--oa-navy-700);margin-bottom:14px;letter-spacing:-.01em}
.drawer-body p{font-size:15px;line-height:1.75;color:var(--fg-2)}
.d-sublabel{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--oa-gold-600);margin-bottom:16px}
.d-sublabel.mute{color:var(--fg-3)}
.subtemas{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px}
.subtema{display:flex;align-items:baseline;gap:10px}
.subtema i{width:20px;height:1.5px;background:var(--oa-gold-600);flex-shrink:0;margin-top:8px;display:block}
.subtema span{font-size:14px;color:var(--fg-2);line-height:1.5}
.approach{background:var(--oa-navy-700);border-radius:10px;padding:24px 28px}
.approach .lbl{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--oa-gold-300);margin-bottom:10px}
.approach p{font-size:15px;line-height:1.7;color:var(--oa-navy-100);font-style:italic}
.casos{display:flex;flex-direction:column;gap:10px}
.caso{background:var(--oa-white);border:1px solid var(--border-2);border-radius:8px;padding:14px 18px;display:flex;align-items:center;gap:14px}
.caso .ic{width:28px;height:28px;border-radius:50%;background:var(--oa-gold-100);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.caso .ic i{width:8px;height:8px;border-radius:50%;background:var(--oa-gold-600);display:block}
.caso span{font-size:14px;color:var(--fg-2);line-height:1.4}
.drawer-cta{font-size:14px;font-weight:700;background:var(--oa-navy-700);color:#fff;border:none;border-radius:6px;height:44px;padding:0 28px;cursor:pointer;letter-spacing:.01em;transition:background 140ms;width:100%;font-family:var(--font-sans)}
.drawer-cta:hover{background:var(--oa-navy-800)}
/* Bio drawer specifics */
.bio-photo{width:96px;height:96px;border-radius:50%;object-fit:cover;object-position:top center;display:block;margin-bottom:20px}
.bio-role{color:rgba(255,255,255,.6);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin-bottom:8px}
.bio-name{color:#fff;font-size:28px;font-weight:700;line-height:1.1}
.bio-list{display:flex;flex-direction:column;gap:8px}
.bio-area{display:flex;align-items:center;gap:10px}
.bio-area i{width:20px;height:1.5px;background:var(--oa-gold-600);flex-shrink:0;display:block}
.bio-area span{font-size:15px;color:var(--fg-2)}
.bio-line{font-size:14px;color:var(--fg-3);line-height:1.5}
.bio-recog{display:flex;align-items:center;gap:10px}
.bio-recog i{width:6px;height:6px;border-radius:50%;background:var(--oa-gold-600);flex-shrink:0;display:block}
.bio-recog span{font-size:14px;color:var(--fg-2)}

/* Mobile menu panel */
.mnav{display:none}

@media(max-width:1024px){
  .areas-grid{grid-template-columns:repeat(2,1fr)}
  .about-intro,.contact-grid{grid-template-columns:1fr;gap:40px}
  .footer-cols{grid-template-columns:1fr 1fr;gap:40px}
}
@media(max-width:768px){
  .wrap,.hero-content,.footer{padding-left:24px;padding-right:24px}
  .hdr-inner{padding:0 24px}
  .nav{display:none}
  .hdr-toggle{display:flex}
  .hero{min-height:560px}
  .hero-mark{display:none}
  .section{padding:64px 0}
  .section-head{margin-bottom:40px}
  .section-head h2{font-size:34px}
  .areas-grid{grid-template-columns:1fr}
  .about-intro h2{font-size:32px}
  #reconocimientos h2,#contacto h2{font-size:30px}
  .recog-card{grid-template-columns:1fr;gap:0;padding:24px}
  .recog-bigyear{display:none}
  .form-row{grid-template-columns:1fr}
  .footer-cols{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:8px}
  /* mobile nav overlay */
  .mnav{display:block;position:fixed;top:72px;left:0;right:0;bottom:0;background:var(--oa-navy-900);z-index:99;transform:translateX(100%);transition:transform 280ms var(--ease-standard);overflow-y:auto;padding:24px}
  .mnav.open{transform:translateX(0)}
  .mnav a{display:block;font-size:18px;color:#fff;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.08)}
  .mnav a:hover{border-bottom:1px solid rgba(255,255,255,.08)}
  .mnav .btn-cta{margin-top:24px;width:100%;height:48px;font-size:14px}
  .hdr-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .hdr-toggle.open span:nth-child(2){opacity:0}
  .hdr-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .subtemas{grid-template-columns:1fr}
  .drawer-panel{width:100%}
}
