*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:"Inter",system-ui,-apple-system,Segoe UI,Arial,sans-serif;color:#111;background:#fff;line-height:1.5}
img{max-width:100%;display:block}a{color:inherit}
.wrap{max-width:1567px;margin:0 auto;padding:80px 5vw}
h1,h2{font-weight:800;letter-spacing:-.02em;line-height:1.1}h1{font-size:clamp(2rem,5vw,4.5rem);margin:0 0 1rem}h2{font-size:clamp(1.8rem,3.5vw,3rem);margin:0 0 1rem}
.btn,.btn-outline{display:inline-block;padding:.7em 1.4em;border-radius:4px;text-decoration:none;font-weight:700;cursor:pointer;border:2px solid #111;font-size:.9rem}
.btn{background:#111;color:#fff}.btn-outline{background:transparent}
.nav{position:fixed;inset:0 0 auto;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:18px 5vw;color:#fff;background:linear-gradient(#000a,#0000)}
.nav nav a{margin:0 .9rem;text-decoration:none;font-weight:700;text-transform:uppercase}.nav .logo{font-weight:800;text-decoration:none}.nav .btn-outline{border-color:#fff;color:#fff;padding:.3em 1.2em}
.hero{position:relative;height:100vh;min-height:520px;overflow:hidden;background:#b8374d}
.slide{position:absolute;inset:0;margin:0;opacity:0;transition:opacity .8s}.slide.active{opacity:1}.slide img{width:100%;height:100%;object-fit:cover}
.hero-label{position:absolute;left:5vw;bottom:110px;color:#fff;font-size:clamp(2.5rem,8vw,7rem);font-weight:800;text-shadow:0 2px 20px #0006}
.hero-ui{position:absolute;left:5vw;right:5vw;bottom:30px;display:flex;justify-content:space-between;align-items:center}
.dots{display:flex;gap:18px;list-style:none;padding:0 0 6px;margin:0;border-bottom:2px solid #fff;color:#fff;font-size:.75rem}.dots li{cursor:pointer;opacity:.6}.dots li.on{opacity:1;font-weight:800}
.round-btns{display:flex;gap:12px}.round{width:56px;height:56px;border-radius:50%;border:0;background:#fff;font-size:1.3rem;cursor:pointer;box-shadow:0 2px 10px #0002}
.intro p{max-width:800px;font-size:1.15rem}
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:2rem 0}.cards3 article{border:1px solid #ddd;padding:28px}.cards3 h3{margin-top:0}
.split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}.big{font-size:clamp(1.4rem,2.6vw,2.2rem);font-weight:800;line-height:1.2}.link-arrow{font-weight:800}
.stats{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;align-items:center;background:#f4f4f4;max-width:none}.stat{display:flex;gap:16px;align-items:flex-start}.num{font-size:4rem;font-weight:800;line-height:1}
.studio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.studio-grid img{width:100%;height:320px;object-fit:cover}
.studio-info{display:grid;grid-template-columns:2fr 1fr;gap:40px;margin-top:40px}.studio-tall{width:100%;height:100%;max-height:640px;object-fit:cover}
.eyebrow{font-weight:800;text-transform:uppercase;font-size:.8rem;letter-spacing:.08em;margin:0 0 .5rem}.lead{font-size:1.3rem}.cols{display:grid;grid-template-columns:1fr 1fr;gap:24px}.cols ul{padding-left:1.1em;margin:0}
.price{font-size:2.4rem;font-weight:800;margin:.2em 0 .6em}
.cats{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid #111}
.cat{all:unset;cursor:pointer;padding:22px;min-height:400px;display:flex;flex-direction:column;border-right:1px solid #111;transition:background .2s;background:#fff}.cat:last-child{border-right:0}
.cat .who{font-size:2rem;font-weight:800;color:#e6e6e6;line-height:1.05;flex:1}.cat b{font-size:1.15rem}.cat p{font-size:.85rem}.cat small{text-transform:uppercase;font-weight:700;color:#888}
.cat.on,.cat:hover,.cat:focus-visible{background:#d9d9d9}.cat.on .who{color:#111}
.grid-wrap{position:relative}.grid{display:grid;grid-template-columns:repeat(4,1fr);border-left:1px solid #111}.grid img{aspect-ratio:1;object-fit:cover;width:100%;border-right:1px solid #111;border-bottom:1px solid #111;background:#f2f2f2}
.page-next{position:absolute;right:-28px;top:50%;transform:translateY(-50%)}.page-info{color:#888;font-size:.85rem}
.retouch{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.ba{position:relative;aspect-ratio:286/652;max-height:80vh;overflow:hidden;margin:auto}.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.ba .after{clip-path:inset(0 0 0 var(--pos))}
.ba input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}.ba::after{content:"";position:absolute;top:0;bottom:0;left:var(--pos);width:3px;background:#fff;box-shadow:0 0 0 1px #0003;pointer-events:none}
.reviews{position:relative;text-align:center;background:#111;color:#fff;max-width:none}.review{display:none}.review.active{display:block}.reviews blockquote{font-size:clamp(1.2rem,2.5vw,2rem);max-width:1000px;margin:0 auto 1rem;font-weight:600}.reviews .round-btns{justify-content:center;margin-top:24px}
.plan{display:grid;grid-template-columns:3fr 1fr auto;gap:24px;align-items:center;border-top:1px solid #ddd;padding:24px 0}.plan h3{margin:0}.amt{font-size:2rem;font-weight:800}.todo{display:block;font-size:.7rem;color:#c00;font-style:normal}
.pitch{text-align:center}.pitch h2{max-width:1000px;margin:0 auto 1rem}
.book{display:grid;grid-template-columns:1fr 1.4fr;gap:48px;background:#f4f4f4;max-width:none}
fieldset{border:0;padding:0;margin:0 0 26px}legend{font-weight:800;font-size:1.1rem;margin-bottom:10px}
.opts{display:flex;flex-wrap:wrap;gap:10px}.opts label{display:flex;align-items:center;gap:8px;border:1px solid #bbb;background:#fff;padding:8px 14px;cursor:pointer}.opts input{accent-color:#111;width:18px;height:18px}
.opts label:has(input:checked){border-color:#111;background:#d9d9d9}
textarea,.two input{width:100%;padding:12px;border:1px solid #bbb;font:inherit;background:#fff}.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.two label{font-size:.8rem;font-weight:700;text-transform:uppercase}
.err{color:#c00;font-weight:700;min-height:1.2em}.muted{color:#666}.call-btn{margin-top:14px}.thanks{grid-column:2;background:#fff;padding:40px}
.love .big{margin-top:2rem}
.foot{min-height:300px;background:#111 center/cover;color:#fff;display:flex;justify-content:space-between;align-items:flex-end;padding:40px 5vw;font-weight:800}
@media(max-width:900px){.cards3,.split,.stats,.studio-info,.retouch,.book,.cols{grid-template-columns:1fr}.cats{grid-template-columns:1fr 1fr}.cat{min-height:200px;border-bottom:1px solid #111}.cat .who{font-size:1.4rem}
.grid{grid-template-columns:1fr 1fr}.page-next{right:8px;top:auto;bottom:8px;transform:none}.studio-grid{grid-template-columns:1fr 1fr}.studio-grid img{height:180px}.plan{grid-template-columns:1fr}.nav nav{display:none}.thanks{grid-column:1}.two{grid-template-columns:1fr}.wrap{padding:56px 5vw}}

.grid img{cursor:zoom-in}
.lightbox{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.82);display:flex;align-items:center;justify-content:center;padding:4vh 80px}
.lightbox[hidden]{display:none}.lightbox img{max-width:100%;max-height:92vh;object-fit:contain;box-shadow:0 10px 60px #000a;background:#222}
.lb-x{position:absolute;top:16px;right:20px;background:none;border:0;color:#fff;font-size:2.6rem;cursor:pointer;line-height:1}
.lb-prev,.lb-next{position:absolute;top:50%;transform:translateY(-50%)}.lb-prev{left:16px}.lb-next{right:16px}
@media(max-width:900px){.lightbox{padding:60px 8px}.lb-prev,.lb-next{top:auto;bottom:16px;transform:none}}
/* Figma canvas look: light gray page (#f5f5f5, sampled from Figma) with sections as separate white containers */
body{background:#f5f5f5}
main>section.wrap{background:#fff;max-width:1567px;margin:40px auto;width:calc(100% - 10vw)}
main>section.stats,main>section.book{background:#fff}
main>section.reviews{background:#111}
.foot{margin-top:40px}
@media(max-width:900px){main>section.wrap{margin:20px auto;width:calc(100% - 24px);padding:40px 18px}}
/* align category titles: fixed-height persona label area */
.cat .who{flex:0 0 auto;height:5.6rem;margin-bottom:auto}.cat b{margin-top:auto}
@media(max-width:900px){.cat .who{height:3.6rem}}
.cat p{min-height:6.6em}
@media(max-width:900px){.cat p{height:auto}}
/* Retouch before/after (matches Figma: thin black line overhanging the photo, round blue handle #1684fc sampled from Figma) */
.retouch{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(32px,6vw,110px)}
.ba{position:relative;aspect-ratio:572/652;max-height:none;width:100%;max-width:560px;overflow:visible;margin:40px auto;touch-action:none;cursor:ew-resize;user-select:none}
.ba::after{content:none}
.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:1px solid #555;pointer-events:none}
.ba .after{clip-path:inset(0 0 0 var(--pos))}
.ba-line{position:absolute;top:-28px;bottom:-28px;left:var(--pos);width:1px;background:#111;transform:translateX(-.5px);pointer-events:none}
.ba-handle{position:absolute;top:50%;left:var(--pos);width:30px;height:30px;border-radius:50%;background:#1684fc;transform:translate(-50%,-50%);cursor:grab;box-shadow:0 1px 4px #0003}
.ba-handle:focus-visible{outline:3px solid #1684fc66;outline-offset:3px}
.retouch-copy h2{font-size:clamp(1.8rem,3vw,2.6rem)}.retouch-copy>p{color:#555;max-width:520px}
.retouch-cta{display:flex;align-items:center;gap:28px;margin-top:2rem;flex-wrap:wrap}.rprice{font-weight:800;font-size:1.1rem;margin:0}
.retouch-cta .btn-outline{border:1px solid #111;border-radius:0;padding:.7em 3.2em;font-size:.8rem}
/* ===== Hero (rebuilt to match Figma slides; colors sampled from David's slide images) ===== */
.hero{height:100vh;min-height:560px;max-height:1000px;background:#b63d52;transition:background .9s ease}
.hero .slide{position:absolute;inset:0;margin:0;opacity:0;transition:opacity .9s ease;background:var(--bg);overflow:hidden}
.hero .slide.active{opacity:1}
.p-layer{position:absolute;inset:0;will-change:transform;pointer-events:none}
.p-layer .in{position:absolute;display:block}
.p-circle .in{left:50%;top:7%;height:90%;aspect-ratio:1;border-radius:50%;background:rgba(255,255,255,.14);transform:translateX(-50%)}
.p-word .in{left:0;right:0;top:50%;text-align:center;transform:translateY(-55%);font-size:var(--fs);font-weight:800;letter-spacing:-.04em;line-height:1;color:rgba(255,255,255,.42);white-space:nowrap}
.p-subj .in{bottom:0;left:calc(50% + var(--x));height:var(--h);width:auto;max-width:none;transform:translateX(-50%)}
.slide[style*="#d5d4d2"] .p-word .in{color:rgba(255,255,255,.55)}
/* layered entrance on slide change */
@keyframes wordIn{from{opacity:0;transform:translate(-6%,-55%)}to{opacity:1;transform:translate(0,-55%)}}
@keyframes subjIn{from{opacity:0;transform:translate(-50%,6%) scale(.96)}to{opacity:1;transform:translate(-50%,0) scale(1)}}
@keyframes circIn{from{opacity:0;transform:translateX(-50%) scale(.9)}to{opacity:1;transform:translateX(-50%) scale(1)}}
.slide.active .p-word .in{animation:wordIn 1s cubic-bezier(.2,.7,.2,1) both .15s}
.slide.active .p-subj .in{animation:subjIn 1.1s cubic-bezier(.2,.7,.2,1) both .05s;transform-origin:50% 100%}
.slide.active .p-circle .in{animation:circIn 1.2s ease both}
.hero-ui{bottom:34px}
.dots{border-bottom:2px solid rgba(255,255,255,.9);gap:22px;font-size:.7rem;font-weight:700}
.hero .round{width:58px;height:58px;background:#fff;box-shadow:none}
.nav .btn-outline{border-radius:0;border-width:1px;font-size:.8rem;letter-spacing:.06em;padding:.35em 1.8em}
@media(prefers-reduced-motion:reduce){.hero .slide{transition:none}.slide.active .in{animation:none!important}.p-layer{will-change:auto}}
@media(max-width:900px){.hero{height:78vh;min-height:480px}.p-circle .in{top:16%;height:auto;width:92%}
 .p-word .in{font-size:calc(var(--fs)*1.25)}.p-subj .in{height:calc(var(--h) * .82);max-width:120%}.hero .round{width:46px;height:46px}.hero-ui{bottom:18px}}
.nav{background:transparent;transition:background .3s}.nav.scrolled{background:rgba(17,17,17,.88)}
.slide[style*="--bg:#706742"] .p-subj .in{height:82%}
@media(max-width:900px){.p-subj .in{height:auto;width:var(--mw,92%);max-width:none}
 .slide[style*="--bg:#706742"] .p-subj .in{height:auto;--mw:96%}.slide[style*="--bg:#b63d52"] .p-subj .in{--mw:130%}
 .slide[style*="--bg:#d5d4d2"] .p-subj .in{--mw:70%}.slide[style*="--bg:#224867"] .p-subj .in{--mw:110%}.slide[style*="--bg:#393e41"] .p-subj .in{--mw:100%}
 .p-word .in{top:42%}}
/* Section containers following the Figma left-margin guides: each guide block = one white card on #f5f5f5 */
.hero{max-width:1567px;margin:0 auto}
main>section.intro{margin-top:0;border-top:0}
main>section.wrap{padding-top:64px;padding-bottom:64px}
main>section.solutions{padding-top:56px}
main>section.collage{padding:24px}
main>section.collage .studio-grid img{height:clamp(160px,24vw,360px)}
.foot{max-width:1567px;margin:40px auto 0;width:calc(100% - 10vw)}
@media(max-width:900px){.foot{width:calc(100% - 24px);margin-top:20px}main>section.collage{padding:12px}}
/* ===== Figma-mirror pass ===== */
body{font-family:"Inter","Helvetica Neue",Arial,system-ui,sans-serif}
.intro{background:#f2f2f2!important;text-align:center;padding:56px 5vw 64px!important;margin-top:0!important}
.intro h1{font-size:clamp(2rem,3.6vw,3.3rem);font-weight:700;letter-spacing:-.025em;margin:0 0 1.2rem}
.intro p{max-width:820px;margin:0 auto;color:#777;font-size:clamp(1rem,1.25vw,1.15rem)}.intro b{color:#555}
.svc-title{font-size:clamp(1.6rem,2.4vw,2.2rem);font-weight:700}
.cards3{gap:0;border:1px solid #888;margin:1.2rem 0 0}.cards3 article{border:0;border-right:1px solid #888;padding:0;display:flex;flex-direction:column}.cards3 article:last-child{border-right:0}
.cards3 img{width:100%;aspect-ratio:141/150;object-fit:cover;border-bottom:1px solid #888}
.card-body{padding:18px 18px 22px;flex:1}.card-body h3{font-size:.95rem;font-weight:700;margin:0 0 .5rem}.card-body p{font-size:.85rem;color:#666;margin:0}
.bar{display:block;text-align:center;border-top:1px solid #888;padding:.55em;font-size:.72rem;font-weight:800;text-decoration:none;letter-spacing:.03em}.bar:hover{background:#111;color:#fff}
.sol{display:grid;grid-template-columns:1fr auto;gap:48px;align-items:center}
.sol h2{font-size:clamp(1.6rem,2.6vw,2.4rem);font-weight:700;margin:0 0 1rem}.sol p{color:#777;max-width:780px;margin:0}.sol b{color:#444}
.see-all{display:block;border:1px solid #888;padding:28px 34px 24px;font-weight:800;text-decoration:none;font-size:1rem;line-height:1.25;min-width:190px}.see-all span{display:block;font-size:1.6rem;margin-top:.4rem}.see-all:hover{background:#111;color:#fff}
main>section.collage{padding:0!important;background:#fff}
.masonry{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:#fff;align-items:start}.masonry .col{display:flex;flex-direction:column;gap:2px}.masonry img{width:100%;height:auto!important;object-fit:cover}
.reviews{background:#d9d9d9!important;color:#111!important;text-align:center;position:relative;padding:44px 8vw 50px!important}
.g-logo{display:block;margin:0 auto 10px}.stars{color:#f5c518;letter-spacing:.35em;font-size:1.1rem;margin-bottom:14px}
.reviews blockquote{font-size:clamp(1.2rem,2.1vw,1.85rem);font-weight:700;line-height:1.3;max-width:820px;color:#111}.reviews cite{font-style:normal;font-size:.85rem}
.rev-next,.rev-prev{position:absolute;top:50%;transform:translateY(-50%);background:none;border:0;font-size:1.2rem;cursor:pointer;color:#111}.rev-next{right:5vw}.rev-prev{left:5vw;opacity:.25}.rev-prev:hover{opacity:1}
.reviews .round-btns{display:none}
.plabel{color:#999;font-size:.8rem;margin:0 0 1.4rem}.phead{font-size:clamp(1.4rem,2.2vw,1.95rem);font-weight:700;margin-bottom:2.4rem}
.plans{max-width:1180px}.plan{grid-template-columns:1fr 200px 140px;border-top:0;border-bottom:1px solid #999;padding:30px 0 34px}.plan:last-child{border-bottom:0}
.plan h3{font-size:1.15rem;font-weight:700;margin:0 0 1.4rem;white-space:pre-wrap}.plan p{font-size:.78rem;color:#777;max-width:520px;margin:0}.amt{font-size:1.25rem;font-weight:700}.plan a{font-size:.75rem;font-weight:800;text-decoration:none;text-align:right}
.pitch{background:#000!important;color:#fff;text-align:left!important;padding:72px 12% 80px!important}
.pitch h2{font-size:clamp(2rem,4.2vw,3.6rem);font-weight:700;margin:0 0 2.4rem;max-width:none}
.pitch-row{display:flex;align-items:center;gap:40px;flex-wrap:wrap}.pitch-row p{max-width:520px;margin:0;font-size:1.05rem}
.btn-white{background:#fff;color:#000;font-weight:800;text-decoration:none;padding:.75em 1.3em;font-size:.85rem;letter-spacing:.02em}
.or-form{max-width:1567px;margin:0 auto;padding:0 5vw!important;font-weight:700;font-size:1.3rem;background:none}
@media(max-width:900px){.cards3{grid-template-columns:1fr}.cards3 article{border-right:0;border-bottom:1px solid #888}.sol{grid-template-columns:1fr}.see-all{justify-self:start}
 .plan{grid-template-columns:1fr auto;row-gap:10px}.plan>div{grid-column:1/-1}.plan a{text-align:right}.pitch{padding:48px 22px!important}.rev-next{right:10px}.rev-prev{left:10px}}
/* typography scale-up to match Figma proportions */
.hero{height:min(100vh,59vw)}
.intro p{font-size:clamp(1rem,1.45vw,1.3rem)}
.card-body h3{font-size:1.1rem}.card-body p{font-size:.98rem}.bar{font-size:.8rem}
.sol p{font-size:1.05rem}.see-all{font-size:1.15rem}
.reviews blockquote{font-size:clamp(1.3rem,2.5vw,2.25rem)}.reviews cite{font-size:.95rem}.g-logo{width:32px;height:32px}.stars{font-size:1.35rem}.rev-next{font-size:1.5rem}
.plan h3{font-size:clamp(1.1rem,1.6vw,1.45rem)}.plan p{font-size:.9rem}.amt{font-size:1.55rem}.plan a{font-size:.85rem}.plabel{font-size:.9rem}.phead{font-size:clamp(1.5rem,2.6vw,2.4rem)}
.pitch h2{font-size:clamp(2rem,4.8vw,4.2rem)}.pitch-row p{font-size:1.25rem}.btn-white{font-size:1rem}
/* Services + solutions + collage + stats = one white container (per David) */
.combined{background:#fff;max-width:1567px;width:calc(100% - 10vw);margin:40px auto}
.combined>section.wrap{background:#fff;margin:0;max-width:none;padding:56px 5vw}
.combined>section.solutions{padding-top:24px}
.combined>section.collage{padding:24px 5vw!important}
.combined>section.stats{background:#fff;padding-top:48px}
@media(max-width:900px){.combined{width:calc(100% - 24px);margin:20px auto}.combined>section.wrap{padding:36px 18px}.combined>section.collage{padding:12px 18px!important}}
/* Stats: 3-column grid per David's reference */
.combined>section.stats{display:grid;grid-template-columns:1.1fr 1.4fr;gap:40px;align-items:center}
.st-head h2{font-size:clamp(2rem,3.2vw,3rem);font-weight:700;margin:0 0 1rem;max-width:12ch}.st-head p{color:#777;max-width:440px;margin:0}
.st-grid{display:grid;grid-template-columns:auto minmax(220px,300px);column-gap:36px;row-gap:34px;align-items:center;justify-content:end}
.st-grid .num{font-size:clamp(2.6rem,4vw,3.8rem);font-weight:800;text-align:right;line-height:1}
.st-lab b{font-size:.85rem}.st-lab p{color:#888;font-size:.85rem;margin:.5rem 0 0}
@media(max-width:900px){.combined>section.stats{grid-template-columns:1fr}.st-grid{justify-content:start;grid-template-columns:auto 1fr;column-gap:20px}}
/* Collage: all 3 columns share one straight top and bottom edge */
.masonry{height:clamp(420px,62vw,900px);align-items:stretch}
.masonry .col{height:100%;min-height:0}
.masonry img{aspect-ratio:auto!important;min-height:0;height:auto!important;object-fit:cover;flex:1 1 0}
.masonry .col:nth-child(1) img:nth-child(1){flex-grow:385}.masonry .col:nth-child(1) img:nth-child(2){flex-grow:719}
.masonry .col:nth-child(2) img:nth-child(1){flex-grow:731}.masonry .col:nth-child(2) img:nth-child(2){flex-grow:385}
.masonry .col:nth-child(3) img:nth-child(1){flex-grow:385}.masonry .col:nth-child(3) img:nth-child(2){flex-grow:775}
@media(max-width:900px){.masonry{height:clamp(300px,110vw,620px)}}
/* Why you'll love us + footer (rebuilt as HTML) */
main>section.love{background:#f2f2f2!important;display:grid;grid-template-columns:1fr 340px;gap:60px;align-items:start;padding:72px 8vw!important}
.love-text{align-self:center}.love-text h2{font-size:clamp(1.9rem,3vw,2.8rem);font-weight:700;margin:0 0 1.4rem}.love-text p{color:#777;max-width:520px;font-size:1.05rem;margin:0}
.love-card img{width:100%;aspect-ratio:1;object-fit:cover;border:1px solid #888}
.love-brand{font-weight:800;font-size:1.25rem;margin:1.4rem 0 1rem}.love-tag{color:#777;font-size:.85rem;margin:0}
.foot{background:#fff!important;color:#111;display:block;min-height:0;padding:0;font-weight:400;position:relative;border-top:4px solid #555;margin:40px auto 0;max-width:1567px;width:calc(100% - 10vw)}
.foot-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;padding:56px 8vw 40px}
.foot-h{font-weight:800;margin:0 0 1.2rem}.foot-intro{color:#777;font-size:.85rem;max-width:440px;margin:0 0 1.3rem}
.socials{display:flex;gap:10px;list-style:none;margin:0;padding:0}.socials li:has(a[href=""]){display:none}
.socials a{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#f2f2f2}.socials svg{width:14px;height:14px;fill:none;stroke:#555;stroke-width:2}
.foot-line{font-size:.85rem;color:#555;margin:0 0 .8rem}.foot-line:empty{display:none}
.copy{border-top:1px solid #eee;text-align:center;color:#999;font-size:.75rem;margin:0;padding:16px}
.to-top{position:absolute;right:28px;bottom:44px;width:40px;height:40px;border-radius:50%;background:#0f1d2e;display:grid;place-items:center}.to-top svg{width:18px;fill:none;stroke:#fff;stroke-width:2.5}
@media(max-width:900px){main>section.love{grid-template-columns:1fr;padding:44px 22px!important}.love-card{max-width:340px}.foot{width:calc(100% - 24px);margin-top:20px}.foot-grid{grid-template-columns:1fr;padding:40px 22px 30px}.to-top{right:16px;bottom:60px}}
/* hide-on-scroll nav */
.nav{transform:translateY(0);transition:transform .3s ease,background .3s;will-change:transform}
.nav.nav-hidden{transform:translateY(-100%)}
@media (prefers-reduced-motion:reduce){.nav{transition:none}}
/* ===== Motion (only active with html.motion, set by JS when motion allowed) ===== */
.motion .rv-title .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.motion .rv-title .wi{display:inline-block;transform:translateY(105%);opacity:0;transition:transform .8s cubic-bezier(.2,.7,.2,1),opacity .8s}
.motion .rv-title.in .wi{transform:none;opacity:1}
.motion .rv-title{will-change:transform}
.motion .rv{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.motion .rv.in{opacity:1;transform:none}
.motion .stars.rv{transform:scale(.6)}.motion .stars.rv.in{transform:none;transition-timing-function:ease,cubic-bezier(.3,1.6,.5,1)}
.motion .grid img{animation:rvUp .6s cubic-bezier(.2,.7,.2,1) both}
.motion .grid img:nth-child(2){animation-delay:.06s}.motion .grid img:nth-child(3){animation-delay:.12s}.motion .grid img:nth-child(4){animation-delay:.18s}.motion .grid img:nth-child(5){animation-delay:.24s}.motion .grid img:nth-child(6){animation-delay:.3s}.motion .grid img:nth-child(7){animation-delay:.36s}.motion .grid img:nth-child(8){animation-delay:.42s}
@keyframes rvUp{from{opacity:0;transform:translateY(20px)}}
/* collage: photos drift inside their frames (edges stay straight) */
.collage .col{overflow:hidden}.collage .col img{transform:translate3d(0,var(--py,0),0) scale(1.1)}
/* hover joy (pointer devices only) */
@media (hover:hover) and (prefers-reduced-motion:no-preference){
 .services article img,.grid img,.collage .col img,.love-card img{transition:transform .5s cubic-bezier(.2,.7,.2,1),filter .5s}
 .services article{overflow:hidden}.services article:hover img,.grid img:hover,.love-card img:hover{transform:scale(1.04)}
 .collage .col img:hover{transform:translate3d(0,var(--py,0),0) scale(1.15)}
 .btn,.btn-outline,button,.to-top{transition:transform .25s ease,background .25s,color .25s}
 .btn:hover,.btn-outline:hover,button:hover{transform:translateY(-2px)}.to-top:hover{transform:translateY(-3px)}
}
@media (prefers-reduced-motion:reduce){.collage .col img{transform:none}}
.cat.on,.cat:hover,.cat:focus-visible{box-shadow:inset 0 0 0 2px #111;outline:none}
.nav.scrolled{background:rgba(250,248,244,.78);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#111;box-shadow:0 1px 0 #0000000f}.nav.scrolled .btn-outline{border-color:#111;color:#111}.nav.scrolled a{color:#111}
html,body{background:#e6e6e6}
.round-btns .round{width:0;height:0;border-radius:0;background:transparent;box-shadow:none;padding:0;border-style:solid;border-color:transparent;filter:drop-shadow(0 1px 3px #0004);transition:transform .2s}
.round-btns .round[data-dir="-1"]{border-width:18px 26px 18px 0;border-right-color:#fff}
.round-btns .round[data-dir="1"]{border-width:18px 0 18px 26px;border-left-color:#fff}
.round-btns{gap:22px;align-items:center}.round-btns .round:hover{transform:scale(1.15)}
.hero-ui .round-btns{gap:14px}
.hero-ui .round-btns .round[data-dir="-1"]{border-width:6px 9px 6px 0}
.hero-ui .round-btns .round[data-dir="1"]{border-width:6px 0 6px 9px}
.hero-ui .round-btns .round{filter:none}
main>section.design{background:#efefef!important;padding:28px 5vw 40px!important}
.design-eye{font-size:.7rem;font-weight:700;margin:0 0 14px}
.design-imgs{display:grid;grid-template-columns:1.35fr 1fr .95fr;gap:6px;align-items:start}
.design-imgs img{width:100%;aspect-ratio:auto;object-fit:cover;display:block}.design-imgs img:nth-child(3){max-width:95%}
.design-row{display:grid;grid-template-columns:2fr 1fr;gap:56px;align-items:start;margin-top:18px}
.design-h{font-size:clamp(1.4rem,2.4vw,2.1rem);font-weight:700;line-height:1.3;margin:0}
.design-row p{font-size:.8rem;color:#555;margin:0 0 12px}
.design-btn{display:inline-block;border:1px solid #111;color:#111;text-decoration:none;text-transform:uppercase;font-size:.7rem;font-weight:700;padding:.55em 1.6em;letter-spacing:.04em}
@media(max-width:900px){.design-imgs,.design-row{grid-template-columns:1fr}.design-row{gap:16px}}
.design-imgs{grid-template-columns:450fr 368fr 316fr;gap:4px;align-items:stretch}.design-imgs img,.design-imgs img:nth-child(3){max-width:none;height:100%;object-fit:cover}
.design-imgs img:nth-child(2){object-fit:cover;object-position:left center;background:#dcdcdc}
.reviews cite{display:flex;flex-direction:column;align-items:center;gap:8px;font-style:normal}.rev-av{width:48px;height:48px;border-radius:50%;object-fit:cover;box-shadow:0 2px 8px #0002}
.review.active{animation:revIn .6s ease}@keyframes revIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.review.active{animation:none}}

/* tweaks 2026-10-20 */
.cat.on,.cat:hover,.cat:focus-visible{box-shadow:inset 0 0 0 1px #111;outline:none}
main>section.pitch{margin-bottom:0!important}
main>section#book{margin-top:0!important;scroll-margin-top:70px}
.book-side .or-form{max-width:none;margin:0 0 .4rem;padding:0!important;font-weight:700;font-size:.95rem;text-align:left;background:none}

/* tweaks2 2026-10-20 */
main>section.love{margin-bottom:0!important}
.foot{margin-top:0!important;border-top:4px solid #555!important;background:#f2f2f2!important}
.foot .copy{border-top:1px solid #e2e2e2}
.foot-email{color:inherit;text-decoration:underline;text-underline-offset:2px}.foot-email:hover{color:#111}
.design-row{grid-template-columns:1fr minmax(220px,300px);column-gap:56px}
.cat{position:relative}
.cat.on,.cat:hover,.cat:focus-visible{box-shadow:none;outline:none}
.cat.on::after,.cat:hover::after,.cat:focus-visible::after{content:"";position:absolute;top:-1px;bottom:-1px;left:-1px;right:-1px;border:1px solid #111;pointer-events:none;z-index:1}
@media(max-width:900px){.design-row{grid-template-columns:1fr}.foot{margin-top:0!important}}
/* Headshot slide: subject aligned to circle per Figma (measured from 1024x604 frame: hair top 11.6%H, subject width 0.91H = circle diameter) */
.slide[style*="--bg:#393e41"] .p-subj .in{height:96.3%;bottom:-7.9%;left:50%;margin-left:-1.46vh}
@media(max-width:900px){.slide[style*="--bg:#393e41"] .p-subj .in{height:auto;bottom:0;margin-left:0}}
/* tweak4: hero background word mirrors Figma (frame 1567x925; TEXT box full frame width, centered,
   top 244-246px = 26.4-26.6% of frame; SF Pro 700, letter-spacing 0, line-height 1.193; solid fills) */
.hero{container-type:inline-size}
.p-word .in{top:26.5%;transform:none;font-family:"SF Pro Display","SF Pro",-apple-system,"Inter","Helvetica Neue",Arial,sans-serif;font-weight:700;letter-spacing:0;line-height:1.1934;color:var(--wc,rgba(255,255,255,.42))}
.slide[style*="#d5d4d2"] .p-word .in{color:var(--wc)}
@keyframes wordIn{from{opacity:0;transform:translateX(-6%)}to{opacity:1;transform:none}}
@media(max-width:900px){.p-word .in{font-size:var(--fs);top:30%}}
.p-word .in{left:-50%;right:-50%}

/* Services card hover: image cross-fade, gray body, BOOK NOW! hover state */
.cards3 .svc-media{position:relative;overflow:hidden;border-bottom:1px solid #888}
.cards3 .svc-media img{display:block;border-bottom:0}
.cards3 .svc-media .svc-alt{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .45s ease,transform .5s cubic-bezier(.2,.7,.2,1)}
.cards3 .card-body{transition:background .3s ease}
.cards3 .bar{transition:background .3s ease,color .3s ease}
.cards3 article:hover .svc-alt,.cards3 article:focus-within .svc-alt,.cards3 article.hov .svc-alt{opacity:1}
.cards3 article:hover .card-body,.cards3 article:focus-within .card-body,.cards3 article.hov .card-body{background:#d9d9d9}
.cards3 article:hover .bar,.cards3 article:focus-within .bar,.cards3 article.hov .bar{background:#111;color:#fff}
.cards3 article:focus{outline:none}.cards3 article:focus-visible{outline:2px solid #111;outline-offset:-2px}
.two label.full{grid-column:1/-1}
[hidden]{display:none!important}
/* SEO pass: footer socials + service area */
.socials a{transition:background .2s}.socials a:hover,.socials a:focus-visible{background:#e2e2e2}.socials a:hover svg{stroke:#111}
.foot-area{color:#777!important}
.cards3 .svc-media img:not(.svc-alt){height:auto;aspect-ratio:141/150;object-fit:cover}.cards3 .svc-media .svc-alt{object-fit:cover}
@media(min-width:700px){.gf-h span{white-space:nowrap}.gf-h{font-size:clamp(1.8rem,4.2vw,3.4rem)}}