@font-face{font-family:"Against";src:url("against.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
/* Layout: banda de petróleo con la tesis y la foto, luego pliegos claros alineados a la izquierda, con mucho aire, como una ficha clínica editorial */
:root{
  --marfil:#F2F0EB; --arena:#DEDACF; --petroleo:#536771; --grafito:#444444; --cafe:#9C846E; --piedra:#A9A393;
  --bg:var(--marfil); --bg-alt:var(--arena); --ink:#444444; --ink-soft:#4C5F69; --band:#FFFFFF; --on-band:#444444; --cta:#536771; --on-cta:#FFFFFF; --line:rgba(68,68,68,.22); --accent:#9C846E; --card:#FFFFFF;
  --pend-bg:#FFF4D6; --pend-ink:#6B4E00;
  --display:"Against",Didot,"Times New Roman",serif;
  --sans:"Roboto",system-ui,-apple-system,"Segoe UI",sans-serif;
  --max:1120px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#1C2428; --bg-alt:#263136; --ink:#DEDACF; --ink-soft:#A9B8BE; --band:#2C3A41; --on-band:#F2F0EB; --cta:#DEDACF; --on-cta:#1C2428; --line:rgba(222,218,207,.2); --accent:#C3AD95; --card:#222D32; --pend-bg:#3A3220; --pend-ink:#F1D79A; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#1C2428; --bg-alt:#263136; --ink:#DEDACF; --ink-soft:#A9B8BE; --band:#2C3A41; --on-band:#F2F0EB; --cta:#DEDACF; --on-cta:#1C2428; --line:rgba(222,218,207,.2); --accent:#C3AD95; --card:#222D32; --pend-bg:#3A3220; --pend-ink:#F1D79A; color-scheme:dark}
.only-dark{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .only-light{display:none}:root:not([data-theme="light"]) .only-dark{display:block}}
:root[data-theme="dark"] .only-light{display:none}
:root[data-theme="dark"] .only-dark{display:block}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{background:var(--bg);color:var(--ink);font:300 17px/1.8 var(--sans);-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--bg)}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.wrap{max-width:var(--max);margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
section{padding-block:clamp(64px,10vw,120px)}
.eyebrow{font:300 12px/1.4 var(--sans);letter-spacing:.42em;text-transform:uppercase;margin:0 0 18px}
.title{font-family:var(--display);font-weight:400;text-transform:uppercase;line-height:.96;letter-spacing:.01em;margin:0;text-wrap:balance}
.t-xl{font-size:clamp(64px,13vw,168px)}
.t-l{font-size:clamp(38px,5.4vw,76px)}
.label{font:500 13px/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;margin:16px 0 0}
.bar{width:56px;height:2px;background:currentColor;margin:22px 0 26px;opacity:.85}
.lead{max-width:60ch;margin:0}
strong{font-weight:700}
.pend{background:var(--pend-bg);color:var(--pend-ink);font:500 12px/1.3 var(--sans);letter-spacing:.04em;padding:3px 8px;border-radius:4px;white-space:nowrap;display:inline-block}

/* header */
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--bg);border-bottom:1px solid var(--line)}
.hd{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:12px}
.hd img{height:44px;width:auto}
nav{display:flex;gap:28px;align-items:center}
nav a{font:400 13px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;text-decoration:none}
nav a:hover{color:var(--accent)}
.btn{display:inline-flex;align-items:center;gap:12px;font:500 13px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;padding:16px 26px;border-radius:999px;border:1px solid currentColor;transition:background .2s,color .2s}
.btn .arr{display:inline-grid;place-items:center;width:26px;height:26px;border:1px solid currentColor;border-radius:50%;font-size:13px;letter-spacing:0}
.btn-solid{background:var(--cta);color:var(--on-cta);border-color:var(--cta)}
.btn-solid:hover{background:var(--accent);border-color:var(--accent)}
@media (max-width:860px){nav .nl{display:none}.hd img{height:36px}}

/* hero */
.hero{background:var(--band);color:var(--on-band);padding:0;position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,5vw,72px);align-items:end}
.hero-copy{padding-block:clamp(56px,9vw,112px);min-width:0}
.hero h1{font:400 clamp(17px,1.6vw,19px)/1.7 var(--sans);max-width:46ch;margin:0}
.hero .btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px}

.hero-photo{align-self:stretch;position:relative;min-height:420px}
.hero-photo img{position:absolute;inset:24px 0 0 0;border-radius:24px 24px 0 0;height:calc(100% - 24px)!important;width:100%;height:100%;object-fit:cover;object-position:50% 20%}

.curve-path{stroke:var(--cta)}
.curve{position:absolute;left:0;right:0;bottom:-2px;width:100%;height:90px;pointer-events:none}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr}.hero-photo{min-height:0;aspect-ratio:4/5;max-width:100%;order:-1;border-radius:0 0 20px 20px;overflow:hidden}.hero-copy{padding-top:36px}}

