/* ============ TOKENS ============ */
:root{
  --ink: #14161a;
  --ink-soft: #363a3f;
  --paper: #f7f7f4;
  --paper-deep: #ececE7;
  --paper-deeper:#e3e3dd;
  --stone: #6b6f6c;
  --stone-light:#93968f;
  --line: #d7d8d1;
  --line-strong:#b9bbb3;
  --accent: #3c4a3f;
  --accent-soft:#e7ebe6;
  --on-accent: #f4f6f2;
  --danger:#8a3b2c;
  --radius:2px;
  --maxw: 1180px;
  --gutter: clamp(20px, 5vw, 64px);
  --font-display:'Newsreader', 'Iowan Old Style', 'Palatino Linotype', serif;
  --font-body:'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --font-wide:'Archivo Expanded','Archivo', sans-serif;
  color-scheme: light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:#f2f1ec;
    --ink-soft:#cfcec6;
    --paper:#141513;
    --paper-deep:#1b1c19;
    --paper-deeper:#232420;
    --stone:#a7a89f;
    --stone-light:#7c7d75;
    --line:#33352f;
    --line-strong:#454741;
    --accent:#8fae9b;
    --accent-soft:#22281f;
    --on-accent:#101210;
  }
}
:root[data-theme="dark"]{
  --ink:#f2f1ec;
  --ink-soft:#cfcec6;
  --paper:#141513;
  --paper-deep:#1b1c19;
  --paper-deeper:#232420;
  --stone:#a7a89f;
  --stone-light:#7c7d75;
  --line:#33352f;
  --line-strong:#454741;
  --accent:#8fae9b;
  --accent-soft:#22281f;
  --on-accent:#101210;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth; scroll-padding-top:88px;}
@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;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  padding-inline: var(--gutter);
}
img{max-width:100%;display:block;}
a{color:inherit;}
h1,h2,h3,h4{font-family:var(--font-display); font-weight:400; margin:0; text-wrap:balance;}
p{margin:0;}
::selection{background:var(--accent); color:var(--on-accent);}
:focus-visible{outline:2px solid var(--accent); outline-offset:3px;}

.wrap{max-width:var(--maxw); margin-inline:auto;}
.eyebrow{
  font-family:var(--font-wide);
  font-size:11.5px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--stone);
  display:flex; align-items:center; gap:10px;
}
.eyebrow::before{content:""; width:22px; height:1px; background:var(--accent); flex-shrink:0;}
@media (prefers-reduced-motion: no-preference){
  .section .eyebrow::before{width:0; transition:width .6s cubic-bezier(.2,.7,.2,1);}
  .section .eyebrow.sweep::before{width:22px;}
}
.cap-num{font-variant-numeric:tabular-nums; color:var(--accent); font-family:var(--font-wide); font-weight:600;}

.rule{border:none; border-top:1px solid var(--line); margin:0;}
.section{padding-block: clamp(64px, 10vw, 132px);}
.section-tight{padding-block: clamp(40px,6vw,72px);}
.bg-deep{background:var(--paper-deep);}
.bg-ink{background:var(--ink); color:var(--paper);}
.bg-ink .eyebrow{color:var(--stone-light);}
.bg-ink .eyebrow::before{background:var(--accent);}

/* ============ REVEAL ============ */
.reveal{opacity:1; transform:none;}

/* ============ HEADER ============ */
header{
  position:sticky; top:0; z-index:50;
  margin-inline: calc(var(--gutter) * -1);
  padding-inline: var(--gutter);
  background:rgba(247,247,244,.86);
  backdrop-filter:blur(10px);
  border-bottom:1px solid transparent;
  transition:border-color .3s ease, background .3s ease;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) header{background:rgba(20,21,19,.86);}}
