:root { --ink:#12172B; --sand:#E8DFC8; --ochre:#C08552; --paper:#F7F4EC; --muted:#a9a596; --line:rgba(232,223,200,.18); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:var(--sand); font-family:Inter,Arial,sans-serif; font-size:16px; line-height:1.55; }
a { color:inherit; text-decoration:none; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline:3px solid var(--ochre); outline-offset:4px; }
.section-shell { width:min(1120px, calc(100% - 48px)); margin-inline:auto; }
.site-header { width:min(1200px, calc(100% - 48px)); margin:0 auto; min-height:84px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.brand { font:700 1.65rem/1 "Space Grotesk",sans-serif; letter-spacing:-.07em; }.brand span { color:var(--ochre); }
.header-link { font-size:.9rem; font-weight:600; }.header-link span { color:var(--ochre); margin-left:.35rem; }
.hero { min-height:calc(100vh - 84px); padding:clamp(100px,15vw,190px) 0; display:flex; align-items:center; justify-content:center; text-align:center; }
.hero-copy { display:flex; flex-direction:column; align-items:center; }
.eyebrow { margin:0 0 17px; color:var(--ochre); font-size:.73rem; letter-spacing:.14em; line-height:1.3; text-transform:uppercase; font-weight:600; }
h1,h2,h3 { font-family:"Space Grotesk",sans-serif; letter-spacing:-.055em; line-height:1.05; margin:0; }
h1 { max-width:700px; font-size:clamp(3rem,5.3vw,5.15rem); }
h2 { font-size:clamp(2.15rem,3.7vw,3.7rem); max-width:680px; }
h3 { font-size:1.3rem; }
.hero-lede { max-width:630px; margin:28px 0 32px; color:#c9c1ae; font-size:1.05rem; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:1rem; padding:14px 20px; border:1px solid transparent; font:600 .9rem Inter,sans-serif; cursor:pointer; transition:background .2s,color .2s,transform .2s; }.button-primary { background:var(--ochre); color:var(--ink); }.button-secondary { color:var(--sand); border-color:var(--line); }.button:hover { background:var(--sand); color:var(--ink); transform:translateY(-2px); }
.data-transform { display:grid; grid-template-columns:1fr 42px 1fr; align-items:center; gap:10px; padding:12px; background:rgba(247,244,236,.06); border:1px solid var(--line); }
.data-panel { min-height:238px; padding:16px 12px 12px; background:var(--paper); color:var(--ink); display:flex; flex-direction:column; }.data-panel-before { background:#dad2c0; }
.panel-label { display:flex; align-items:center; gap:7px; font-size:.67rem; letter-spacing:.12em; font-weight:600; text-transform:uppercase; }.status-dot { width:7px; height:7px; border-radius:99px; background:var(--ochre); }.data-panel-after .status-dot { background:#466c5b; }
.data-rows { margin-top:18px; font-size:.62rem; }.data-row,.data-heading { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:7px; padding:6px 0; border-bottom:1px solid rgba(18,23,43,.12); align-items:center; }.messy-rows .data-row:nth-child(1){transform:rotate(-1.6deg)}.messy-rows .data-row:nth-child(2){transform:translateX(8px)}.messy-rows .data-row:nth-child(3){transform:rotate(1deg);opacity:.72}.messy-rows .data-row:nth-child(4){transform:translateX(-3px);opacity:.75}.messy-rows .data-row:nth-child(5){transform:rotate(-.7deg)}
.data-heading { padding-top:0; color:#676761; font-size:.55rem; letter-spacing:.08em; }.tag { padding:2px 5px; background:#d7e1da; border-radius:2px; color:#315447; font-size:.57rem; }.tag-ochre { background:#e9d1b6; color:#704116; }.panel-note { margin:auto 0 0; padding-top:15px; color:#656159; font-size:.66rem; }.transform-arrow { text-align:center; color:var(--ochre); font:500 2rem/1 "Space Grotesk",sans-serif; }.transform-arrow span { display:inline-block; animation:nudge 2.8s ease-in-out infinite; }
.services,.why { padding:120px 0; border-top:1px solid var(--line); }.section-intro { margin-bottom:48px; }.service-grid { display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid var(--line); }.service-card { padding:28px 28px 6px 0; min-height:270px; }.service-card:nth-child(3) { padding-left:28px; border-left:1px solid var(--line); }.service-card-featured { grid-column:1/-1; display:grid; grid-template-columns:minmax(230px,.7fr) 1.3fr; gap:48px; align-items:center; padding:34px 0; border-bottom:1px solid var(--line); }.service-card-featured .data-transform { max-width:620px; justify-self:end; width:100%; }.service-mark { display:block; color:var(--ochre); font-size:1.35rem; height:54px; }.service-card h3 { max-width:245px; }.service-card p,.why-list p { color:#bdb6a6; font-size:.91rem; max-width:295px; }
.why { padding-top:0; border-top:0; }.why-list { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }.why-list article { padding-top:18px; border-top:2px solid var(--ochre); }.why-list h3 { font-size:1.2rem; }
.contact { background:var(--paper); color:var(--ink); padding:94px 0; }.contact-inner { display:grid; grid-template-columns:.9fr 1fr; gap:12%; }.contact-copy p:not(.eyebrow) { max-width:340px; color:#5a5c64; }.contact .eyebrow { color:#8d5b30; }.contact-form { display:grid; grid-template-columns:1fr 1fr; gap:18px; align-content:start; }.form-field { display:grid; gap:7px; }.form-field:nth-child(3),.form-field:nth-child(4),.submit-button,.form-status { grid-column:1/-1; } label { font-size:.75rem; font-weight:600; } input,textarea { appearance:none; width:100%; padding:11px 0; background:transparent; color:var(--ink); border:0; border-bottom:1px solid #aaa69d; border-radius:0; font:400 .95rem Inter,sans-serif; } textarea { resize:vertical; min-height:100px; } input:focus,textarea:focus { outline:0; border-bottom-color:var(--ochre); }.submit-button { justify-self:start; margin-top:7px; }.submit-button:disabled { cursor:wait; opacity:.7; transform:none; }.form-status { min-height:1.4em; margin:0; font-size:.85rem; font-weight:500; }.form-status.success { color:#315447; }.form-status.error { color:#a53d2b; }
.site-footer { min-height:100px; display:flex; align-items:center; justify-content:space-between; color:#aaa695; font-size:.8rem; }.site-footer a:not(.brand):hover { color:var(--sand); }
@keyframes nudge { 50% { transform:translateX(6px); } }
@media (max-width:760px) { .section-shell,.site-header { width:min(100% - 36px, 560px); }.site-header { min-height:70px; }.hero { min-height:auto; padding:110px 0 100px; }.data-panel { min-height:230px; padding:16px 12px 12px; }.data-rows { margin-top:18px; }.transform-arrow { font-size:1.45rem; }.services,.why { padding:78px 0; }.service-grid,.why-list { grid-template-columns:1fr; }.service-card { min-height:0; padding:27px 0; }.service-card:nth-child(3) { padding-left:0; border-left:0; border-top:1px solid var(--line); }.service-card-featured { display:block; }.service-card-featured .data-transform { margin-top:28px; }.service-mark { height:39px; }.why { padding-top:0; }.why-list { gap:30px; }.contact { padding:72px 0; }.contact-inner { grid-template-columns:1fr; gap:42px; }.site-footer { min-height:130px; flex-wrap:wrap; align-content:center; gap:13px 30px; } }
@media (max-width:390px) { h1 { font-size:2.7rem; }.data-transform { grid-template-columns:1fr; gap:8px; }.transform-arrow { transform:rotate(90deg); height:26px; }.data-panel { min-height:210px; }.messy-rows .data-row,.clean-rows .data-row { padding:5px 0; }.panel-note { padding-top:7px; }.data-rows { margin-top:12px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.button,.transform-arrow span { transition:none; animation:none; } }
