:root{--ink:#130508;--wine:#440d17;--red:#d32e48;--blush:#f4b6b0;--paper:#f4eee6;--pink:#fa839e;--line:rgba(244,238,230,.2);--mono:"DM Mono",monospace;--sans:"Manrope",sans-serif;--serif:"Bodoni Moda",serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--paper);font-family:var(--sans);overflow-x:hidden}body:before{content:"";position:fixed;inset:0;z-index:10;pointer-events:none;background:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:4.5rem 4.5rem;mask-image:linear-gradient(180deg,black,transparent 70%)}a{color:inherit;text-decoration:none}.section{width:min(90%,1300px);margin:auto}.site-header{position:fixed;inset:0 0 auto;z-index:20;height:5.4rem;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;transition:.3s}.site-header.is-scrolled{background:rgba(19,5,8,.82);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.brand{font-size:1.25rem;font-weight:800;letter-spacing:-.08em}.brand span,.header-contact{color:var(--pink)}nav{display:flex;gap:2rem;text-transform:uppercase;font-size:.7rem;font-weight:700;letter-spacing:.1em}.header-contact{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em}.cursor-glow{position:fixed;z-index:-1;width:23rem;height:23rem;border-radius:50%;background:radial-gradient(circle,rgba(229,51,84,.15),transparent 66%);pointer-events:none;transform:translate(-50%,-50%)}.hero{position:relative;min-height:100svh;overflow:hidden;background:radial-gradient(circle at 50% 36%,#741526,#350a13 34%,#130508 74%);isolation:isolate}.hero-grid{position:absolute;inset:0;opacity:.27;background:linear-gradient(90deg,transparent 49.94%,rgba(255,255,255,.23) 50%,transparent 50.06%),linear-gradient(0deg,transparent 49.94%,rgba(255,255,255,.12) 50%,transparent 50.06%);background-size:25% 100%,100% 16.7%}.hero-meta{position:absolute;top:7.5rem;z-index:4;font:500 .61rem/1.6 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--blush)}.left{left:5vw}.right{right:5vw;text-align:right}.hero-title,.hero-outline{position:absolute;left:50%;transform:translateX(-51%);white-space:nowrap;font:800 clamp(9rem,25vw,26rem)/.68 var(--sans);letter-spacing:-.13em}.hero-title{top:19%;z-index:0;color:#e55470;animation:title 1.1s both}.hero-outline{top:47%;z-index:3;color:transparent;-webkit-text-stroke:1px rgba(244,238,230,.63);animation:title 1.1s .12s both}.hero-portrait{position:absolute;z-index:2;inset:10% 0 0;display:flex;justify-content:center;align-items:end}.hero-portrait img{position:absolute;bottom:8%;height:68%;width:min(50rem,68vw);object-fit:contain;object-position:center bottom;mix-blend-mode:lighten;filter:contrast(1.08) saturate(.92) drop-shadow(0 2.2rem 1.6rem rgba(0,0,0,.48));animation:portrait 1.2s .1s both}.ring{position:absolute;width:min(48vw,41rem);aspect-ratio:1;border:1px solid rgba(244,238,230,.26);border-radius:50%}.one{transform:rotateX(68deg);bottom:16%;animation:spin 18s linear infinite}.two{width:min(34vw,29rem);bottom:26%;border-color:rgba(250,131,158,.55);animation:spin 12s linear infinite reverse}.hero-copy{position:absolute;z-index:5;left:5vw;bottom:17vh;width:min(25rem,34vw)}.kicker{margin:0 0 1.2rem;font:500 .67rem var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--pink)}h1,h2{margin:0;font:600 clamp(3rem,6vw,6.8rem)/.95 var(--serif);letter-spacing:-.07em}em{font-weight:500;color:var(--blush)}.hero h1{font-size:clamp(2.7rem,5vw,5.5rem)}.hero-foot{position:absolute;z-index:5;right:5vw;bottom:3.7rem;left:5vw;display:flex;justify-content:space-between;align-items:end;border-top:1px solid var(--line);padding-top:1.3rem}.hero-foot p{width:18rem;margin:0;color:#e3c6bf;font-size:.8rem;line-height:1.6}.round{display:grid;place-items:center;width:3.25rem;height:3.25rem;border:1px solid var(--line);border-radius:50%;font-size:1.3rem}.manifesto{display:grid;grid-template-columns:.8fr 1.5fr 1fr;gap:3rem;padding:10rem 0 9rem}.section-label,.overline{font:500 .67rem var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--pink)}.side{align-self:end}.side p,.rate-head>p,.brands-head>p{color:#d8c0ba;font-size:.9rem;line-height:1.7}.text-link{font-size:.78rem;font-weight:700}.signal{display:grid;grid-template-columns:.75fr 2fr;gap:4rem;padding:7rem 0;border-top:1px solid var(--line)}.signal h2{font-size:clamp(2.6rem,4vw,4.6rem)}.signal-grid{display:grid;grid-template-columns:repeat(2,1fr);margin:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}.signal-grid div{min-height:13rem;padding:1.5rem;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}dt,.signal-grid span{font:500 .63rem var(--mono);text-transform:uppercase;letter-spacing:.08em;color:#cbaaa4}.signal-grid dd{margin:1.6rem 0 .6rem;font:600 clamp(3rem,5vw,5rem)/.8 var(--serif);letter-spacing:-.08em;color:var(--pink)}.formats{padding:9rem 0;background:var(--paper);color:var(--ink);overflow:hidden}.formats-intro{display:flex;justify-content:space-between;align-items:end;padding-bottom:3.5rem}.formats h2{max-width:8ch}.formats-intro>p{width:18rem;font-size:.85rem;line-height:1.7}.format-rail{display:flex;width:max-content;gap:1px;padding-left:5vw}.format{width:20rem;height:28rem;padding:1.5rem;display:flex;flex-direction:column;justify-content:space-between;border:1px solid rgba(19,5,8,.12);transition:.45s}.format:hover{transform:translateY(-1rem) rotate(-2deg)}.format span{font:500 .65rem var(--mono)}.format h3{margin:0;font:700 3.4rem/.82 var(--sans);letter-spacing:-.09em}.format p{width:13rem;margin:0;font-size:.8rem;line-height:1.6}.rose{background:#e25072}.cream{background:#e9e2d6}.red{background:#b21f3a;color:#fff}.black{background:#1b1518;color:#fff}.pink{background:#f899ae}.diary{display:grid;grid-template-columns:1fr 1.35fr;gap:5rem;padding:11rem 0}.diary-head{position:sticky;top:8rem;align-self:start}.diary-head h2{font-size:clamp(3rem,5vw,5.5rem)}.diary-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.1rem;align-items:start}.diary-grid img{width:100%;aspect-ratio:3/4;object-fit:cover;filter:saturate(.78) contrast(1.08);transition:.7s}.diary-grid img:nth-child(even){margin-top:5rem}.diary-grid img:hover{transform:scale(1.06);filter:saturate(1.1)}.brands{display:grid;grid-template-columns:.85fr 1.45fr;gap:5rem;padding:8rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.brands-head h2{font-size:clamp(3rem,5vw,5.6rem)}.brand-cloud{display:flex;align-content:center;justify-content:center;flex-wrap:wrap;gap:.75rem;min-height:24rem}.brand-cloud span{display:grid;place-items:center;min-width:8.5rem;height:4rem;padding:.7rem 1rem;border:1px solid var(--line);border-radius:100%;font-weight:700;font-size:.86rem;text-align:center;transition:.3s}.brand-cloud span:nth-child(3n){border-radius:.3rem}.brand-cloud span:nth-child(4n){font-family:var(--serif);font-size:1.25rem}.brand-cloud span:hover{background:var(--pink);color:var(--ink);transform:rotate(-5deg) scale(1.08)}.rates{display:grid;grid-template-columns:.8fr 1.5fr;gap:4rem;padding:10rem 0}.rate-head{position:sticky;top:8rem;align-self:start}.rate-main{position:relative;overflow:hidden;background:var(--paper);color:var(--ink);padding:clamp(1.5rem,4vw,3.5rem)}.rate-main:after{content:"STEPH";position:absolute;right:-.1em;bottom:-.23em;color:rgba(178,31,58,.1);font:800 clamp(8rem,20vw,16rem)/1 var(--sans);letter-spacing:-.13em}.rate-title,.addons,.rate-main>ul,.rate-note{position:relative;z-index:1}.rate-title{display:flex;justify-content:space-between;gap:1rem;padding-bottom:1.4rem;border-bottom:1px solid rgba(19,5,8,.18)}.rate-title h3,.addons h3{margin:0;font:700 clamp(1.7rem,3vw,3rem)/1 var(--sans);letter-spacing:-.08em}.rate-title strong,dd{font:500 .8rem var(--mono)}.rate-main>ul{padding:0;list-style:none;columns:2;column-gap:2rem}.rate-main li{position:relative;padding:.75rem 0 .75rem 1.25rem;border-bottom:1px solid rgba(19,5,8,.1);font-size:.8rem;line-height:1.35}.rate-main li:before{content:"+";position:absolute;left:0;color:var(--red);font-weight:800}.addons{margin-top:2.5rem;padding-top:2rem;border-top:2px solid var(--ink)}.addons dl{margin:1.5rem 0 0}.addons dl div{display:flex;justify-content:space-between;gap:1rem;padding:.8rem 0;border-bottom:1px solid rgba(19,5,8,.13);font-size:.82rem}.addons dd{margin:0}.rate-note{margin:1.8rem 0 0;font-size:.68rem}.contact{padding:10rem 0 4rem;background:radial-gradient(circle at 85% 5%,#7e1d31,transparent 30%)}.contact h2{max-width:12ch}.contact-row{display:flex;justify-content:space-between;align-items:end;gap:2rem;margin-top:5rem;padding-top:1.4rem;border-top:1px solid var(--line)}.email{font:600 clamp(1.4rem,3.2vw,3.3rem)/1 var(--serif);letter-spacing:-.06em}.socials{display:flex;gap:1rem;font:500 .68rem var(--mono);text-transform:uppercase;letter-spacing:.08em}.reveal{opacity:0;transform:translateY(2rem);transition:opacity .8s,transform .8s}.reveal.is-visible{opacity:1;transform:none}@keyframes portrait{from{opacity:0;transform:translateY(4rem) scale(.98)}to{opacity:1;transform:none}}@keyframes title{from{opacity:0;transform:translate(-51%,3rem)}to{opacity:1;transform:translateX(-51%)}}@keyframes spin{to{transform:rotateX(68deg) rotate(360deg)}}@media(max-width:800px){.site-header{height:4.5rem;padding:0 1.25rem}nav{display:none}.section{width:calc(100% - 2.5rem)}.hero{min-height:45rem}.hero-meta{top:6rem;font-size:.53rem}.left{left:1.25rem}.right{right:1.25rem}.hero-title{top:23%;font-size:clamp(7.3rem,29vw,12rem)}.hero-outline{top:47%;font-size:clamp(7.3rem,29vw,12rem)}.hero-portrait{inset:14% -20% 0}.hero-portrait img{width:108%;height:59%;bottom:12%}.ring{width:78vw}.two{width:55vw}.hero-copy{left:1.25rem;bottom:10.5rem;width:75%}.hero h1{font-size:3rem}.hero-foot{right:1.25rem;bottom:1.5rem;left:1.25rem}.hero-foot p{width:14rem;font-size:.7rem}.manifesto,.signal,.brands,.rates{grid-template-columns:1fr;gap:2rem}.manifesto,.brands,.rates{padding:6rem 0}.signal{padding:5rem 0}.signal-grid{grid-template-columns:1fr 1fr}.signal-grid div{min-height:9rem;padding:1rem}.signal-grid dd{font-size:2.7rem}.formats{padding:6rem 0}.formats-intro{display:block;padding-bottom:2.5rem}.formats-intro>p{width:auto;margin-top:1.5rem}.format-rail{padding-left:1.25rem}.format{width:16rem;height:22rem}.format h3{font-size:2.7rem}.diary{grid-template-columns:1fr;gap:3rem;padding:6rem 0}.diary-head{position:static}.diary-grid img:nth-child(even){margin-top:2rem}.brand-cloud{min-height:auto;justify-content:start}.brand-cloud span{min-width:6.6rem;height:3.3rem;font-size:.68rem}.rate-head{position:static}.rate-main>ul{columns:1}.contact{padding:6rem 1.25rem 2.5rem}.contact-row{display:block;margin-top:3rem}.socials{margin-top:2rem;flex-wrap:wrap}.cursor-glow{display:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
/* Keep all five content formats visible, with motion instead of horizontal clipping. */
@media (min-width:801px){.format-rail{display:grid;width:100%;grid-template-columns:repeat(5,minmax(0,1fr));padding:0 5vw}.format{width:auto;height:30rem;overflow:hidden;position:relative}.format:before{content:"";position:absolute;inset:-120% -55%;background:linear-gradient(110deg,transparent 42%,rgba(255,255,255,.22) 50%,transparent 58%);transform:translateX(-85%) rotate(8deg);animation:format-sheen 7s ease-in-out infinite}.format:nth-child(2):before{animation-delay:-1.2s}.format:nth-child(3):before{animation-delay:-2.4s}.format:nth-child(4):before{animation-delay:-3.6s}.format:nth-child(5):before{animation-delay:-4.8s}.format>*{position:relative;z-index:1}.format h3{font-size:clamp(2rem,3.1vw,3.4rem)}.format p{width:auto}.format:hover{transform:translateY(-.85rem) rotate(-1.5deg) scale(1.02);box-shadow:0 1.4rem 2.5rem rgba(28,4,9,.22)}}
@keyframes format-sheen{0%,58%,100%{transform:translateX(-85%) rotate(8deg)}78%{transform:translateX(105%) rotate(8deg)}}

/* Distinct dark-section gradients keep the editorial rhythm without sacrificing readability. */
.manifesto{background:radial-gradient(circle at 82% 18%,rgba(169,38,61,.2),transparent 29%),linear-gradient(135deg,#160508 0%,#2a0810 58%,#110407 100%)}
.signal{background:radial-gradient(circle at 12% 70%,rgba(198,47,73,.18),transparent 29%),linear-gradient(110deg,#0e0305,#25070e 58%,#160509)}
.brands{background:radial-gradient(circle at 78% 45%,rgba(244,182,176,.1),transparent 23%),linear-gradient(145deg,#170509,#3a0b15 56%,#160508)}
.rates{background:radial-gradient(circle at 15% 20%,rgba(211,46,72,.2),transparent 30%),linear-gradient(125deg,#180509,#26070d 65%,#110407)}

/* A campaign-builder treatment replaces the static rate-sheet layout. */
.rates{align-items:start}.rate-experience{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:1rem;min-height:47rem;padding:1.2rem;overflow:hidden;background:linear-gradient(140deg,#b81d3b,#57101c 56%,#22060b);isolation:isolate}.rate-orbit{position:absolute;border:1px solid rgba(255,238,230,.28);border-radius:50%;pointer-events:none}.orbit-a{width:34rem;height:34rem;right:-12rem;top:-12rem;animation:rate-orbit 18s linear infinite}.orbit-b{width:21rem;height:21rem;left:-8rem;bottom:-10rem;border-style:dashed;animation:rate-orbit 12s linear infinite reverse}.focus-card{position:relative;display:flex;min-height:27rem;padding:1.6rem;flex-direction:column;justify-content:space-between;overflow:hidden;background:var(--paper);color:var(--ink);transform:rotate(-1.5deg);box-shadow:1rem 1rem 0 rgba(19,5,8,.2)}.focus-card:before{content:"TIKTOK";position:absolute;right:-.1em;bottom:-.3em;color:rgba(211,46,72,.1);font:800 8rem/.8 var(--sans);letter-spacing:-.13em}.focus-top{display:flex;justify-content:space-between;font:500 .62rem var(--mono);letter-spacing:.08em;text-transform:uppercase}.price{font:700 1rem var(--mono)}.price small{font-size:.57rem}.focus-card h3{position:relative;margin:0;font:800 clamp(3.7rem,6vw,6.5rem)/.73 var(--sans);letter-spacing:-.13em}.focus-card h3 em{color:var(--red)}.focus-card p{position:relative;max-width:15rem;margin:0;font-size:.78rem;line-height:1.55}.focus-stamp{position:absolute;right:1.5rem;bottom:1.5rem;display:grid;place-items:center;width:5.4rem;height:5.4rem;border:1px solid var(--red);border-radius:50%;font:600 .55rem/1.25 var(--mono);letter-spacing:.08em;text-align:center;text-transform:uppercase;transform:rotate(12deg)}.deliverable-flow{display:flex;grid-column:1/-1;align-content:center;flex-wrap:wrap;gap:.6rem;padding:1.2rem;background:rgba(19,5,8,.28);backdrop-filter:blur(8px)}.deliverable-flow span{padding:.62rem .8rem;border:1px solid rgba(255,255,255,.26);border-radius:999px;color:#fff5f0;font-size:.68rem;font-weight:700;animation:tag-float 4s ease-in-out infinite}.deliverable-flow span:nth-child(2n){animation-delay:-1.3s}.deliverable-flow span:nth-child(3n){animation-delay:-2.4s}.addons-deck{display:grid;align-content:start;gap:.5rem;padding:1.4rem;background:rgba(24,5,9,.5);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(12px)}.addons-title{padding-bottom:.8rem}.addons-title .kicker{color:var(--blush);margin-bottom:.5rem}.addons-title h3{margin:0;font:700 2.2rem/.82 var(--sans);letter-spacing:-.1em}.addon-chip{display:flex;justify-content:space-between;align-items:center;gap:.6rem;width:100%;padding:.8rem;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.07);color:var(--paper);font:500 .67rem var(--mono);text-align:left;transition:transform .25s,background .25s}.addon-chip:hover{transform:translateX(.45rem) rotate(-1deg);background:var(--paper);color:var(--ink)}.addon-chip strong{display:flex;gap:.35rem;font-weight:500}.addon-chip b{font-weight:700}.rate-experience .rate-note{grid-column:1/-1;margin:0;color:#f5c8c2;font:500 .59rem var(--mono);letter-spacing:.04em}@keyframes rate-orbit{to{transform:rotate(360deg)}}@keyframes tag-float{50%{transform:translateY(-.25rem)}}@media(max-width:800px){.rate-experience{grid-template-columns:1fr;min-height:auto}.focus-card{min-height:22rem}.deliverable-flow{grid-column:auto}.addons-deck{grid-column:auto}.rate-experience .rate-note{grid-column:auto}.focus-card h3{font-size:4.2rem}}

/* Hero entrance sequence: Steph arrives before the editorial interface. */
.hero-portrait img{animation:portrait .82s cubic-bezier(.2,.8,.2,1) both}
.hero-title{animation:title .78s .68s cubic-bezier(.2,.8,.2,1) both}
.hero-outline{animation:title .78s .88s cubic-bezier(.2,.8,.2,1) both}
.hero-meta{opacity:0;animation:hero-fade .55s 1.16s ease both}
.hero-copy{opacity:0;animation:hero-fade .7s 1.3s cubic-bezier(.2,.8,.2,1) both}
.hero-foot{opacity:0;animation:hero-fade .65s 1.48s ease both}
.ring{opacity:0;animation:ring-in .45s .48s ease both,spin 18s 1.1s linear infinite}
.ring.two{animation:ring-in .45s .58s ease both,spin 12s 1.1s linear infinite reverse}
@keyframes hero-fade{from{opacity:0;transform:translateY(1rem)}to{opacity:1;transform:none}}
@keyframes ring-in{to{opacity:1}}

.format{cursor:pointer}.format:after{content:"Open �";position:absolute;top:1.35rem;right:1.2rem;z-index:2;opacity:0;font:700 .58rem var(--mono);letter-spacing:.08em;text-transform:uppercase;transition:opacity .25s}.format:hover:after,.format:focus-visible:after{opacity:1}.format:focus-visible{outline:3px solid var(--ink);outline-offset:-.45rem}

/* Mobile-first tuning: touch-friendly rails, stable image space, and no horizontal page overflow. */
@media(max-width:800px){
  body{overflow-x:clip}
  .hero{min-height:42rem}
  .hero-portrait{inset:8.5rem -13% 0}
  .hero-portrait img{width:112%;height:61%;bottom:8%}
  .hero-copy{bottom:8.6rem;width:70%}
  .hero h1{font-size:clamp(2.55rem,11vw,3.5rem)}
  .hero-foot{gap:.8rem}
  .hero-foot p{max-width:13.5rem}
  .formats-intro h2{font-size:clamp(3rem,14vw,4.8rem)}
  .format-rail{width:100%;max-width:100%;overflow-x:auto;overflow-y:visible;padding:0 1.25rem 1.2rem;scroll-snap-type:x mandatory;scroll-padding-inline:1.25rem;scrollbar-width:thin}
  .format{flex:0 0 min(78vw,19rem);width:min(78vw,19rem);scroll-snap-align:start}
  .format:last-child{margin-right:1.25rem}
  .signal-grid{overflow:hidden}
  .diary-grid{gap:.8rem}
  .diary-grid img{min-width:0}
  .brand-cloud{gap:.55rem}
  .rate-experience{padding:.75rem}
  .addon-chip{min-height:3rem}
  .addon-chip strong{align-items:flex-end;flex-direction:column;gap:.12rem}
}

/* Hero revision: graphic media-kit cover with a Brittany-style handwriting fallback. */
.hero.hero--kit{min-height:100svh;background:linear-gradient(125deg,#591427 0%,#481020 52%,#2e0914 100%);overflow:hidden;isolation:isolate}
.hero--kit:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 67% 28%,rgba(193,222,232,.13),transparent 23%),radial-gradient(circle at 25% 80%,rgba(255,241,181,.12),transparent 31%);pointer-events:none}
.hero--kit .hero-grid{display:none}
.kit-grid{position:absolute;inset:0;opacity:.35;background:linear-gradient(90deg,transparent 49.93%,rgba(255,255,255,.17) 50%,transparent 50.07%),linear-gradient(0deg,transparent 49.93%,rgba(255,255,255,.11) 50%,transparent 50.07%);background-size:20% 100%,100% 18%}
.kit-edition{position:absolute;z-index:4;top:7.4rem;right:5vw;margin:0;color:#fff1b5;font:500 .62rem/1.6 var(--mono);letter-spacing:.1em;text-align:right;text-transform:uppercase;animation:kit-fade .55s .9s both}
.kit-word{position:absolute;z-index:0;top:21%;left:50%;display:flex;transform:translateX(-51%);font:900 clamp(10rem,28vw,29rem)/.67 Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif;letter-spacing:-.09em;white-space:nowrap;user-select:none}
.kit-word span{display:block;animation:kit-word-in .8s cubic-bezier(.2,.8,.2,1) both}.kit-word span:nth-child(1){animation-delay:.15s}.kit-word span:nth-child(2){animation-delay:.24s}.kit-word span:nth-child(3){animation-delay:.33s}.kit-word span:nth-child(4){animation-delay:.42s}.kit-word span:nth-child(5){animation-delay:.51s}
.kit-word .cream{color:#fff1b5}.kit-word .sky{color:#c1dee8}
.kit-media{position:absolute;z-index:4;top:17%;left:10.5%;margin:0;color:#fff1b5;font:400 clamp(3rem,7vw,7.5rem)/.7 "Brittany Signature","Allura",cursive;transform:rotate(-10deg);animation:kit-fade .7s .8s both}.kit-media i{color:#c1dee8;font-style:inherit}
.kit-portrait{position:absolute;z-index:3;right:8%;bottom:0;width:min(47vw,41rem);height:87%;display:flex;align-items:end;justify-content:center;pointer-events:none}
.kit-portrait:after{content:"";position:absolute;inset:auto 5% 5% 5%;height:12%;background:radial-gradient(ellipse,rgba(11,0,4,.52),transparent 68%);filter:blur(10px);z-index:-1}
.kit-portrait img{display:block;max-width:100%;max-height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 1.8rem 1.6rem rgba(20,2,8,.3));animation:kit-portrait-in .9s cubic-bezier(.2,.8,.2,1) both}
.kit-content{position:absolute;z-index:5;left:5vw;bottom:5.5rem;animation:kit-fade .65s 1s both}.kit-content p{margin:0;color:#fff1b5;font:600 clamp(1.05rem,1.7vw,1.45rem)/1.15 var(--sans);letter-spacing:-.04em;text-transform:uppercase}.kit-content p span{color:#c1dee8}
.kit-socials{display:flex;gap:.6rem;margin-top:1.1rem}.kit-socials a{display:grid;place-items:center;width:2.2rem;height:2.2rem;border:1px solid rgba(255,241,181,.55);border-radius:50%;color:#fff1b5;transition:transform .25s,background .25s,color .25s}.kit-socials a:hover{background:#c1dee8;color:#591427;transform:translateY(-.25rem)}.kit-socials svg{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-width:1.7}
.kit-scroll{position:absolute;z-index:5;right:5vw;bottom:5.5rem;display:flex;align-items:center;gap:.7rem;color:#c1dee8;font:600 .62rem var(--mono);letter-spacing:.1em;text-transform:uppercase;animation:kit-fade .65s 1.08s both}.kit-scroll span{display:grid;place-items:center;width:2.1rem;height:2.1rem;border:1px solid rgba(193,222,232,.55);border-radius:50%;font-size:1rem;animation:kit-bob 2.6s ease-in-out infinite}
@keyframes kit-portrait-in{from{opacity:0;transform:translateY(3rem) scale(.97)}to{opacity:1;transform:none}}@keyframes kit-word-in{from{opacity:0;transform:translateY(2rem)}to{opacity:1;transform:none}}@keyframes kit-fade{from{opacity:0;transform:translateY(1rem)}to{opacity:1;transform:none}}@keyframes kit-bob{50%{transform:translateY(.3rem)}}
@media(max-width:800px){.hero.hero--kit{min-height:46rem}.kit-edition{top:5.9rem;right:1.25rem;font-size:.5rem}.kit-word{top:22%;font-size:clamp(7rem,29vw,12rem);transform:translateX(-51%)}.kit-media{top:19%;left:8%;font-size:clamp(2.7rem,13vw,4.5rem)}.kit-portrait{right:-4%;width:92vw;height:68%}.kit-content{left:1.25rem;bottom:2rem}.kit-content p{font-size:1rem}.kit-scroll{right:1.25rem;bottom:2rem;font-size:.5rem}.kit-scroll{max-width:7rem;text-align:right}.kit-scroll span{flex:none}}

/* Refined hero type hierarchy: one color per word and a longer, airier STEPH wordmark. */
.kit-word{font-weight:400;letter-spacing:-.015em;transform:translateX(-51%) scaleX(1.12);transform-origin:center}
.kit-word span{margin-right:.018em}
.kit-word .cream,.kit-word .sky{color:#fff1b5}
.kit-media,.kit-media i{color:#c1dee8}
@media(max-width:800px){.kit-word{transform:translateX(-51%) scaleX(1.04);letter-spacing:-.02em}.kit-word span{margin-right:.008em}}

/* Thin condensed display lettering, with the hero grid removed. */
.kit-grid{display:none}
.kit-word{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-weight:300;letter-spacing:-.035em;transform:translateX(-51%) scaleX(1.17)}
.kit-word span{margin-right:.008em}
@media(max-width:800px){.kit-word{font-weight:300;transform:translateX(-51%) scaleX(1.06)}}

/* Balanced hero type weight and higher-contrast social controls. */
.kit-word{font-size:clamp(11rem,30vw,31rem);font-weight:400;letter-spacing:-.025em;transform:translateX(-51%) scaleX(1.1)}
.kit-word .cream,.kit-word .sky{background:transparent}
.kit-socials{gap:.8rem;margin-top:1.25rem}
.kit-socials a{width:2.75rem;height:2.75rem;border:2px solid rgba(255,241,181,.85);box-shadow:0 .3rem .8rem rgba(13,1,6,.18)}
.kit-socials svg{width:1.3rem;height:1.3rem;stroke-width:2.25}
@media(max-width:800px){.kit-word{font-size:clamp(8rem,32vw,13rem);font-weight:400;transform:translateX(-51%) scaleX(1.03)}.kit-socials a{width:2.55rem;height:2.55rem}}

/* Centered cropped portrait and a bold ice-sky STEPH wordmark. */
.kit-word{font-family:Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif;font-size:clamp(11rem,29vw,30rem);font-weight:900;letter-spacing:-.075em;transform:translateX(-51%) scaleX(1.03)}
.kit-word .cream,.kit-word .sky{color:#c1dee8;background:transparent}
.kit-portrait{left:50%;right:auto;bottom:0;width:min(62vw,55rem);height:82%;align-items:flex-start;overflow:hidden;transform:translateX(-50%)}
.kit-portrait img{width:100%;max-width:none;max-height:none;height:auto;object-fit:contain;object-position:center top}
.kit-portrait:after{left:12%;right:12%;bottom:1%;opacity:.7}
@media(max-width:800px){.kit-word{font-size:clamp(8.5rem,33vw,13.5rem);font-weight:900;letter-spacing:-.07em;transform:translateX(-51%) scaleX(1)}.kit-portrait{width:105vw;height:73%;right:auto;left:50%;transform:translateX(-50%)}.kit-portrait img{width:100%}.kit-content{z-index:6}}

/* Media Kit uses the requested lemon-cream accent. */
.kit-media,.kit-media i{color:#fff1b5}

/* Slightly airier STEPH letter spacing. */
.kit-word{letter-spacing:-.025em;transform:translateX(-51%) scaleX(.98)}
@media(max-width:800px){.kit-word{letter-spacing:-.035em;transform:translateX(-51%) scaleX(.96)}}

/* Per-letter spacing prevents the heavy Impact glyphs from touching. */
.kit-word{letter-spacing:0;transform:translateX(-51%) scaleX(.93)}
.kit-word span{margin-right:.045em}.kit-word span:last-child{margin-right:0}
@media(max-width:800px){.kit-word{transform:translateX(-51%) scaleX(.9)}.kit-word span{margin-right:.03em}}

/* Section two: a cinematic Who Am I profile card. */
.who-section{padding:8rem 0}
.who-card{position:relative;display:grid;grid-template-columns:1.15fr .85fr;min-height:42rem;overflow:hidden;background:linear-gradient(135deg,#240912,#591427 57%,#3c0d1b);border:1px solid rgba(255,241,181,.18);box-shadow:0 1.8rem 5rem rgba(8,0,3,.28)}
.who-card:before{content:"STEPH";position:absolute;left:-.07em;bottom:-.25em;color:rgba(193,222,232,.08);font:900 16rem/.8 Impact,Haettenschweiler,sans-serif;letter-spacing:-.08em;pointer-events:none}
.who-copy{position:relative;z-index:2;padding:clamp(2rem,5vw,5rem)}
.who-copy h2{font-size:clamp(4rem,7vw,7.6rem);color:#fff1b5}.who-copy h2 em{color:#c1dee8}
.who-intro{max-width:35rem;margin:1.4rem 0 0;color:#fff8df;font-size:clamp(.92rem,1.2vw,1.08rem);line-height:1.65}
.who-signal{display:flex;flex-wrap:wrap;gap:.55rem;margin:2rem 0 2.1rem}.who-signal span{padding:.52rem .7rem;border:1px solid rgba(193,222,232,.4);border-radius:999px;color:#c1dee8;font:600 .6rem var(--mono);letter-spacing:.07em;text-transform:uppercase}
.who-focus{display:grid;grid-template-columns:max-content 1fr;gap:.8rem 1.3rem;padding-top:1.4rem;border-top:1px solid rgba(255,241,181,.22)}.who-focus p{margin:0;color:#fff1b5;font:600 .6rem var(--mono);letter-spacing:.08em;text-transform:uppercase}.who-focus strong{color:#fffdf1;font-size:.77rem;line-height:1.35}
.who-photo{position:relative;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;background:radial-gradient(circle at 50% 28%,rgba(193,222,232,.4),transparent 27%),#c1dee8}
.who-photo:before{content:"";position:absolute;inset:1.25rem;border:1px solid rgba(89,20,39,.28);pointer-events:none}.who-photo img{position:relative;z-index:1;width:108%;max-width:none;max-height:95%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 1.5rem 1.5rem rgba(41,5,17,.35));animation:who-portrait 6s ease-in-out infinite}.who-photo-label{position:absolute;z-index:3;top:2rem;right:2rem;color:#591427;font:700 .65rem/1.4 var(--mono);letter-spacing:.1em;text-align:right;text-transform:uppercase}.who-signature{position:absolute;z-index:3;right:1.8rem;bottom:1.3rem;margin:0;color:#fff1b5;font:400 4rem/1 "Brittany Signature","Allura",cursive;transform:rotate(-8deg)}
@keyframes who-portrait{50%{transform:translateY(-.6rem)}}
@media(max-width:800px){.who-section{padding:5rem 0}.who-card{grid-template-columns:1fr;min-height:0}.who-copy{padding:2rem 1.5rem 2.5rem}.who-copy h2{font-size:4.4rem}.who-intro{font-size:.9rem}.who-focus{grid-template-columns:1fr;gap:.35rem}.who-focus p{margin-top:.7rem}.who-photo{min-height:29rem}.who-photo img{width:90%;max-height:105%}.who-photo-label{top:1.5rem;right:1.5rem}}

/* Desktop Who Am I is intentionally one complete viewport, with no unused portrait space. */
@media(min-width:801px){
  .who-section{height:100svh;min-height:42rem;padding:0;display:flex;align-items:stretch}
  .who-card{width:100%;min-height:0;height:100%;grid-template-columns:1.1fr .9fr}
  .who-copy{display:flex;flex-direction:column;justify-content:center;padding-block:3rem}
  .who-photo{align-items:flex-end}
  .who-photo img{width:auto;height:108%;max-width:none;max-height:none;object-fit:contain;object-position:center bottom}
  .who-photo:before{inset:1rem}
}
@media(max-width:800px){.who-section{height:auto;min-height:0}}

/* Who Am I intentionally spans edge to edge. */
.who-section{width:100%;max-width:none;margin:0}

/* Full, uncropped supplied portrait in the hero. */
.kit-portrait{height:84%;overflow:visible;align-items:flex-end}
.kit-portrait img{width:auto;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center bottom}
@media(max-width:800px){.kit-portrait{height:70%;width:94vw}.kit-portrait img{width:auto;height:100%;max-width:100%;object-fit:contain}}

/* Outlined display treatment for the Who Am I title. */
.who-copy h2{font-family:Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif;font-size:clamp(4.6rem,8vw,8.6rem);font-weight:400;line-height:.8;letter-spacing:.025em;color:transparent;-webkit-text-stroke:1.5px #fff1b5;text-stroke:1.5px #fff1b5;text-shadow:0 .25rem .6rem rgba(7,0,3,.18)}
.who-copy h2 em{font-style:normal;color:transparent;-webkit-text-stroke:1.5px #c1dee8;text-stroke:1.5px #c1dee8}
@media(max-width:800px){.who-copy h2{font-size:clamp(4.4rem,19vw,6.3rem);-webkit-text-stroke:1px #fff1b5;text-stroke:1px #fff1b5}.who-copy h2 em{-webkit-text-stroke:1px #c1dee8;text-stroke:1px #c1dee8}}

/* Let the transparent Who Am I portrait sit directly on the section garnet background. */
.who-photo{background:transparent}
.who-photo:before{border-color:rgba(255,241,181,.2)}

/* Reference-inspired condensed title for the Who Am I section. */
.who-copy h2{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:clamp(4.4rem,8vw,8.4rem);font-weight:900;font-stretch:condensed;line-height:.78;letter-spacing:-.065em;text-transform:uppercase;color:#f58bb1;-webkit-text-stroke:0;text-stroke:0;text-shadow:none}
.who-copy h2 em{font-style:normal;color:inherit;-webkit-text-stroke:0;text-stroke:0}
@media(max-width:800px){.who-copy h2{font-size:clamp(4rem,18vw,6rem);letter-spacing:-.055em}}

/* Make the profile signature legible without crowding the portrait. */
.who-signature{font-size:clamp(4.8rem,6vw,6.5rem)}
@media(max-width:800px){.who-signature{font-size:4.8rem;right:1.2rem;bottom:1rem}}

/* Airier, more readable Who Am I body copy. */
.who-intro{font-size:clamp(1rem,1.35vw,1.18rem);letter-spacing:.012em;line-height:1.72}
.who-signal span{font-size:.65rem;letter-spacing:.1em}
.who-focus p{font-size:.65rem;letter-spacing:.11em}
.who-focus strong{font-size:.86rem;letter-spacing:.012em;line-height:1.45}
@media(max-width:800px){.who-intro{font-size:1rem;letter-spacing:.01em}.who-focus strong{font-size:.84rem}}

/* Tighter text-to-portrait composition with airier Who Am I typography. */
.who-copy h2{letter-spacing:-.035em}
.who-intro{letter-spacing:.025em}
.who-signal span{letter-spacing:.13em}
.who-focus p{letter-spacing:.14em}
.who-focus strong{letter-spacing:.025em}
@media(min-width:801px){.who-card{grid-template-columns:1fr 1fr}.who-photo{margin-left:-3.25rem}.who-photo img{left:-3%;position:relative}}
@media(max-width:800px){.who-copy h2{letter-spacing:-.04em}.who-intro{letter-spacing:.018em}.who-photo{margin-left:0}.who-photo img{left:auto}}

/* Section four: Steph's niche, built as an editorial three-part composition. */
.niche-section{position:relative;overflow:hidden;background:radial-gradient(circle at 52% 35%,rgba(193,222,232,.14),transparent 17%),radial-gradient(circle at 88% 12%,rgba(247,139,177,.18),transparent 26%),linear-gradient(125deg,#150408,#500e20 53%,#240812);color:#fff1b5}
.niche-section:before{content:"";position:absolute;inset:1.1rem;border:1px solid rgba(255,241,181,.14);pointer-events:none}
.niche-frame{position:relative;display:grid;grid-template-columns:minmax(13rem,.7fr) minmax(16rem,.8fr) minmax(18rem,1.25fr);min-height:43rem;align-items:center;padding:5.5rem 2.5rem 3rem}
.niche-menu{position:relative;z-index:2;align-self:center}.niche-menu .kicker{color:#f58bb1}.niche-menu ul{display:grid;gap:.65rem;max-width:16rem;margin:0;padding:0;list-style:none}.niche-menu li{display:flex;align-items:center;gap:.8rem;min-height:3.25rem;padding:.7rem 1rem;border:1px solid rgba(255,241,181,.42);border-radius:999px;background:rgba(32,5,13,.22);color:#fff1b5;font:700 clamp(.95rem,1.4vw,1.22rem)/1 "Barlow Condensed","Arial Narrow",sans-serif;letter-spacing:.045em;text-transform:uppercase;transition:transform .35s,background .35s,color .35s}.niche-menu li span{color:#c1dee8;font:500 .56rem var(--mono);letter-spacing:.06em}.niche-menu li:nth-child(2),.niche-menu li:nth-child(4){margin-left:1.5rem}.niche-menu li:hover{background:#fff1b5;color:#591427;transform:translateX(.55rem)}
.niche-portrait{position:relative;z-index:1;align-self:end;height:100%;min-height:34rem;margin:0;display:flex;align-items:flex-end;justify-content:center;pointer-events:none}.niche-portrait:before{content:"";position:absolute;bottom:5%;width:82%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(193,222,232,.28),transparent 66%);filter:blur(5px)}.niche-portrait img{position:relative;z-index:1;width:120%;max-width:none;max-height:39rem;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 1.8rem 1.4rem rgba(11,0,4,.44));animation:niche-float 6s ease-in-out infinite}.niche-portrait figcaption{position:absolute;z-index:2;bottom:2.1rem;left:50%;transform:translateX(-50%);width:max-content;color:#c1dee8;font:500 .56rem var(--mono);letter-spacing:.13em;text-transform:uppercase}
.niche-copy{position:relative;z-index:2;padding:2rem 0 3rem}.niche-eyebrow{margin:0 0 1rem;color:#c1dee8;font:600 .62rem var(--mono);letter-spacing:.14em;text-transform:uppercase}.niche-copy h2{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:clamp(4.6rem,8vw,8.7rem);font-weight:900;line-height:.68;letter-spacing:-.07em;text-transform:uppercase;color:#f58bb1}.niche-copy h2 em{display:block;color:#fff1b5;font:inherit}.niche-copy h3{margin:.9rem 0 1.5rem;color:#c1dee8;font:700 clamp(1.25rem,2.15vw,2rem)/.95 "Barlow Condensed","Arial Narrow",sans-serif;letter-spacing:.02em;text-transform:uppercase}.niche-copy>p:not(.niche-eyebrow){max-width:31rem;margin:0;color:#fff8df;font-size:clamp(.98rem,1.2vw,1.12rem);line-height:1.72;letter-spacing:.015em}.niche-stamp{position:absolute;right:1rem;bottom:-.5rem;display:grid;place-items:center;width:6.3rem;aspect-ratio:1;border:1px solid rgba(193,222,232,.62);border-radius:50%;color:#c1dee8;font:600 .58rem/1.35 var(--mono);letter-spacing:.08em;text-align:center;text-transform:uppercase;transform:rotate(12deg)}
@keyframes niche-float{50%{transform:translateY(-.7rem) rotate(-.45deg)}}
@media(max-width:800px){.niche-section:before{inset:.65rem}.niche-frame{width:100%;display:grid;grid-template-columns:1fr;min-height:0;padding:5rem 1.5rem 2.5rem}.niche-menu{grid-row:2;margin-top:1.5rem}.niche-menu ul{max-width:none;grid-template-columns:1fr 1fr;gap:.5rem}.niche-menu li{min-height:3.4rem;padding:.55rem .7rem;font-size:1rem}.niche-menu li:nth-child(2),.niche-menu li:nth-child(4){margin-left:0}.niche-portrait{grid-row:1;min-height:26rem;height:26rem;margin:0 -1.5rem}.niche-portrait img{width:auto;height:100%;max-height:none}.niche-portrait figcaption{bottom:1rem}.niche-copy{grid-row:3;padding:3rem 0 1rem}.niche-copy h2{font-size:clamp(4.5rem,22vw,6.5rem)}.niche-stamp{right:0;bottom:0;width:5.3rem}.niche-copy>p:not(.niche-eyebrow){padding-right:.25rem}}

/* Loosen the My Niche display lettering for a cleaner editorial read. */
.niche-copy h2{letter-spacing:-.02em}
.niche-copy h3{letter-spacing:.055em}
@media(max-width:800px){.niche-copy h2{letter-spacing:-.015em}.niche-copy h3{letter-spacing:.045em}}

/* Collaboration logos use a size hierarchy: feature partners lead the mosaic. */
.brand-mosaic{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:8rem;gap:.8rem;align-content:center}
.brand-tile{position:relative;display:grid;place-items:center;min-width:0;margin:0;overflow:hidden;border:1px solid rgba(255,241,181,.16);border-radius:.65rem;background:#f8f5ed;box-shadow:0 .8rem 1.8rem rgba(9,1,4,.16);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.brand-tile--feature{grid-column:span 2;grid-row:span 2}.brand-tile--wide{grid-column:span 2}
.brand-tile img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.brand-tile--feature img{object-fit:cover}.brand-tile figcaption{position:absolute;right:.55rem;bottom:.45rem;margin:0;padding:.24rem .38rem;border-radius:999px;background:rgba(19,5,8,.72);color:#fff1b5;font:500 .48rem var(--mono);letter-spacing:.07em;text-transform:uppercase;opacity:0;transform:translateY(.3rem);transition:opacity .25s,transform .25s}
.brand-tile:hover{z-index:2;transform:translateY(-.45rem) rotate(-.6deg);box-shadow:0 1.25rem 2.5rem rgba(9,1,4,.34)}.brand-tile:hover img{transform:scale(1.055)}.brand-tile:hover figcaption{opacity:1;transform:none}
@media(max-width:800px){.brands{gap:2.5rem}.brand-mosaic{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:7.5rem;gap:.6rem}.brand-tile--feature{grid-column:span 2;grid-row:span 2}.brand-tile--wide{grid-column:span 2}.brand-tile figcaption{opacity:1;transform:none;font-size:.44rem}}

/* Split-screen logo gallery: the portrait anchors the story while each logo stays legible. */
.brand-showcase{width:min(90%,1400px);display:grid;grid-template-columns:minmax(19rem,.82fr) minmax(34rem,1.18fr);gap:0;padding:0;overflow:hidden;border:1px solid rgba(255,241,181,.18);background:#f4eee6;box-shadow:0 1.8rem 4.5rem rgba(8,0,3,.25)}
.brand-portrait-panel{position:relative;min-height:52rem;margin:0;overflow:hidden;background:#160509}.brand-portrait-panel:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(16,2,7,.68));pointer-events:none}.brand-portrait-panel img{width:100%;height:100%;object-fit:cover;object-position:52% center;filter:saturate(.84) contrast(1.04);transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}.brand-portrait-panel:hover img{transform:scale(1.035)}.brand-portrait-panel figcaption{position:absolute;z-index:1;right:1.3rem;bottom:1.15rem;color:#fff1b5;font:600 .62rem var(--mono);letter-spacing:.12em;text-transform:uppercase}.brand-portrait-panel figcaption span{color:#f58bb1}
.brands-gallery{min-width:0;padding:clamp(1.7rem,3vw,3.5rem);color:#22070e;background:radial-gradient(circle at 94% 4%,rgba(193,222,232,.5),transparent 25%),#f4eee6}.brands-gallery .brands-head{display:flex;align-items:end;justify-content:space-between;gap:1.5rem;margin-bottom:2.2rem}.brands-gallery .brands-head .kicker{color:#9a2942}.brands-gallery .brands-head h2{color:#260812;font-size:clamp(3.3rem,5vw,5.7rem);line-height:.78}.brands-gallery .brands-head h2 em{color:#ba3150}.brands-gallery .brands-head>p:last-child{max-width:15rem;margin:0;color:#5d3540;font-size:.82rem;line-height:1.55}
.brand-showcase .brand-mosaic{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:clamp(7rem,8.5vw,8.8rem);gap:.75rem;align-content:start}.brand-showcase .brand-tile{display:grid;place-items:center;margin:0;overflow:hidden;border:1px solid rgba(38,8,18,.12);border-radius:.7rem;background:#fffdf8;box-shadow:0 .35rem .8rem rgba(52,15,24,.1);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}.brand-showcase .brand-tile--feature{grid-column:span 2;grid-row:span 2}.brand-showcase .brand-tile--wide{grid-column:span 2;grid-row:auto}.brand-showcase .brand-tile img,.brand-showcase .brand-tile--feature img{width:100%;height:100%;padding:.7rem;object-fit:contain;transform:none;transition:transform .35s cubic-bezier(.2,.8,.2,1)}.brand-showcase .brand-tile--feature img{padding:0;object-fit:cover}.brand-showcase .brand-tile figcaption{right:.45rem;bottom:.4rem;display:block;margin:0;padding:.22rem .36rem;border-radius:.22rem;background:rgba(32,6,14,.82);color:#fff1b5;font:600 .46rem var(--mono);letter-spacing:.055em;text-transform:uppercase;opacity:1;transform:none}.brand-showcase .brand-tile:hover{z-index:2;transform:translateY(-.3rem);box-shadow:0 .8rem 1.5rem rgba(52,15,24,.2)}.brand-showcase .brand-tile:hover img{transform:scale(1.035)}
@media(max-width:800px){.brand-showcase{width:calc(100% - 2.5rem);grid-template-columns:1fr;overflow:visible}.brand-portrait-panel{min-height:32rem}.brand-portrait-panel img{object-position:center 36%}.brands-gallery{padding:2rem 1.25rem}.brands-gallery .brands-head{display:block}.brands-gallery .brands-head>p:last-child{margin-top:1rem}.brand-showcase .brand-mosaic{grid-auto-rows:clamp(6.3rem,29vw,8rem);gap:.55rem}.brand-showcase .brand-tile figcaption{font-size:.42rem}}

/* Compact one-viewport partner wall: every logo remains fully visible. */
.brand-showcase .brand-tile figcaption{display:none}
.brand-showcase .brand-tile--feature{grid-column:span 2;grid-row:auto}
.brand-showcase .brand-tile--wide{grid-column:span 2;grid-row:auto}
.brand-showcase .brand-tile img,.brand-showcase .brand-tile--feature img{padding:.8rem;object-fit:contain}
@media(min-width:801px){.brand-showcase{height:100svh;min-height:42rem;max-height:58rem}.brand-portrait-panel{height:100%;min-height:0}.brands-gallery{height:100%;overflow:hidden;display:flex;flex-direction:column;padding:clamp(1.25rem,2.25vw,2.6rem)}.brands-gallery .brands-head{flex:none;margin-bottom:clamp(.9rem,1.6vw,1.5rem)}.brands-gallery .brands-head h2{font-size:clamp(3rem,4.2vw,4.8rem)}.brands-gallery .brands-head>p:last-child{font-size:.76rem}.brand-showcase .brand-mosaic{flex:1;grid-template-rows:repeat(4,minmax(0,1fr));grid-auto-rows:auto;min-height:0;gap:.6rem}.brand-showcase .brand-tile{min-height:0}}
@media(max-width:800px){.brand-showcase .brand-tile img,.brand-showcase .brand-tile--feature img{padding:.55rem;object-fit:contain}}

/* Never stretch partner artwork: preserve each logo's native aspect ratio and full mark. */
.brand-showcase .brand-tile img,.brand-showcase .brand-tile--feature img{display:block;width:auto!important;height:auto!important;max-width:calc(100% - 1.25rem);max-height:calc(100% - 1.25rem);padding:0!important;object-fit:initial!important;object-position:center!important;transform:none!important}
@media(min-width:801px){.brand-showcase{height:calc(100svh - 5.4rem);min-height:40rem;max-height:54rem}.brand-showcase .brand-mosaic{grid-template-rows:repeat(4,minmax(0,1fr))}}
@media(max-width:800px){.brand-showcase .brand-tile img,.brand-showcase .brand-tile--feature img{max-width:calc(100% - .9rem);max-height:calc(100% - .9rem)}}

/* Final logo rendering: background containment avoids grid-image crop behavior entirely. */
.brand-showcase .brand-tile{padding:.65rem;background-color:#fffdf8;background-repeat:no-repeat;background-position:center;background-size:contain;background-origin:content-box;background-clip:content-box}
.brand-showcase .brand-tile img{display:none!important}
.brand-showcase .brand-tile figcaption{display:block!important;position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.brand-showcase .brand-tile:nth-child(1){background-image:url("/assets/brands/big-c.jpg")}.brand-showcase .brand-tile:nth-child(2){background-image:url("/assets/brands/aura-bangkok-clinic.png")}.brand-showcase .brand-tile:nth-child(3){background-image:url("/assets/brands/centralworld.png")}.brand-showcase .brand-tile:nth-child(4){background-image:url("/assets/brands/lolane.png")}.brand-showcase .brand-tile:nth-child(5){background-image:url("/assets/brands/labx.png")}.brand-showcase .brand-tile:nth-child(6){background-image:url("/assets/brands/truemoney.png")}.brand-showcase .brand-tile:nth-child(7){background-image:url("/assets/brands/issa-compass.png")}.brand-showcase .brand-tile:nth-child(8){background-image:url("/assets/brands/partner-c.jpg")}.brand-showcase .brand-tile:nth-child(9){background-image:url("/assets/brands/partner-pencils.jpg")}.brand-showcase .brand-tile:nth-child(10){background-image:url("/assets/brands/partner-violet.png")}

/* Equal-partner gallery: every collaboration receives the same clear visual weight. */
.brand-showcase .brand-mosaic{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(5,minmax(0,1fr));grid-auto-rows:auto;gap:.75rem}
.brand-showcase .brand-tile,.brand-showcase .brand-tile--feature,.brand-showcase .brand-tile--wide{grid-column:auto;grid-row:auto;border-radius:1rem;background-color:#fffdf8;box-shadow:0 .45rem 1rem rgba(52,15,24,.11)}
.brand-showcase .brand-tile:nth-child(3n+2){background-color:#fff8ed}.brand-showcase .brand-tile:nth-child(3n){background-color:#f8fbfc}.brand-showcase .brand-tile:hover{transform:translateY(-.25rem) rotate(-.3deg);box-shadow:0 .85rem 1.7rem rgba(52,15,24,.19)}
@media(max-width:800px){.brand-showcase .brand-mosaic{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(5,7.2rem);gap:.55rem}}

/* Cropped transparent marks remove the baked-in white canvas around horizontal logos. */
.brand-showcase .brand-tile{background-color:#fff1b5}.brand-showcase .brand-tile:nth-child(3n+2){background-color:#c1dee8}.brand-showcase .brand-tile:nth-child(3n){background-color:#f4b6b0}
.brand-showcase .brand-tile:nth-child(3){background-image:url("/assets/brands/centralworld-mark.png")}.brand-showcase .brand-tile:nth-child(4){background-image:url("/assets/brands/lolane-mark.png")}.brand-showcase .brand-tile:nth-child(5){background-image:url("/assets/brands/labx-mark.png")}.brand-showcase .brand-tile:nth-child(6){background-image:url("/assets/brands/truemoney-mark.png")}.brand-showcase .brand-tile:nth-child(7){background-image:url("/assets/brands/issa-compass-mark.png")}.brand-showcase .brand-tile:nth-child(10){background-image:url("/assets/brands/partner-violet-mark.png")}

/* Circular brand constellation, inspired by the media-kit collage rather than a boxed logo grid. */
.brands-gallery{background:radial-gradient(circle at 88% 14%,rgba(193,222,232,.28),transparent 25%),radial-gradient(circle at 19% 78%,rgba(245,139,177,.18),transparent 30%),linear-gradient(145deg,#3e0b19,#681632);color:#fff1b5}.brands-gallery .brands-head .kicker{color:#c1dee8}.brands-gallery .brands-head h2{color:#fff1b5}.brands-gallery .brands-head h2 em{color:#f58bb1}.brands-gallery .brands-head>p:last-child{color:#f8dedd}
.brand-showcase .brand-mosaic{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));grid-auto-rows:auto;gap:.35rem;align-items:center;justify-items:center}
.brand-showcase .brand-tile,.brand-showcase .brand-tile--feature,.brand-showcase .brand-tile--wide{width:clamp(4.7rem,7.2vw,7.3rem);aspect-ratio:1;min-height:0;margin:0;padding:.45rem;align-self:center;justify-self:center;overflow:hidden;border:1px solid rgba(255,241,181,.48);border-radius:50%;background-size:82% auto;background-origin:padding-box;background-clip:padding-box;box-shadow:0 .75rem 1.35rem rgba(10,1,5,.25);transition:transform .35s cubic-bezier(.2,.8,.2,1),filter .35s}
.brand-showcase .brand-tile:nth-child(1){width:clamp(6.4rem,10vw,10rem);background-size:94% auto}.brand-showcase .brand-tile:nth-child(2){width:clamp(5.1rem,7.7vw,7.8rem);background-size:100% auto}.brand-showcase .brand-tile:nth-child(3){width:clamp(4.5rem,6.2vw,6.3rem);background-size:86% auto}.brand-showcase .brand-tile:nth-child(4){width:clamp(5.5rem,8.2vw,8.2rem);background-size:100% auto}.brand-showcase .brand-tile:nth-child(5){width:clamp(4.4rem,5.8vw,5.9rem)}.brand-showcase .brand-tile:nth-child(6){width:clamp(5.6rem,8.5vw,8.4rem);background-size:80% auto}.brand-showcase .brand-tile:nth-child(7){width:clamp(4.6rem,6.2vw,6.4rem);background-size:80% auto}.brand-showcase .brand-tile:nth-child(8){width:clamp(5.3rem,7.6vw,7.6rem);background-size:100% auto}.brand-showcase .brand-tile:nth-child(9){width:clamp(5rem,7vw,7rem);background-size:100% auto}.brand-showcase .brand-tile:nth-child(10){width:clamp(4.7rem,6.5vw,6.5rem);background-size:90% auto}
.brand-showcase .brand-tile:hover{z-index:3;transform:translateY(-.45rem) scale(1.08) rotate(-3deg);filter:brightness(1.08);box-shadow:0 1rem 1.8rem rgba(10,1,5,.34)}
@media(max-width:800px){.brands-gallery{background:radial-gradient(circle at 88% 10%,rgba(193,222,232,.28),transparent 26%),linear-gradient(145deg,#3e0b19,#681632)}.brand-showcase .brand-mosaic{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(4,7.4rem);gap:.4rem}.brand-showcase .brand-tile,.brand-showcase .brand-tile--feature,.brand-showcase .brand-tile--wide{width:clamp(4.5rem,23vw,6.2rem)}.brand-showcase .brand-tile:nth-child(n){width:clamp(4.5rem,23vw,6.2rem)}}

/* Partnership CTA lives at the end of the rate journey, before Steph's direct contacts. */
.collab-cta{display:grid;grid-template-columns:1.15fr .85fr;gap:2rem;align-items:end;margin-top:3.5rem;padding:clamp(1.35rem,3vw,2.4rem);border:1px solid rgba(255,241,181,.35);background:linear-gradient(120deg,rgba(255,241,181,.12),rgba(193,222,232,.1));box-shadow:.8rem .8rem 0 rgba(89,20,39,.36)}.collab-cta .kicker{margin-bottom:.7rem;color:#c1dee8}.collab-cta h3{margin:0;color:#fff1b5;font:600 clamp(2rem,3.8vw,4.1rem)/.82 var(--serif);letter-spacing:-.055em}.collab-cta h3 em{color:#f58bb1}.collab-cta>div>p:last-child{max-width:34rem;margin:1rem 0 0;color:#f8dedd;font-size:.9rem;line-height:1.6}.collab-actions{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}.collab-action{display:flex;min-height:7.2rem;padding:1rem;flex-direction:column;justify-content:space-between;border:1px solid rgba(255,241,181,.44);color:#fff1b5;transition:transform .3s,background .3s,color .3s}.collab-action span{font:700 1rem var(--sans);letter-spacing:-.04em}.collab-action b{display:flex;justify-content:space-between;gap:.5rem;font:600 .57rem var(--mono);letter-spacing:.05em;text-transform:uppercase}.collab-action i{font-style:normal;font-size:.9rem}.line-action{background:rgba(193,222,232,.11)}.whatsapp-action{background:rgba(245,139,177,.1)}.collab-action:hover{background:#fff1b5;color:#591427;transform:translateY(-.35rem)}
@media(max-width:800px){.collab-cta{grid-template-columns:1fr;gap:1.5rem;margin-top:2.5rem;padding:1.25rem}.collab-cta h3{font-size:clamp(2.3rem,12vw,3.7rem)}.collab-actions{grid-template-columns:1fr 1fr}.collab-action{min-height:6rem}.collab-action span{font-size:.9rem}.collab-action b{font-size:.5rem}}

/* Big C now fills its badge; staggered offsets create a balanced, non-rigid logo constellation. */
.brand-showcase .brand-tile:nth-child(1){background-color:#a6df00;background-image:url("/assets/brands/big-c-mark.png");background-size:105% auto;translate:.25rem .45rem}.brand-showcase .brand-tile:nth-child(2){translate:-.45rem .8rem}.brand-showcase .brand-tile:nth-child(3){translate:.55rem -.3rem}.brand-showcase .brand-tile:nth-child(4){translate:-.5rem .55rem}.brand-showcase .brand-tile:nth-child(5){translate:.55rem .15rem}.brand-showcase .brand-tile:nth-child(6){translate:-.35rem -.45rem}.brand-showcase .brand-tile:nth-child(7){translate:.45rem .8rem}.brand-showcase .brand-tile:nth-child(8){translate:-.45rem -.4rem}.brand-showcase .brand-tile:nth-child(9){translate:.55rem .3rem}.brand-showcase .brand-tile:nth-child(10){translate:-.2rem -.45rem}
@media(max-width:800px){.brand-showcase .brand-tile:nth-child(n){translate:0}}

/* Desktop logo field is deliberately free-form, not a disguised grid. */
@media(min-width:801px){.brand-showcase .brand-mosaic{position:relative!important;display:block!important;min-height:0}.brand-showcase .brand-tile,.brand-showcase .brand-tile--feature,.brand-showcase .brand-tile--wide{position:absolute;translate:0!important}.brand-showcase .brand-tile:nth-child(1){left:5%;top:3%}.brand-showcase .brand-tile:nth-child(2){left:37%;top:11%}.brand-showcase .brand-tile:nth-child(3){left:69%;top:2%}.brand-showcase .brand-tile:nth-child(4){left:75%;top:29%}.brand-showcase .brand-tile:nth-child(5){left:13%;top:37%}.brand-showcase .brand-tile:nth-child(6){left:43%;top:41%}.brand-showcase .brand-tile:nth-child(7){left:62%;top:54%}.brand-showcase .brand-tile:nth-child(8){left:2%;top:67%}.brand-showcase .brand-tile:nth-child(9){left:32%;top:70%}.brand-showcase .brand-tile:nth-child(10){left:75%;top:72%}}
@media(max-width:800px){.brand-showcase .brand-mosaic{display:grid!important}.brand-showcase .brand-tile,.brand-showcase .brand-tile--feature,.brand-showcase .brand-tile--wide{position:static}}

/* A compact collage keeps the playful irregularity without leaving dead space. */
@media(min-width:801px){.brand-showcase .brand-mosaic{width:min(100%,42rem);margin-inline:auto}.brand-showcase .brand-tile:nth-child(1){left:5%;top:6%}.brand-showcase .brand-tile:nth-child(2){left:30%;top:12%}.brand-showcase .brand-tile:nth-child(3){left:52%;top:3%}.brand-showcase .brand-tile:nth-child(4){left:72%;top:18%}.brand-showcase .brand-tile:nth-child(5){left:13%;top:40%}.brand-showcase .brand-tile:nth-child(6){left:36%;top:42%}.brand-showcase .brand-tile:nth-child(7){left:60%;top:48%}.brand-showcase .brand-tile:nth-child(8){left:2%;top:68%}.brand-showcase .brand-tile:nth-child(9){left:27%;top:70%}.brand-showcase .brand-tile:nth-child(10){left:54%;top:70%}}

/* LINE and WhatsApp become expressive message cards rather than plain outlined buttons. */
.collab-actions{position:relative;gap:.9rem;padding:.45rem .15rem}.collab-actions:before{content:"";position:absolute;left:50%;top:50%;width:7rem;height:7rem;border:1px dashed rgba(255,241,181,.35);border-radius:50%;transform:translate(-50%,-50%);animation:contact-orbit 13s linear infinite}.collab-action{position:relative;z-index:1;min-height:8.4rem;padding:1.1rem 1.15rem;overflow:hidden;border:0!important;border-radius:1.35rem;color:#260812!important;box-shadow:.55rem .65rem 0 rgba(26,3,10,.32);isolation:isolate}.collab-action:before{position:absolute;z-index:-1;right:-.75rem;bottom:-1.05rem;display:grid;place-items:center;width:4.6rem;height:4.6rem;border-radius:50%;font:800 .64rem var(--mono);letter-spacing:-.05em;transform:rotate(-12deg)}.collab-action:after{content:"";position:absolute;z-index:-2;inset:0;background:linear-gradient(145deg,rgba(255,255,255,.48),transparent 55%)}.line-action{background:linear-gradient(145deg,#dff5aa,#b7e855);transform:rotate(-2.2deg)}.line-action:before{content:"LINE";background:#05b53f;color:#fff}.whatsapp-action{margin-top:.65rem;background:linear-gradient(145deg,#bce8e3,#7ec8b9);transform:rotate(2.2deg)}.whatsapp-action:before{content:"WA";background:#20aa73;color:#fff;font-size:.86rem}.collab-action span{max-width:5.5rem;color:#2d1716;font:800 1.12rem/1 var(--sans);letter-spacing:-.065em}.collab-action b{align-items:center;color:#52212a;font:700 .53rem var(--mono);letter-spacing:.075em}.collab-action i{display:grid;place-items:center;width:1.55rem;height:1.55rem;border:1px solid currentColor;border-radius:50%;font-size:.72rem}.collab-action:hover{color:#260812!important;transform:translateY(-.55rem) rotate(0deg)!important;box-shadow:.75rem .9rem 0 rgba(26,3,10,.35)}@keyframes contact-orbit{to{transform:translate(-50%,-50%) rotate(360deg)}}
@media(max-width:800px){.collab-actions{gap:.7rem}.collab-actions:before{width:5.4rem;height:5.4rem}.collab-action{min-height:7rem;padding:.9rem;border-radius:1.1rem}.collab-action:before{width:3.7rem;height:3.7rem;right:-.65rem;bottom:-.8rem;font-size:.53rem}.collab-action span{font-size:.92rem}.collab-action b{font-size:.46rem}.whatsapp-action{margin-top:.45rem}}

/* Refined My Niche: stacked pills, a larger portrait, and the requested ice-sky / cream editorial palette. */
.niche-section{background:radial-gradient(circle at 50% 34%,rgba(193,222,232,.16),transparent 20%),linear-gradient(125deg,#150408,#500e20 53%,#240812)}
.niche-frame{grid-template-columns:minmax(12rem,.62fr) minmax(18rem,1fr) minmax(19rem,1.2fr);min-height:42rem;padding:2.5rem 2.25rem 1.8rem;align-items:end}.niche-menu{align-self:center}.niche-menu .kicker{color:#c1dee8}.niche-menu ul{max-width:14.5rem;gap:.72rem}.niche-menu li{min-height:3.45rem;padding:.74rem 1.05rem;border-color:rgba(193,222,232,.62);background:rgba(255,241,181,.1);color:#fff1b5;letter-spacing:.065em}.niche-menu li:nth-child(2),.niche-menu li:nth-child(4){margin-left:0}.niche-menu li:hover{background:#c1dee8;color:#591427;transform:translateX(.4rem)}
.niche-portrait{min-height:39rem;height:100%;justify-content:center}.niche-portrait img{width:142%;max-height:44rem}.niche-portrait:before{width:96%;background:radial-gradient(circle,rgba(193,222,232,.35),transparent 68%)}
.niche-copy{align-self:center;padding:1rem 0 2.7rem}.niche-copy h2{color:#c1dee8}.niche-copy h2 em{color:#fff1b5}.niche-copy h3{color:#c1dee8}.niche-copy>p:not(.niche-eyebrow){max-width:33rem;color:#fff8df;font-size:clamp(1.12rem,1.4vw,1.32rem);line-height:1.68;letter-spacing:.02em}.niche-stamp{right:-1.2rem;bottom:-1.05rem;width:8.8rem;border:2px solid rgba(193,222,232,.82);color:#fff1b5;font-size:.76rem;letter-spacing:.11em;line-height:1.45;box-shadow:0 .55rem 1.5rem rgba(12,1,5,.22)}
@media(max-width:800px){.niche-frame{padding:3rem 1.5rem 2rem}.niche-menu ul{grid-template-columns:1fr;max-width:100%}.niche-menu li{min-height:3.35rem}.niche-portrait{min-height:30rem;height:30rem}.niche-portrait img{width:116%;height:auto;max-height:none}.niche-copy>p:not(.niche-eyebrow){font-size:1.05rem}.niche-stamp{right:-.25rem;bottom:-.5rem;width:7rem;font-size:.64rem}}

/* The niche list follows a soft curve, and the stamp sits clear of the description. */
@media(min-width:801px){.niche-menu li:nth-child(1){transform:translateX(1.35rem)}.niche-menu li:nth-child(2){transform:translateX(.7rem)}.niche-menu li:nth-child(3){transform:translateX(0)}.niche-menu li:nth-child(4){transform:translateX(.7rem)}.niche-menu li:nth-child(5){transform:translateX(1.35rem)}.niche-menu li:hover{transform:translateX(1.1rem)}.niche-stamp{right:-4.6rem;bottom:0}.niche-copy>p:not(.niche-eyebrow){max-width:25rem}}
@media(max-width:800px){.niche-copy{padding-bottom:7rem}.niche-stamp{right:0;bottom:1rem}}

/* Give the niche label its own upper anchor and let the curved pills breathe. */
@media(min-width:801px){.niche-menu{align-self:stretch;padding-top:.35rem}.niche-menu .kicker{margin:0}.niche-menu ul{margin-top:4.5rem;gap:1.3rem}}
@media(max-width:800px){.niche-menu ul{gap:.8rem}}


/* Center the niche labels while the curve opens toward Steph's portrait and hand. */
@media(min-width:801px){
  .niche-menu li{position:relative;justify-content:center;padding-inline:2.5rem;text-align:center}
  .niche-menu li span{position:absolute;left:1.05rem}
  .niche-menu li:nth-child(1){transform:translateX(.15rem)}
  .niche-menu li:nth-child(2){transform:translateX(.95rem)}
  .niche-menu li:nth-child(3){transform:translateX(2.05rem)}
  .niche-menu li:nth-child(4){transform:translateX(.95rem)}
  .niche-menu li:nth-child(5){transform:translateX(.15rem)}
  .niche-menu li:nth-child(1):hover{transform:translate(.15rem,-.14rem)}
  .niche-menu li:nth-child(2):hover{transform:translate(.95rem,-.14rem)}
  .niche-menu li:nth-child(3):hover{transform:translate(2.05rem,-.14rem)}
  .niche-menu li:nth-child(4):hover{transform:translate(.95rem,-.14rem)}
  .niche-menu li:nth-child(5):hover{transform:translate(.15rem,-.14rem)}
}


/* Keep the Beauty pill at the outer tip, but bring the full niche arc toward the portrait. */
@media(min-width:801px){
  .niche-menu ul{margin-left:2.7rem}
  .niche-menu li{height:4.65rem;min-height:4.65rem;line-height:1.08}
}

/* Match every editorial section title to the Hero STEPH display treatment. */
main > section h2{
  font-family:Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif;
  font-weight:900;
  letter-spacing:-.055em;
  text-transform:uppercase;
}
main > section h2 em{font-style:normal}
@media(max-width:800px){
  main > section h2{letter-spacing:-.04em}
}


/* Open the list outwards: Beauty reaches the outer edge, while the ends return inward. */
@media(min-width:801px){
  .niche-menu ul{position:relative;top:1.8rem}
  .niche-menu li:nth-child(1){transform:translateX(2.05rem)}
  .niche-menu li:nth-child(2){transform:translateX(.95rem)}
  .niche-menu li:nth-child(3){transform:translateX(.15rem)}
  .niche-menu li:nth-child(4){transform:translateX(.95rem)}
  .niche-menu li:nth-child(5){transform:translateX(2.05rem)}
  .niche-menu li:nth-child(1):hover{transform:translate(2.05rem,-.14rem)}
  .niche-menu li:nth-child(2):hover{transform:translate(.95rem,-.14rem)}
  .niche-menu li:nth-child(3):hover{transform:translate(.15rem,-.14rem)}
  .niche-menu li:nth-child(4):hover{transform:translate(.95rem,-.14rem)}
  .niche-menu li:nth-child(5):hover{transform:translate(2.05rem,-.14rem)}
}

/* Wider display tracking keeps all section titles crisp rather than overlapping. */
main > section h2{
  letter-spacing:.035em;
  line-height:.88;
}
@media(max-width:800px){
  main > section h2{letter-spacing:.02em;line-height:.92}
}

/* Shift the complete niche pill arc left without changing its curve. */
@media(min-width:801px){.niche-menu ul{margin-left:.4rem}}


/* Carry the Hero STEPH display voice through the partnership callout and direct email. */
.collab-cta h3,
.email{
  font-family:Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif;
  font-weight:900;
  font-style:normal;
  letter-spacing:.025em;
  line-height:.92;
  text-transform:uppercase;
}
.collab-cta h3 em{font-style:normal}
.email{font-size:clamp(1.7rem,3vw,3rem);letter-spacing:.018em}
@media(max-width:800px){
  .collab-cta h3{letter-spacing:.018em}
  .email{font-size:clamp(1.35rem,7.1vw,2.2rem);letter-spacing:.012em}
}

/* Section two now uses the Hero STEPH display face in a single ice-blue tone. */
.who-copy h2,.who-copy h2 em{font-family:Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif;font-style:normal;font-weight:900;color:#c1dee8;-webkit-text-stroke:0;text-stroke:0;letter-spacing:.035em;line-height:.88}
@media(max-width:800px){.who-copy h2,.who-copy h2 em{letter-spacing:.02em;line-height:.92}}


/* Section five turns each content format into an image-led editorial card. */
.format{isolation:isolate}
.format-image{position:absolute!important;z-index:0!important;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.82;filter:saturate(.92) contrast(1.05);transition:transform .7s cubic-bezier(.2,.8,.2,1),filter .7s}
.format:after{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(180deg,rgba(12,3,7,.08),rgba(12,3,7,.2) 40%,rgba(12,3,7,.88));pointer-events:none}
.format > :not(.format-image){position:relative;z-index:2}
.format:hover .format-image{transform:scale(1.07);filter:saturate(1.08) contrast(1.08)}
.format.cream:after{background:linear-gradient(180deg,rgba(16,6,8,.08),rgba(16,6,8,.25) 40%,rgba(16,6,8,.83))}
.format.cream,.format.rose,.format.red,.format.black,.format.pink{color:#fffaf0}
.format.cream{color:#fffaf0}

/* Center the content overlay within each What She Makes card. */
.format{align-items:center;text-align:center}.format p{margin-inline:auto}

/* Keep format card copy centered, with the sequence number anchored left. */
.format > span{align-self:flex-start;text-align:left}


/* Mobile format cards stack cleanly instead of requiring a horizontal rail scroll. */
@media(max-width:800px){
  .formats{overflow:clip}
  .formats-intro{width:calc(100% - 2.5rem)}
  .format-rail{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    width:100%;
    max-width:100%;
    gap:1rem;
    padding:0 1.25rem;
    overflow:visible;
    scroll-snap-type:none;
  }
  .format{
    width:100%;
    min-height:0;
    height:clamp(18.5rem,76vw,24rem);
    flex:none;
    scroll-snap-align:none;
  }
  .format h3{font-size:clamp(2.35rem,12vw,4rem)}
  .format-image{opacity:.9}
  main > section{min-width:0}
  main > section h2{max-width:100%;overflow-wrap:anywhere}
}


/* A compact mobile My Niche composition: no oversized empty portrait field or long pill column. */
@media(max-width:800px){
  .niche-frame{padding:1.4rem 1.25rem 2.5rem}
  .niche-portrait{
    min-height:19rem;
    height:19rem;
    margin:0 -1.25rem;
    justify-content:center;
  }
  .niche-portrait img{
    width:104%;
    height:auto;
    max-height:23rem;
    object-position:center bottom;
  }
  .niche-portrait figcaption{bottom:.65rem}
  .niche-menu{margin-top:.75rem}
  .niche-menu .kicker{margin-bottom:1rem}
  .niche-menu ul{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:.65rem;
    max-width:none;
  }
  .niche-menu li{
    min-height:4.2rem;
    padding:.55rem .6rem;
    font-size:clamp(.9rem,4.25vw,1.08rem);
  }
  .niche-menu li:nth-child(5){
    grid-column:span 2;
    width:calc(50% - .33rem);
    justify-self:center;
  }
  .niche-copy{padding:2.25rem 0 5.8rem}
}


/* First-screen portrait waits for decode, then enters once on the compositor. */
.kit-portrait img{
  animation:none;
  opacity:0;
  transform:translate3d(0,1.25rem,0) scale(.985);
  will-change:opacity,transform;
}
.kit-portrait.is-ready img{
  animation:kit-portrait-in .62s cubic-bezier(.2,.8,.2,1) both;
}
@media(prefers-reduced-motion:reduce){
  .kit-portrait img{opacity:1;transform:none;will-change:auto}
}


/* Section four gets its own mobile layout instead of shrinking the desktop arc. */
@media(max-width:800px){
  .niche-frame{padding:1rem 1.25rem 2.75rem}
  .niche-portrait{
    height:18rem;
    min-height:18rem;
    margin:0 -1.25rem;
    overflow:hidden;
    align-items:flex-end;
  }
  .niche-portrait img{
    position:absolute;
    bottom:0;
    left:50%;
    width:auto;
    height:100%;
    max-width:none;
    max-height:none;
    object-fit:contain;
    transform:translateX(-50%);
    animation:none;
  }
  .niche-portrait figcaption{left:50%;bottom:.7rem;transform:translateX(-50%)}
  .niche-menu{margin-top:1.2rem}
  .niche-menu .kicker{margin-bottom:.85rem}
  .niche-menu ul{display:grid;grid-template-columns:1fr;gap:.55rem}
  .niche-menu li,
  .niche-menu li:nth-child(5){
    grid-column:auto;
    justify-self:stretch;
    width:100%;
    min-height:3.7rem;
    height:3.7rem;
    padding:.55rem 1rem;
    border-radius:.75rem;
    font-size:clamp(1rem,4.4vw,1.14rem);
  }
  .niche-menu li span{min-width:1.4rem}
  .niche-copy{padding:2.6rem 0 5.6rem}
}


/* Force the whole My Niche story to use the full mobile canvas. */
@media(max-width:800px){
  .niche-frame{
    display:block!important;
    width:100%!important;
    max-width:none;
  }
  .niche-menu,
  .niche-portrait,
  .niche-copy{
    width:100%;
    max-width:none;
  }
  .niche-copy{
    display:block;
    padding:2.4rem 1.25rem 6.4rem;
  }
  .niche-copy h2{
    width:100%;
    max-width:none;
    font-size:clamp(3.9rem,17vw,5.8rem);
    line-height:.9;
    letter-spacing:.02em;
    overflow-wrap:normal;
    word-break:normal;
  }
  .niche-copy h3{font-size:clamp(1.3rem,6vw,1.8rem)}
  .niche-copy>p:not(.niche-eyebrow){
    width:100%;
    max-width:none;
    padding-right:0;
    font-size:1.03rem;
    line-height:1.62;
  }
  .niche-stamp{right:1.25rem;bottom:1.25rem}
}


/* Mobile audit: the Who portrait loads early and keeps a compact, image-filled frame. */
@media(max-width:800px){
  .who-section{padding:3rem 0}
  .who-card{min-height:0}
  .who-photo{
    min-height:0;
    height:clamp(20rem,72vw,24rem);
    overflow:hidden;
    align-items:flex-end;
  }
  .who-photo img{
    display:block;
    width:auto;
    height:108%;
    max-width:none;
    max-height:none;
    object-fit:contain;
    object-position:center bottom;
    animation:none;
  }
  .who-photo:before{inset:.8rem}
  .who-photo-label{top:1.1rem;right:1.1rem}
  .who-signature{right:1.1rem;bottom:.75rem;font-size:4rem}
}


/* The rate card now focuses only on the signature package and its inclusions. */
.rate-experience{grid-template-columns:1fr;min-height:0}
.focus-card{min-height:25rem}