:root[data-theme="dark"] header{background:rgba(20,21,19,.86);}
header.scrolled{border-bottom-color:var(--line);}
.nav{display:flex; align-items:center; justify-content:space-between; height:76px;}
.logo{
  font-family:var(--font-wide); font-weight:700; font-size:19px; letter-spacing:.06em;
  display:flex; align-items:baseline; gap:8px; text-decoration:none;
}
.logo small{font-family:var(--font-body); font-weight:500; font-size:10.5px; letter-spacing:.12em; color:var(--stone); text-transform:uppercase;}
.nav-links{display:flex; align-items:center; gap:34px; list-style:none; margin:0; padding:0;}
.nav-links a{
  font-size:13.5px; text-decoration:none; color:var(--ink-soft);
  position:relative; padding-block:4px;
}
.nav-links a::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:1px; background:var(--accent);
  transition:right .28s ease;
}
.nav-links a:hover::after{right:0;}
.nav-links a[aria-current="page"]{color:var(--ink);}
.nav-links a[aria-current="page"]::after{right:0;}
.btn{
  font-family:var(--font-body); font-weight:600; font-size:13px; letter-spacing:.02em;
  padding:11px 22px; border-radius:var(--radius); text-decoration:none; display:inline-flex; align-items:center; gap:8px;
  border:1px solid var(--ink); cursor:pointer; transition:background .25s ease, color .25s ease, border-color .25s ease, transform .2s ease;
  background:transparent; color:var(--ink);
}
.btn-primary{background:var(--ink); color:var(--paper); border-color:var(--ink);}
.btn-primary:hover{background:var(--accent); border-color:var(--accent); transform:translateY(-1px);}
.btn-ghost:hover{background:var(--ink); color:var(--paper);}
.bg-ink .btn{border-color:var(--paper); color:var(--paper);}
.bg-ink .btn:hover{background:var(--paper); color:var(--ink);}
.btn-sm{padding:9px 16px; font-size:12.5px;}
.nav-cta{display:flex; align-items:center; gap:18px;}
.burger{display:none; background:none; border:none; cursor:pointer; padding:8px; color:var(--ink);}

.mobile-nav{
  position:fixed; inset:0; background:var(--paper); z-index:100;
  display:flex; flex-direction:column; padding: 24px var(--gutter);
  transform:translateY(-100%); transition:transform .38s cubic-bezier(.2,.7,.2,1);
}
.mobile-nav.open{transform:translateY(0);}
.mobile-nav .nav{height:76px;}
.mobile-nav ul{list-style:none; padding:0; margin:24px 0; display:flex; flex-direction:column; gap:0;}
.mobile-nav a{text-decoration:none; color:var(--ink); font-family:var(--font-display); font-size:30px; padding:16px 0; border-bottom:1px solid var(--line);}
.mobile-nav .btn{align-self:flex-start; margin-top:12px;}
.close-x{font-size:26px; line-height:1; background:none;border:none;cursor:pointer;color:var(--ink);}

/* ============ HERO ============ */
.hero{padding-block: clamp(56px,9vw,104px) clamp(48px,8vw,96px);}
.hero-grid{display:grid; grid-template-columns: 1.15fr .85fr; gap:56px; align-items:end;}
.hero-photo-frame{width:100%; aspect-ratio:4/3; overflow:hidden; border:1px solid var(--line-strong);}
.hero-photo-frame img{width:100%; height:100%; object-fit:cover; display:block;}
.hero h1{
  font-size:clamp(40px, 6vw, 76px); font-weight:300; line-height:1.03; letter-spacing:-.01em;
}
.hero h1 em{font-style:italic; color:var(--accent);}
.hero-lede{max-width:44ch; font-size:17px; color:var(--ink-soft); margin-top:22px;}
.hero-side{display:flex; flex-direction:column; gap:16px;}
.hero-side p{font-size:13px; color:var(--stone-light); max-width:38ch;}
.hero-cta{display:flex; gap:14px; margin-top:32px; flex-wrap:wrap;}
.hero-mark{
  margin-top:56px; padding-top:28px; border-top:1px solid var(--line);
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px;
}
.hero-mark div{font-size:12px; color:var(--stone);}
.hero-mark strong{display:block; font-family:var(--font-display); font-size:15px; color:var(--ink); font-weight:500; margin-bottom:2px;}

/* Architectural line motif (decorative, no stock photos) */
.blueprint{
  width:100%; aspect-ratio: 4/3; position:relative; overflow:hidden;
  background:
    linear-gradient(var(--line) 1px, transparent 1px) 0 0/ 28px 28px,
    linear-gradient(90deg, var(--line) 1px, transparent 1px) 0 0/ 28px 28px,
    var(--paper-deep);
  border:1px solid var(--line-strong);
}
.blueprint svg{position:absolute; inset:0; width:100%; height:100%;}

