:root { --ink:#25231f; --cream:#f4f0e8; --peach:#edb19b; --lime:#dce8b2; --muted:#77736b; --line:#d7d0c3; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--cream); color:var(--ink); font-family:'DM Sans',sans-serif; line-height:1.5; }
a { color:inherit; text-decoration:none; }
.site-header { width:min(1180px,calc(100% - 64px)); margin:auto; padding:28px 0; display:flex; justify-content:space-between; align-items:center; }
.brand { font-weight:700; font-size:1.5rem; letter-spacing:-.08em; }.brand span { color:#c76b4d; }
.site-nav { display:flex; align-items:center; gap:34px; font-size:.82rem; }.site-nav a { transition:opacity .2s; }.site-nav a:hover { opacity:.55; }.nav-contact { border-bottom:1px solid var(--ink); padding-bottom:4px; }.nav-contact span { margin-left:8px; }
.menu-toggle { display:none; background:none; border:0; font:inherit; }
.section-shell { width:min(1180px,calc(100% - 64px)); margin:auto; }.hero { min-height:650px; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:40px; padding:74px 0 110px; }.eyebrow { text-transform:uppercase; letter-spacing:.13em; font-size:.68rem; color:var(--muted); margin:0 0 24px; }.hero h1, h2 { font-size:clamp(3rem,6.4vw,6.2rem); line-height:.98; letter-spacing:-.07em; margin:0; font-weight:500; }.hero h1 em,h2 em { font-family:'Playfair Display',serif; font-weight:500; }.hero-intro { max-width:430px; margin:32px 0; color:#5f5b54; font-size:1.02rem; }.hero-actions { display:flex; gap:26px; align-items:center; }.button { display:inline-flex; gap:22px; align-items:center; padding:15px 20px; font-size:.76rem; }.button-dark { color:var(--cream); background:var(--ink); }.button span { font-size:1.1rem; }.text-link { font-size:.76rem; border-bottom:1px solid var(--ink); padding-bottom:5px; }.text-link span { margin-left:9px; }
.hero-art { position:relative; height:420px; background:var(--peach); overflow:hidden; }.hero-photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 26%; display:block; }.sun { width:310px; height:310px; background:#f8d8b8; border-radius:50%; position:absolute; top:-90px; right:-30px; z-index:1; opacity:.18; }.portrait-card { display:none; }.art-note { position:absolute; left:24px; bottom:22px; z-index:2; color:#fff; font-size:.68rem; text-transform:uppercase; letter-spacing:.1em; text-shadow:0 1px 8px rgba(0,0,0,.72); }.art-stamp { position:absolute; right:28px; bottom:24px; z-index:2; color:#fff; text-align:center; font-size:1.5rem; text-shadow:0 1px 8px rgba(0,0,0,.72); }.art-stamp small { font:600 .48rem/1.2 'DM Sans',sans-serif; letter-spacing:.1em; }
.section-rule { border-top:1px solid var(--line); padding:100px 0; }.about-grid { display:grid; grid-template-columns:1.1fr .8fr; gap:15%; }.about h2 { font-size:clamp(2.5rem,4vw,4.6rem); }.about-copy { padding-top:10px; color:#615d55; }.about-copy p { margin:0 0 20px; }.about-copy .text-link { display:inline-block; margin-top:20px; color:var(--ink); }
.capabilities .section-heading { margin-bottom:35px; }.capabilities h2 { font-size:clamp(2.5rem,4vw,4.5rem); }.capability-list { border-top:1px solid var(--line); }.capability-item { display:grid; grid-template-columns:70px 1fr; gap:24px; padding:22px 0; border-bottom:1px solid var(--line); }.capability-item > span { color:var(--muted); font-size:.7rem; padding-top:3px; }.capability-item h3 { margin:0 0 7px; font-size:1.05rem; }.capability-item p { margin:0; max-width:650px; color:var(--muted); font-size:.8rem; }
.credentials .section-heading { margin-bottom:35px; }.credentials h2 { font-size:clamp(2.5rem,4vw,4.5rem); }.credential-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.credential-card { min-height:130px; border:1px solid var(--line); padding:18px; display:flex; gap:16px; align-items:center; background:rgba(255,255,255,.16); }.credential-logo { width:44px; height:44px; flex:0 0 44px; object-fit:contain; }.credential-card h3 { margin:0 0 6px; font-size:.9rem; line-height:1.2; }.credential-card p { margin:0; color:var(--muted); font-size:.68rem; }.company-logo { width:38px; height:27px; object-fit:contain; vertical-align:middle; margin-right:10px; }
.section-heading { display:flex; justify-content:space-between; align-items:end; margin-bottom:44px; }.section-heading h2 { font-size:clamp(2.5rem,4vw,4.5rem); }.project-count { color:var(--muted); font-size:.75rem; }.project-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }.project-visual { height:280px; position:relative; overflow:hidden; padding:18px; }.project-visual > span { position:relative; z-index:2; font-size:.7rem; }.visual-one { background:var(--lime); }.visual-two { background:#d8d0c3; }.visual-three { background:#bdd4d4; }.visual-shape { width:180px; height:180px; border-radius:50%; background:#c68163; position:absolute; bottom:-30px; right:22%; }.visual-shape:after { content:''; display:block; width:80px; height:80px; background:#5a7567; border-radius:50%; position:absolute; top:30px; left:-45px; }.visual-lines { position:absolute; inset:40px 30px; border:1px solid var(--ink); transform:rotate(15deg); }.visual-lines:before,.visual-lines:after { content:''; position:absolute; inset:35px; border:1px solid var(--ink); }.visual-lines:after { inset:70px; }.visual-orbit { position:absolute; width:240px; height:100px; border:18px solid #e59e77; border-radius:50%; transform:rotate(-35deg); top:85px; left:10%; }.project-meta { display:flex; justify-content:space-between; align-items:start; padding-top:18px; }.project-type { margin:0 0 8px; color:var(--muted); text-transform:uppercase; letter-spacing:.1em; font-size:.62rem; }.project h3 { margin:0; font-size:1.05rem; font-weight:600; }.circle-arrow { border:1px solid var(--ink); border-radius:50%; height:29px; width:29px; display:grid; place-items:center; font-size:.9rem; }.project-description { color:var(--muted); font-size:.78rem; margin-top:14px; }
.experience { display:grid; grid-template-columns:.58fr 1.42fr; gap:8%; }.experience h2 { font-size:clamp(2.5rem,4vw,4.5rem); }.timeline-item { display:grid; grid-template-columns:120px 1fr; gap:24px; padding:24px 0; border-bottom:1px solid var(--line); }.timeline-item:first-child { border-top:1px solid var(--line); }.timeline-item > span { color:var(--muted); font-size:.72rem; }.timeline-item h3 { font-size:1rem; margin:0 0 7px; }.timeline-item p { color:var(--muted); font-size:.8rem; margin:0; }
.contact { text-align:center; padding:130px 0; }.contact h2 { font-size:clamp(3.5rem,7vw,7rem); }.contact-email { display:inline-block; margin-top:38px; border-bottom:1px solid var(--ink); padding-bottom:8px; font-size:1rem; }.contact-email span { margin-left:12px; }.site-footer { border-top:1px solid var(--line); padding:24px 0 32px; display:flex; justify-content:space-between; color:var(--muted); font-size:.7rem; }.site-footer div { display:flex; gap:24px; }.site-footer a:hover { color:var(--ink); }
@media (max-width:760px) { .site-header,.section-shell { width:min(100% - 36px,540px); }.site-header { padding:20px 0; }.menu-toggle { display:block; cursor:pointer; font-size:.78rem; }.site-nav { display:none; position:absolute; z-index:5; top:65px; left:18px; right:18px; background:var(--cream); border:1px solid var(--line); padding:20px; flex-direction:column; align-items:flex-start; gap:18px; }.site-nav.open { display:flex; }.hero { display:block; padding:55px 0 70px; }.hero h1 { font-size:3.8rem; }.hero-art { margin-top:55px; height:350px; }.section-rule { padding:70px 0; }.about-grid,.experience { grid-template-columns:1fr; gap:35px; }.about h2,.experience h2 { font-size:3rem; }.capability-item { grid-template-columns:42px 1fr; gap:14px; }.credential-grid { grid-template-columns:1fr; }.project-grid { grid-template-columns:1fr; }.project-visual { height:250px; }.section-heading { align-items:start; }.section-heading h2 { font-size:3rem; }.project-count { display:none; }.contact { padding:90px 0; }.contact h2 { font-size:3.6rem; }.site-footer { display:block; }.site-footer div { margin-top:15px; flex-wrap:wrap; gap:15px; } }