/* Art Deco noir layer (preview-deco). Brief: docs/BRAND-BRIEF.md.
   Night indigo, cherry red, amber gold, pearl cream; neon magenta only as a spark. */
:root{--night:#0d1038;--night-2:#161a55;--night-3:#232884;--cherry:#c3112e;--cherry-deep:#6e0a1d;--gold:#e8b04a;--gold-soft:#f5d58a;--pearl:#f6efe2;--neon:#ff3d8b;--deco-ease:cubic-bezier(.22,1,.36,1)}

/* ---------- shared ornaments ---------- */
.deco-sky{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;background:
 radial-gradient(1px 1px at 12% 18%,#fff 60%,transparent),radial-gradient(1px 1px at 27% 8%,#fff 60%,transparent),radial-gradient(1.5px 1.5px at 43% 22%,#fff 60%,transparent),radial-gradient(1px 1px at 58% 12%,#fff 60%,transparent),radial-gradient(1px 1px at 71% 28%,#fff 60%,transparent),radial-gradient(1.5px 1.5px at 86% 9%,#fff 60%,transparent),radial-gradient(1px 1px at 93% 33%,#fff 60%,transparent),radial-gradient(1px 1px at 6% 38%,#fff 60%,transparent),radial-gradient(1px 1px at 35% 41%,#fff8 60%,transparent),radial-gradient(1px 1px at 64% 44%,#fff8 60%,transparent),
 radial-gradient(120% 70% at 50% 100%,#3b2a8f 0%,transparent 60%),linear-gradient(180deg,#070926 0%,var(--night) 45%,var(--night-2) 100%)}
.deco-skyline{position:absolute;left:0;right:0;bottom:0;width:100%;height:46%;display:block}
.deco-towers path{fill:#080a2a}
.deco-windows rect{fill:var(--gold)}
.deco-windows{opacity:.85}
.deco-searchlights{position:absolute;inset:0}
.deco-searchlights i{position:absolute;bottom:-6%;left:calc(14% + var(--i) * 32%);width:26vmin;height:120%;transform-origin:50% 100%;background:linear-gradient(to top,#b9c3ff59,#b9c3ff14 60%,transparent 85%);clip-path:polygon(46% 100%,54% 100%,100% 0,0 0);filter:blur(1.5px);transform:rotate(calc(-14deg + var(--i) * 13deg));animation:deco-sweep calc(11s + var(--i) * 2s) ease-in-out calc(var(--i) * -4s) infinite alternate}
@keyframes deco-sweep{from{transform:rotate(-22deg)}to{transform:rotate(20deg)}}
.deco-glint{position:absolute;width:22px;height:22px;color:var(--gold-soft);opacity:.9;animation:deco-twinkle 3.2s ease-in-out infinite}
.deco-glint.g1{top:14%;left:7%}.deco-glint.g2{top:9%;right:38%;width:14px;height:14px;animation-delay:-1.1s}.deco-glint.g3{top:30%;right:4%;width:16px;height:16px;animation-delay:-2s}
@keyframes deco-twinkle{0%,100%{transform:scale(.6) rotate(0);opacity:.35}50%{transform:scale(1) rotate(45deg);opacity:1}}
.deco-rule{display:flex;align-items:center;gap:14px;color:var(--gold);width:100%}
.deco-rule>span{flex:1;height:1px;background:linear-gradient(90deg,transparent,currentColor 30%,currentColor 70%,transparent)}
.deco-rule svg{width:120px;height:34px;flex:none}
.deco-star{width:1em;height:1em;color:var(--gold)}
.deco-ribbon{position:relative;overflow:hidden;background:var(--cherry);color:var(--pearl);border-block:2px solid var(--gold);padding:16px 0}
.deco-ribbon::before,.deco-ribbon::after{content:'';position:absolute;left:0;right:0;height:3px;background:repeating-linear-gradient(90deg,var(--gold) 0 6px,transparent 6px 12px)}
.deco-ribbon::before{top:5px}.deco-ribbon::after{bottom:5px}
.deco-ribbon-track{display:flex;align-items:center;gap:28px;width:max-content;animation:deco-ribbon 38s linear infinite}
.deco-ribbon-track>span{font-size:clamp(18px,2vw,26px);font-style:italic;letter-spacing:-.01em;white-space:nowrap}
.deco-ribbon-glint{width:18px;height:18px;color:var(--gold);flex:none}
@keyframes deco-ribbon{to{transform:translateX(-50%)}}

/* ---------- night header on Deco pages ---------- */
:is(.landing,.about-deco-page) .site-header{background:var(--night);color:var(--pearl);border-bottom-color:#f6efe21f}
:is(.landing,.about-deco-page) .site-header .menu-toggle>span{background:var(--pearl)}
:is(.landing,.about-deco-page) .site-header .grn-mark>span{color:var(--gold)}
:is(.landing,.about-deco-page) .lens-popover{color:var(--ink)}
:is(.landing,.about-deco-page) .main-nav .nav-contact{background:var(--cherry);color:var(--pearl);box-shadow:inset 0 0 0 1px var(--gold)}
:is(.landing,.about-deco-page) .main-nav .nav-contact:hover{background:var(--cherry-deep)}
:is(.landing,.about-deco-page) .main-nav>a:not(.nav-contact):after{background:var(--gold)}

/* ---------- home hero ---------- */
.landing .deco-hero{position:relative;isolation:isolate;background:var(--night);color:var(--pearl);overflow:hidden}
.landing .deco-hero>:not(.deco-sky){position:relative;z-index:1}
.landing .deco-hero .eyebrow,.landing .deco-hero .location{color:var(--gold)}
.landing .deco-hero .edition-index{color:var(--pearl)}
.landing .deco-hero .role-hero-title{color:var(--pearl)}
.landing .deco-hero .role-hero-title em{color:var(--gold);font-style:italic}
.landing .deco-hero .hero-foot p{color:#f6efe2d9}
.landing .deco-hero .hero-work-link{color:var(--pearl);border-color:var(--gold)}
.landing .hero-stage{position:relative}
.deco-arch{position:absolute;inset:-18px;width:calc(100% + 36px);height:calc(100% + 36px);overflow:visible;pointer-events:none;z-index:2}
.deco-arch path{fill:none;stroke:var(--gold);stroke-width:1.6;vector-effect:non-scaling-stroke}
.deco-arch .deco-arch-inner{stroke:var(--gold-soft);stroke-width:1;opacity:.6}
.landing .hero-feature{box-shadow:0 30px 80px #000a,0 0 0 1px #e8b04a55}

/* zigzag cut from the night above */
.deco-zigzag{position:relative}
.deco-zigzag::before{content:'';position:absolute;left:0;right:0;top:0;height:18px;background:linear-gradient(135deg,var(--night) 50%,transparent 50.5%) 0 0/28px 18px repeat-x,linear-gradient(225deg,var(--night) 50%,transparent 50.5%) 0 0/28px 18px repeat-x;z-index:1}
.landing .selected-work{padding-top:clamp(70px,8vw,120px)}

/* stamp frames on landing project covers */
.landing .project-card .project-cover{padding:12px;-webkit-mask:linear-gradient(#000 0 0) content-box,radial-gradient(circle 6px at 6px 6px,#0000 96%,#000) -6px -6px/17px 17px round;mask:linear-gradient(#000 0 0) content-box,radial-gradient(circle 6px at 6px 6px,#0000 96%,#000) -6px -6px/17px 17px round}
.landing .project-card .project-cover::after{content:'';position:absolute;inset:0;border:12px solid var(--pearl);box-shadow:inset 0 0 0 1px #c9b99c;pointer-events:none;z-index:3}

/* ---------- bento ---------- */
.deco-bento{position:relative;background:var(--night);color:var(--pearl);padding-top:clamp(70px,8vw,120px);padding-bottom:clamp(70px,8vw,120px);background-image:linear-gradient(90deg,#e8b04a0d 1px,transparent 1px);background-size:56px 100%}
.bento-head{display:grid;justify-items:center;text-align:center;gap:18px;margin-bottom:clamp(36px,5vw,64px)}
.bento-head .eyebrow{color:var(--gold)}
.bento-head h2{font-size:clamp(40px,6vw,92px);line-height:.95;letter-spacing:-.045em;margin:0}
.bento-head h2 em{color:var(--gold)}
.bento-grid{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:minmax(120px,auto);gap:16px}
.tile{position:relative;overflow:hidden;padding:clamp(22px,2.6vw,38px);min-width:0}
.tile h3{font-size:clamp(24px,2.4vw,36px);line-height:1.05;letter-spacing:-.03em;margin:14px 0 14px;font-weight:600}
.tile p{margin:0;font-size:16px;line-height:1.6}
.tile-label{display:inline-block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:6px 10px;border:1px solid currentColor}
.tile-a{grid-column:span 4;grid-row:span 2}.tile-b{grid-column:span 2;grid-row:span 2}
.tile-c{grid-column:span 2;grid-row:span 3}.tile-d{grid-column:span 4;grid-row:span 2}
.tile-e{grid-column:span 3;grid-row:span 2}.tile-f{grid-column:span 1;grid-row:span 1}
.tile-velvet{background:radial-gradient(circle at 25% 25%,#ffffff1f 0 7%,transparent 8%) 0 0/46px 46px,radial-gradient(circle at 75% 75%,#00000038 0 7%,transparent 8%) 0 0/46px 46px,radial-gradient(120% 120% at 20% 0%,#e3263a,var(--cherry) 45%,var(--cherry-deep));color:var(--pearl);clip-path:polygon(0 0,calc(100% - 40px) 0,100% 40px,100% 100%,40px 100%,0 calc(100% - 40px))}
.tile-velvet .tile-label{color:var(--gold-soft)}
.tile-velvet h3{font-size:clamp(30px,3.4vw,52px);max-width:16ch}
.tile-velvet p{max-width:52ch;color:#fff1ecd9}
.tile-sunburst{background:linear-gradient(180deg,#1d2270,#10134a);color:var(--pearl);border:1px solid #e8b04a66;border-radius:200px 200px 0 0}
.tile-burst{position:absolute;left:50%;top:-6%;width:150%;transform:translateX(-50%);color:var(--gold);opacity:.32}
.tile-sunburst>*:not(.tile-burst){position:relative}
.tile-sunburst{padding-top:clamp(70px,7vw,110px);text-align:center}
.tile-sunburst .tile-label{color:var(--gold)}
.tile-sunburst .practice-focus{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:8px}
.tile-sunburst .practice-focus li{font-size:16px;padding:10px 12px;border:1px solid #e8b04a55;background:#0d10384d}
.tile-ticket{background:var(--pearl);color:var(--ink);-webkit-mask:radial-gradient(circle 20px at 0 50%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 20px at 100% 50%,#0000 98%,#000) right/51% 100% no-repeat;mask:radial-gradient(circle 20px at 0 50%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 20px at 100% 50%,#0000 98%,#000) right/51% 100% no-repeat;outline:1px solid var(--cherry);outline-offset:-10px}
.tile-ticket .tile-label{color:var(--cherry)}
.tile-ticket .text-link{color:var(--cherry);margin-top:22px}
.tile-night{background:linear-gradient(135deg,#0a0d33,#1b1f66);color:var(--pearl);border:1px solid #e8b04a59;box-shadow:inset 0 0 0 6px var(--night),inset 0 0 0 7px #e8b04a40}
.tile-night .tile-label{color:var(--gold)}
.tile-evidence{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:14px;counter-reset:ev}
.tile-evidence li{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start;font-size:16px;line-height:1.55}
.tile-evidence li>span{display:grid;place-items:center;width:40px;height:40px;color:var(--night);background:var(--gold);font-size:13px;font-weight:700;clip-path:polygon(30% 0,70% 0,100% 30%,100% 70%,70% 100%,30% 100%,0 70%,0 30%)}
.tile-marquee{background:#140710;color:var(--pearl);box-shadow:inset 0 0 0 10px #140710,inset 0 0 0 12px var(--gold)}
.tile-marquee::before{content:'';position:absolute;inset:4px;background:radial-gradient(circle,#ffd98a 0 2.2px,#e8b04a55 3px,transparent 4px) 0 0/16px 16px;-webkit-mask:linear-gradient(#000 0 0),linear-gradient(#000 0 0) content-box;-webkit-mask-composite:xor;mask-composite:exclude;padding:6px;pointer-events:none;animation:deco-bulbs 1.6s steps(2) infinite}
@keyframes deco-bulbs{50%{filter:brightness(.55)}}
.tile-marquee .tile-label{color:var(--gold)}
.marquee-bill{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:18px 0 6px}
.marquee-bill>div{display:grid;gap:4px;border-top:1px solid #e8b04a66;padding-top:12px}
.marquee-bill strong{font-size:20px;color:var(--gold-soft)}
.marquee-bill span{font-size:14px;color:#f6efe2c7}
.tile-marquee .text-link{color:var(--pearl);margin-top:14px}
.tile-gem{display:grid;place-items:center;text-align:center;background:linear-gradient(160deg,var(--gold-soft),var(--gold) 50%,#a8741d);color:var(--night);clip-path:polygon(50% 0,100% 30%,100% 70%,50% 100%,0 70%,0 30%)}
.tile-gem .deco-star{width:34px;height:34px;color:var(--night);--deco-star-core:var(--gold-soft)}
.tile-gem span{font-size:14px;line-height:1.25;font-weight:600}
.deco-bento .text-link svg{width:14px;height:14px}

/* ---------- night footer ---------- */
.deco-footer{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(180deg,var(--night) 0%,#0a0c2e 100%);color:var(--pearl)}
.deco-footer>:not(.footer-night){position:relative;z-index:1}
.footer-night{position:absolute;inset:0;z-index:0;pointer-events:none;-webkit-mask:linear-gradient(180deg,transparent 30%,#000 75%);mask:linear-gradient(180deg,transparent 30%,#000 75%)}
.footer-night .deco-skyline{height:60%;opacity:.7}
.footer-rule{margin-bottom:clamp(36px,5vw,64px)}
.deco-footer .footer-name>span{display:block;color:var(--gold)}
.deco-footer .footer-name>span .deco-star{width:clamp(28px,3vw,46px);height:auto}
.deco-footer .email-link{color:var(--gold-soft)}
.deco-footer :is(.footer-lower,.footer-perspectives){color:#f6efe2cc}
.deco-footer .footer-lower>div>a,.deco-footer .footer-perspectives a{color:var(--pearl)}

/* ---------- About ---------- */
.about-deco-page .about-stage{position:relative;isolation:isolate;overflow:hidden;background:var(--night);color:var(--pearl);display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:clamp(30px,5vw,80px);min-height:min(88vh,860px);padding-top:clamp(56px,7vw,110px);padding-bottom:clamp(120px,14vw,200px)}
.about-stage>:not(.deco-sky){position:relative;z-index:1}
.about-stage .eyebrow{color:var(--gold)}
.about-stage h1{font-size:clamp(48px,6.6vw,108px);line-height:.95;letter-spacing:-.045em;margin:20px 0 26px}
.about-stage h1 em{color:var(--gold)}
.about-stage p{max-width:560px;font-size:clamp(17px,1.4vw,20px);line-height:1.6;color:#f6efe2d9;margin:0}
.about-emblem{position:relative;justify-self:center;width:min(100%,460px);aspect-ratio:100/130;display:grid;place-items:center}
.emblem-burst{position:absolute;left:50%;top:40%;width:150%;transform:translate(-50%,-50%);color:var(--gold);opacity:.55}
.emblem-arch{position:absolute;inset:0;width:100%;height:100%}
.emblem-arch path{fill:#0d103899;stroke:var(--gold);stroke-width:1.5;vector-effect:non-scaling-stroke}
.about-monogram{position:relative;font-family:var(--display);font-weight:700;font-size:clamp(90px,11vw,170px);line-height:1;letter-spacing:-.08em;color:var(--pearl);text-shadow:0 0 40px #e8b04a55;padding-right:.18em;margin-top:18%}
.about-monogram .deco-star{position:absolute;top:-.05em;right:-.12em;width:.32em;height:.32em}
.about-story{position:relative;display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(30px,6vw,100px);align-items:center;background:var(--pearl);padding-top:clamp(70px,8vw,120px);padding-bottom:clamp(70px,8vw,120px)}
.about-story .eyebrow{color:var(--cherry)}
.story-lead{font-size:clamp(26px,2.8vw,42px);line-height:1.18;letter-spacing:-.025em;margin:18px 0 22px}
.story-lead em{color:var(--cherry)}
.story-copy>p:not(.story-lead){max-width:560px;font-size:17px;line-height:1.65}
.story-quote{margin:0;padding:clamp(30px,3vw,46px);background:var(--night);color:var(--pearl);border-radius:220px 220px 0 0;text-align:center;box-shadow:inset 0 0 0 8px var(--night),inset 0 0 0 9px var(--gold)}
.story-quote .deco-rule{margin:18px 0 22px}
.story-quote p{font-size:clamp(22px,2.2vw,32px);line-height:1.2;font-style:italic;margin:0}
.story-quote footer{margin-top:16px;color:var(--gold);font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.about-moods{background:var(--cherry-deep);background-image:repeating-linear-gradient(90deg,#ffffff08 0 1px,transparent 1px 64px),radial-gradient(120% 90% at 50% 0%,#a5102b,var(--cherry-deep));color:var(--pearl);padding-top:clamp(70px,8vw,120px);padding-bottom:clamp(70px,8vw,120px)}
.moods-head,.about-principles>header{text-align:center;margin-bottom:clamp(36px,5vw,64px)}
.moods-head .eyebrow{color:var(--gold-soft)}
:is(.moods-head,.about-principles>header) h2{font-size:clamp(40px,6vw,92px);line-height:.95;letter-spacing:-.045em;margin:16px 0 0}
.moods-head h2 em{color:var(--gold)}
.moods-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.mood-stamp{padding:12px;background:var(--pearl);-webkit-mask:linear-gradient(#000 0 0) content-box,radial-gradient(circle 6px at 6px 6px,#0000 96%,#000) -6px -6px/17px 17px round;mask:linear-gradient(#000 0 0) content-box,radial-gradient(circle 6px at 6px 6px,#0000 96%,#000) -6px -6px/17px 17px round}
.mood-stamp:nth-child(odd){transform:rotate(-1.6deg)}.mood-stamp:nth-child(even){transform:rotate(1.4deg) translateY(14px)}
.mood-inner{position:relative;height:100%;padding:26px 22px 28px;display:grid;align-content:start;gap:10px;outline:1px solid currentColor;outline-offset:-8px;min-height:300px}
.mood-retro .mood-inner{background:var(--cherry);color:var(--pearl)}
.mood-rebel .mood-inner{background:var(--night);color:var(--pearl)}
.mood-excellence .mood-inner{background:#f3e7cf;color:var(--ink)}
.mood-creative .mood-inner{background:linear-gradient(160deg,#f5d58a,var(--gold));color:var(--night)}
.mood-icon{width:64px;height:auto;color:var(--gold);margin-bottom:8px}
.mood-excellence .mood-icon,.mood-creative .mood-icon{color:var(--cherry)}
.mood-no{font-size:12px;letter-spacing:.14em;opacity:.75}
.mood-inner h3{font-size:clamp(24px,2.1vw,32px);line-height:1.05;letter-spacing:-.03em;margin:0;font-style:italic}
.mood-inner p{margin:0;font-size:16px;line-height:1.55}
.about-principles{background:var(--night);color:var(--pearl);padding-top:clamp(70px,8vw,120px);padding-bottom:clamp(70px,8vw,120px);position:relative}
.about-principles>header .eyebrow{color:var(--gold)}
.about-principles>header h2 em{color:var(--gold)}
.principle-tickets{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.principle-ticket{position:relative;display:grid;grid-template-columns:auto 1fr;column-gap:26px;align-items:start;padding:30px 34px;background:var(--pearl);color:var(--ink);-webkit-mask:radial-gradient(circle 16px at 0 50%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 16px at 100% 50%,#0000 98%,#000) right/51% 100% no-repeat;mask:radial-gradient(circle 16px at 0 50%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 16px at 100% 50%,#0000 98%,#000) right/51% 100% no-repeat}
.principle-ticket::after{content:'';position:absolute;inset:8px 22px;border:1px dashed #c3112e80;pointer-events:none}
.ticket-no{grid-row:span 2;font-size:clamp(40px,4vw,64px);line-height:.9;font-weight:700;color:var(--cherry);letter-spacing:-.05em;padding-right:22px;border-right:2px dashed #c3112e66}
.principle-ticket h3{font-size:clamp(20px,1.8vw,26px);margin:2px 0 8px;letter-spacing:-.02em}
.principle-ticket p{margin:0;font-size:16px;line-height:1.6;color:#3a302a}
.about-billing{background:var(--night);padding-top:0;padding-bottom:clamp(70px,8vw,120px)}
.billing-frame{position:relative;padding:clamp(40px,5vw,70px);background:#120612;color:var(--pearl);text-align:center;box-shadow:inset 0 0 0 14px #120612,inset 0 0 0 16px var(--gold)}
.billing-frame::before{content:'';position:absolute;inset:4px;background:radial-gradient(circle,#ffd98a 0 2.4px,#e8b04a55 3.2px,transparent 4.2px) 0 0/18px 18px;-webkit-mask:linear-gradient(#000 0 0),linear-gradient(#000 0 0) content-box;-webkit-mask-composite:xor;mask-composite:exclude;padding:8px;pointer-events:none;animation:deco-bulbs 1.6s steps(2) infinite}
.billing-frame .eyebrow{color:var(--gold)}
.billing-frame h2{font-size:clamp(36px,5vw,76px);line-height:1;letter-spacing:-.04em;margin:16px 0 clamp(30px,4vw,50px)}
.billing-frame h2 em{color:var(--gold)}
.billing-acts{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,60px);text-align:left}
.billing-act{border-top:1px solid #e8b04a80;padding-top:20px}
.billing-act>span{font-size:12px;letter-spacing:.14em;color:var(--gold)}
.billing-act h3{font-size:clamp(22px,2vw,30px);line-height:1.1;margin:10px 0 8px}
.billing-venue{color:var(--gold-soft);margin:0 0 10px}
.billing-act p:not(.billing-venue){margin:0;font-size:16px;line-height:1.6;color:#f6efe2cc}

/* ---------- responsive ---------- */
@media (max-width:1000px){
 .bento-grid{grid-template-columns:repeat(2,1fr)}
 .tile-a,.tile-d{grid-column:span 2}.tile-b,.tile-c,.tile-e{grid-column:span 1}.tile-f{grid-column:span 1}
 .tile-a,.tile-b,.tile-c,.tile-d,.tile-e,.tile-f{grid-row:auto}
 .moods-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:650px){
 .bento-grid{grid-template-columns:1fr;gap:14px}
 .tile-a,.tile-b,.tile-c,.tile-d,.tile-e,.tile-f{grid-column:auto}
 .tile-f{min-height:170px}
 .marquee-bill{grid-template-columns:1fr}
 .about-deco-page .about-stage{grid-template-columns:1fr;min-height:0;padding-bottom:150px}
 .about-emblem{width:min(78%,320px);order:-1}
 .about-story{grid-template-columns:1fr}
 .moods-grid{grid-template-columns:1fr;gap:26px}
 .mood-stamp:nth-child(even){transform:rotate(1.2deg)}
 .mood-inner{min-height:0}
 .principle-tickets{grid-template-columns:1fr}
 .principle-ticket{grid-template-columns:1fr;padding:30px 30px}
 .ticket-no{grid-row:auto;border-right:0;padding:0 0 10px;border-bottom:2px dashed #c3112e66;margin-bottom:12px;width:max-content}
 .billing-acts{grid-template-columns:1fr}
 .landing .deco-hero .deco-skyline{height:30%}
 .deco-arch{inset:-10px;width:calc(100% + 20px);height:calc(100% + 20px)}
}
@media (prefers-reduced-motion:reduce){
 .deco-searchlights i,.deco-glint,.deco-ribbon-track,.tile-marquee::before,.billing-frame::before{animation:none!important}
 .deco-ribbon-track{flex-wrap:wrap;width:auto;justify-content:center}
}

/* ---------- round 2 fixes ---------- */
/* hero: skyline sits below the copy */
.landing .deco-hero{padding-bottom:clamp(150px,14vw,210px)}
.landing .deco-hero .deco-skyline{height:clamp(140px,13vw,200px)}
.landing .deco-glint.g1{top:5%;left:auto;right:56%}
.landing .deco-hero .hero-switcher>button{color:#f6efe2b3}
.landing .deco-hero .hero-switcher>button[aria-pressed=true],.landing .deco-hero .hero-switcher>button:hover{color:var(--pearl)}
.landing .deco-hero .hero-switcher>button>span{color:var(--gold)}
/* projects on oxblood so the cream stamps read */
.landing .selected-work{background:radial-gradient(90% 60% at 50% 0%,#5a0b1c,#33060f 70%);color:var(--pearl)}
.landing .selected-work :is(.section-heading h2,.project-caption h3){color:var(--pearl)}
.landing .selected-work .section-heading h2 em{color:var(--gold)}
.landing .selected-work .eyebrow,.landing .selected-work .project-number{color:var(--gold)}
.landing .selected-work .project-caption p{color:#f6efe2c7}
.landing .selected-work .project-tags span{color:#f6efe2b3;border-color:#f6efe233}
.landing .selected-work .text-link{color:var(--gold-soft)}
.landing .project-card .project-open{background:var(--gold);color:var(--night)}
/* bento rhythm */
.tile h3.tile-label{font-size:12px;letter-spacing:.14em;line-height:1.4;margin:0;font-weight:500}
.tile-c{grid-row:span 4}.tile-f{grid-row:span 2}
/* CTA becomes a cherry stage with a zigzag cut */
.identity-grn:is(.landing,.about-deco-page) .contact-strip{position:relative;background:radial-gradient(110% 120% at 80% 0%,#e3263a,var(--cherry) 45%,var(--cherry-deep));color:var(--pearl);padding-top:clamp(80px,9vw,130px)}
.identity-grn:is(.landing,.about-deco-page) .contact-strip::before{content:'';position:absolute;left:0;right:0;top:0;height:18px;background:linear-gradient(135deg,var(--night) 50%,transparent 50.5%) 0 0/28px 18px repeat-x,linear-gradient(225deg,var(--night) 50%,transparent 50.5%) 0 0/28px 18px repeat-x}
.identity-grn:is(.landing,.about-deco-page) .contact-strip :is(.eyebrow,p){color:#fde9de}
.identity-grn:is(.landing,.about-deco-page) .contact-strip h2{color:var(--pearl)}
.identity-grn:is(.landing,.about-deco-page) .contact-strip h2 em,.identity-grn:is(.landing,.about-deco-page) .contact-strip h2 span{color:var(--gold)}
.identity-grn:is(.landing,.about-deco-page) .contact-strip .circle-cta{background:var(--gold);color:var(--night);border-color:var(--gold)}
/* footer: skyline as a strip below the content */
.footer-night{-webkit-mask:none;mask:none}
.footer-night .deco-skyline{height:170px;opacity:.85}
.deco-footer{padding-bottom:calc(170px + 20px)!important}
/* about: skyline below the copy, emblem sunburst visible */
.about-deco-page .about-stage{padding-bottom:clamp(190px,17vw,240px)}
.about-stage .deco-skyline{height:clamp(150px,14vw,210px)}
.emblem-arch path{fill:#0d103866}
.emblem-burst{top:36%;width:130%;opacity:.8;z-index:0}
.emblem-arch{z-index:1}
.about-monogram{z-index:2}
.mood-retro .mood-icon{color:var(--gold-soft);width:84px}
.tile-c{display:flex;flex-direction:column}
.ticket-stub{margin-top:auto;padding-top:22px;border-top:2px dashed #c3112e66;display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--cherry);font-size:13px;font-weight:600;letter-spacing:.18em;text-transform:uppercase}
.tile-c .text-link{margin-bottom:26px}
.ticket-stub .deco-star{width:26px;height:26px;color:var(--cherry);--deco-star-core:var(--pearl)}
.deco-bento::before{content:'';position:absolute;left:0;right:0;top:0;height:18px;background:linear-gradient(135deg,#33060f 50%,transparent 50.5%) 0 0/28px 18px repeat-x,linear-gradient(225deg,#33060f 50%,transparent 50.5%) 0 0/28px 18px repeat-x}
@media (max-width:1000px){.bento-grid>.tile{grid-row:auto}.tile-f{min-height:150px}}
@media (max-width:650px){.tile-f{clip-path:polygon(8% 0,92% 0,100% 50%,92% 100%,8% 100%,0 50%);min-height:120px}.tile-f{display:flex;gap:14px;justify-content:center}}
.mood-no{opacity:1!important}

/* ================= round 3: scalloped stamps, glass, neon glow, Projects page ================= */
/* Postage-stamp silhouette: tightly packed perforations form one continuous scalloped edge.
   The frame is pure shape; images are never edited. */
:is(.landing,.archive) .project-grid:not(.list-view) .project-cover,.mood-stamp{--perf:7px;--perf-step:15px;padding:18px;-webkit-mask:linear-gradient(#000 0 0) content-box,radial-gradient(circle var(--perf) at var(--perf) var(--perf),#0000 97%,#000) calc(var(--perf) * -1) calc(var(--perf) * -1)/var(--perf-step) var(--perf-step) round;mask:linear-gradient(#000 0 0) content-box,radial-gradient(circle var(--perf) at var(--perf) var(--perf),#0000 97%,#000) calc(var(--perf) * -1) calc(var(--perf) * -1)/var(--perf-step) var(--perf-step) round;filter:drop-shadow(0 18px 30px #0007)}
:is(.landing,.archive) .project-grid:not(.list-view) .project-cover::after{content:'';position:absolute;inset:0;border:18px solid var(--pearl);box-shadow:inset 0 0 0 1px #d8c8a8,inset 0 0 0 2px #fff6;pointer-events:none;z-index:3}
.archive .project-grid.list-view .project-cover::after{content:none}
.mood-stamp{padding:16px}
:is(.landing,.archive) .project-grid:not(.list-view) .project-card{transition:transform .5s var(--deco-ease)}
:is(.landing,.archive) .project-grid:not(.list-view) .project-card:hover{transform:translateY(-6px) rotate(-.4deg)}

/* Cursor-tracking spotlight */
.deco-spot{position:absolute;inset:0;pointer-events:none;z-index:2;opacity:0;transition:opacity .4s ease;background:radial-gradient(280px circle at var(--mx,50%) var(--my,50%),#ffd98a40,transparent 60%);mix-blend-mode:screen}
:is(.tile,.mood-stamp,.principle-ticket,.project-cover):hover>.deco-spot{opacity:1}
.tile-ticket>.deco-spot,.principle-ticket>.deco-spot,.mood-excellence .deco-spot{mix-blend-mode:multiply;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),#e8b04a33,transparent 60%)}

/* Neon glow */
.deco-arch{filter:drop-shadow(0 0 4px #e8b04acc) drop-shadow(0 0 14px #e8b04a66);transition:filter .5s var(--deco-ease)}
.hero-stage:hover .deco-arch{filter:drop-shadow(0 0 6px #ffd98a) drop-shadow(0 0 22px #e8b04acc) drop-shadow(0 0 42px #ff3d8b40)}
.deco-arch .deco-arch-beam{stroke:#fff3d6;stroke-width:3;stroke-dasharray:7 93;stroke-linecap:round;animation:deco-beam 7s linear infinite}
@keyframes deco-beam{to{stroke-dashoffset:-100}}
:is(.landing .role-hero-title em,.bento-head h2 em,.about-stage h1 em,.moods-head h2 em,.billing-frame h2 em,.archive-title h1 em){text-shadow:0 0 18px #e8b04a73,0 0 42px #e8b04a33}
.emblem-arch,.billing-frame{transition:filter .5s var(--deco-ease)}
.emblem-arch{filter:drop-shadow(0 0 6px #e8b04a99) drop-shadow(0 0 20px #e8b04a4d)}
.about-emblem:hover .emblem-arch{filter:drop-shadow(0 0 8px #ffd98a) drop-shadow(0 0 30px #e8b04aaa)}
.about-monogram{text-shadow:0 0 10px #ff3d5a99,0 0 32px #c3112e88}
:is(.landing,.about-deco-page,.archive) .main-nav .nav-contact,.identity-grn:is(.landing,.about-deco-page,.archive) .contact-strip .circle-cta,.deco-bento .text-link,.tile-gem{transition:box-shadow .35s var(--deco-ease),transform .35s var(--deco-ease),background-color .3s}
:is(.landing,.about-deco-page,.archive) .main-nav .nav-contact:hover{box-shadow:inset 0 0 0 1px var(--gold),0 0 14px #ff3d5a99,0 0 36px #c3112e88}
.identity-grn:is(.landing,.about-deco-page,.archive) .contact-strip .circle-cta:hover{box-shadow:0 0 0 6px #e8b04a33,0 0 30px #ffd98acc,0 0 70px #e8b04a77}
.tile-gem:hover{filter:drop-shadow(0 0 14px #ffd98a)}
.tile-marquee,.billing-frame{--bulb:#ffd98a}

/* Glassmorphism */
:is(.landing,.about-deco-page,.archive) .site-header{position:sticky;top:0;transition:background-color .4s ease,border-color .4s ease}
:is(.landing,.about-deco-page,.archive) .site-header::before{content:'';position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .4s ease;background:linear-gradient(180deg,#0d10388c,#0d103859);-webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5);box-shadow:inset 0 -1px 0 #ffffff1f,inset 0 1px 0 #ffffff14}
:is(.landing,.about-deco-page,.archive) .site-header.is-scrolled{background:transparent}
:is(.landing,.about-deco-page,.archive) .site-header.is-scrolled::before{opacity:1}
.bento-glow{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.bento-glow i{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55}
.bento-glow i:nth-child(1){width:42vw;height:42vw;left:-8vw;top:18%;background:#c3112e}
.bento-glow i:nth-child(2){width:34vw;height:34vw;right:-6vw;top:8%;background:#6a3cff}
.bento-glow i:nth-child(3){width:30vw;height:30vw;left:40%;bottom:-6%;background:#e8b04a;opacity:.35}
.deco-bento>*:not(.bento-glow){position:relative}
.tile-sunburst,.tile-night{background:linear-gradient(160deg,#ffffff1f,#ffffff08)!important;-webkit-backdrop-filter:blur(22px) saturate(1.4);backdrop-filter:blur(22px) saturate(1.4);border:1px solid #ffffff2e!important;box-shadow:inset 0 1px 0 #ffffff40,0 20px 50px #0006!important}
.tile-sunburst .practice-focus li{background:#ffffff12;border-color:#ffffff2b;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
:is(.landing,.archive) .project-card .project-open{background:#0d103873!important;color:var(--pearl)!important;border:1px solid #ffffff40;-webkit-backdrop-filter:blur(12px) saturate(1.4);backdrop-filter:blur(12px) saturate(1.4);box-shadow:inset 0 1px 0 #ffffff33}

/* ---------- Projects page ---------- */
.archive .site-header{background:var(--night);color:var(--pearl);border-bottom-color:#f6efe21f}
.archive .site-header .menu-toggle>span{background:var(--pearl)}
.archive .site-header .grn-mark>span{color:var(--gold)}
.archive .lens-popover{color:var(--ink)}
.archive .main-nav .nav-contact{background:var(--cherry);color:var(--pearl);box-shadow:inset 0 0 0 1px var(--gold)}
.archive .main-nav>a:not(.nav-contact):after{background:var(--gold)}
.deco-archive-hero{position:relative;isolation:isolate;overflow:hidden;background:var(--night);color:var(--pearl);padding-bottom:clamp(170px,15vw,230px)}
.deco-archive-hero>:not(.deco-sky){position:relative;z-index:1}
.deco-archive-hero .deco-skyline{height:clamp(140px,13vw,200px)}
.deco-archive-hero .eyebrow,.deco-archive-hero .archive-total,.deco-archive-hero .lens-note b{color:var(--gold)}
.deco-archive-hero .archive-total span,.deco-archive-hero .lens-note{color:#f6efe2b3}
.deco-archive-hero h1{color:var(--pearl);text-shadow:0 0 30px #e8b04a33}
.deco-archive-hero .archive-sub p{color:#f6efe2d9}
.deco-archive-hero .archive-sub{border-color:#f6efe233}
.archive .archive-work{position:relative;background:radial-gradient(90% 50% at 50% 0%,#5a0b1c,#33060f 70%);color:var(--pearl);padding-top:clamp(60px,7vw,100px)}
.archive .archive-work::before{content:'';position:absolute;left:0;right:0;top:0;height:18px;background:linear-gradient(135deg,var(--night) 50%,transparent 50.5%) 0 0/28px 18px repeat-x,linear-gradient(225deg,var(--night) 50%,transparent 50.5%) 0 0/28px 18px repeat-x}
.archive .archive-tools{position:relative;z-index:5;padding:10px 12px;background:linear-gradient(160deg,#ffffff1c,#ffffff08);border:1px solid #ffffff2e;-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);box-shadow:inset 0 1px 0 #ffffff33,0 18px 40px #0005}
.archive .filter-group>button{color:#f6efe2c7}
.archive .filter-group>button:hover{border-color:#e8b04a88;color:var(--pearl)}
.archive .filter-group>button[aria-pressed=true]{background:var(--gold);color:var(--night);box-shadow:0 0 16px #e8b04a88}
.archive .search-box{color:var(--pearl);border-color:#ffffff33}
.archive .search-box input{color:var(--pearl);background:transparent}
.archive .search-box input::placeholder{color:#f6efe299}
.archive .view-controls>button{color:#f6efe2b3;border-color:#ffffff26}
.archive .view-controls>button[aria-pressed=true]{background:#ffffff1f;color:var(--gold)}
.archive .archive-status,.archive .archive-status span{color:#f6efe2b3;border-color:#f6efe233}
.archive .project-caption h3,.archive .project-caption h3 a{color:var(--pearl)}
.archive .project-caption p{color:#f6efe2c7}
.archive .project-number{color:var(--gold)}
.archive .project-tags span{color:#f6efe2b3;border-color:#f6efe233}
.archive .empty-state{color:var(--pearl)}
.archive .upcoming-section{background:var(--night);color:var(--pearl);position:relative}
.archive .upcoming-section::before{content:'';position:absolute;left:0;right:0;top:0;height:18px;background:linear-gradient(135deg,#33060f 50%,transparent 50.5%) 0 0/28px 18px repeat-x,linear-gradient(225deg,#33060f 50%,transparent 50.5%) 0 0/28px 18px repeat-x}
.archive .upcoming-section .work-section-heading .eyebrow{color:var(--gold)}
.archive .upcoming-section :is(.work-section-heading h2,.project-caption h3){color:var(--pearl)}
.archive .upcoming-section .project-caption p{color:#f6efe2c7}
.archive .upcoming-art{box-shadow:0 0 0 1px #e8b04a66,0 0 0 8px var(--night),0 0 0 9px #e8b04a40}
.identity-grn.archive .contact-strip{position:relative;background:radial-gradient(110% 120% at 80% 0%,#e3263a,var(--cherry) 45%,var(--cherry-deep));color:var(--pearl);padding-top:clamp(80px,9vw,130px)}
.identity-grn.archive .contact-strip::before{content:'';position:absolute;left:0;right:0;top:0;height:18px;background:linear-gradient(135deg,var(--night) 50%,transparent 50.5%) 0 0/28px 18px repeat-x,linear-gradient(225deg,var(--night) 50%,transparent 50.5%) 0 0/28px 18px repeat-x}
.identity-grn.archive .contact-strip :is(.eyebrow,p){color:#fde9de}
.identity-grn.archive .contact-strip h2{color:var(--pearl)}
.identity-grn.archive .contact-strip h2 :is(em,span){color:var(--gold)}
.identity-grn.archive .contact-strip .circle-cta{background:var(--gold);color:var(--night);border-color:var(--gold)}
@media (max-width:650px){:is(.landing,.archive) .project-grid:not(.list-view) .project-cover{--perf:6px;--perf-step:13px;padding:14px}:is(.landing,.archive) .project-grid:not(.list-view) .project-cover::after{border-width:14px}.bento-glow i{filter:blur(50px)}}
@media (prefers-reduced-motion:reduce){.deco-arch .deco-arch-beam{animation:none;opacity:0}:is(.landing,.archive) .project-grid:not(.list-view) .project-card:hover{transform:none}}
/* Scalloped stamp, v2: solid card inset by r, plus a single row of touching circles along each edge. */
:is(.landing,.archive) .project-grid:not(.list-view) .project-cover,.mood-stamp{--r:6px;--d:calc(var(--r) * 2);
 -webkit-mask:linear-gradient(#000 0 0) center/calc(100% - var(--d)) calc(100% - var(--d)) no-repeat,radial-gradient(circle var(--r),#000 95%,#0000) 0 0/var(--d) var(--d) round no-repeat,radial-gradient(circle var(--r),#000 95%,#0000) 0 100%/var(--d) var(--d) round no-repeat,radial-gradient(circle var(--r),#000 95%,#0000) 0 0/var(--d) var(--d) no-repeat round,radial-gradient(circle var(--r),#000 95%,#0000) 100% 0/var(--d) var(--d) no-repeat round;
 mask:linear-gradient(#000 0 0) center/calc(100% - var(--d)) calc(100% - var(--d)) no-repeat,radial-gradient(circle var(--r),#000 95%,#0000) 0 0/var(--d) var(--d) round no-repeat,radial-gradient(circle var(--r),#000 95%,#0000) 0 100%/var(--d) var(--d) round no-repeat,radial-gradient(circle var(--r),#000 95%,#0000) 0 0/var(--d) var(--d) no-repeat round,radial-gradient(circle var(--r),#000 95%,#0000) 100% 0/var(--d) var(--d) no-repeat round}
@media (max-width:650px){:is(.landing,.archive) .project-grid:not(.list-view) .project-cover{--r:5px}}
.archive .deco-archive-hero .archive-total{color:var(--gold)!important;text-shadow:0 0 18px #e8b04a66}
/* The curtain page transition replaces the browser cross-document fade, which raced with it. */
@view-transition{navigation:none}

/* ================= round 4: sticky header everywhere, Art Deco menu ================= */
.site-header{position:sticky!important;top:0}
html{scroll-padding-top:calc(var(--header-h,90px) + 16px)}
.case-toolbar,.project-jumps{top:var(--header-h,0px)!important}
.case-nav{top:calc(var(--header-h,0px) + 24px)!important}
/* glass header after scrolling on case studies too, tinted with the project's world colour */
.case-page .site-header::before{content:'';position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .4s ease;background:color-mix(in srgb,var(--world,#201a16) 72%,transparent);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4)}
.case-page .site-header.is-scrolled{background:transparent}
.case-page .site-header.is-scrolled::before{opacity:1}
body:not(:is(.landing,.about-deco-page,.archive,.case-page)) .site-header.is-scrolled{box-shadow:0 10px 30px #0000001a}

@media (max-width:650px){
 .site-header .main-nav{background:#2a040e url('/assets/deco-pattern.svg') 50% 0/150px auto repeat!important}
 .site-header .main-nav::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#1a0309f5 0%,#1a0309e0 55%,#1a03098c 100%),radial-gradient(80% 50% at 100% 100%,#e8b04a2e,transparent 70%)}
 .site-header .main-nav::after{content:'';position:fixed;left:var(--pad);right:var(--pad);top:96px;height:1px;background:linear-gradient(90deg,#e8b04a,#e8b04a33);pointer-events:none}
 .site-header .main-nav>a{border-bottom-color:#e8b04a40!important;text-shadow:0 2px 18px #000}
 .site-header .main-nav>a:not(.nav-contact)>svg{color:var(--gold)}
 .site-header .main-nav>a[aria-current]{color:var(--gold)}
 .site-header .main-nav .nav-contact{background:var(--gold)!important;color:#2a040e!important;box-shadow:0 0 0 1px #2a040e,0 0 0 4px var(--gold),0 0 30px #e8b04a66}
}
@media (max-width:650px){
 .site-header .main-nav::before{background:linear-gradient(90deg,#1a0309e0 0%,#1a03099c 48%,#1a030914 100%),radial-gradient(70% 45% at 100% 100%,#e8b04a33,transparent 70%)}
 .site-header .main-nav .nav-contact{text-shadow:none}
 html:has(.main-nav.is-open) .back-to-top{opacity:0;visibility:hidden}
}

/* ================= one thumbnail shape: 4:5 portrait, balanced grid (owner request 8 Nov 2026) ================= */
.identity-grn:is(.landing,.archive) .project-grid:not(.list-view){display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:clamp(40px,4vw,64px) clamp(20px,2.4vw,40px)!important;align-items:start!important}
.identity-grn.archive .project-grid:not(.list-view){grid-template-columns:repeat(2,minmax(0,1fr))!important}
.identity-grn:is(.landing,.archive) .project-grid:not(.list-view)>.project-card{grid-column:auto!important;grid-row:auto!important;margin:0!important;width:auto!important;max-width:none!important}
.identity-grn:is(.landing,.archive) .project-grid:not(.list-view) .project-cover{aspect-ratio:4/5!important;height:auto!important;min-height:0!important;max-height:none!important;width:100%!important}
.identity-grn:is(.landing,.archive) .project-grid:not(.list-view) .project-cover>:is(img,.cover-photo){position:absolute;inset:18px;width:calc(100% - 36px)!important;height:calc(100% - 36px)!important;max-height:none!important;object-fit:cover}
@media (max-width:900px){.identity-grn:is(.landing,.archive) .project-grid:not(.list-view){grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media (max-width:650px){.identity-grn:is(.landing,.archive) .project-grid:not(.list-view){grid-template-columns:1fr!important}.identity-grn:is(.landing,.archive) .project-grid:not(.list-view) .project-cover>:is(img,.cover-photo){inset:14px;width:calc(100% - 28px)!important;height:calc(100% - 28px)!important}}

/* ================= round 5 (owner requests 8 Nov 2026) ================= */
/* Squared premium stamp perforations: solid card + one row of square teeth per edge */
:is(.landing,.archive) .project-grid:not(.list-view) .project-cover,.mood-stamp,.archive .upcoming-art{--s:8px;
 -webkit-mask:linear-gradient(#000 0 0) center/calc(100% - var(--s) * 2) calc(100% - var(--s) * 2) no-repeat,linear-gradient(90deg,#000 50%,#0000 0) top/calc(var(--s) * 2) var(--s) round no-repeat,linear-gradient(90deg,#000 50%,#0000 0) bottom/calc(var(--s) * 2) var(--s) round no-repeat,linear-gradient(#000 50%,#0000 0) left/var(--s) calc(var(--s) * 2) no-repeat round,linear-gradient(#000 50%,#0000 0) right/var(--s) calc(var(--s) * 2) no-repeat round;
 mask:linear-gradient(#000 0 0) center/calc(100% - var(--s) * 2) calc(100% - var(--s) * 2) no-repeat,linear-gradient(90deg,#000 50%,#0000 0) top/calc(var(--s) * 2) var(--s) round no-repeat,linear-gradient(90deg,#000 50%,#0000 0) bottom/calc(var(--s) * 2) var(--s) round no-repeat,linear-gradient(#000 50%,#0000 0) left/var(--s) calc(var(--s) * 2) no-repeat round,linear-gradient(#000 50%,#0000 0) right/var(--s) calc(var(--s) * 2) no-repeat round}
@media (max-width:650px){:is(.landing,.archive) .project-grid:not(.list-view) .project-cover,.mood-stamp,.archive .upcoming-art{--s:6px}}

/* Premium black-lacquer stage behind thumbnails (replaces oxblood) with fine gold fluting */
.landing .selected-work,.archive .archive-work{background:linear-gradient(90deg,#e8b04a0f 1px,transparent 1px) 0 0/72px 100%,radial-gradient(80% 50% at 50% 0%,#1b1d4a,#08091a 70%)!important}
.deco-bento::before{background:linear-gradient(135deg,#08091a 50%,transparent 50.5%) 0 0/28px 18px repeat-x,linear-gradient(225deg,#08091a 50%,transparent 50.5%) 0 0/28px 18px repeat-x!important}
.archive .upcoming-section::before{background:linear-gradient(135deg,#08091a 50%,transparent 50.5%) 0 0/28px 18px repeat-x,linear-gradient(225deg,#08091a 50%,transparent 50.5%) 0 0/28px 18px repeat-x!important}

/* Upcoming: portrait stamps in a balanced grid */
.archive .upcoming-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:clamp(20px,2.4vw,36px)!important}
.archive .upcoming-item{margin:0!important}
.archive .upcoming-art{position:relative;display:flex!important;flex-direction:column;justify-content:space-between;aspect-ratio:4/5!important;height:auto!important;min-height:0!important;padding:calc(var(--s) + 24px)!important;box-shadow:none!important;overflow:hidden}
.archive .upcoming-art::after{content:'';position:absolute;inset:0;border:var(--s) solid var(--pearl);pointer-events:none}
.archive .upcoming-art h3{font-size:clamp(26px,2.4vw,38px)!important;line-height:1}
.archive .sweet-pack-teaser{background:linear-gradient(160deg,#ffd7b0,#f6b98f);color:#59263a}
.archive .sweet-web-teaser{background:linear-gradient(160deg,#7b304b,#4a1529);color:#ffe4cc}
.archive .upcoming-art .teaser-seal{align-self:flex-end;font-size:64px;line-height:1;opacity:.25;font-weight:700}
@media (max-width:1000px){.archive .upcoming-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media (max-width:650px){.archive .upcoming-grid{grid-template-columns:1fr!important}}

/* Hero: no clipped glow; title fills the width on phones */
.landing .role-hero-title em{text-shadow:none!important}
@media (max-width:650px){.landing .role-hero-title{font-size:clamp(48px,15vw,120px)}.landing .role-hero-title .hero-line{display:block;width:100%}.landing .hero-content{width:100%}}
/* Slideshow progress on the active project */
.hero-switcher>button{position:relative}
.hero-switcher.is-ticking>button[aria-pressed=true]::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--gold);transform-origin:left;animation:hero-tick var(--hero-delay,4800ms) linear forwards}
@keyframes hero-tick{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* Red tile: plain velvet, no dots */
.tile-velvet{background:radial-gradient(120% 120% at 20% 0%,#e3263a,var(--cherry) 45%,var(--cherry-deep))!important}

/* Touch screens: no hover jumps or zoom on thumbnails */
@media (hover:none){
 .project-card,.project-card:hover,.project-cover,.project-cover:active,.thinking-card-link:active{transform:none!important}
 .project-cover:hover>*,.project-cover>img,.project-cover>.cover-photo{transform:none!important;transition:none!important}
 .deco-spot{display:none}
}

/* ---------- Case-study opening ---------- */
.case-intro{text-align:center;padding-top:clamp(28px,4vw,56px);padding-bottom:clamp(40px,5vw,70px)}
.case-intro .back-link{display:inline-block;margin-bottom:clamp(20px,3vw,40px)}
.case-name{margin:0 auto;display:grid;justify-items:center;font-weight:800;text-transform:uppercase;letter-spacing:-.035em;line-height:.86;font-size:clamp(64px,9vw,150px)}
.case-name-line{display:block;max-width:100%}
.case-slogan{margin:clamp(16px,2vw,26px) auto 0;max-width:24ch;font-style:italic;font-size:clamp(21px,2.3vw,32px);line-height:1.2;color:var(--world-pop,var(--accent))}
.case-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:0;margin:clamp(26px,3vw,40px) auto 0;max-width:1000px;border-block:1px solid color-mix(in srgb,currentColor 25%,transparent)}
.case-meta>div{padding:14px clamp(14px,2vw,26px);text-align:center}
.case-meta>div+div{border-left:1px solid color-mix(in srgb,currentColor 18%,transparent)}
.case-meta dt{font-size:11px;letter-spacing:.16em;text-transform:uppercase;opacity:.7;margin-bottom:6px}
.case-meta dd{margin:0;font-size:15px;font-weight:600}
.passion-tag{font-weight:400;font-style:italic;opacity:.85}
.case-story{max-width:680px;margin:clamp(26px,3vw,40px) auto 0;text-align:left;font-size:clamp(17px,1.4vw,20px);line-height:1.6}
.case-results{padding-top:clamp(50px,6vw,90px);padding-bottom:clamp(40px,5vw,70px)}
.case-results header{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;margin-bottom:clamp(24px,3vw,40px)}
.case-results h2{margin:0;font-size:clamp(36px,5vw,72px);letter-spacing:-.04em;line-height:1}
.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1px;background:color-mix(in srgb,currentColor 20%,transparent);border:1px solid color-mix(in srgb,currentColor 20%,transparent)}
.stat{display:grid;align-content:start;gap:10px;padding:clamp(20px,2.4vw,32px);background:var(--world,var(--paper))}
.stat strong{font-size:clamp(40px,4.6vw,72px);line-height:.95;letter-spacing:-.045em;font-weight:800;color:var(--world-pop,var(--accent))}
.stat span{font-size:15px;line-height:1.45;max-width:24ch}
.win-list{list-style:none;margin:clamp(22px,3vw,34px) 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 30px}
.win-list li{position:relative;padding-left:30px;font-size:17px;line-height:1.5}
.win-list li::before{content:'';position:absolute;left:0;top:.35em;width:16px;height:16px;background:var(--world-pop,var(--accent));clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%)}
.case-brief{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,80px);padding-top:clamp(40px,5vw,70px);padding-bottom:clamp(50px,6vw,90px);border-top:1px solid color-mix(in srgb,currentColor 18%,transparent)}
.brief-problem p{margin:14px 0 0;font-size:clamp(22px,2.2vw,32px);line-height:1.3;letter-spacing:-.015em}
.brief-tackle ol{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px;counter-reset:t}
.brief-tackle li{counter-increment:t;display:grid;grid-template-columns:36px 1fr;gap:12px;align-items:center;font-size:16px;line-height:1.4}
.brief-tackle li::before{content:counter(t,decimal-leading-zero);display:grid;place-items:center;width:34px;height:34px;font-size:12px;font-weight:700;border:1px solid currentColor;border-radius:50%}
.case-process{padding-top:clamp(50px,6vw,90px);padding-bottom:clamp(50px,6vw,90px);border-top:1px solid color-mix(in srgb,currentColor 18%,transparent)}
.case-process h2{margin:12px 0 clamp(24px,3vw,40px);font-size:clamp(34px,4.5vw,64px);letter-spacing:-.04em;line-height:1}
.process-grid{display:grid;grid-template-columns:1fr 1fr 2fr;gap:clamp(18px,2.4vw,34px);margin:0}
.process-grid dt{font-size:11px;letter-spacing:.16em;text-transform:uppercase;opacity:.7;margin-bottom:10px}
.process-grid dd{margin:0;font-size:clamp(20px,1.8vw,26px);font-weight:600;line-height:1.25}
.process-tools ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.process-tools li{font-size:14px;font-weight:500;padding:8px 12px;border:1px solid color-mix(in srgb,currentColor 35%,transparent);border-radius:999px}
.process-flow{grid-column:1/-1}
.process-flow ol{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px 0;counter-reset:f}
.process-flow li{counter-increment:f;font-size:15px;font-weight:500}
.process-flow li:not(:last-child)::after{content:'→';margin:0 12px;opacity:.6}
@media (max-width:900px){.case-brief{grid-template-columns:1fr}.process-grid{grid-template-columns:1fr 1fr}.process-tools{grid-column:1/-1}}
@media (max-width:650px){
 .case-name{font-size:clamp(56px,18vw,140px)}
 .case-meta{display:grid;grid-template-columns:1fr 1fr;text-align:left}
 .case-meta>div{text-align:left;padding:12px 10px}
 .case-meta>div+div{border-left:0}
 .case-meta>div:nth-child(even){border-left:1px solid color-mix(in srgb,currentColor 18%,transparent)}
 .case-meta>div:nth-child(n+3){border-top:1px solid color-mix(in srgb,currentColor 18%,transparent)}
 .stat-row{grid-template-columns:1fr 1fr}
 .win-list{grid-template-columns:1fr}
 .process-grid{grid-template-columns:1fr}
 .process-flow ol{display:grid;gap:6px}.process-flow li:not(:last-child)::after{content:'↓';display:block;margin:4px 0 0}
}

/* ---------- Lightbox design notes ---------- */
.lightbox-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,340px);gap:18px;min-height:0}
.lightbox-logic{overflow:auto;padding:22px;background:#ffffff0d;border:1px solid #ffffff1f;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.lightbox-logic .eyebrow{color:var(--gold)}
.logic-chapter{margin:12px 0 10px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;opacity:.75}
.logic-text{margin:0;font-size:16px;line-height:1.6}
.logic-toggle{margin-top:18px;background:transparent;border:1px solid #ffffff40;color:inherit;padding:8px 12px;font-size:13px}
.lightbox.logic-hidden .lightbox-body{grid-template-columns:minmax(0,1fr) auto}
.lightbox.logic-hidden .lightbox-logic>:not(.logic-toggle){display:none}
.lightbox.logic-hidden .lightbox-logic{padding:10px;background:transparent;border:0}
@media (max-width:800px){.lightbox-body{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}.lightbox-logic{max-height:32vh;padding:16px}.lightbox.logic-hidden .lightbox-body{grid-template-columns:1fr}}
.is-fitted :is(.hero-line>span),.case-name-line.is-fitted{white-space:nowrap}
.role-hero-title.is-fitted .hero-line>span{display:inline-block;white-space:nowrap}
.archive .upcoming-art::after{border-width:calc(var(--s) * 2.6)!important}
.archive .upcoming-art{padding:calc(var(--s) * 2.6 + 22px)!important}
.archive .upcoming-art .teaser-seal{display:none}
.deco-arrow{display:inline-block;width:1em;height:1em;vertical-align:-.12em;flex:none}

/* ---------- GRN symbol mark: Art Deco display face, slight italic, natural spacing, no star ---------- */
@font-face{font-family:'Limelight';src:url('/assets/limelight.woff2') format('woff2');font-display:swap}
.grn-mark,.pt-mark,.about-monogram{font-family:'Limelight',Georgia,serif!important;font-weight:400!important;letter-spacing:.015em!important;display:inline-block;transform:skewX(-9deg);padding-right:0!important}
.grn-mark{font-size:40px}
@media (max-width:650px){.grn-mark{font-size:32px}}
.about-monogram{margin-top:22%;font-size:clamp(80px,9.5vw,150px)}

/* ---------- Roaring-twenties Deco silhouettes for tool pills and step numbers ---------- */
.process-tools li{--st:5px;position:relative;isolation:isolate;border:0!important;border-radius:0!important;padding:9px 14px!important;background:var(--world-pop,var(--gold));
 clip-path:polygon(0 var(--st),var(--st) var(--st),var(--st) 0,calc(100% - var(--st)) 0,calc(100% - var(--st)) var(--st),100% var(--st),100% calc(100% - var(--st)),calc(100% - var(--st)) calc(100% - var(--st)),calc(100% - var(--st)) 100%,var(--st) 100%,var(--st) calc(100% - var(--st)),0 calc(100% - var(--st)))}
.process-tools li::before{content:'';position:absolute;inset:1.5px;z-index:-1;background:var(--world,var(--night));clip-path:inherit}
.brief-tackle li::before{border:0!important;border-radius:0!important;background:var(--world-pop,var(--gold));color:var(--world,var(--night));width:36px!important;height:36px!important;
 clip-path:polygon(30% 0,70% 0,70% 14%,86% 14%,86% 30%,100% 30%,100% 70%,86% 70%,86% 86%,70% 86%,70% 100%,30% 100%,30% 86%,14% 86%,14% 70%,0 70%,0 30%,14% 30%,14% 14%,30% 14%)}
.case-meta dt,.process-grid dt{opacity:1!important}
.stat{min-width:0}
@media (max-width:650px){.stat strong{font-size:clamp(28px,9vw,56px);overflow-wrap:anywhere}}
/* Phone hero: two balanced lines (two short lines share a row), slightly smaller, tighter rhythm */
@media (max-width:650px){
 .landing .role-hero-title .hero-line.joins-next,.landing .role-hero-title .hero-line.joined{display:inline-block;width:auto}
 .landing .role-hero-title .hero-line.joins-next{margin-right:.25em}
 .landing .deco-hero .hero-kicker{margin-bottom:14px}
 .landing .deco-hero .role-hero-title{margin-bottom:18px}
 .landing .deco-hero .hero-foot{margin-top:0;gap:14px}
 .landing .deco-hero .hero-foot p{font-size:16px;line-height:1.5}
 .landing .deco-hero .hero-stage{margin-top:22px}
}
@media (max-width:650px){
 .landing .deco-hero .hero-foot{display:flex!important;flex-direction:column;align-items:flex-start;gap:14px;padding-top:6px}
 .landing .deco-hero .hero-foot p{max-width:none;margin:0}
 .landing .deco-hero .hero-work-link{display:inline-flex;align-items:center;gap:12px;width:auto;padding:4px 0 8px;font-size:14px!important;letter-spacing:.06em;text-transform:uppercase}
 .landing .deco-hero .hero-stage{margin-top:26px}
}
@media (max-width:650px){.landing .deco-hero .hero-work-link{display:none!important}.landing .deco-hero{padding-top:22px}.landing .deco-hero .hero-stage{margin-top:22px}}

/* ================= Page transition: theatre curtains ================= */
.page-transition{position:fixed;inset:0;z-index:9999;pointer-events:none;visibility:hidden;overflow:hidden}
html:is(.is-leaving,.is-arriving) .page-transition{visibility:visible}
.pt-curtain{position:absolute;top:0;bottom:0;width:51%;transition:transform .78s cubic-bezier(.7,0,.3,1);
 background:
  linear-gradient(180deg,#0000004d 0%,transparent 18%,transparent 70%,#00000066 100%),
  repeating-linear-gradient(90deg,#4a0310 0,#8e0b20 14px,#c8162f 30px,#e2304a 38px,#b3122b 48px,#76081a 62px,#4a0310 76px)}
.pt-left{left:0;transform:translateX(-102%) skewX(0);transform-origin:left}
.pt-right{right:0;transform:translateX(102%);transform-origin:right}
.pt-left::after,.pt-right::after{content:'';position:absolute;top:0;bottom:0;width:18px;background:linear-gradient(90deg,#0000,#00000059)}
.pt-left::after{right:0}.pt-right::after{left:0;transform:scaleX(-1)}
.pt-fringe{position:absolute;left:0;right:0;bottom:0;height:22px;background:repeating-linear-gradient(90deg,#f5d58a 0 2px,#c8902f 2px 4px,transparent 4px 7px),linear-gradient(#e8b04a,#e8b04a) top/100% 5px no-repeat;-webkit-mask:linear-gradient(#000,#000) top/100% 5px no-repeat,repeating-linear-gradient(90deg,#000 0 4px,#0000 4px 7px);mask:linear-gradient(#000,#000) top/100% 5px no-repeat,repeating-linear-gradient(90deg,#000 0 4px,#0000 4px 7px)}
.pt-valance{position:absolute;left:0;right:0;top:0;height:clamp(56px,9vh,96px);transform:translateY(-105%);transition:transform .6s cubic-bezier(.7,0,.3,1);
 background:radial-gradient(60% 120% at 50% 0%,#e2304a,#8e0b20 70%) 0 0/clamp(90px,14vw,180px) 100%;
 -webkit-mask:radial-gradient(55% 100% at 50% 0%,#000 98%,#0000) 0 0/clamp(90px,14vw,180px) 100%;mask:radial-gradient(55% 100% at 50% 0%,#000 98%,#0000) 0 0/clamp(90px,14vw,180px) 100%;filter:drop-shadow(0 6px 10px #0008)}
.pt-valance::after{content:'';position:absolute;inset:0;background:radial-gradient(55% 100% at 50% 0%,transparent 88%,#e8b04a 90%,transparent 96%) 0 0/clamp(90px,14vw,180px) 100%}
.pt-spot{position:absolute;inset:0;opacity:0;background:radial-gradient(30% 45% at 50% 55%,#ffe7b333,transparent 70%);transition:opacity .5s ease}
html.is-leaving .pt-curtain,html.is-arriving .pt-curtain{transform:translateX(0)}
html.is-leaving .pt-valance,html.is-arriving .pt-valance{transform:translateY(0)}
html.is-leaving .pt-spot{opacity:1;transition-delay:.45s}
html.is-arriving .page-transition{animation:pt-failsafe .3s 4s forwards}
html.is-arriving.is-arrived .pt-left{transform:translateX(-102%);transition:transform 1.05s cubic-bezier(.65,0,.25,1) .12s}
html.is-arriving.is-arrived .pt-right{transform:translateX(102%);transition:transform 1.05s cubic-bezier(.65,0,.25,1) .12s}
html.is-arriving.is-arrived .pt-valance{transform:translateY(-105%);transition:transform .7s cubic-bezier(.65,0,.25,1) .6s}
html.is-arriving.is-arrived #main{animation:pt-content-in .9s .45s cubic-bezier(.22,1,.36,1) both}
@media (prefers-reduced-motion:reduce){.page-transition{display:none}}

/* ================= Curtains v2: flat Art Deco (no shading, no 3D) ================= */
.pt-curtain{background:linear-gradient(90deg,#e8b04a 0 1.5px,transparent 1.5px) 0 0/48px 100%,repeating-linear-gradient(90deg,#c3112e 0 24px,#ad0e29 24px 48px)!important;box-shadow:none!important}
.pt-left::after,.pt-right::after{content:'';position:absolute;top:0;bottom:0;width:14px;background:linear-gradient(90deg,#e8b04a 0 3px,#6e0a1d 3px 8px,#e8b04a 8px 9.5px,transparent 9.5px)!important}
.pt-left::after{right:0;left:auto;transform:scaleX(-1)}.pt-right::after{left:0;right:auto;transform:none}
.pt-fringe{height:16px!important;-webkit-mask:none!important;mask:none!important;background:linear-gradient(#e8b04a,#e8b04a) top/100% 4px no-repeat,conic-gradient(from 135deg at 50% 100%,#e8b04a 90deg,transparent 0) 0 4px/12px 12px repeat-x!important;transform:none}
.pt-valance{height:96px!important;background:url('/assets/deco-valance.svg') 50% 0/160px 96px repeat-x!important;-webkit-mask:none!important;mask:none!important;filter:none!important}
.pt-valance::after{content:none!important}
.pt-spot{display:none!important}
.pt-emblem{position:absolute;left:50%;top:50%;width:clamp(120px,16vw,200px);aspect-ratio:1;transform:translate(-50%,-50%) scale(.4);opacity:0;color:#e8b04a;transition:transform .5s cubic-bezier(.22,1,.36,1),opacity .3s ease}
.pt-emblem::before{content:'';position:absolute;inset:18%;border-radius:50%;background:#6e0a1d;box-shadow:0 0 0 2px #e8b04a,0 0 0 7px #6e0a1d,0 0 0 8px #e8b04a}
.pt-burst{position:relative;width:100%;height:100%}
html.is-leaving .pt-emblem{opacity:1;transform:translate(-50%,-50%) scale(1);transition-delay:.55s}
html.is-arriving .pt-emblem{opacity:1;transform:translate(-50%,-50%) scale(1)}
html.is-arriving.is-arrived .pt-emblem{opacity:0;transform:translate(-50%,-50%) scale(.6);transition:transform .35s ease,opacity .25s ease;transition-delay:0s}

/* Hero title: never clip glyphs (italic overhang, descenders); the old reveal animation no longer uses clipping */
.landing .role-hero-title .hero-line{overflow:visible!important;padding:0 .08em .1em 0}
.landing .role-hero-title{overflow:visible}
.landing .hero-content{overflow:visible}

/* Design logic lives in the lightbox: chapter explanations and spread notes leave the page flow (still read by screen readers) */
.case-chapter .chapter-heading p,.case-chapter .spread-copy{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;margin:-1px!important;padding:0!important}
.case-chapter .case-spread{grid-template-columns:1fr!important}
.logic-intro{margin:0 0 12px;font-size:15px;line-height:1.6;opacity:.85}
.logic-intro:empty,.logic-text:empty{display:none}
.case-chapter .chapter-heading::after{content:'Tap any image for the design logic';display:block;margin-top:14px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;opacity:.75}
@media (hover:hover){.case-chapter .chapter-heading::after{content:'Click any image for the design logic'}}

/* ================= Relational spacing system (owner request) =================
   Proximity: label -> heading 12px, heading -> text 16-20px, text -> action 24-28px,
   group -> group 40-56px, section -> section 72-128px. One rhythm everywhere. */
:root{--sp-label:12px;--sp-head:18px;--sp-action:26px;--sp-group:clamp(36px,4.5vw,56px);--sp-section:clamp(72px,9vw,128px)}
@media (max-width:650px){:root{--sp-head:14px;--sp-action:22px;--sp-group:36px;--sp-section:64px}}
.eyebrow+:is(h1,h2,h3){margin-top:var(--sp-label)!important}
:is(h1,h2):not(.case-name)+p{margin-top:var(--sp-head)}
p+:is(.text-link,.button){margin-top:var(--sp-action)}
.case-intro,.case-results,.case-brief,.case-process,.project-overview,.opening-sequence,.case-reflection,.chapter-heading{padding-top:var(--sp-section)!important;padding-bottom:var(--sp-section)!important}
.chapter-body{padding-bottom:var(--sp-section)!important}
.case-intro{padding-top:clamp(28px,4vw,48px)!important}
.case-intro .back-link{margin-bottom:var(--sp-group)}
.case-slogan{margin-top:var(--sp-head)!important}
.case-meta{margin-top:var(--sp-group)!important}
.case-story{margin-top:var(--sp-group)!important}
.case-results header{display:block!important;margin-bottom:var(--sp-group)!important}
.case-results header .eyebrow{display:block}
.case-results header h2{margin-top:var(--sp-label)!important}
.win-list{margin-top:var(--sp-group)!important}
.case-brief{gap:var(--sp-group)!important}
.brief-problem p,.brief-tackle ol{margin-top:var(--sp-head)!important}
.case-process h2{margin:var(--sp-label) 0 var(--sp-group)!important}
.process-grid{row-gap:var(--sp-group)!important}
.chapter-heading{padding-bottom:var(--sp-group)!important}
.case-chapter .chapter-heading h2{margin-top:var(--sp-label)}
.chapter-body>*+*{margin-top:var(--sp-group)}
:is(.deco-bento,.about-story,.about-moods,.about-principles,.think-pieces,.philosophy,.selected-work,.archive-work,.upcoming-section){padding-top:var(--sp-section)!important;padding-bottom:var(--sp-section)!important}
.about-billing{padding-bottom:var(--sp-section)!important}
.bento-head,.moods-head,.about-principles>header,.think-head{margin-bottom:var(--sp-group)!important}
.section-heading{margin-bottom:var(--sp-group)!important}

/* ================= Card motion + micro-interactions on every page ================= */
@media (prefers-reduced-motion:no-preference){
 .ease-card{opacity:0;translate:0 28px;scale:.985;transition:opacity .8s cubic-bezier(.22,1,.36,1) var(--ease-d,0ms),translate 1s cubic-bezier(.22,1,.36,1) var(--ease-d,0ms),scale 1s cubic-bezier(.22,1,.36,1) var(--ease-d,0ms)}
 .ease-card.is-in{opacity:1;translate:0 0;scale:1}
 .stat-pop{animation:stat-pop .7s cubic-bezier(.22,1,.36,1) both}
 @keyframes stat-pop{from{opacity:0;translate:0 14px;letter-spacing:.06em}to{opacity:1;translate:0 0}}

 /* hover/press lifts (fine pointers) */
 @media (hover:hover) and (pointer:fine){
  :is(.tile,.principle-ticket,.thinking-card,.stat,.billing-act,.capability-grid>div,.upcoming-item,.cv-section article){transition:translate .5s cubic-bezier(.22,1,.36,1),box-shadow .5s ease,filter .5s ease}
  :is(.tile,.thinking-card,.upcoming-item):hover{translate:0 -6px}
  .principle-ticket:hover{translate:0 -4px;filter:drop-shadow(0 14px 22px #0006)}
  .mood-stamp{transition:transform .6s cubic-bezier(.34,1.4,.64,1),filter .5s ease}
  .mood-stamp:hover{transform:rotate(0) translateY(-8px) scale(1.02)!important;filter:drop-shadow(0 22px 30px #0008)}
  .stat:hover strong{text-shadow:0 0 18px color-mix(in srgb,var(--world-pop,#e8b04a) 60%,transparent)}
  .billing-act:hover,.capability-grid>div:hover{translate:0 -4px}
  .cv-section article{border-left:2px solid transparent;padding-left:14px;transition:border-color .4s ease,translate .5s cubic-bezier(.22,1,.36,1)}
  .cv-section article:hover{border-left-color:var(--accent);translate:4px 0}
  .philosophy-list li{transition:background-color .4s ease}
  .philosophy-list li:hover{background:#ffffff08}
  .philosophy-list li span{display:inline-block;transition:transform .5s cubic-bezier(.34,1.4,.64,1)}
  .philosophy-list li:hover span{transform:scale(1.4) rotate(-8deg)}
  .story-quote{transition:box-shadow .5s ease}
  .story-quote:hover{box-shadow:inset 0 0 0 8px var(--night),inset 0 0 0 9px var(--gold),0 0 40px #e8b04a40}
 }
 /* contact form: focus glow and an animated gold underline */
 .contact-composer :is(input,select,textarea){transition:border-color .3s ease,box-shadow .35s ease,background-color .3s ease}
 .contact-composer :is(input,select,textarea):focus{border-color:var(--accent)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent),0 10px 24px #0000000f;outline:0}
 .contact-composer label{transition:color .3s ease,letter-spacing .4s ease}
 .contact-composer label:has(+ :is(input,select,textarea):focus){color:var(--accent);letter-spacing:.02em}
 .contact-composer .button.primary,.cv-sub .button{transition:transform .25s ease,box-shadow .35s ease}
 .contact-composer .button.primary:hover,.cv-sub .button:hover{transform:translateY(-2px);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 20%,transparent),0 12px 26px color-mix(in srgb,var(--accent) 35%,transparent)}
 .copy-email:active,.contact-email:active{transform:scale(.97)}
 /* thinking + articles */
 .pull-quote{border-left-color:transparent!important;background:linear-gradient(var(--accent),var(--accent)) 0 0/3px 0 no-repeat;transition:background-size 1.1s cubic-bezier(.22,1,.36,1) .2s}
 .pull-quote.is-in,.pull-quote:not(.ease-card){background-size:3px 100%}
 .thinking-jump a span{animation:nudge-down 1.8s ease-in-out infinite}
 @keyframes nudge-down{50%{transform:translateY(3px)}}
}
.read-progress{position:fixed;left:0;right:0;top:var(--header-h,0px);height:3px;z-index:45;background:linear-gradient(90deg,var(--accent),#e8b04a);transform-origin:left;transform:scaleX(0);pointer-events:none}
@media (prefers-reduced-motion:reduce){.read-progress{display:none}}