/* ============ PAGE HEADER (inner pages) ============ */
.page-hero{padding-block: clamp(40px,7vw,72px) clamp(24px,4vw,40px);}
.page-hero h1{font-size:clamp(34px,5vw,58px); font-weight:300; line-height:1.05;}
.page-hero p{max-width:56ch; font-size:16px; color:var(--ink-soft); margin-top:18px;}
.breadcrumb{font-size:12.5px; color:var(--stone-light); margin-bottom:14px;}
.breadcrumb a{text-decoration:none;}
.breadcrumb a:hover{color:var(--accent);}

/* ============ MANIFESTO ============ */
.manifesto-grid{display:grid; grid-template-columns:.7fr 1.3fr; gap:64px;}
.manifesto-grid h2{font-size:clamp(28px,3.4vw,42px); font-weight:400; line-height:1.18; font-style:italic;}
.manifesto-body{max-width:60ch; display:flex; flex-direction:column; gap:18px; color:var(--ink-soft); font-size:16px;}
.manifesto-body p:first-child{font-size:18px; color:var(--ink);}

/* ============ VALUE LIST (editorial, not cards) ============ */
.value-list{margin-top:44px; border-top:1px solid var(--line);}
.value-row{
  display:grid; grid-template-columns: 90px 1fr 1.6fr; gap:32px; padding:26px 0;
  border-bottom:1px solid var(--line); align-items:baseline;
}
.value-row .num{font-family:var(--font-display); font-style:italic; font-size:20px; color:var(--accent);}
.value-row h3{font-size:19px; font-weight:500; font-family:var(--font-body);}
.value-row p{color:var(--stone); font-size:14.5px; max-width:52ch;}

/* ============ DISCIPLINES ============ */
.disc-head{max-width:62ch;}
.disc-head h2{font-size:clamp(28px,3.6vw,44px);}
.disciplines{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); margin-top:48px; border:1px solid var(--line);}
.disc-card{background:var(--paper); padding:38px 30px; display:flex; flex-direction:column; gap:16px; min-height:280px;}
.disc-photo{aspect-ratio:3/2; overflow:hidden; margin:-38px -30px 2px -30px;}
.disc-photo img{width:100%; height:100%; object-fit:cover; display:block; filter:grayscale(.15);}
.disc-card .tag{font-family:var(--font-wide); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent);}
.disc-card h3{font-family:var(--font-display); font-size:24px; font-weight:400;}
.disc-card p{color:var(--stone); font-size:14.5px;}
.disc-foot{margin-top:36px; font-size:16px; font-style:italic; font-family:var(--font-display); color:var(--ink-soft); max-width:58ch;}

/* ============ PILLARS (Servicios) ============ */
.pillar-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:44px;}
.pillar{background:var(--paper); padding:36px 32px; display:flex; flex-direction:column; gap:14px;}
.pillar .tag{font-family:var(--font-wide); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent);}
.pillar h3{font-family:var(--font-display); font-size:23px; font-weight:400;}
.pillar > p{color:var(--stone); font-size:14.5px;}
.pillar ul{list-style:none; margin:6px 0 0; padding:0; display:flex; flex-direction:column; gap:9px;}
.pillar li{font-size:13.5px; color:var(--ink-soft); display:flex; gap:9px;}
.pillar li::before{content:"—"; color:var(--accent); flex-shrink:0;}

/* ============ PAGE CTA (cierre de página) ============ */
.page-cta{
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
  padding-top:40px; border-top:1px solid var(--line); margin-top:8px;
}
.page-cta p{font-family:var(--font-display); font-size:19px; font-style:italic; color:var(--ink-soft); max-width:46ch;}

