:root {
  --ink: #121311;
  --ink-soft: #1a1c18;
  --cream: #f1eee3;
  --paper: #fbfaf5;
  --olive: #a2a466;
  --olive-deep: #747a4c;
  --olive-dark: #61673f;
  --white: #ffffff;
  --muted-dark: #b9b8ae;
  --muted-light: #65685c;
  --line-dark: rgba(255,255,255,.14);
  --line-light: rgba(18,19,17,.14);
  --radius: 1.4rem;
  --shadow: 0 24px 70px rgba(0,0,0,.18);
  --container: min(1180px, calc(100% - 2.5rem));
  --font-sans: "Avenir Next", Avenir, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-serif: Iowan Old Style, Baskerville, "Times New Roman", serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 86px; }
body { margin: 0; background: var(--ink); color: var(--cream); font-family: var(--font-sans); line-height: 1.65; -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
::selection { background: var(--olive); color: var(--ink); }

.container { width: var(--container); margin-inline: auto; }
.section-dark { background: var(--ink); color: var(--cream); }
.section-light { background: var(--paper); color: var(--ink); }
.section-cream { background: var(--cream); color: var(--ink); }
.section-olive { background: var(--olive-deep); color: var(--white); }

.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.skip-link { position: fixed; z-index: 9999; top: .8rem; left: .8rem; transform: translateY(-160%); padding: .65rem 1rem; background: var(--cream); color: var(--ink); text-decoration: none; border-radius: .5rem; }
.skip-link:focus { transform: translateY(0); }

.site-header { position: fixed; inset: 0 0 auto; z-index: 1000; border-bottom: 1px solid transparent; transition: background .25s ease, border-color .25s ease, backdrop-filter .25s ease; }
.site-header.scrolled { background: rgba(18,19,17,.88); backdrop-filter: blur(15px); border-color: var(--line-dark); }
.header-inner { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.brand { display: inline-flex; align-items: center; gap: .8rem; text-decoration: none; text-transform: uppercase; letter-spacing: .12em; line-height: 1; }
.brand img { width: 44px; height: 44px; object-fit: contain; }
.brand strong { display: block; font-size: .92rem; }
.brand small { display: block; margin-top: .3rem; color: var(--olive); font-size: .67rem; letter-spacing: .24em; }
.main-nav { display: flex; align-items: center; gap: 1.8rem; }
.main-nav a { position: relative; color: #d5d4ca; text-decoration: none; font-size: .86rem; font-weight: 650; letter-spacing: .04em; }
.main-nav a:not(.nav-cta)::after { content:""; position:absolute; left:0; right:100%; bottom:-.35rem; height:2px; background:var(--olive); transition:right .2s ease; }
.main-nav a:not(.nav-cta):hover::after, .main-nav a:not(.nav-cta):focus-visible::after { right:0; }
.main-nav .nav-cta { padding: .72rem 1rem; color: var(--ink); background: var(--olive); border-radius: 999px; transition: transform .2s ease, background .2s ease; }
.main-nav .nav-cta:hover { transform: translateY(-2px); background: #b4b677; }
.nav-toggle { display:none; width:44px; height:44px; padding:10px; border:0; background:transparent; }
.nav-toggle span:not(.sr-only) { display:block; height:2px; margin:5px 0; background:var(--cream); transition:.25s ease; }

.hero { position: relative; min-height: 100svh; display: grid; align-items: center; overflow: hidden; padding: 9.2rem 0 5rem; }
.hero::after { content:""; position:absolute; inset:auto 0 0; height:1px; background:linear-gradient(90deg,transparent,var(--line-dark),transparent); }
.hero-glow { position:absolute; width:820px; height:820px; right:-260px; top:-260px; border-radius:50%; background:radial-gradient(circle,rgba(162,164,102,.18),transparent 67%); pointer-events:none; }
.hero-grid { display:grid; grid-template-columns: 1.08fr .92fr; gap: clamp(2.5rem,6vw,7rem); align-items:center; }
.eyebrow { margin:0 0 1rem; color:var(--olive); text-transform:uppercase; letter-spacing:.18em; font-size:.73rem; font-weight:800; }
h1,h2,h3,p { text-wrap:pretty; }
h1 { margin:0; max-width:760px; font-size:clamp(3rem,6.5vw,6.5rem); line-height:.93; letter-spacing:-.055em; font-weight:760; }
h1 em, h2 em { color:var(--olive); font-family:var(--font-serif); font-weight:400; }
.hero-lead { max-width:700px; margin:2rem 0 0; color:#cecdc3; font-size:clamp(1.02rem,1.5vw,1.22rem); }
.hero-actions { display:flex; flex-wrap:wrap; gap:.9rem; margin:2.35rem 0 0; }
.button { display:inline-flex; justify-content:center; align-items:center; min-height:49px; padding:.8rem 1.35rem; border:1px solid transparent; border-radius:999px; text-decoration:none; font-weight:750; font-size:.9rem; transition:transform .2s ease, background .2s ease, border-color .2s ease, color .2s ease; }
.button:hover { transform:translateY(-2px); }
.button-primary { background:var(--olive); color:var(--ink); }
.button-primary:hover { background:#b3b575; }
.button-ghost { border-color:var(--line-dark); color:var(--cream); background:rgba(255,255,255,.02); }
.button-ghost:hover { border-color:var(--olive); }
.button-dark { width:100%; background:var(--ink); color:var(--cream); }
.button-dark:hover { background:#272a23; }
.hero-proof { display:grid; grid-template-columns:repeat(3,1fr); max-width:720px; margin-top:3.25rem; padding-top:1.45rem; border-top:1px solid var(--line-dark); }
.hero-proof div { display:grid; gap:.2rem; padding-right:1rem; }
.hero-proof strong { color:var(--olive); font-size:1.25rem; }
.hero-proof span { color:#aaa99f; font-size:.76rem; }
.hero-visual { position:relative; justify-self:end; width:min(100%,560px); }
.portrait-frame { position:relative; aspect-ratio:1; overflow:hidden; border-radius:50% 50% 7% 50%; box-shadow:var(--shadow); border:1px solid rgba(255,255,255,.12); }
.portrait-frame::after { content:""; position:absolute; inset:0; background:linear-gradient(145deg,transparent 55%,rgba(116,122,76,.24)); }
.portrait-frame > img { width:100%; height:100%; object-fit:cover; }
.portrait-logo { position:absolute; right:5%; bottom:3%; z-index:1; width:27%; opacity:.14; }
.floating-note { position:absolute; z-index:2; min-width:205px; padding:.9rem 1rem; background:rgba(25,27,23,.86); border:1px solid var(--line-dark); backdrop-filter:blur(12px); box-shadow:0 16px 40px rgba(0,0,0,.28); }
.floating-note span,.floating-note strong { display:block; }
.floating-note span { color:var(--olive); font-size:.67rem; text-transform:uppercase; letter-spacing:.12em; }
.floating-note strong { margin-top:.2rem; font-size:.82rem; }
.note-top { top:7%; right:-5%; border-radius:1rem 1rem 1rem .2rem; }
.note-bottom { bottom:7%; left:-10%; border-radius:1rem 1rem .2rem 1rem; }

.services { padding:clamp(5rem,9vw,9rem) 0; }
.section-heading { max-width:760px; margin-bottom:3.6rem; }
.section-heading-wide { max-width:920px; }
.section-heading h2, .experience h2, .about h2, .fit h2, .contact h2, .mao-band h2 { margin:0; font-size:clamp(2.45rem,5.2vw,5.2rem); line-height:1; letter-spacing:-.05em; }
.section-heading > p:last-child { color:var(--muted-light); font-size:1.06rem; max-width:680px; }
.section-dark .section-heading > p:last-child { color:var(--muted-dark); }
.service-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
.service-card { position:relative; min-height:460px; padding:2rem; overflow:hidden; border:1px solid var(--line-light); border-radius:var(--radius); background:rgba(255,255,255,.55); transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.service-card:hover { transform:translateY(-6px); border-color:rgba(116,122,76,.45); box-shadow:0 22px 60px rgba(22,24,18,.1); }
.service-card-featured { background:var(--ink); color:var(--cream); border-color:var(--ink); }
.service-card-featured p,.service-card-featured li { color:#bbbcb0; }
.service-number { position:absolute; right:1.6rem; top:1.2rem; font-family:var(--font-serif); font-size:3.5rem; color:rgba(116,122,76,.16); }
.service-card-featured .service-number { color:rgba(162,164,102,.2); }
.service-icon { width:58px; height:58px; display:grid; place-items:center; margin-bottom:2.4rem; border-radius:50%; background:var(--olive); color:var(--ink); }
.service-icon svg { width:32px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.service-card h3 { margin:0 0 .8rem; max-width:420px; font-size:clamp(1.45rem,2.5vw,2rem); line-height:1.1; letter-spacing:-.025em; }
.service-card p { color:var(--muted-light); }
.service-card ul { margin:1.4rem 0 0; padding:1.3rem 0 0; border-top:1px solid currentColor; border-color:rgba(116,122,76,.2); list-style:none; }
.service-card li { position:relative; margin:.45rem 0; padding-left:1.2rem; color:#55594d; font-size:.9rem; }
.service-card li::before { content:""; position:absolute; left:0; top:.68em; width:5px; height:5px; border-radius:50%; background:var(--olive-deep); }

.experience { padding:clamp(5rem,9vw,8rem) 0; }
.experience-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:clamp(3rem,7vw,7rem); align-items:start; }
.experience .eyebrow { color:#daddb1; }
.experience h2 { max-width:680px; color:#fff; }
.experience-copy > p:not(.eyebrow) { max-width:700px; color:#e1e2d6; font-size:1.04rem; }
.experience-copy strong { color:#fff; }
.experience-facts { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(255,255,255,.19); border:1px solid rgba(255,255,255,.19); }
.fact { min-height:190px; padding:1.5rem; background:var(--olive-deep); display:flex; flex-direction:column; justify-content:space-between; }
.fact strong { font-size:clamp(1.45rem,3vw,2.5rem); line-height:1; color:#fff; }
.fact span { color:#e0e1d6; font-size:.88rem; }

.method { padding:clamp(5rem,9vw,9rem) 0; }
.method-grid { display:grid; grid-template-columns:repeat(4,1fr); margin:0; padding:0; list-style:none; border-top:1px solid var(--line-dark); border-bottom:1px solid var(--line-dark); }
.method-step { position:relative; min-height:300px; padding:2rem 1.5rem 2.5rem; border-right:1px solid var(--line-dark); }
.method-step:last-child { border-right:0; }
.method-step > span { color:var(--olive); font-family:var(--font-serif); font-size:1.1rem; }
.method-step h3 { margin:5.2rem 0 .7rem; font-size:1.55rem; }
.method-step p { margin:0; color:#aaa99f; font-size:.9rem; }

.mao-band { position:relative; min-height:560px; display:flex; align-items:flex-end; overflow:hidden; background:#080908; }
.mao-image { position:absolute; inset:0; }
.mao-image::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(8,9,8,.95) 0%,rgba(8,9,8,.75) 47%,rgba(8,9,8,.28) 100%),linear-gradient(0deg,rgba(8,9,8,.88),transparent 62%); }
.mao-image img { width:100%; height:100%; object-fit:cover; object-position:center; filter:saturate(.72); }
.mao-content { position:relative; z-index:2; display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; padding-bottom:4.5rem; }
.mao-content > div { max-width:820px; }
.mao-band h2 { color:#fff; font-size:clamp(2.3rem,4.7vw,4.6rem); }

.about { padding:clamp(5rem,9vw,9rem) 0; }
.about-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(3rem,8vw,8rem); align-items:center; }
.about-photo { position:relative; max-width:520px; }
.about-photo::before { content:""; position:absolute; inset:-1rem 1rem 1rem -1rem; border:1px solid var(--olive); border-radius:var(--radius); }
.about-photo img { position:relative; width:100%; aspect-ratio:.72; object-fit:cover; border-radius:var(--radius); box-shadow:var(--shadow); }
.about-caption { position:absolute; left:1.2rem; right:-2.2rem; bottom:1.2rem; padding:1rem 1.2rem; background:rgba(18,19,17,.9); color:var(--cream); backdrop-filter:blur(10px); border-radius:.9rem; }
.about-caption strong,.about-caption span { display:block; }
.about-caption span { color:var(--olive); font-size:.76rem; }
.about-copy .intro { font-size:1.2rem; color:#303329; }
.about-copy > p:not(.eyebrow):not(.intro) { color:var(--muted-light); }
.about-meta { display:grid; grid-template-columns:repeat(3,1fr); gap:.7rem; margin-top:2rem; padding-top:1.5rem; border-top:1px solid var(--line-light); }
.about-meta span,.about-meta strong { display:block; }
.about-meta span { color:var(--olive-deep); font-size:.68rem; text-transform:uppercase; letter-spacing:.1em; font-weight:800; }
.about-meta strong { margin-top:.3rem; font-size:.82rem; }

.fit { padding:clamp(5rem,9vw,8rem) 0; }
.fit-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(3rem,8vw,8rem); }
.fit-heading { position:sticky; top:120px; align-self:start; }
.fit-heading h2 { font-size:clamp(2.4rem,4.7vw,4.7rem); }
.fit-list article { display:grid; grid-template-columns:70px 1fr; gap:1.1rem; align-items:start; padding:1.5rem 0; border-bottom:1px solid var(--line-light); }
.fit-list article:first-child { border-top:1px solid var(--line-light); }
.fit-list span { color:var(--olive-deep); font-family:var(--font-serif); font-size:1.1rem; }
.fit-list p { margin:0; font-size:clamp(1.05rem,1.7vw,1.3rem); line-height:1.4; }

.artistic { padding:clamp(5rem,9vw,8rem) 0; }
.artistic-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.artistic-card { min-height:330px; display:flex; flex-direction:column; padding:1.8rem; border:1px solid var(--line-dark); border-radius:var(--radius); text-decoration:none; background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.015)); transition:transform .25s ease,border-color .25s ease,background .25s ease; }
.artistic-card:hover { transform:translateY(-6px); border-color:var(--olive); background:linear-gradient(145deg,rgba(162,164,102,.13),rgba(255,255,255,.015)); }
.card-kicker { color:var(--olive); text-transform:uppercase; font-size:.66rem; font-weight:800; letter-spacing:.15em; }
.artistic-card h3 { margin:4rem 0 .6rem; font-size:2rem; }
.artistic-card p { color:#aaa99f; }
.card-link { margin-top:auto; padding-top:1rem; border-top:1px solid var(--line-dark); font-size:.85rem; font-weight:750; }
.card-link b { float:right; color:var(--olive); font-size:1.15rem; }

.contact { padding:clamp(5rem,9vw,8rem) 0; }
.contact-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(3rem,8vw,8rem); }
.contact .eyebrow { color:#e1e4bb; }
.contact h2 { color:#fff; }
.contact h2 em { color:#e1e4bb; }
.contact-copy > p:not(.eyebrow) { color:#e1e2d6; max-width:570px; }
.contact-details { display:grid; gap:1px; margin-top:2.3rem; font-style:normal; background:rgba(255,255,255,.22); border:1px solid rgba(255,255,255,.22); }
.contact-details a { display:grid; grid-template-columns:110px 1fr; gap:1rem; padding:1rem 1.1rem; background:var(--olive-deep); text-decoration:none; transition:background .2s ease; }
.contact-details a:hover { background:var(--olive-dark); }
.contact-details span { color:#d7d9c7; font-size:.72rem; text-transform:uppercase; letter-spacing:.1em; }
.contact-details strong { color:#fff; font-size:.9rem; }
.contact-form { padding:2rem; border-radius:var(--radius); background:var(--paper); color:var(--ink); box-shadow:0 28px 70px rgba(0,0,0,.16); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.contact-form label { display:block; margin-bottom:1rem; font-size:.78rem; font-weight:800; }
.contact-form label > span { color:#777a70; font-weight:500; }
.contact-form input,.contact-form select,.contact-form textarea { width:100%; margin-top:.4rem; border:1px solid #d5d3c8; border-radius:.65rem; background:#fff; color:var(--ink); padding:.75rem .85rem; outline:none; transition:border-color .2s ease,box-shadow .2s ease; }
.contact-form textarea { resize:vertical; min-height:145px; }
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus { border-color:var(--olive-deep); box-shadow:0 0 0 3px rgba(116,122,76,.15); }
.contact-form .invalid { border-color:#9b3a34; box-shadow:0 0 0 3px rgba(155,58,52,.11); }
.form-note,.form-status { margin:.8rem 0 0; color:#696c62; font-size:.72rem; }
.form-status { min-height:1.2em; color:#4a502d; font-weight:700; }

.site-footer { padding:2rem 0; border-top:1px solid var(--line-dark); background:#0d0e0c; color:#aaa99f; }
.footer-grid { display:grid; grid-template-columns:1fr auto auto; gap:2rem; align-items:center; }
.footer-brand { display:flex; align-items:center; gap:.9rem; }
.footer-brand img { width:46px; height:46px; }
.footer-brand strong,.footer-brand span { display:block; }
.footer-brand strong { color:var(--cream); font-size:.9rem; }
.footer-brand span { font-size:.7rem; color:var(--olive); }
.footer-legal { text-align:right; font-size:.72rem; }
.footer-legal p { margin:.15rem 0; }
.back-top { width:42px; height:42px; display:grid; place-items:center; border:1px solid var(--line-dark); border-radius:50%; text-decoration:none; color:var(--olive); }

.reveal { opacity:0; transform:translateY(24px); transition:opacity .7s ease,transform .7s ease; }
.reveal.visible { opacity:1; transform:none; }

@media (max-width: 980px) {
  .main-nav { position:fixed; inset:82px 1rem auto; display:grid; gap:0; padding:1rem; border:1px solid var(--line-dark); border-radius:1rem; background:rgba(18,19,17,.97); box-shadow:var(--shadow); transform:translateY(-150%); opacity:0; visibility:hidden; transition:.25s ease; }
  .main-nav.open { transform:none; opacity:1; visibility:visible; }
  .main-nav a { padding:.85rem; }
  .main-nav .nav-cta { margin-top:.5rem; text-align:center; }
  .nav-toggle { display:block; }
  .nav-toggle[aria-expanded="true"] span:nth-child(2) { transform:translateY(7px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] span:nth-child(3) { opacity:0; }
  .nav-toggle[aria-expanded="true"] span:nth-child(4) { transform:translateY(-7px) rotate(-45deg); }
  .hero { min-height:auto; }
  .hero-grid,.about-grid,.contact-grid { grid-template-columns:1fr; }
  .hero-copy { padding-top:1.5rem; }
  .hero-visual { width:min(82vw,540px); justify-self:center; margin-top:2rem; }
  .experience-grid,.fit-grid { grid-template-columns:1fr; }
  .fit-heading { position:static; }
  .method-grid { grid-template-columns:1fr 1fr; }
  .method-step:nth-child(2) { border-right:0; }
  .method-step:nth-child(-n+2) { border-bottom:1px solid var(--line-dark); }
  .artistic-grid { grid-template-columns:1fr; }
  .artistic-card { min-height:250px; }
  .mao-content { align-items:flex-start; flex-direction:column; }
  .about-photo { justify-self:center; }
}

@media (max-width: 680px) {
  :root { --container:min(100% - 1.35rem, 1180px); }
  .header-inner { min-height:72px; }
  .site-header.scrolled .header-inner { min-height:68px; }
  html { scroll-padding-top:72px; }
  .brand img { width:38px; height:38px; }
  .hero { padding-top:7.4rem; }
  h1 { font-size:clamp(2.75rem,14vw,4.4rem); }
  .hero-proof { grid-template-columns:1fr; gap:.8rem; }
  .hero-proof div { grid-template-columns:60px 1fr; align-items:center; }
  .hero-visual { width:92vw; }
  .note-top { right:0; top:3%; }
  .note-bottom { left:0; bottom:3%; }
  .floating-note { min-width:180px; padding:.7rem .8rem; }
  .service-grid { grid-template-columns:1fr; }
  .service-card { min-height:auto; }
  .experience-facts { grid-template-columns:1fr; }
  .fact { min-height:135px; }
  .method-grid { grid-template-columns:1fr; }
  .method-step { min-height:auto; border-right:0; border-bottom:1px solid var(--line-dark); }
  .method-step:last-child { border-bottom:0; }
  .method-step h3 { margin-top:2.2rem; }
  .mao-band { min-height:520px; }
  .mao-image::after { background:linear-gradient(0deg,rgba(8,9,8,.95) 0%,rgba(8,9,8,.68) 70%,rgba(8,9,8,.32)); }
  .about-caption { right:.7rem; left:.7rem; }
  .about-meta { grid-template-columns:1fr; }
  .fit-list article { grid-template-columns:45px 1fr; }
  .form-row { grid-template-columns:1fr; gap:0; }
  .contact-form { padding:1.2rem; }
  .contact-details a { grid-template-columns:1fr; gap:.2rem; }
  .footer-grid { grid-template-columns:1fr auto; }
  .footer-legal { grid-column:1/-1; text-align:left; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
  .reveal { opacity:1; transform:none; }
}
