:root{
  --text-xs:clamp(.75rem,.7rem + .25vw,.875rem);
  --text-sm:clamp(.875rem,.8rem + .35vw,1rem);
  --text-base:clamp(1rem,.95rem + .25vw,1.125rem);
  --text-lg:clamp(1.125rem,1rem + .75vw,1.5rem);
  --text-xl:clamp(1.5rem,1.2rem + 1.25vw,2.25rem);
  --text-2xl:clamp(2rem,1.2rem + 2.5vw,3.5rem);
  --text-3xl:clamp(2.5rem,1rem + 4vw,5rem);
  --space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--space-32:8rem;
  --color-bg:#F3EFE7;--color-surface:#F8F5EF;--color-surface-offset:#EAE4D9;
  --color-divider:#D9D1C3;--color-border:#CFC6B6;
  --color-text:#15212C;--color-text-muted:#5C6168;--color-text-faint:#9A9A96;--color-text-inverse:#F3EFE7;
  --color-ink:#15212C;--color-ink-2:#1E2D3A;
  --color-primary:#8E4B26;--color-primary-hover:#6F3A1D;--color-primary-soft:#E8D6C8;
  --radius-sm:.25rem;--radius-md:.375rem;
  --transition:180ms cubic-bezier(.16,1,.3,1);
  --font-display:'Gambetta','Iowan Old Style',Georgia,serif;
  --font-body:'Switzer','Helvetica Neue',Arial,sans-serif;
  --wide:1200px;--gutter:clamp(1.25rem,4vw,3rem);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:none;text-size-adjust:none;-webkit-font-smoothing:antialiased;scroll-behavior:smooth;scroll-padding-top:5rem}
body{min-height:100dvh;line-height:1.6;font-family:var(--font-body);font-size:var(--text-base);color:var(--color-text);background:var(--color-bg)}
img{display:block;max-width:100%;height:auto}
h1,h2,h3{text-wrap:balance;line-height:1.12;font-weight:500}
p,li{text-wrap:pretty;max-width:68ch}
a{color:inherit;transition:color var(--transition),background var(--transition),border-color var(--transition)}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px;border-radius:var(--radius-sm)}
::selection{background:var(--color-primary-soft)}
@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;scroll-behavior:auto!important}}
.wrap{max-width:var(--wide);margin-inline:auto;padding-inline:var(--gutter)}
.eyebrow{font-size:var(--text-xs);letter-spacing:.14em;text-transform:uppercase;color:var(--color-primary);font-weight:500}

/* header */
.header{position:sticky;top:0;z-index:20;background:color-mix(in oklab,var(--color-bg) 88%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color var(--transition)}
.header.scrolled{border-color:var(--color-divider)}
.header .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);height:4.25rem}
.brand{display:flex;flex-direction:column;text-decoration:none;line-height:1}
.brand-name{font-family:var(--font-display);font-size:1.375rem;letter-spacing:.005em}
.brand-sub{font-size:.6875rem;letter-spacing:.24em;text-transform:uppercase;color:var(--color-text-muted);margin-top:.3rem}
.nav{display:flex;align-items:center;gap:var(--space-8)}
.nav a{font-size:var(--text-sm);text-decoration:none;color:var(--color-text-muted)}
.nav a:hover{color:var(--color-text)}
.lang{display:flex;border:1px solid var(--color-border);border-radius:var(--radius-sm);overflow:hidden}
.lang button{font-size:var(--text-xs);font-weight:500;letter-spacing:.06em;padding:.35rem .6rem;color:var(--color-text-muted)}
.lang button[aria-pressed="true"]{background:var(--color-ink);color:var(--color-text-inverse)}
.lang button:not([aria-pressed="true"]):hover{color:var(--color-text)}
@media (max-width:760px){.nav .navlink{display:none}}