/* ============ SERVICES ============ */
.services{margin-top:40px;}
.svc-row{
  border-top:1px solid var(--line); padding: 28px 0; display:grid; grid-template-columns: 60px 1fr 1.3fr; gap:28px;
  cursor:default;
}
.services > .svc-row:last-child{border-bottom:1px solid var(--line);}
.svc-row .idx{font-family:var(--font-display); font-style:italic; color:var(--stone-light); font-size:15px;}
.svc-row h3{font-size:19px; font-weight:500; font-family:var(--font-body);}
.svc-row p{color:var(--stone); font-size:14.5px; max-width:54ch;}

/* ============ MÉTODO ============ */
.method-list{margin-top:48px; display:flex; flex-direction:column;}
.m-step{display:grid; grid-template-columns:110px 1fr; gap:28px; padding:30px 0; border-top:1px solid rgba(255,255,255,.14);}
.m-step:last-child{border-bottom:1px solid rgba(255,255,255,.14);}
.m-step .num{font-family:var(--font-display); font-size:34px; font-style:italic; color:var(--accent);}
.m-step h3{font-size:21px; font-weight:500; font-family:var(--font-body); color:var(--paper); margin-bottom:8px;}
.m-step p{color:#c8cac4; font-size:14.5px; max-width:60ch;}

/* ============ LAW SECTION ============ */
.law{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;}
.law h2{font-size:clamp(28px,3.6vw,44px); max-width:14ch;}
.law-body p{color:var(--ink-soft); font-size:16px; margin-top:20px; max-width:52ch;}
.law-list{margin-top:26px; display:flex; flex-direction:column; gap:10px;}
.law-list li{list-style:none; font-size:14px; color:var(--stone); display:flex; gap:10px;}
.law-list li::before{content:"—"; color:var(--accent); flex-shrink:0;}
.law-plate{
  border:1px solid var(--line-strong); background:var(--paper-deep); padding:36px; aspect-ratio:1/1.05;
  display:flex; flex-direction:column; justify-content:space-between;
}
.law-plate .art{font-family:var(--font-display); font-style:italic; font-size:54px; color:var(--accent); line-height:1;}
.law-plate .cite{font-family:var(--font-wide); font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--stone);}

/* legal alliance */
.legal-note{margin-top:64px; padding-top:40px; border-top:1px solid var(--line); display:grid; grid-template-columns:.6fr 1.4fr; gap:32px; align-items:start;}
.legal-note p{color:var(--stone); font-size:15px; max-width:58ch;}

/* ============ DIFFERENTIATORS TABLE ============ */
.diff-table{margin-top:44px; border:1px solid var(--line);}
.diff-row{display:grid; grid-template-columns:1fr 1fr; }
.diff-row + .diff-row{border-top:1px solid var(--line);}
.diff-cell{padding:22px 26px; font-size:14.5px;}
.diff-cell.old{color:var(--stone-light); text-decoration:line-through; text-decoration-color:var(--line-strong); text-decoration-thickness:1px;}
.diff-cell.new{color:var(--ink); font-weight:500; border-left:1px solid var(--line); background:var(--accent-soft);}
.diff-head-row{display:grid; grid-template-columns:1fr 1fr; border-bottom:1px solid var(--line);}
.diff-head-row div{padding:16px 26px; font-family:var(--font-wide); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--stone);}
.diff-head-row div:last-child{border-left:1px solid var(--line);}

/* ============ TEAM ============ */
.team-intro{max-width:66ch;}
.team-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin-top:48px;}
.team-card{border:1px solid var(--line);}
.person-mark{
  aspect-ratio:4/5; overflow:hidden; border-bottom:1px solid var(--line);
  background:var(--accent-soft); display:flex; align-items:center; justify-content:center;
}
.person-mark span{font-family:var(--font-display); font-style:italic; font-size:96px; color:var(--accent); line-height:1;}
.team-info{padding:22px 24px;}
.team-info .tag{font-family:var(--font-wide); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--accent);}
.team-info h3{font-family:var(--font-display); font-size:20px; font-weight:400; margin-top:6px;}
.team-info p{font-size:13.5px; color:var(--stone); margin-top:8px;}

