:root { --ink:#082857; --coral:#ec6c6b; --paper:#ffffff; --dark:#082857; --muted:#cbcbe0; --body:#35364d; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--body); background:var(--paper); font-family:"DM Sans", Arial, sans-serif; font-size:16px; line-height:1.5; }
a { color:inherit; text-decoration:none; }
.site-header { height:82px; padding:0 clamp(24px,5vw,78px); display:flex; justify-content:space-between; align-items:center; color:var(--ink); background:var(--paper); position:relative; z-index:3; }
.brand { font-size:22px; font-weight:600; letter-spacing:-.07em; white-space:nowrap; }.brand em { font-family:"Playfair Display",serif; font-weight:500; letter-spacing:-.08em; }
.navigation { display:flex; align-items:center; gap:31px; font-size:13px; font-weight:500; }.navigation a:not(.nav-cta) { transition:color .2s; }.navigation a:not(.nav-cta):hover { color:var(--coral); }.nav-cta { border:1px solid var(--ink); padding:10px 15px; }.menu-toggle { display:none; }
.hero { min-height:calc(100vh - 82px); background:var(--ink); color:#fff; display:grid; grid-template-columns:1.08fr .92fr; overflow:hidden; }.hero-copy { padding:clamp(75px,11vw,155px) clamp(24px,7vw,110px) 75px; position:relative; z-index:1; }.eyebrow { color:var(--coral); font:11px "DM Mono",monospace; letter-spacing:.08em; text-transform:uppercase; margin:0 0 25px; }.eyebrow.ink { color:var(--ink); }.hero h1,.intro-layout h2,.method h2,.contact h2 { font-family:"Playfair Display",Georgia,serif; font-size:clamp(52px,6.35vw,100px); line-height:.98; font-weight:500; letter-spacing:-.055em; margin:0; }.hero h1 em,.intro-layout h2 em,.method h2 em,.contact h2 em { color:var(--coral); font-weight:500; }.hero-intro { max-width:420px; font-size:17px; margin:39px 0 35px; color:#e4e4ee; }.button { display:inline-flex; align-items:center; justify-content:space-between; gap:35px; font-size:13px; font-weight:600; padding:15px 18px; border:0; cursor:pointer; transition:transform .2s,background .2s; }.button:hover { transform:translateY(-2px); }.button span { font-size:18px; line-height:12px; }.button-light { background:#fff; color:var(--ink); }.button-coral { color:#fff; background:var(--coral); width:100%; margin-top:16px; }.hero-art { position:relative; min-height:500px; overflow:hidden; border-left:1px solid rgba(255,255,255,.22); background:var(--ink); }.art-circle { position:absolute; border-radius:50%; }.art-circle-one { width:min(55vw,725px); height:min(55vw,725px); left:-10%; top:14%; background:var(--coral); }.art-circle-two { width:min(29vw,400px); height:min(29vw,400px); left:31%; top:30%; border:1px solid var(--ink); background:#f4d5c7; }.art-line { width:calc(100% + 80px); border-top:1px solid var(--ink); transform:rotate(-38deg); position:absolute; top:48%; left:-40px; }.hero-art p { color:var(--ink); position:absolute; top:32%; left:12%; font:clamp(16px,2vw,28px)/1.1 "DM Mono",monospace; letter-spacing:-.08em; }.hero-art span { font:11px "DM Mono",monospace; position:absolute; right:30px; bottom:28px; color:#fff; }
.intro-band { padding:clamp(75px,11vw,154px) clamp(24px,8vw,125px); }.intro-layout { display:grid; grid-template-columns:1.35fr .65fr; gap:60px; align-items:end; }.intro-layout h2 { font-size:clamp(46px,5.2vw,78px); color:var(--ink); max-width:750px; }.intro-layout p { margin:0 0 28px; max-width:320px; font-size:16px; }.text-link { color:var(--ink); padding-bottom:6px; border-bottom:1px solid var(--ink); font-size:13px; font-weight:600; }.text-link span { padding-left:18px; }
.services { background:var(--coral); color:var(--ink); padding:clamp(70px,8vw,116px) clamp(24px,8vw,125px); }.section-heading { display:grid; grid-template-columns:1.35fr .65fr; gap:60px; margin-bottom:60px; }.section-heading .eyebrow { color:var(--ink); }.section-heading > p:last-child { max-width:310px; margin:0; font-size:16px; }.service-list { border-top:1px solid rgba(43,46,131,.52); }.service-item { display:grid; grid-template-columns:85px 1fr 35px; gap:28px; padding:34px 0 31px; align-items:start; border-bottom:1px solid rgba(43,46,131,.52); transition:padding .25s; }.service-item:hover { padding-left:13px; }.number { font:11px "DM Mono",monospace; padding-top:7px; }.service-item h3 { font:clamp(30px,3.4vw,53px)/.98 "Playfair Display",Georgia,serif; margin:0; font-weight:500; letter-spacing:-.055em; }.service-item h3 em { font-weight:500; }.service-item p { grid-column:2; max-width:500px; font-size:15px; margin:18px 0 0; }.arrow { font-size:25px; text-align:right; }
.proofs { color:#fff; background:var(--dark); display:grid; grid-template-columns:repeat(3,1fr); padding:clamp(48px,6vw,78px) clamp(24px,8vw,125px); }.proofs > div { padding:0 30px; border-left:1px solid rgba(255,255,255,.4); }.proofs > div:first-child { padding-left:0; border:0; }.proofs strong { display:block; color:var(--coral); font:clamp(60px,7vw,110px)/.9 "Playfair Display",Georgia,serif; font-weight:500; letter-spacing:-.07em; }.proofs span { display:block; margin-top:18px; font-size:14px; color:#ececf5; }
.method { padding:clamp(78px,10vw,145px) clamp(24px,8vw,125px); }.method-top { max-width:880px; }.method h2 { color:var(--ink); font-size:clamp(46px,5.5vw,82px); }.method-steps { display:grid; grid-template-columns:repeat(4,1fr); margin-top:90px; border-top:1px solid #aaaabc; }.method-steps article { min-height:220px; padding:21px 24px 0 0; border-right:1px solid #aaaabc; }.method-steps article + article { padding-left:23px; }.method-steps article:last-child { border:0; }.method-steps span { font:11px "DM Mono",monospace; color:var(--coral); }.method-steps h3 { color:var(--ink); margin:43px 0 10px; font:28px "Playfair Display",Georgia,serif; letter-spacing:-.05em; }.method-steps p { margin:0; max-width:200px; font-size:14px; }
.about { display:grid; grid-template-columns:1fr 1fr; background:#f0e3db; color:var(--ink); }.portrait-wrap { min-height:690px; position:relative; overflow:hidden; background:var(--coral); }.portrait-wrap img { width:100%; height:100%; position:absolute; inset:0; display:block; object-fit:cover; object-position:center 18%; mix-blend-mode:multiply; filter:saturate(.8) contrast(1.02); }.portrait-wrap::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(43,46,131,.03),rgba(43,46,131,.2)); pointer-events:none; }.portrait-wrap span { position:absolute; z-index:1; left:28px; bottom:23px; color:white; font:11px/1.35 "DM Mono",monospace; text-transform:uppercase; letter-spacing:.05em; }.about-copy { padding:clamp(72px,9vw,135px) clamp(30px,9vw,130px); }.about h2 { font:clamp(48px,5vw,77px)/.98 "Playfair Display",Georgia,serif; letter-spacing:-.055em; margin:0 0 35px; font-weight:500; }.about h2 em { color:var(--coral); font-weight:500; }.about-copy > p:not(.eyebrow) { max-width:390px; margin:0 0 17px; }.about .text-link { display:inline-block; margin-top:17px; }
.quote-section { background:#e4e4ee; color:var(--ink); padding:clamp(70px,10vw,135px) 14vw; text-align:center; }.quote-mark { color:var(--coral); font:90px/.55 "Playfair Display",Georgia,serif; margin:0 0 22px; }.quote-section blockquote { max-width:900px; margin:auto; font:clamp(34px,4.5vw,68px)/1.05 "Playfair Display",Georgia,serif; letter-spacing:-.05em; }
.contact { color:#fff; background:var(--ink); padding:clamp(72px,10vw,140px) clamp(24px,8vw,125px); display:grid; grid-template-columns:1fr 1fr; gap:clamp(45px,12vw,180px); }.contact h2 { font-size:clamp(47px,5.4vw,80px); }.contact-copy { color:#e4e4ee; max-width:360px; margin-top:34px; }.contact-form { padding-top:37px; }.contact-form label { display:block; font-size:12px; margin:0 0 25px; color:#e4e4ee; }.contact-form input,.contact-form textarea { color:#fff; font:16px "DM Sans",sans-serif; display:block; width:100%; background:transparent; border:0; border-bottom:1px solid rgba(255,255,255,.5); padding:11px 0; outline:none; resize:vertical; }.contact-form input:focus,.contact-form textarea:focus { border-bottom-color:var(--coral); }.contact-form ::placeholder { color:#b5b6d2; }
footer { background:var(--paper); color:var(--ink); padding:34px clamp(24px,5vw,78px); display:grid; grid-template-columns:1fr 1fr 1.3fr; gap:20px; align-items:end; font-size:12px; }footer > div { display:flex; gap:18px; flex-wrap:wrap; }footer p { margin:0; text-align:right; color:#777899; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:760px) { .site-header { height:68px; }.menu-toggle { display:block; width:32px; height:32px; padding:5px; background:transparent; border:0; }.menu-toggle span:not(.sr-only) { background:var(--ink); height:1px; display:block; margin:6px 0; transition:transform .2s; }.navigation { display:none; position:absolute; top:68px; left:0; right:0; padding:25px; background:var(--paper); border-top:1px solid #dedde0; flex-direction:column; align-items:flex-start; gap:20px; }.navigation.open { display:flex; }.hero { min-height:auto; grid-template-columns:1fr; }.hero-copy { padding-top:76px; }.hero-art { height:390px; min-height:0; border-top:1px solid rgba(255,255,255,.22); border-left:0; }.art-circle-one { width:450px; height:450px; left:-80px; top:-43px; }.art-circle-two { width:255px; height:255px; left:32%; top:20%; }.intro-layout,.section-heading,.contact { grid-template-columns:1fr; gap:32px; }.section-heading { margin-bottom:39px; }.service-item { grid-template-columns:45px 1fr 25px; gap:8px; }.service-item p { grid-column:1 / -1; margin-top:17px; }.proofs { grid-template-columns:1fr; gap:32px; }.proofs > div,.proofs > div:first-child { padding:0 0 30px; border-left:0; border-bottom:1px solid rgba(255,255,255,.4); }.proofs > div:last-child { border:0; padding:0; }.method-steps { grid-template-columns:1fr 1fr; margin-top:53px; }.method-steps article { min-height:195px; border-bottom:1px solid #aaaabc; }.method-steps article:nth-child(2) { border-right:0; }.method-steps article:nth-child(3) { padding-left:0; }.method-steps article:nth-child(n+3) { padding-top:21px; border-bottom:0; }.method-steps h3 { margin-top:30px; }.contact-form { padding-top:0; } footer { grid-template-columns:1fr; align-items:start; gap:20px; } footer p { text-align:left; }.quote-section { padding-left:25px; padding-right:25px; } }