/* hero */
.hero{position:relative;min-height:min(86vh,820px);display:flex;align-items:flex-end;color:var(--color-text-inverse);isolation:isolate;overflow:hidden}
.hero picture,.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 50%;z-index:-2}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,rgba(13,22,30,.82) 0%,rgba(13,22,30,.55) 42%,rgba(13,22,30,.08) 75%),linear-gradient(0deg,rgba(13,22,30,.55) 0%,transparent 45%)}
.hero .wrap{width:100%;padding-block:clamp(var(--space-16),10vw,var(--space-32))}
.hero .eyebrow{color:#E7C3A6;font-size:var(--text-xs);margin:0;max-width:none}
.hero h1{font-family:var(--font-display);font-size:var(--text-3xl);max-width:15ch;margin-top:var(--space-5);letter-spacing:-.01em}
.hero p{font-size:var(--text-lg);line-height:1.5;max-width:44ch;margin-top:var(--space-6);color:rgba(243,239,231,.86)}
.hero-cta{display:flex;flex-wrap:wrap;gap:var(--space-4);margin-top:var(--space-10)}
.btn{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);font-weight:500;text-decoration:none;padding:.85rem 1.4rem;border-radius:var(--radius-sm)}
.btn-primary{background:var(--color-bg);color:var(--color-ink)}
.btn-primary:hover{background:#fff}
.btn-ghost{border:1px solid rgba(243,239,231,.45)}
.btn-ghost:hover{border-color:var(--color-text-inverse);background:rgba(243,239,231,.08)}

/* sections */
section{padding-block:clamp(var(--space-16),9vw,var(--space-32))}
.section-head{display:grid;grid-template-columns:1.25fr 1fr;gap:var(--space-12);align-items:end;margin-bottom:clamp(var(--space-10),6vw,var(--space-20))}
.section-head h2{font-family:var(--font-display);font-size:var(--text-2xl);margin-top:var(--space-3)}
.section-head p{color:var(--color-text-muted)}
@media (max-width:860px){.section-head{grid-template-columns:1fr;gap:var(--space-5)}}

/* services */
.services{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--color-ink)}
.service{padding:var(--space-10) var(--space-8) var(--space-10) 0;border-bottom:1px solid var(--color-divider);display:grid;grid-template-columns:3.5rem 1fr;gap:var(--space-4)}
.service:nth-child(2n){padding-left:var(--space-8);border-left:1px solid var(--color-divider)}
.service .num{font-family:var(--font-display);font-size:var(--text-lg);color:var(--color-primary)}
.service h3{font-family:var(--font-body);font-weight:600;font-size:var(--text-lg);letter-spacing:-.005em}
.service p{color:var(--color-text-muted);margin-top:var(--space-3)}
.service ul{list-style:none;margin-top:var(--space-5);display:flex;flex-wrap:wrap;gap:var(--space-2)}
.service li{font-size:var(--text-xs);padding:.3rem .65rem;border:1px solid var(--color-border);border-radius:999px;color:var(--color-text-muted)}
@media (max-width:860px){.services{grid-template-columns:1fr}.service,.service:nth-child(2n){padding:var(--space-8) 0;border-left:none}}

/* approach */
.approach{background:var(--color-ink);color:var(--color-text-inverse)}
.approach-grid{display:grid;grid-template-columns:5fr 6fr;gap:clamp(var(--space-10),7vw,var(--space-24));align-items:center}
.approach figure{aspect-ratio:4/5;overflow:hidden;border-radius:var(--radius-sm)}
.approach figure img{width:100%;height:100%;object-fit:cover}
.approach .eyebrow{color:#E7C3A6}
.approach h2{font-family:var(--font-display);font-size:var(--text-2xl);margin-top:var(--space-3);max-width:18ch}
.approach .lead{margin-top:var(--space-6);color:rgba(243,239,231,.78)}
.principles{list-style:none;margin-top:var(--space-10);border-top:1px solid rgba(243,239,231,.18)}
.principles li{display:grid;grid-template-columns:1fr 1.6fr;gap:var(--space-6);padding-block:var(--space-5);border-bottom:1px solid rgba(243,239,231,.18);max-width:none}
.principles strong{font-weight:500}
.principles span{color:rgba(243,239,231,.72);font-size:var(--text-sm)}
@media (max-width:860px){.approach-grid{grid-template-columns:1fr}.approach figure{aspect-ratio:3/2}.principles li{grid-template-columns:1fr;gap:var(--space-1)}}

/* clients */
.reach{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--color-ink)}
.reach div{padding:var(--space-8) var(--space-6) var(--space-8) 0;border-bottom:1px solid var(--color-divider)}
.reach div+div{padding-left:var(--space-6);border-left:1px solid var(--color-divider)}
.reach .k{font-family:var(--font-display);font-size:var(--text-lg);line-height:1.25}
.reach .v{font-size:var(--text-sm);color:var(--color-text-muted);margin-top:var(--space-2)}
@media (max-width:860px){.reach{grid-template-columns:1fr 1fr}.reach div:nth-child(3){padding-left:0;border-left:none}}

