:root{--bg:#f6f3ee;--alt:#ece7df;--ink:#2b2a28;--muted:#6b6660;--accent:#8a7a66;--dark:#23211f;--line:#d9d2c7;--cream:#f1ede6;--max:1120px;--ease:cubic-bezier(.2,.7,.2,1)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;overflow-x:hidden}
h1,h2,h3,.logo,.num{font-family:Georgia,"Times New Roman",serif;font-weight:400;line-height:1.15;margin:0 0 .6em}
h1{font-size:clamp(2.1rem,6vw,3.6rem)}
h2{font-size:clamp(1.6rem,4vw,2.4rem)}
h3{font-size:1.15rem}
p{margin:0 0 1em}
a{color:var(--ink);text-decoration-color:var(--accent);text-underline-offset:3px}
a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-999px;top:0;background:var(--dark);color:#fff;padding:10px 14px;z-index:40}
.skip:focus{left:0}
/* progress bar */
.progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:30;pointer-events:none}
.progress i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),#c9bfae);transform-origin:0 50%;transform:scaleX(var(--p,0))}
/* header */
.site-header{background:rgba(246,243,238,.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;transition:box-shadow .3s}
.site-header.scrolled{box-shadow:0 8px 24px rgba(35,33,31,.09)}
.bar{display:flex;align-items:center;justify-content:space-between;min-height:72px;padding-top:6px;padding-bottom:6px;gap:12px;transition:min-height .3s var(--ease)}
.scrolled .bar{min-height:54px}
.logo{display:flex;align-items:center;gap:12px;font-size:1.1rem;letter-spacing:.14em;text-decoration:none;margin:0;color:var(--ink)}
.logo img{height:56px;width:auto;mix-blend-mode:multiply;display:block;transition:height .3s var(--ease)}
.scrolled .logo img{height:40px}
.logo .wordmark span{color:var(--accent)}
.nav{display:flex;gap:22px;align-items:center}
.nav a:not(.btn){text-decoration:none;font-size:.95rem;padding:6px 0;position:relative}
.nav a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:0 50%;transition:transform .35s var(--ease)}
.nav a:not(.btn):hover::after,.nav a[aria-current=page]::after{transform:scaleX(1)}
.nav a.btn{border:0;padding:8px 16px}
.menu-btn{display:none;background:none;border:1px solid var(--ink);padding:8px 14px;font:inherit;font-size:.9rem;color:var(--ink);border-radius:2px;cursor:pointer}
/* buttons */
.btn{position:relative;overflow:hidden;display:inline-block;background:var(--dark);color:#fff;text-decoration:none;padding:13px 26px;border:1px solid var(--dark);border-radius:2px;font-size:.95rem;letter-spacing:.02em;transition:transform .25s var(--ease),background .25s,color .25s,box-shadow .25s}
.btn:hover{background:#000;transform:translateY(-3px);box-shadow:0 10px 20px rgba(0,0,0,.2)}
.btn:active{transform:translateY(0)}
.btn::after{content:"";position:absolute;top:0;bottom:0;left:-70%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);transition:left .7s var(--ease);pointer-events:none}
.btn:hover::after{left:130%}
.btn-ghost{background:transparent;color:var(--ink)}
.btn-ghost:hover{background:var(--dark);color:#fff}
.btn-ghost::after{display:none}
.btn-sm{font-size:.85rem}
.ripple{position:absolute;border-radius:50%;background:currentColor;opacity:.28;width:14px;height:14px;margin:-7px 0 0 -7px;transform:scale(0);animation:rip .65s ease-out forwards;pointer-events:none}
@keyframes rip{to{transform:scale(22);opacity:0}}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:1.6em}
/* dark blueprint areas: drifting grid + glow */
.on-dark{background-color:var(--dark);color:var(--cream);position:relative;overflow:hidden;isolation:isolate}
.on-dark::before{content:"";position:absolute;inset:-64px;z-index:1;pointer-events:none;
 background-image:linear-gradient(rgba(241,237,230,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(241,237,230,.07) 1px,transparent 1px),linear-gradient(rgba(241,237,230,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(241,237,230,.035) 1px,transparent 1px);
 background-size:160px 160px,160px 160px,32px 32px,32px 32px;animation:gridmove 24s linear infinite}
@keyframes gridmove{to{transform:translate3d(160px,160px,0)}}
.on-dark::after{content:"";position:absolute;inset:-20%;z-index:1;background:radial-gradient(ellipse at 20% 10%,rgba(138,122,102,.32),transparent 55%),radial-gradient(ellipse at 85% 90%,rgba(201,191,174,.14),transparent 50%);pointer-events:none;animation:glow 16s ease-in-out infinite alternate}
@keyframes glow{from{transform:translate3d(-3%,-2%,0) scale(1)}to{transform:translate3d(4%,3%,0) scale(1.12)}}
.on-dark>.wrap{position:relative;z-index:2}
.on-dark a{color:var(--cream)}
.on-dark .lead{color:#d8d0c2}
.on-dark .btn{background:var(--cream);color:var(--dark);border-color:var(--cream)}
.on-dark .btn:hover{background:#fff}
.on-dark .btn-ghost{background:transparent;color:var(--cream)}
.on-dark .btn-ghost:hover{background:var(--cream);color:var(--dark)}
.on-dark.off *,.on-dark.off::before,.on-dark.off::after{animation-play-state:paused!important}
/* hero background slot (photos / video / animated fallback scene) */
.hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-bg .slides,.hero-bg .bg-video,.hero-bg .hero-scene{position:absolute;inset:0;width:100%;height:100%}
.hero-bg .bg-video{object-fit:cover;opacity:0;transition:opacity 1.4s ease}
.hero-bg.video-on .bg-video{opacity:1}
.hero-bg.video-on .slides{opacity:0;transition:opacity 1.4s}
.slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transform-origin:var(--o,50% 50%);transition:opacity 1.8s ease;will-change:opacity,transform}
.slide.on,.slide.out{animation:kb 16s ease-out forwards}
.slide.on{opacity:1}
@keyframes kb{from{transform:scale(1.02) translate3d(0,0,0)}to{transform:scale(1.16) translate3d(var(--tx,-2%),var(--ty,-1.5%),0)}}
.hero-bg.has-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(35,33,31,.86),rgba(35,33,31,.5) 60%,rgba(35,33,31,.4)),linear-gradient(180deg,rgba(35,33,31,.2),rgba(35,33,31,.6))}
.hero-bg.has-media .hero-scene{opacity:0;visibility:hidden;transition:opacity 1.2s,visibility 0s 1.2s}
/* fallback scene: drifting skyline layers + scanning beam */
.hero-scene{overflow:hidden}
.sky{position:absolute;left:0;bottom:0;width:calc(100% + var(--tile));height:var(--h);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 200' preserveAspectRatio='none'%3E%3Cpath fill='%23f1ede6' fill-opacity='.045' d='M0 200V120H40V90H70V130H100V60H132V100H160V140H200V80H228V50H250V110H290V150H330V100H360V70H400V120H430V40H455V90H490V130H520V95H560V120H600V200z'/%3E%3Cpath fill='none' stroke='%23c9bfae' stroke-opacity='.4' stroke-width='1.2' vector-effect='non-scaling-stroke' d='M0 120H40V90H70V130H100V60H132V100H160V140H200V80H228V50H250V110H290V150H330V100H360V70H400V120H430V40H455V90H490V130H520V95H560V120H600'/%3E%3C/svg%3E") repeat-x 0 100%/var(--tile) 100%;animation:drift var(--spd) linear infinite;will-change:transform}
.sky.s1{--tile:620px;--h:170px;--spd:70s}
.sky.s2{--tile:940px;--h:230px;--spd:120s;opacity:.55}
.sky.s3{--tile:1400px;--h:300px;--spd:190s;opacity:.3}
@keyframes drift{to{transform:translate3d(calc(var(--tile)*-1),0,0)}}
.beam{position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(201,191,174,.55),transparent);animation:beam 9s ease-in-out infinite}
@keyframes beam{0%{transform:translateY(0);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translateY(560px);opacity:0}}
/* hero */
.hero{padding:84px 0 110px}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center}
.hero h1{font-size:clamp(2.4rem,6.4vw,4.6rem);letter-spacing:-.01em;max-width:13em}
.hero h1 em{font-style:normal;color:#c9bfae}
.hero-art-wrap{transform:translate3d(calc(var(--mx,0)*-14px),calc(var(--my,0)*-10px + var(--sy,0)*.08px),0);transition:transform .35s ease-out}
.hero-grid>div:first-child{translate:0 calc(var(--sy,0)*-.05px)}
.hero-art{display:block;width:100%;height:auto;color:#c9bfae;max-height:440px}
.draw{stroke-dasharray:1;stroke-dashoffset:1;animation:drawloop 14s ease-in-out infinite}
.draw:nth-of-type(2){animation-delay:.2s}.draw:nth-of-type(3){animation-delay:.4s}.draw:nth-of-type(4){animation-delay:.6s}.draw:nth-of-type(5){animation-delay:.8s}.draw:nth-of-type(6){animation-delay:1s}.draw:nth-of-type(7){animation-delay:1.2s}.draw:nth-of-type(8){animation-delay:1.4s}.draw:nth-of-type(9){animation-delay:1.6s}
@keyframes drawloop{0%{stroke-dashoffset:1}22%{stroke-dashoffset:0}80%{stroke-dashoffset:0}100%{stroke-dashoffset:-1}}
.lite{opacity:0;animation:lite 7s ease-in-out infinite;animation-delay:3s}.lite.l2{animation-delay:4.2s}.lite.l3{animation-delay:5.1s}.lite.l4{animation-delay:3.6s}
@keyframes lite{0%,100%{opacity:0}50%{opacity:.22}}
.scan{animation:scan 8s ease-in-out infinite alternate}
@keyframes scan{from{transform:translateX(20px)}to{transform:translateX(540px)}}
.shapes{position:absolute;inset:0;z-index:1;pointer-events:none}
.sh{position:absolute;display:block;transform:translate3d(calc(var(--mx,0)*var(--k)*1px),calc(var(--my,0)*var(--k)*1px - var(--sy,0)*var(--s)*1px),0);transition:transform .45s ease-out}
.sh svg{display:block;width:var(--w,40px);height:auto;fill:none;stroke:rgba(201,191,174,.45);stroke-width:1.2;animation:fl var(--dur,10s) ease-in-out infinite alternate}
@keyframes fl{from{transform:translateY(0) rotate(0)}to{transform:translateY(-26px) rotate(var(--rot,25deg))}}
.shapes-sm .sh svg{stroke:rgba(201,191,174,.3)}
/* entrance (CSS only, always ends visible) */
@keyframes fadeup{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}
.hero .eyebrow,.page-head .eyebrow{animation:fadeup .9s var(--ease) .1s backwards}
.hero .lead{animation:fadeup 1s var(--ease) .95s backwards}
.hero .actions{animation:fadeup 1s var(--ease) 1.15s backwards}
.page-head .lead{animation:fadeup 1s var(--ease) .7s backwards}
main{animation:pagein .6s var(--ease) backwards}
@keyframes pagein{from{opacity:0}}
body.leaving main{opacity:0;transition:opacity .25s ease}
/* word-by-word headline */
.js .sw{opacity:0;animation:rvfail .01s 3.5s forwards}
.js.ready .sw{animation:none}
.js .sw.words-ready{opacity:1}
.w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em}
.w>i{display:inline-block;font-style:normal}
.js .w>i{translate:0 110%;transition:translate .9s var(--ease) calc(var(--i,0)*70ms + .15s)}
.js .words-in .js .w>i{translate:0 0}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.78rem;color:var(--accent);margin-bottom:1.2em;display:flex;align-items:center;gap:12px}
.eyebrow::before{content:"";width:36px;height:1px;background:currentColor;flex:none}
.on-dark .eyebrow{color:#c9bfae}
.lead{font-size:1.2rem;max-width:36em;color:#45423e}
/* stats */
.stats{background:var(--bg);border-bottom:1px solid var(--line)}
.stats .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.stat{padding:30px 20px;border-left:1px solid var(--line)}
.stat:first-child{border-left:0;padding-left:0}
.num{display:block;font-size:clamp(2.2rem,5vw,3.2rem);line-height:1;color:var(--ink);margin:0 0 .3em}
.num small{font-size:.5em;color:var(--accent)}
.stat span.lbl{font-size:.85rem;color:var(--muted);text-transform:uppercase;letter-spacing:.1em}
/* marquee */
.marquee{background:var(--dark);color:var(--cream);overflow:hidden;border-bottom:1px solid #3a3733}
.marquee .track{display:flex;width:max-content;animation:marq 70s linear infinite}
.marquee:hover .track{animation-play-state:paused}
.marquee ul{display:flex;list-style:none;margin:0;padding:0}
.marquee li{padding:16px 0 16px 28px;font:400 1.05rem Georgia,serif;white-space:nowrap;display:flex;align-items:center}
.marquee li::after{content:"";width:7px;height:7px;background:var(--accent);transform:rotate(45deg);margin-left:28px;flex:none}
@keyframes marq{to{transform:translate3d(-50%,0,0)}}
/* sections */
.section{padding:72px 0;position:relative}
.alt{background:var(--alt)}
.alt::before{content:"";position:absolute;left:0;right:0;top:-39px;height:40px;pointer-events:none;
 background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='40' viewBox='0 0 600 40'%3E%3Cpath fill='%23ece7df' d='M0 40V28h20V18h14v10h16V10h18v30h20V22h24v8h14V14h10V6h14v34h22V24h18v8h24V16h20v10h18V8h16v32h28V20h20v10h22V12h14v28h24V26h20V18h16v22h20V30h24V22h18v18z'/%3E%3C/svg%3E") repeat-x 0 100%/600px 40px,
 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='40' viewBox='0 0 600 40'%3E%3Cpath fill='%23ddd6ca' d='M0 40V30h40V22h30v8h30V16h28v24h40V26h30V12h24v28h60V20h30V30h50V18h26v22h40V24h36V32h52V14h30V28h28v12z'/%3E%3C/svg%3E") repeat-x 0 100%/600px 40px;
 animation:skydrift 60s linear infinite}
@keyframes skydrift{to{background-position:600px 100%,-600px 100%}}
.section h2::after{content:"";display:block;width:64px;height:2px;background:var(--accent);margin-top:.5em}
.js .section h2::after{width:0;transition:width 1s var(--ease) .35s}
.js .section h2.in::after{width:64px}
.js:not(.ready) .section h2::after{animation:ulfail .01s 3.5s forwards}
@keyframes ulfail{to{width:64px}}
.cta h2::after,.page-head h1::after{display:none}
.sub{color:var(--muted);margin-bottom:1.8em}
.muted{color:var(--muted)}
.page-head{padding:72px 0 64px}
.page-head h1{max-width:16em}
.split{display:grid;gap:44px;grid-template-columns:1fr 1fr;align-items:center}
.more{font-weight:600}
/* cards */
.cards{list-style:none;margin:0 0 1.5em;padding:0;display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.card{background:#faf8f4;border:1px solid var(--line);padding:26px;position:relative}
.card p{margin:0;color:#55514c;font-size:.97rem}
.card h3{margin-bottom:.5em}
.card:hover,.cat-tile:hover,.quotes figure:hover{transform:perspective(900px) translateY(-6px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))}
.card:hover{box-shadow:0 18px 34px rgba(35,33,31,.14);border-color:var(--accent)}
.ico{width:56px;height:56px;border:1px solid var(--line);display:grid;place-items:center;margin-bottom:18px;color:var(--dark);background:var(--bg);transition:background .3s,color .3s,border-color .3s}
.ico svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:square;stroke-linejoin:miter}
.card:hover .ico,.svc:hover .ico{background:var(--dark);color:var(--cream);border-color:var(--dark)}
.js .ico svg *{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.3s ease-out calc(var(--d,0s) + .35s)}
.js .rv.in .ico svg *{stroke-dashoffset:0}
.js:not(.ready) .ico svg *{animation:icofail .01s 3.5s forwards}
.js .rv.in:hover .ico svg *{animation:redraw .9s ease-out}
@keyframes icofail{to{stroke-dashoffset:0}}
@keyframes redraw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
.cards-3{counter-reset:w;grid-template-columns:repeat(3,minmax(0,1fr))}
.cards-3 .card{counter-increment:w}
.cards-3 .card::before{content:"0" counter(w);display:block;font:400 2.2rem/1 Georgia,serif;color:var(--accent);opacity:.5;margin-bottom:.45em;transition:opacity .3s,transform .3s}
.cards-3 .card:hover::before{opacity:1;transform:translateX(4px)}
@media(max-width:1000px){.cards-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.cards-3{grid-template-columns:1fr}}
.quotes{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin-bottom:1.4em}
.quotes figure{margin:0;background:#faf8f4;border-left:3px solid var(--accent);padding:30px 28px 22px;position:relative}
.quotes figure:hover{box-shadow:0 16px 30px rgba(35,33,31,.12)}
.quotes figure{padding-top:56px}
.quotes figure::before{content:"“";position:absolute;left:24px;top:6px;font:400 4.2rem/1 Georgia,serif;color:var(--accent);opacity:.45;pointer-events:none}
blockquote{margin:0;font-family:Georgia,serif;font-size:1.25rem;line-height:1.45}
blockquote p{margin:0}
figcaption{margin-top:.9em;font-size:.85rem;color:var(--muted)}
.cta{padding:84px 0;text-align:center}
.cta .actions{justify-content:center}
.cta h2{font-size:clamp(1.8rem,5vw,2.8rem)}
/* services page */
.svc-list{display:grid;gap:0}
.svc{padding:30px 0;border-top:1px solid var(--line);display:grid;grid-template-columns:56px 1fr;gap:6px 24px;align-items:start}
.svc .ico{margin:0;grid-row:span 2}
.svc h2{font-size:1.45rem;margin-bottom:.3em}
.svc h2::after{display:none}
.svc p{margin:0;max-width:44em;color:#45423e}
.steps{list-style:none;counter-reset:s;margin:0;padding:0;display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.steps li{counter-increment:s;padding-top:16px;border-top:2px solid var(--accent)}
.steps li::before{content:"0" counter(s);font:400 2.2rem/1 Georgia,serif;color:var(--accent);display:block;margin-bottom:.4em}
.hours{border-collapse:collapse;margin-bottom:1em}
.hours th,.hours td{text-align:left;padding:6px 24px 6px 0;font-weight:400}
.hours th{font-weight:600}
address{font-style:normal;margin-bottom:1em}
.map{aspect-ratio:4/3;border:1px solid var(--line);background:var(--alt)}
.map iframe{width:100%;height:100%;border:0;display:block}
/* project tiles */
.cat-tiles{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));margin-top:36px}
.cat-tile{display:block;text-decoration:none;color:var(--cream);padding:22px 20px 20px;min-height:190px;position:relative;overflow:hidden;background:linear-gradient(135deg,#2e2b28,#1b1917);border:1px solid #3a3733}
.cat-tile:hover{box-shadow:0 18px 32px rgba(0,0,0,.32);border-color:var(--accent)}
.cat-tile svg{position:absolute;right:-6px;bottom:-6px;width:118px;height:118px;fill:none;stroke:#8a7a66;stroke-width:1.2;opacity:.75;transition:transform .5s var(--ease),opacity .3s,stroke .3s}
.cat-tile:hover svg{transform:scale(1.1) translate(-4px,-4px) rotate(-3deg);opacity:1;stroke:#c9bfae}
.cat-tile span{display:block;font:400 1.15rem/1.25 Georgia,serif;max-width:10em;position:relative}
.cat-tile small{display:block;margin-top:.7em;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:#a89f8e;position:relative}
.grid{display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
.proj h3{margin:.9em 0 .2em}
.meta{font-size:.85rem;color:var(--muted);margin-bottom:.4em}
.ph{position:relative;overflow:hidden;aspect-ratio:3/2;display:flex;align-items:flex-end;justify-content:flex-start;padding:14px;text-align:left;color:#6f685e;font-size:.85rem;background-color:#e8e2d8;background-image:linear-gradient(rgba(35,33,31,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(35,33,31,.07) 1px,transparent 1px);background-size:24px 24px;border:1px dashed #b3a999;transition:border-color .3s}
.ph svg{position:absolute;right:10px;top:10px;width:46%;height:auto;fill:none;stroke:#8a7a66;stroke-width:1.2;opacity:.55;transition:transform .5s var(--ease),opacity .3s}
.proj:hover .ph{border-color:var(--dark)}
.proj:hover .ph svg{transform:scale(1.08) rotate(-2deg);opacity:.9}
.ph span{position:relative;background:var(--bg);border:1px solid #b3a999;padding:5px 10px;font-weight:600;letter-spacing:.04em}
.ph span::before{content:"＋ "}
.ph-wide{aspect-ratio:16/10}.ph-tall{aspect-ratio:4/5}.ph-sq{aspect-ratio:1}
/* footer */
.flogo{margin:0 0 1em}.flogo img{height:84px;width:auto;background:#fff;padding:8px;border-radius:2px;display:block}
.site-footer{background:#1b1917;color:#cfc9bf;padding:56px 0 24px;font-size:.93rem}
.site-footer a{color:#f1ede6}
.site-footer h2{font-size:1rem;letter-spacing:.1em;text-transform:uppercase;color:#f1ede6}
.site-footer h2::after{display:none!important}
.foot{display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.site-footer p{line-height:1.7}.site-footer address{line-height:1.7}
.clinks a{display:block;padding:.4em 0}.clinks{margin:.2em 0 1em}
.copy{margin-top:32px;padding-top:16px;border-top:1px solid #3a3733;font-size:.82rem;color:#948d82}
.wa-float{position:fixed;right:16px;bottom:16px;background:#1f7a4d;color:#fff;text-decoration:none;padding:12px 18px;border-radius:999px;font-size:.9rem;box-shadow:0 4px 14px rgba(0,0,0,.25);z-index:25;transition:transform .25s var(--ease)}
.wa-float::before{content:"";position:absolute;inset:0;border-radius:inherit;background:#1f7a4d;z-index:-1;animation:pulse 2.6s ease-out infinite}
.wa-float:hover{transform:scale(1.07)}
@keyframes pulse{0%{transform:scale(1);opacity:.55}100%{transform:scale(1.55,1.9);opacity:0}}
/* scroll reveal (progressive enhancement: only hidden when JS present; failsafe reveals after 3.5s if JS never starts) */
.rv{transition:opacity .85s ease var(--d,0s),translate .85s var(--ease) var(--d,0s),scale .85s var(--ease) var(--d,0s),transform .2s ease-out,box-shadow .3s,border-color .3s}
.js .rv{opacity:0;animation:rvfail .01s 3.5s forwards}
.js .rv-up{translate:0 34px}.js .rv-left{translate:-46px 0}.js .rv-right{translate:46px 0}.js .rv-scale{scale:.9;translate:0 20px}
.js.ready .rv{animation:none}
.js .rv.in{opacity:1;translate:0 0;scale:1}
@keyframes rvfail{to{opacity:1;translate:0 0;scale:1}}
/* responsive */
@media(max-width:860px){
 .hero-grid{grid-template-columns:1fr}
 .hero-art-wrap{max-width:460px;margin:0 auto}
 .stats .wrap{grid-template-columns:repeat(2,1fr)}
 .stat:nth-child(3){border-left:0;padding-left:0}
 .stat{border-bottom:1px solid var(--line)}
 .stat:nth-last-child(-n+2){border-bottom:0}
}
@media(max-width:760px){
 body{font-size:16px}
 .split{grid-template-columns:1fr}
 .menu-btn{display:block}
 .nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--bg);flex-direction:column;align-items:stretch;gap:0;padding:8px 20px 16px;border-bottom:1px solid var(--line)}
 .nav.open{display:flex}
 .nav a:not(.btn){padding:12px 0;border-bottom:1px solid var(--line)}
 .nav a.btn{margin-top:12px;text-align:center}
 .hero{padding:52px 0 70px}.section{padding:52px 0}.page-head{padding:52px 0 44px}.cta{padding:60px 0}
 .logo img{height:48px}.scrolled .logo img{height:38px}
 .logo{font-size:.95rem;letter-spacing:.1em;gap:10px}
 .svc{grid-template-columns:1fr}.svc .ico{grid-row:auto;margin-bottom:10px}
 .cat-tiles{grid-template-columns:repeat(2,1fr)}
 .cat-tile{min-height:160px}.cat-tile svg{width:92px;height:92px}
 .js .rv-left{translate:-24px 0}.js .rv-right{translate:24px 0}
 .sky.s1{--h:120px}.sky.s2{--h:160px}.sky.s3{--h:200px}
}
/* reduced motion: no animation, everything visible */
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation:none!important;transition:none!important}
 .js .rv,.js .sw{opacity:1!important;translate:none!important;scale:none!important}
 .js .section h2::after{width:64px}
 .js .ico svg *{stroke-dashoffset:0}
 .draw{stroke-dashoffset:0}
 .js .w>i{translate:0 0}
 .marquee .track{width:auto;flex-wrap:wrap;justify-content:center}
 .marquee ul{flex-wrap:wrap;justify-content:center}
 .marquee ul[aria-hidden]{display:none}
 .sh{display:none}
}
/* top contact bar */
.topbar{background:#1b1917;color:#cfc9bf;font-size:.82rem}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:34px;padding-top:4px;padding-bottom:4px}
.topbar a{color:#f1ede6;text-decoration:none;font-weight:600}
.topbar a:hover{text-decoration:underline}
.topbar i{font-style:normal;color:var(--accent);margin:0 4px}
/* directors */
.cards-dir{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));max-width:720px}
.cards-dir .card{display:flex;flex-direction:column;align-items:flex-start}
.avatar{width:84px;height:84px;border-radius:50%;background:var(--dark);color:var(--cream);display:grid;place-items:center;font:400 1.9rem Georgia,serif;letter-spacing:.06em;margin-bottom:18px;position:relative;box-shadow:0 0 0 5px #faf8f4,0 0 0 6px var(--accent);transition:transform .4s var(--ease)}
.card:hover .avatar{transform:rotate(-6deg) scale(1.06)}
.role{color:var(--accent)!important;text-transform:uppercase;letter-spacing:.14em;font-size:.78rem!important}
.dirs{color:#a89f8e}
@media(max-width:760px){.tb-hours{display:none}.topbar .wrap{justify-content:center}}
@media(prefers-reduced-motion:reduce){.card:hover .avatar{transform:none}}

/* real project photos */
.ph.has-photo{display:block;padding:0;border:0;background:#1b1917}
.ph.has-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.proj:hover .ph.has-photo img{transform:scale(1.06)}
.ph .tag{position:absolute;left:12px;top:12px;bottom:auto;background:rgba(27,25,23,.82);color:var(--cream);border:0;padding:5px 10px;font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;backdrop-filter:blur(4px)}
.ph .tag::before{content:none}
.proj .cap{font-size:.92rem;color:var(--muted);margin:0}
/* category tiles with a photo */
.cat-tile.has-photo{background:#1b1917}
.cat-tile.has-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.62;transition:transform .9s var(--ease),opacity .4s}
.cat-tile.has-photo::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(27,25,23,.25),rgba(27,25,23,.85));z-index:1}
.cat-tile.has-photo:hover img{transform:scale(1.07);opacity:.85}
.cat-tile.has-photo span,.cat-tile.has-photo small{z-index:2}
.cat-tile.has-photo svg{display:none}
.cat-tile{display:flex;flex-direction:column;justify-content:flex-end}
.cat-tile small{max-width:calc(100% - 100px)}
@media(max-width:760px){.cat-tile small{max-width:100%}.cat-tile:not(.has-photo) svg{opacity:.45}}

/* click-to-enlarge */
.ph.has-photo a.zoom{position:absolute;inset:0;display:block;cursor:zoom-in}
.ph.has-photo a.zoom::after{content:"Enlarge";position:absolute;right:10px;bottom:10px;background:rgba(27,25,23,.82);color:var(--cream);font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:5px 10px;opacity:.9;transition:background .3s}
.ph.has-photo a.zoom:hover::after,.ph.has-photo a.zoom:focus-visible::after{background:var(--accent)}
.ph.has-photo a.zoom:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
.ph.plan{aspect-ratio:5/4}
.lb{position:fixed;inset:0;z-index:100;background:rgba(18,16,14,.94);display:none;flex-direction:column;align-items:center;justify-content:center;padding:56px 12px 16px}
.lb.open{display:flex}
.lb-fig{margin:0;max-width:100%;display:flex;flex-direction:column;align-items:center;min-height:0}
.lb img{max-width:100%;max-height:calc(100vh - 130px);width:auto;height:auto;object-fit:contain;background:#fff}
.lb figcaption{color:#e9e3d8;font-size:.95rem;margin-top:12px;text-align:center}
.lb button{position:absolute;background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.35);cursor:pointer;font:400 1.6rem/1 Georgia,serif;width:46px;height:46px;border-radius:50%}
.lb button:hover,.lb button:focus-visible{background:var(--accent);outline:none}
.lb-x{top:10px;right:12px}.lb-p{left:12px;top:50%}.lb-n{right:12px;top:50%}
.lb-p[hidden],.lb-n[hidden]{display:none}
@media(max-width:640px){.lb-p,.lb-n{top:auto;bottom:10px}.lb-p{left:20px}.lb-n{right:20px}.lb figcaption{margin-bottom:46px}}
body.lb-lock{overflow:hidden}
.ph .tag{max-width:calc(100% - 24px);line-height:1.35}

/* grouped project cards */
.groups .group-label{margin:2.2em 0 1em;padding-left:14px;border-left:3px solid var(--accent);font-size:.82rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--dark)}
.groups .group-label:first-child{margin-top:1.2em}

/* team portraits */
.team-grid{list-style:none;margin:1.4em 0 0;padding:0;display:grid;gap:24px;grid-template-columns:repeat(2,minmax(0,320px))}
.team-grid .ph{aspect-ratio:4/5}
.team-grid .ph.has-photo img{object-position:50% 20%}
@media(max-width:640px){.team-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}}
.prose{max-width:46rem}

/* director portrait cards */
.cards-dir{max-width:760px;grid-template-columns:repeat(2,minmax(0,1fr))}
.cards-dir .card.dir{padding:0;overflow:hidden;align-items:stretch}
.cards-dir .dir .ph{aspect-ratio:4/5;width:100%}
.cards-dir .dir .ph.has-photo img{object-position:50% 20%}
.cards-dir .dir h3{margin:18px 22px 4px}
.cards-dir .dir .role{margin:0 22px 22px}
@media(max-width:640px){.cards-dir{gap:12px}.cards-dir .dir h3{margin:14px 14px 2px;font-size:1.05rem}.cards-dir .dir .role{margin:0 14px 16px;font-size:.78rem}}
.cards-dir .dir .dir-line{margin:-12px 22px 22px;font-size:.88rem;color:var(--muted);line-height:1.45}
@media(max-width:640px){.cards-dir .dir .dir-line{margin:-10px 14px 16px;font-size:.8rem}}
.cards-dir .dir .dir-lines{list-style:none;margin:-12px 22px 22px;padding:0;font-size:.88rem;color:var(--muted)}
.cards-dir .dir .dir-lines li{margin:0 0 .4em;line-height:1.4}
@media(max-width:640px){.cards-dir .dir .dir-lines{margin:-8px 14px 16px;font-size:.78rem}}
@media(max-width:520px){.cards-dir{grid-template-columns:1fr;max-width:420px}.cards-dir .dir h3{margin:16px 18px 4px;font-size:1.25rem}.cards-dir .dir .role{margin:0 18px 18px;font-size:.8rem}.cards-dir .dir .dir-lines{margin:-8px 18px 20px;font-size:.88rem}}
/* credential lines: short ones stay on one line */
.cards-dir{max-width:860px}
.cards-dir .dir h3,.cards-dir .dir .role,.cards-dir .dir .dir-lines{margin-left:18px;margin-right:18px}
.cards-dir .dir .dir-lines{font-size:clamp(.7rem,.62rem + .32vw,.84rem);letter-spacing:-.005em}
.cards-dir .dir .dir-lines li.nw{white-space:nowrap}
@media(max-width:520px){.cards-dir{max-width:420px}.cards-dir .dir .dir-lines{font-size:clamp(.7rem,3.55vw,.84rem);margin-left:14px;margin-right:14px}.cards-dir .dir h3,.cards-dir .dir .role{margin-left:14px;margin-right:14px}}
@media(max-width:640px){.cards-dir{grid-template-columns:1fr;max-width:420px}.cards-dir .dir .dir-lines{font-size:clamp(.62rem,calc((100vw - 76px)/24.4),.84rem)}.cards-dir .dir h3{margin:16px 14px 4px;font-size:1.25rem}.cards-dir .dir .role{margin:0 14px 18px;font-size:.8rem}}
/* prevent grid children (map iframe, photos) from forcing horizontal overflow on very narrow screens */
.split>*{min-width:0}
@media(max-width:760px){.split{grid-template-columns:minmax(0,1fr)}}
.map iframe,.ph img{max-width:100%}
.clinks span{display:block;padding:.4em 0}.clinks a{display:inline;padding:0}
@media(max-width:760px){.js .rv-right,.js .rv-left{translate:0 30px}}

/* home page services: headings only */
.cards-titles .card{padding:22px 24px}
.cards-titles .card h3{margin:0}
.cards-titles .card .ico{margin-bottom:.9em}

/* floating WhatsApp button: raised so the Netlify badge (bottom-right) doesn't overlap it */
.wa-float{bottom:72px}