/* ============ CONTACTO ============ */
.contact-grid{display:grid; grid-template-columns:.85fr 1.15fr; gap:64px;}
.contact-info h2{font-size:clamp(30px,3.8vw,46px);}
.contact-info p{color:var(--stone-light); margin-top:18px; max-width:40ch;}
.contact-block{margin-top:36px; padding-top:24px; border-top:1px solid rgba(255,255,255,.16);}
.contact-block .label{font-family:var(--font-wide); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--stone-light);}
.contact-block .val{font-family:var(--font-display); font-size:19px; margin-top:6px;}
.wa-btn{margin-top:28px;}
.wa-note{font-size:11.5px; color:var(--stone-light); margin-top:8px;}

form{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
.field{display:flex; flex-direction:column; gap:8px;}
.field.full{grid-column:1/-1;}
label{font-size:12px; letter-spacing:.03em; color:var(--stone-light); font-family:var(--font-wide); text-transform:uppercase;}
input, textarea, select{
  background:transparent; border:none; border-bottom:1px solid var(--line-strong); color:var(--paper);
  font-family:var(--font-body); font-size:15px; padding:10px 2px; outline:none; transition:border-color .2s ease;
}
.bg-ink input, .bg-ink textarea, .bg-ink select{color:var(--paper);}
select option{color:#111;}
input::placeholder, textarea::placeholder{color:var(--stone-light); opacity:.7;}
input:focus, textarea:focus, select:focus{border-color:var(--accent);}
textarea{resize:vertical; min-height:90px;}
.form-foot{grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:8px; flex-wrap:wrap;}
.form-note{font-size:12px; color:var(--stone-light); max-width:38ch;}
.form-msg{grid-column:1/-1; font-size:13.5px; padding:14px 16px; border:1px solid var(--accent); background:var(--accent-soft); color:var(--ink); display:none;}
.form-msg.show{display:block;}
.bg-ink .form-msg{background:rgba(143,174,155,.12); color:var(--paper); border-color:var(--accent);}

/* ============ FOOTER ============ */
footer{padding-block:56px 40px;}
.foot-top{display:grid; grid-template-columns:1.2fr .8fr .8fr .8fr; gap:40px; padding-bottom:44px; border-bottom:1px solid var(--line);}
.foot-brand .logo{margin-bottom:14px;}
.foot-brand p{color:var(--stone); font-size:13.5px; max-width:30ch;}
.foot-col h4{font-family:var(--font-wide); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--stone); font-weight:600; margin-bottom:14px;}
.foot-col ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px;}
.foot-col a{text-decoration:none; color:var(--ink-soft); font-size:13.5px;}
.foot-col a:hover{color:var(--accent);}
.foot-bottom{display:flex; justify-content:space-between; align-items:center; padding-top:26px; font-size:12px; color:var(--stone-light); flex-wrap:wrap; gap:10px;}

/* ============ RESPONSIVE ============ */
@media (max-width: 980px){
  .nav-links, .nav-cta .btn-ghost{display:none;}
  .burger{display:block;}
  .hero-grid{grid-template-columns:1fr;}
  .hero-side{margin-top:8px;}
  .hero-mark{grid-template-columns:repeat(2,1fr);}
  .manifesto-grid{grid-template-columns:1fr; gap:28px;}
  .disciplines{grid-template-columns:1fr;}
  .svc-row{grid-template-columns:40px 1fr; }
  .svc-row p{grid-column:2/3;}
  .law{grid-template-columns:1fr;}
  .law-plate{max-width:280px;}
  .legal-note{grid-template-columns:1fr;}
  .diff-row, .diff-head-row{grid-template-columns:1fr;}
  .diff-cell.new, .diff-head-row div:last-child{border-left:none; border-top:1px solid var(--line);}
  .pillar-grid{grid-template-columns:1fr;}
  .team-grid{grid-template-columns:1fr; max-width:420px;}
  .contact-grid{grid-template-columns:1fr; gap:44px;}
  form{grid-template-columns:1fr;}
  .foot-top{grid-template-columns:1fr 1fr; row-gap:32px;}
}
@media (max-width: 560px){
  body{font-size:15.5px;}
  .value-row{grid-template-columns:1fr; gap:8px;}
  .value-row .num{display:none;}
  .m-step{grid-template-columns:1fr; gap:6px;}
  .foot-top{grid-template-columns:1fr;}
  .hero-mark{grid-template-columns:1fr 1fr;}
}