/* contact */
.contact{background:var(--color-surface-offset)}
.contact-grid{display:grid;grid-template-columns:minmax(0,640px);gap:var(--space-6)}
.card{background:var(--color-surface);border:1px solid var(--color-divider);border-radius:var(--radius-md);padding:clamp(var(--space-6),4vw,var(--space-10));display:flex;flex-direction:column;gap:var(--space-3)}
.card h3{font-family:var(--font-body);font-weight:600;font-size:var(--text-lg)}
.card p{color:var(--color-text-muted)}
.card a.mail{margin-top:auto;padding-top:var(--space-6);font-family:var(--font-display);font-size:var(--text-xl);text-decoration:none;color:var(--color-primary);overflow-wrap:anywhere;display:inline-flex;align-items:center;gap:var(--space-3)}
.card a.mail:hover{color:var(--color-primary-hover)}
.card a.mail svg{flex:none;transition:transform var(--transition)}
.card a.mail:hover svg{transform:translateX(4px)}
.card.primary{border-color:var(--color-ink)}
@media (max-width:760px){.contact-grid{grid-template-columns:1fr}.card a.mail{font-size:1.25rem}.service{grid-template-columns:2.25rem 1fr}}

/* footer */
footer{padding-block:var(--space-12);border-top:1px solid var(--color-divider)}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-4);font-size:var(--text-xs);color:var(--color-text-muted)}
footer a{text-decoration:none}
footer a:hover{color:var(--color-text)}

[data-lang-hide]{display:none}

/* legal page */
.legal{padding-block:clamp(var(--space-12),7vw,var(--space-24))}
.legal .wrap{max-width:820px}
.legal h1{font-family:var(--font-display);font-size:var(--text-2xl);margin-top:var(--space-3)}
.legal .updated{color:var(--color-text-muted);font-size:var(--text-sm);margin-top:var(--space-3)}
.legal h2{font-family:var(--font-body);font-weight:600;font-size:var(--text-lg);margin-top:var(--space-12);padding-top:var(--space-6);border-top:1px solid var(--color-divider)}
.legal p,.legal li{color:var(--color-text);margin-top:var(--space-4)}
.legal ul{padding-left:1.2rem}
.legal dl{display:grid;grid-template-columns:minmax(9rem,max-content) 1fr;gap:var(--space-3) var(--space-8);margin-top:var(--space-6);padding:var(--space-6);background:var(--color-surface);border:1px solid var(--color-divider);border-radius:var(--radius-md)}
.legal dt{color:var(--color-text-muted);font-size:var(--text-sm)}
.legal dd{overflow-wrap:anywhere}
.legal a{color:var(--color-primary)}
.legal .note{font-size:var(--text-sm);color:var(--color-text-muted)}
.pending{background:#F6E2B8;padding:0 .3em;border-radius:3px}
@media (max-width:600px){.legal dl{grid-template-columns:1fr;gap:var(--space-1)}.legal dd{margin-bottom:var(--space-3)}}
.back{display:inline-flex;gap:var(--space-2);font-size:var(--text-sm);color:var(--color-text-muted);text-decoration:none}
.back:hover{color:var(--color-text)}

.phone-row{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-5);padding-top:var(--space-5);border-top:1px solid var(--color-divider)}
.phone,.wa{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);font-weight:500;text-decoration:none;padding:.6rem 1rem;border-radius:var(--radius-sm);border:1px solid var(--color-border)}
.phone:hover{border-color:var(--color-ink)}
.wa{background:var(--color-ink);color:var(--color-text-inverse);border-color:var(--color-ink)}
.wa:hover{background:var(--color-ink-2)}