/* credenciales */
.creds{padding-block:0;border-bottom:1px solid var(--line)}
.creds ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr)}
.creds li{padding:28px 20px 28px 0;border-right:1px solid var(--line);min-width:0}
.creds li:last-child{border-right:0}
.creds li+li{padding-left:24px}
.creds b{display:block;font:400 clamp(26px,3vw,36px)/1.1 var(--display);margin-bottom:6px}
.creds span{font-size:14px;line-height:1.5;display:block}
@media (max-width:760px){.creds ul{grid-template-columns:1fr 1fr}.creds li{border-right:0;padding-left:0!important;border-bottom:1px solid var(--line)}.creds li:nth-child(odd){padding-right:16px}}

/* qué es */
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,88px);align-items:start}
.two>*{min-width:0}
@media (max-width:860px){.two{grid-template-columns:1fr}}
.depth{background:#FBFAF7;border:1px solid var(--line);border-radius:16px;padding:28px 24px 20px}
.depth svg{width:100%;height:auto;display:block}
.depth figcaption{font-size:13px;line-height:1.6;margin-top:14px;color:var(--ink-soft)}

/* servicios */
.alt{background:var(--bg-alt)}
.svc-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:48px}
.svc-head p{max-width:46ch;margin:0}
.list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.list li{display:grid;grid-template-columns:1fr auto;gap:8px 24px;padding:22px 0;border-bottom:1px solid var(--line);align-items:baseline}
.list li>div{min-width:0}
.list .n{font-weight:700}
.list .d{font-style:italic;font-weight:300}
.list .p{font:400 22px/1 var(--display);white-space:nowrap}
.list .note{grid-column:1/-1;font-size:14px;color:var(--ink-soft);margin:0}
.svc-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,80px)}
.svc-cols>*{min-width:0}
@media (max-width:860px){.svc-cols{grid-template-columns:1fr}}
.svc-cols h3{font:500 13px/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;margin:0 0 14px}

/* proceso */
.steps{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.steps li{min-width:0;padding-top:20px;border-top:1px solid var(--line)}
.pill{display:inline-block;font:500 12px/1 var(--sans);letter-spacing:.1em;border:1px solid currentColor;border-radius:999px;padding:7px 12px;margin-bottom:18px}
.steps h3{font:400 30px/1.1 var(--display);text-transform:uppercase;margin:0 0 10px}
.steps p{margin:0;font-size:16px}
@media (max-width:760px){.steps{grid-template-columns:1fr}}

/* sobre mi */
.about{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(32px,6vw,88px);align-items:center}
.about>*{min-width:0}
.about img{width:100%;max-width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 15%;border-radius:20px;display:block}
.cv{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:14px}
.cv li{padding-left:22px;position:relative;font-size:16px;line-height:1.65}
.cv li::before{content:"";position:absolute;left:0;top:.8em;width:10px;height:1px;background:currentColor}
@media (max-width:860px){.about{grid-template-columns:1fr}.about img{max-width:420px}}

/* sedes */
.sedes{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:20px;margin-top:48px}
.sede{min-width:0;border:1px solid var(--line);border-radius:20px;padding:32px 28px;display:flex;flex-direction:column;gap:14px;background:var(--card)}
.sede.main{background:var(--band);color:var(--on-band);border-color:var(--cta);border-width:1.5px}
.sede h3{font:400 clamp(30px,2.7vw,40px)/1 var(--display);text-transform:uppercase;margin:0}
.sede dl{margin:0;display:grid;gap:10px}
.sede dt{font:500 11px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;opacity:.8}
.sede dd{margin:4px 0 0;font-size:15px;line-height:1.5}
.sede .btn{margin-top:auto;align-self:flex-start}

.soon{font:500 11px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}
@media (max-width:900px){.sedes{grid-template-columns:1fr}}

/* faq */
.faq{max-width:820px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:24px 40px 24px 0;font:400 clamp(20px,2.2vw,24px)/1.35 var(--display);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:22px;font:300 26px/1 var(--sans)}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:0 0 24px;max-width:64ch}

/* footer */
footer{background:var(--bg-alt);color:var(--ink);padding-block:56px calc(56px + env(safe-area-inset-bottom,0px))}
.ft{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:end}
.ft>*{min-width:0}
.ft img{height:56px;width:auto}
.ft p{margin:0;font-size:14px;line-height:1.7}
.ft a{text-decoration:none;border-bottom:1px solid currentColor}
@media (max-width:700px){.ft{grid-template-columns:1fr}}

/* barra móvil */
.mbar{display:none}
@media (max-width:700px){
  .mbar{display:flex;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--bg);border-top:1px solid var(--line);padding:10px max(12px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px))}
  .mbar .btn{flex:1;justify-content:center;padding:14px 10px;font-size:12px}
  footer{padding-bottom:calc(120px + env(safe-area-inset-bottom,0px))}
}
