
:root { --ink:#2f312c; --muted:#6d7068; --paper:#f7f6f1; --warm:#eeece5; --line:#d8d5cc; --clay:#b25c4f; --sage:#7b8574; --dark:#2f312c; --dark-2:#20221f; --display:"Playfair Display", Georgia, serif; --body:"DM Sans", Arial, sans-serif; --mono:"DM Mono", monospace; --ease:cubic-bezier(.23,1,.32,1); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--body); font-size:16px; line-height:1.6; }
body, button, input, textarea { font-family:var(--body); }
a { color:inherit; text-decoration:none; }
button { border:0; }
.site-shell { overflow:hidden; }
.page-container { width:min(1180px, calc(100% - 80px)); margin:0 auto; }
.section-pad { padding:140px 0; }
.section-tint { background:#eeece5; }
.section-dark { background:var(--dark); color:#f4f1e9; }
.eyebrow { align-items:center; color:var(--muted); display:flex; font:500 11px/1 var(--mono); gap:13px; letter-spacing:.13em; margin:0 0 27px; text-transform:uppercase; }
.eyebrow > span:not(.section-index) { background:var(--clay); border-radius:50%; display:inline-block; height:7px; width:7px; }
.light-eyebrow { color:rgba(244,241,233,.68); }
.light-eyebrow > span:not(.section-index) { background:#d6a58f; }
.section-index { color:var(--clay); font-size:11px; margin-right:3px; }
.section-dark .section-index { color:#d6a58f; }
h1,h2,h3,p { margin-top:0; }
h1,h2 { font-family:var(--display); font-weight:500; letter-spacing:-.04em; }
h1 i,h2 i { font-weight:500; }
h2 { font-size:clamp(42px, 5vw, 72px); line-height:1.04; margin-bottom:29px; }
h3 { font-weight:600; }
.body-large { color:#575950; font-size:20px; line-height:1.6; max-width:620px; }
.button { align-items:center; display:inline-flex; font:500 11px/1 var(--mono); gap:18px; justify-content:center; letter-spacing:.08em; min-height:52px; padding:0 24px; text-transform:uppercase; transition:transform .18s var(--ease), background-color .18s var(--ease), color .18s var(--ease); }
.button:active { transform:scale(.97); }
.button-light { background:#f4f1e9; color:var(--ink); }
.button-light:hover { background:#fff; transform:translateY(-2px); }
.button-dark { background:var(--ink); color:#fff; }
.button-dark:hover { background:var(--clay); transform:translateY(-2px); }
.text-link { align-items:center; display:inline-flex; font:500 11px/1 var(--mono); gap:10px; letter-spacing:.08em; padding-bottom:8px; position:relative; text-transform:uppercase; }
.text-link::after { background:currentColor; bottom:0; content:""; height:1px; left:0; position:absolute; transform-origin:left; transition:transform .25s var(--ease); width:100%; }
.text-link:hover::after { transform:scaleX(.45); }
.dark-link { color:var(--ink); }
.light-link { color:#f4f1e9; }
.site-header { align-items:center; color:#f4f1e9; display:flex; height:88px; justify-content:space-between; left:0; padding:0 40px; position:absolute; right:0; top:0; transition:background-color .25s var(--ease), color .25s var(--ease), box-shadow .25s var(--ease); z-index:10; }
.site-header-scrolled { background:rgba(247,246,241,.96); box-shadow:0 1px 0 rgba(47,49,44,.1); color:var(--ink); position:fixed; }
.brand-lockup { align-items:center; display:flex; gap:12px; }
.brand-mark { display:flex; gap:3px; height:25px; transform:skew(-12deg); width:25px; }
.brand-mark span { background:currentColor; display:block; height:100%; width:10px; }
.brand-mark span:last-child { opacity:.5; transform:translateY(7px); }
.brand-wordmark { display:flex; flex-direction:column; font:500 10px/1 var(--mono); letter-spacing:.03em; text-transform:uppercase; }
.brand-wordmark strong { font-weight:500; }
.brand-wordmark em { color:var(--clay); font:italic 15px/1 var(--display); letter-spacing:0; margin-top:4px; text-transform:none; }
.desktop-nav { align-items:center; display:flex; gap:32px; }
.desktop-nav > a { font:500 10px/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; }
.desktop-nav > a:not(.nav-cta) { opacity:.8; transition:opacity .18s ease; }
.desktop-nav > a:not(.nav-cta):hover { opacity:1; }
.nav-cta { align-items:center; border:1px solid currentColor; display:flex; gap:12px; min-height:42px; padding:0 16px; transition:background-color .18s ease,color .18s ease; }
.nav-cta:hover { background:var(--ink); color:#fff; }
.site-header:not(.site-header-scrolled) .nav-cta:hover { background:#fff; color:var(--ink); }
.menu-toggle { background:none; color:inherit; display:none; padding:8px; }
.hero-section { color:#fff; min-height:780px; position:relative; }
.hero-image { background-image:url('../images/hero-wallpaper-living-room.jpg'); background-position:center; background-size:cover; inset:0; position:absolute; }
.hero-overlay { background:linear-gradient(90deg,rgba(19,20,17,.82) 0%,rgba(19,20,17,.45) 36%,rgba(19,20,17,.08) 75%),linear-gradient(0deg,rgba(19,20,17,.45),transparent 48%); inset:0; position:absolute; }
.hero-content { display:flex; flex-direction:column; justify-content:center; min-height:780px; padding-bottom:20px; position:relative; }
.hero-content h1 { font-size:clamp(64px, 8vw, 118px); line-height:.92; margin:0 0 36px; max-width:820px; }
.hero-content h1 i { color:#e2bba8; }
.hero-copy { color:rgba(255,255,255,.83); font-size:18px; line-height:1.6; max-width:460px; }
.hero-actions { align-items:center; display:flex; gap:28px; margin-top:17px; }
.hero-footnote { align-items:center; border-top:1px solid rgba(255,255,255,.24); bottom:34px; color:rgba(255,255,255,.7); display:flex; font:400 10px/1 var(--mono); justify-content:space-between; left:40px; letter-spacing:.09em; padding-top:16px; position:absolute; right:40px; text-transform:uppercase; }
.scroll-cue { align-items:center; display:flex; gap:7px; }
.intro-grid { display:grid; gap:50px; grid-template-columns:1fr 2.6fr 1.1fr; }
.intro-kicker { color:var(--muted); display:flex; flex-direction:column; font:500 11px/1.4 var(--mono); gap:18px; letter-spacing:.11em; text-transform:uppercase; }
.intro-kicker .section-index { font-size:12px; }
.intro-copy h2 { max-width:680px; }
.intro-copy .body-large { margin-bottom:36px; }
.intro-note { align-self:end; padding-bottom:8px; }
.note-line { background:var(--clay); display:block; height:1px; margin-bottom:21px; width:52px; }
.intro-note p { font:italic 20px/1.55 var(--display); max-width:230px; }
.note-signature { color:var(--muted); display:block; font:400 10px var(--mono); letter-spacing:.07em; margin-top:26px; text-transform:uppercase; }
.split-heading { align-items:end; display:flex; justify-content:space-between; margin-bottom:58px; }
.split-heading h2 { margin-bottom:0; }
.heading-aside { color:var(--muted); font-size:16px; line-height:1.55; margin:0 0 4px; max-width:285px; }
.light-copy { color:rgba(244,241,233,.62); }
.services-list { border-top:1px solid var(--line); }
.service-row { align-items:center; border-bottom:1px solid var(--line); display:grid; gap:20px; grid-template-columns:50px 50px 1.1fr 1.2fr 25px; min-height:112px; transition:background-color .2s ease,padding .2s var(--ease); }
.service-row:hover { background:rgba(255,255,255,.46); padding:0 16px; }
.service-number { color:var(--clay); font:400 11px var(--mono); }
.service-icon { align-items:center; border:1px solid rgba(47,49,44,.28); border-radius:50%; display:flex; height:42px; justify-content:center; transition:background-color .2s ease,color .2s ease; width:42px; }
.service-row:hover .service-icon { background:var(--ink); color:#fff; }
.service-row h3 { font-size:17px; margin:0; }
.service-row p { color:var(--muted); font-size:14px; line-height:1.5; margin:0; max-width:400px; }
.row-arrow { color:var(--clay); justify-self:end; transition:transform .2s var(--ease); }
.service-row:hover .row-arrow { transform:translate(3px,-3px); }
.quote-strip { background:#9e5549; color:#fff; }
.quote-strip-inner { align-items:center; display:flex; gap:24px; justify-content:space-between; min-height:112px; }
.quote-strip-inner p { font:italic 24px/1.2 var(--display); margin:0; }
.quote-strip-inner > svg { color:#e9c8b9; }
.about-grid { display:grid; gap:60px; grid-template-columns:1.25fr 1.55fr .8fr; }
.about-intro h2 { max-width:420px; }
.about-body > p:not(.body-large) { color:var(--muted); font-size:16px; line-height:1.7; max-width:510px; }
.about-body strong { color:var(--ink); font-weight:600; }
.about-signature { align-items:center; display:flex; font:500 12px/1.6 var(--mono); gap:18px; letter-spacing:.04em; margin-top:48px; text-transform:uppercase; }
.about-signature small { color:var(--muted); font-size:10px; font-weight:400; letter-spacing:.08em; }
.signature-line { background:var(--clay); display:block; height:1px; width:62px; }
.about-stats { align-self:end; border-top:1px solid var(--line); }
.about-stats div { border-bottom:1px solid var(--line); display:flex; gap:24px; padding:16px 0; }
.about-stats strong { color:var(--clay); font:400 11px var(--mono); }
.about-stats span { font:500 10px/1.4 var(--mono); letter-spacing:.07em; text-transform:uppercase; }
.portfolio-section { overflow:hidden; }
.portfolio-section .section-heading { margin-bottom:70px; }
.portfolio-grid { display:grid; gap:18px; grid-template-columns:repeat(12,1fr); }
.portfolio-item { margin:0; overflow:hidden; position:relative; }
.portfolio-tall { grid-column:span 4; min-height:520px; }
.portfolio-wide { grid-column:span 8; min-height:380px; }
.portfolio-detail { grid-column:span 4; min-height:380px; }
.portfolio-item img { height:100%; inset:0; object-fit:cover; position:absolute; transform:scale(1.01); transition:transform .7s var(--ease); width:100%; }
.portfolio-item:hover img { transform:scale(1.055); }
.portfolio-item::after { background:linear-gradient(0deg,rgba(22,24,21,.84),transparent 55%); content:""; inset:0; opacity:.9; position:absolute; pointer-events:none; }
.portfolio-item figcaption { bottom:25px; color:#fff; display:grid; gap:3px; left:25px; position:absolute; right:25px; z-index:1; }
.portfolio-item figcaption span { color:rgba(255,255,255,.66); font:400 10px var(--mono); letter-spacing:.1em; text-transform:uppercase; }
.portfolio-item figcaption strong { font:500 28px/1.1 var(--display); }
.portfolio-item figcaption svg { position:absolute; right:0; top:8px; }
.why-section { background:var(--paper); }
.reasons-grid { display:grid; gap:0 22px; grid-template-columns:repeat(3,1fr); margin-top:68px; }
.reason-card { border-top:1px solid var(--line); min-height:205px; padding:28px 0 30px; }
.reason-card > svg { color:var(--clay); margin-bottom:23px; }
.reason-card h3 { font-size:17px; margin-bottom:8px; }
.reason-card p { color:var(--muted); font-size:14px; line-height:1.55; margin:0; max-width:250px; }
.process-block { border-top:1px solid var(--ink); display:grid; gap:30px; grid-template-columns:1fr 2.6fr; margin-top:72px; padding-top:28px; }
.process-label { display:flex; flex-direction:column; font:500 11px/1.5 var(--mono); letter-spacing:.1em; text-transform:uppercase; }
.process-label span:last-child { color:var(--clay); }
.process-list { display:grid; gap:30px; grid-template-columns:repeat(3,1fr); }
.process-step { display:flex; gap:15px; }
.process-step > span { color:var(--clay); font:400 11px var(--mono); }
.process-step h3 { font-size:15px; margin-bottom:8px; }
.process-step p { color:var(--muted); font-size:13px; line-height:1.55; margin:0; }
.contact-grid { display:grid; gap:100px; grid-template-columns:1fr 1.2fr; }
.contact-intro h2 { max-width:480px; }
.contact-direct { border-top:1px solid var(--line); margin-top:48px; max-width:510px; }
.contact-direct a { align-items:center; border-bottom:1px solid var(--line); display:flex; gap:15px; padding:18px 0; }
.direct-icon { align-items:center; border:1px solid var(--line); border-radius:50%; display:flex; height:38px; justify-content:center; width:38px; }
.contact-direct small,.contact-direct strong { display:block; }
.contact-direct small { color:var(--muted); font:400 10px var(--mono); letter-spacing:.07em; margin-bottom:4px; text-transform:uppercase; }
.contact-direct strong { font:500 14px var(--mono); letter-spacing:.03em; }
.contact-form-wrap { background:#f8f7f2; box-shadow:0 18px 55px rgba(47,49,44,.08); padding:42px; }
.contact-form { display:flex; flex-direction:column; gap:24px; }
.form-row { display:grid; gap:22px; grid-template-columns:1fr 1fr; }
.field { position:relative; }
.field label { color:var(--muted); display:block; font:500 10px var(--mono); letter-spacing:.1em; margin-bottom:9px; text-transform:uppercase; }
.field label span { color:var(--clay); }
.field input,.field textarea { background:transparent; border:0; border-bottom:1px solid #c9c6bc; border-radius:0; color:var(--ink); font:400 16px/1.5 var(--body); outline:none; padding:10px 0; resize:vertical; transition:border-color .18s ease; width:100%; }
.field input::placeholder,.field textarea::placeholder { color:#9b9d95; }
.field input:focus,.field textarea:focus { border-color:var(--ink); }
.error-message { color:var(--clay); font-size:12px; margin-top:5px; }
.form-submit { align-self:flex-start; margin-top:8px; }
.form-success { align-items:center; background:#e0e9dc; color:#41523d; display:none; font-size:14px; gap:8px; padding:14px; }
.form-note { color:var(--muted); font-size:11px; line-height:1.45; margin:0; }
.map-section { background:#dbd7cd; display:grid; grid-template-columns:1fr 1fr; }
.map-copy { align-self:center; padding-bottom:110px; padding-top:110px; }
.map-copy h2 { font-size:clamp(42px,4vw,62px); max-width:510px; }
.map-copy > p:not(.eyebrow) { color:#60645c; font-size:16px; line-height:1.6; margin-bottom:30px; max-width:420px; }
.map-frame { min-height:540px; }
.map-frame iframe { border:0; display:block; filter:grayscale(1) contrast(.88) sepia(.12); height:100%; min-height:540px; width:100%; }
.final-cta { padding:125px 0 135px; text-align:center; }
.final-cta-inner { align-items:center; display:flex; flex-direction:column; }
.final-cta h2 { color:#f4f1e9; font-size:clamp(46px,6vw,86px); margin-bottom:40px; }
.final-cta h2 i { color:#d6a58f; }
.site-footer { padding:74px 0 27px; }
.footer-grid { display:grid; gap:60px; grid-template-columns:2fr 1fr 1fr; padding-bottom:85px; }
.footer-brand { margin-bottom:25px; }
.footer-statement { color:rgba(244,241,233,.56); font-size:14px; line-height:1.6; max-width:315px; }
.footer-column { display:flex; flex-direction:column; gap:11px; }
.footer-column a,.footer-column span:not(.footer-label) { color:rgba(244,241,233,.7); font-size:13px; line-height:1.45; }
.footer-column a:hover,.footer-bottom a:hover { color:#fff; }
.footer-label { color:#d6a58f; font:500 10px var(--mono); letter-spacing:.12em; margin-bottom:9px; text-transform:uppercase; }
.footer-bottom { border-top:1px solid rgba(244,241,233,.16); color:rgba(244,241,233,.45); display:flex; font:400 10px var(--mono); justify-content:space-between; letter-spacing:.06em; padding-top:22px; text-transform:uppercase; }
.footer-bottom a { align-items:center; color:rgba(244,241,233,.72); display:flex; gap:7px; }
.mobile-call { background:var(--clay); bottom:16px; color:#fff; display:none; font:500 11px var(--mono); gap:8px; left:16px; letter-spacing:.08em; padding:14px 18px; position:fixed; text-transform:uppercase; z-index:20; }
.reveal { opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-visible { opacity:1; transform:none; }
.reveal-delay-1 { transition-delay:.08s; }
.reveal-delay-2 { transition-delay:.16s; }
.reveal-delay-3 { transition-delay:.24s; }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .reveal { opacity:1; transform:none; transition:none; } * { transition-duration:0s !important; } }
@media (max-width: 900px) {
  .page-container { width:min(100% - 44px, 680px); }
  .site-header { height:76px; padding:0 22px; }
  .menu-toggle { display:block; }
  .desktop-nav { align-items:flex-start; background:var(--paper); box-shadow:0 16px 32px rgba(20,20,15,.1); color:var(--ink); display:none; flex-direction:column; gap:0; left:0; padding:20px 22px 28px; position:absolute; right:0; top:76px; }
  .desktop-nav.mobile-nav-open { display:flex; }
  .desktop-nav > a { padding:14px 0; width:100%; }
  .desktop-nav > a:not(.nav-cta) { border-bottom:1px solid var(--line); opacity:1; }
  .nav-cta { justify-content:space-between; margin-top:12px; }
  .hero-section,.hero-content { min-height:720px; }
  .hero-content h1 { font-size:clamp(58px,13vw,96px); }
  .hero-footnote { bottom:24px; left:22px; right:22px; }
  .scroll-cue { display:none; }
  .section-pad { padding:95px 0; }
  .intro-grid,.about-grid,.contact-grid { gap:42px; grid-template-columns:1fr; }
  .intro-kicker { flex-direction:row; gap:14px; }
  .intro-note { justify-self:end; }
  .about-stats { display:grid; grid-template-columns:repeat(3,1fr); }
  .about-stats div { flex-direction:column; gap:10px; }
  .split-heading { align-items:start; flex-direction:column; gap:20px; }
  .service-row { gap:15px; grid-template-columns:35px 43px 1fr 20px; padding:19px 0; }
  .service-row p { grid-column:3 / -1; }
  .service-row h3 { font-size:16px; }
  .service-row:hover { padding:19px 0; }
  .quote-strip-inner { align-items:flex-start; flex-direction:column; gap:18px; padding-bottom:28px; padding-top:28px; }
  .portfolio-tall,.portfolio-wide,.portfolio-detail { grid-column:span 6; min-height:340px; }
  .portfolio-item:nth-child(2),.portfolio-item:nth-child(4) { grid-column:span 6; }
  .reasons-grid { grid-template-columns:repeat(2,1fr); margin-top:45px; }
  .process-block { grid-template-columns:1fr; }
  .process-list { grid-template-columns:1fr; }
  .contact-grid { gap:58px; }
  .map-section { grid-template-columns:1fr; }
  .map-copy { padding-bottom:70px; padding-top:85px; }
  .map-frame,.map-frame iframe { min-height:360px; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .footer-grid > div:first-child { grid-column:1 / -1; }
}
@media (max-width: 560px) {
  .page-container { width:calc(100% - 36px); }
  .hero-copy { font-size:16px; max-width:360px; }
  .hero-actions { align-items:flex-start; flex-direction:column; gap:22px; }
  .hero-footnote { font-size:8px; }
  h2 { font-size:42px; }
  .body-large { font-size:18px; }
  .service-row { grid-template-columns:29px 38px 1fr 18px; }
  .service-icon { height:36px; width:36px; }
  .service-row h3 { font-size:15px; }
  .service-row p { font-size:13px; }
  .portfolio-tall,.portfolio-wide,.portfolio-detail,.portfolio-item:nth-child(2),.portfolio-item:nth-child(4) { grid-column:span 12; min-height:330px; }
  .portfolio-item figcaption strong { font-size:25px; }
  .reasons-grid { grid-template-columns:1fr; }
  .reason-card { min-height:0; }
  .form-row { grid-template-columns:1fr; }
  .contact-form-wrap { padding:26px 20px; }
  .contact-direct strong { font-size:12px; }
  .footer-grid { gap:38px 25px; grid-template-columns:1fr; }
  .footer-grid > div:first-child { grid-column:auto; }
  .footer-bottom { align-items:flex-start; flex-direction:column; gap:12px; }
  .mobile-call { display:flex; }
}
