/* =========================================================
   STOLEN HEART MEDIA - SITE DESIGN SYSTEM
   Events - Corporate Headshots - Portraits

   Stolen Heart's bright editorial system. Warm ivory, ink,
   blush and generous white space keep this brand visually
   separate from Foreign Kollective.
   ========================================================= */

:root{
  --night:#FFFAF8;
  --panel:#FFFFFF;
  --panel-2:#FAF0F2;
  --bone:#21191A;
  --bone-dim:rgba(33,25,26,.72);
  --bone-faint:rgba(33,25,26,.5);
  --gold:#E85C78;
  --gold-lit:#F37D94;
  --gold-deep:#C74360;
  --hair:rgba(33,25,26,.14);
  --hair-solid:#E8DDE0;
  --f-display:'Instrument Serif',Georgia,'Times New Roman',serif;
  --f-body:'Space Grotesk','Helvetica Neue',Arial,sans-serif;
  --f-code:'Space Mono',ui-monospace,'SF Mono',monospace;
  --ease:cubic-bezier(.22,.9,.3,1);
  --maxw:1340px;
  --rail:clamp(0px,7vw,104px);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--night);color:var(--bone);font-family:var(--f-body);font-size:17px;line-height:1.6;font-weight:300;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
::selection{background:var(--gold);color:var(--night)}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(1.15rem,4vw,3rem)}
.wrap-narrow{max-width:920px;margin:0 auto;padding:0 clamp(1.15rem,4vw,3rem)}
section{padding:clamp(3.5rem,9vw,7.5rem) 0;position:relative}
section.tight{padding:clamp(2.5rem,5vw,4.5rem) 0}

/* ---------- type ---------- */
h1,h2,h3{font-family:var(--f-display);font-weight:400;line-height:.95;letter-spacing:-.02em}
h1{font-size:clamp(3rem,9vw,7.5rem)}
h2{font-size:clamp(2.3rem,6vw,4.6rem);margin-bottom:1.1rem}
h3{font-size:clamp(1.45rem,2.6vw,2.05rem);line-height:1.05;margin-bottom:.5rem}
h4{font-family:var(--f-body);font-size:.95rem;font-weight:600;letter-spacing:.01em;line-height:1.3;margin-bottom:.4rem}
h1 em,h2 em,h3 em{font-style:italic;color:var(--gold)}
p{color:var(--bone-dim);font-weight:300}
p+p{margin-top:1rem}
.lede{font-size:clamp(1.05rem,1.55vw,1.3rem);line-height:1.55;color:var(--bone-dim)}
strong{color:var(--bone);font-weight:500}
.fine{display:block;font-family:var(--f-code);font-size:.7rem;line-height:1.6;color:var(--bone-faint);margin-top:.9rem}

ul.ticks{list-style:none;margin:1.3rem 0}
ul.ticks li{position:relative;padding-left:1.6rem;margin-bottom:.65rem;color:var(--bone-dim)}
ul.ticks li::before{content:'';position:absolute;left:0;top:.66em;width:8px;height:1px;background:var(--gold);box-shadow:0 4px 0 var(--gold)}

/* ---------- the timecode / moment label system ---------- */
.stamp{display:inline-flex;align-items:baseline;gap:.6rem;font-family:var(--f-code);font-size:.66rem;font-weight:400;letter-spacing:.2em;text-transform:uppercase;color:var(--bone-faint)}
.stamp b{color:var(--gold);font-weight:700}
.stamp::before{content:'';align-self:center;width:6px;height:6px;border-radius:50%;background:var(--gold);flex:none;box-shadow:0 0 0 3px rgba(216,169,60,.16)}
.stamp-row{display:flex;align-items:center;gap:1.1rem;margin-bottom:1.6rem}
.stamp-row::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,var(--hair),transparent)}
/* narrow screens: the label wraps, so drop the rule rather than let it cut through the text */
@media(max-width:720px){
  .stamp{flex-wrap:wrap;row-gap:.25rem}
  .stamp-row::after{display:none}
}

/* ---------- nav ---------- */
header.site{position:fixed;top:0;left:0;right:0;z-index:200;background:linear-gradient(180deg,rgba(10,10,12,.94),rgba(10,10,12,.72) 70%,transparent);backdrop-filter:blur(10px)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.05rem clamp(1.15rem,4vw,3rem);max-width:var(--maxw);margin:0 auto}
.logo{display:flex;flex-direction:column;line-height:1}
.logo .lg-1{font-family:var(--f-display);font-size:1.3rem;letter-spacing:.005em}
.logo .lg-1 i{font-style:italic;color:var(--gold)}
.logo .lg-2{font-family:var(--f-code);font-size:.5rem;letter-spacing:.38em;text-transform:uppercase;color:var(--bone-faint);margin-top:.3rem}
.nav-links{display:flex;gap:1.55rem;list-style:none;align-items:center}
.nav-links>li{position:relative}
.nav-links a{font-family:var(--f-code);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--bone-dim);transition:color .25s;white-space:nowrap}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--gold)}
.nav-cta{color:var(--night)!important;background:var(--gold);padding:.72rem 1.25rem;transition:background .25s,transform .25s}
.nav-cta:hover{background:var(--gold-lit);transform:translateY(-1px)}
.has-sub>a::after{content:'/';margin-left:.4rem;opacity:.35}
.sub{position:absolute;top:calc(100% + 1rem);left:-1.1rem;min-width:262px;background:var(--panel-2);border:1px solid var(--hair-solid);padding:.45rem;list-style:none;opacity:0;visibility:hidden;transform:translateY(-6px);transition:all .25s var(--ease);box-shadow:0 24px 50px rgba(0,0,0,.6)}
.has-sub:hover .sub,.has-sub:focus-within .sub{opacity:1;visibility:visible;transform:none}
.sub a{display:block;padding:.62rem .8rem;letter-spacing:.09em;font-size:.66rem}
.sub a:hover{background:rgba(216,169,60,.09);color:var(--gold)}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:.4rem}
.nav-toggle span{display:block;width:26px;height:2px;background:var(--bone);transition:transform .3s,opacity .3s}
.nav-open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-open .nav-toggle span:nth-child(2){opacity:0}
.nav-open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.nav-backdrop{display:none}
@media(max-width:1100px){
  .nav-toggle{display:flex}
  .nav-links{position:fixed;inset:0 0 0 auto;top:0;width:min(84vw,380px);height:100vh;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:1.05rem;background:var(--panel);border-left:1px solid var(--hair-solid);padding:5.8rem clamp(1.4rem,6vw,2.4rem) 2rem;transform:translateX(105%);transition:transform .4s var(--ease);z-index:210;overflow-y:auto}
  .nav-open .nav-links{transform:none}
  .nav-links a{font-size:.8rem}
  .sub{position:static;opacity:1;visibility:visible;transform:none;border:none;box-shadow:none;padding:.35rem 0 0 .95rem;min-width:0;background:transparent;border-left:1px solid var(--hair-solid)}
  .sub a{padding:.34rem 0;font-size:.7rem}
  .has-sub>a::after{display:none}
  .nav-cta{padding:.85rem 1.35rem;margin-top:.5rem}
  .nav-backdrop{display:block;position:fixed;inset:0;background:rgba(0,0,0,.6);opacity:0;pointer-events:none;transition:opacity .4s;z-index:190}
  .nav-open .nav-backdrop{opacity:1;pointer-events:auto}
}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--f-code);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;padding:1.05rem 1.9rem;border:1px solid var(--hair);transition:all .3s var(--ease);cursor:pointer;text-align:center}
.btn-solid{background:var(--gold);border-color:var(--gold);color:var(--night)}
.btn-solid:hover{background:var(--gold-lit);border-color:var(--gold-lit);transform:translateY(-2px)}
.btn-ghost{background:transparent;color:var(--bone)}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold)}
.btn-sm{padding:.72rem 1.25rem;font-size:.63rem}
.btn-row{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2rem}

/* ---------- PAPER sections: the inversion, used sparingly ---------- */
.paper{background:var(--bone);color:var(--night)}
.paper h1,.paper h2,.paper h3,.paper h4{color:var(--night)}
.paper p,.paper .lede{color:#4A443A}
.paper strong{color:var(--night)}
.paper .stamp{color:#8C8378}
.paper .stamp b{color:var(--gold-deep)}
.paper .stamp::before{background:var(--gold-deep);box-shadow:0 0 0 3px rgba(138,106,30,.14)}
.paper .stamp-row::after{background:linear-gradient(90deg,rgba(10,10,12,.16),transparent)}
.paper h1 em,.paper h2 em,.paper h3 em{color:var(--gold-deep)}
.paper ul.ticks li{color:#4A443A}
.paper ul.ticks li::before{background:var(--gold-deep);box-shadow:0 4px 0 var(--gold-deep)}
.paper .btn{border-color:rgba(10,10,12,.28)}
.paper .btn-ghost{color:var(--night)}
.paper .btn-ghost:hover{border-color:var(--gold-deep);color:var(--gold-deep)}
.paper .btn-solid{background:var(--night);border-color:var(--night);color:var(--bone)}
.paper .btn-solid:hover{background:var(--gold-deep);border-color:var(--gold-deep)}
.paper .fine{color:#8C8378}
.paper .tile,.paper .card{background:transparent;border-color:rgba(10,10,12,.16)}
.paper .tile .n,.paper .card .more{color:var(--gold-deep)}
.paper .step{border-color:rgba(10,10,12,.14)}
.paper .steps{border-color:rgba(10,10,12,.14)}
.paper .faq,.paper .faq details{border-color:rgba(10,10,12,.14)}
.paper .faq summary::after{color:var(--gold-deep)}
.paper .quote p{color:var(--night)}
.paper .quote{border-color:var(--gold-deep)}
.paper .quote cite{color:#8C8378}
.paper .tbl th{color:#8C8378}
.paper .tbl th,.paper .tbl td{border-color:rgba(10,10,12,.14)}
.paper .index-row{border-color:rgba(10,10,12,.14)}
.paper .index-row:hover{background:rgba(10,10,12,.03)}
.paper .index-row .ix-n{color:rgba(10,10,12,.28)}
.paper .index-row:hover .ix-t{color:var(--gold-deep)}
.paper .index-row .ix-d{color:#6d665c}

/* PANEL sections: still night, lifted a step, hairline framed */
.dark{background:var(--panel);border-top:1px solid var(--hair-solid);border-bottom:1px solid var(--hair-solid)}

/* ---------- film frames + placeholders ---------- */
figure{position:relative}
.frm{position:relative;overflow:hidden;background:var(--panel-2)}
.frm img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease),filter 1s var(--ease)}
.frm:hover img{transform:scale(1.04)}
/* sprocket edge: reads as 35mm without shouting about it */
.frm::after{content:'';position:absolute;left:0;top:0;bottom:0;width:9px;
  background-image:radial-gradient(circle at 4.5px 6px,rgba(10,10,12,.62) 2.1px,transparent 2.2px);
  background-size:9px 15px;pointer-events:none;opacity:.85}
.ar-45{aspect-ratio:4/5}
.ar-11{aspect-ratio:1/1}
.ar-32{aspect-ratio:3/2}
.ar-23{aspect-ratio:2/3}
.ar-169{aspect-ratio:16/9}
.ar-219{aspect-ratio:21/9}

.ph{display:flex;align-items:center;justify-content:center;text-align:center;padding:1.6rem;
  background:linear-gradient(158deg,#191922 0%,#12121A 48%,#0D0D13 100%)}
.ph::before{content:'';position:absolute;inset:1rem 1rem 1rem 1.5rem;border:1px solid rgba(242,237,227,.09)}
.ph span{position:relative;font-family:var(--f-code);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(242,237,227,.3);max-width:88%}
.ph span b{display:block;font-weight:700;color:var(--gold);margin-bottom:.4rem;letter-spacing:.1em}
.ph span i{display:block;font-family:var(--f-body);font-style:normal;font-weight:300;letter-spacing:.01em;text-transform:none;font-size:.76rem;line-height:1.45;color:rgba(242,237,227,.34);margin-top:.55rem}
.paper .ph{background:linear-gradient(158deg,#E4DCCC 0%,#DCD2BE 50%,#D2C6AE 100%)}
.paper .ph::before{border-color:rgba(10,10,12,.14)}
.paper .ph span{color:rgba(10,10,12,.42)}
.paper .ph span b{color:var(--gold-deep)}
.paper .ph span i{color:rgba(10,10,12,.46)}
.paper .frm::after{background-image:radial-gradient(circle at 4.5px 6px,rgba(242,237,227,.75) 2.1px,transparent 2.2px)}

/* the timecode chip that rides on a frame */
.chip{position:absolute;left:.85rem;bottom:.85rem;right:.85rem;display:flex;align-items:center;gap:.55rem;
  background:rgba(10,10,12,.82);backdrop-filter:blur(8px);border-left:2px solid var(--gold);
  color:var(--bone);font-family:var(--f-code);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;padding:.5rem .7rem}
.chip b{color:var(--gold);font-size:.7em}
.chip i{font-style:normal;margin-left:auto;color:var(--gold);letter-spacing:.08em}

/* ---------- STACK: frames that overlap and tilt ---------- */
.hero-fig,.feat-fig{position:relative}
.hero-fig::before,.hero-fig::after{content:'';position:absolute;border:1px solid var(--hair);pointer-events:none}
.hero-fig::before{inset:-1.4rem 1.6rem 2.2rem -2.2rem;transform:rotate(-3.2deg)}
.hero-fig::after{inset:2.4rem -2rem -1.6rem 2rem;transform:rotate(2.4deg);border-color:rgba(216,169,60,.3)}
.hero-fig>.frm{position:relative;z-index:2;box-shadow:0 40px 90px rgba(0,0,0,.6)}
.hero-fig>.chip{z-index:3}
.paper .hero-fig::before{border-color:rgba(10,10,12,.16)}
.paper .hero-fig::after{border-color:rgba(138,106,30,.36)}
.feat-fig>.frm{transform:rotate(-1.4deg);box-shadow:0 30px 70px rgba(0,0,0,.5);transition:transform .7s var(--ease)}
.feat-fig:hover>.frm{transform:rotate(0deg)}
.feat.rev .feat-fig>.frm{transform:rotate(1.4deg)}
@media(max-width:880px){
  .hero-fig::before,.hero-fig::after{display:none}
  .feat-fig>.frm,.feat.rev .feat-fig>.frm{transform:none}
}

/* ---------- hero ---------- */
.hero{padding-top:clamp(7.5rem,15vw,12rem);padding-bottom:clamp(3rem,7vw,6rem)}
.hero::before{content:'';position:absolute;top:-15%;left:50%;width:130%;height:90%;transform:translateX(-50%);
  background:radial-gradient(ellipse at 50% 0%,rgba(216,169,60,.10),transparent 58%);pointer-events:none}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(2rem,6vw,5rem);align-items:center;position:relative}
.hero h1{margin-top:.4rem}
.hero-sub{max-width:52ch;margin-top:1.8rem}
.hero-fig .frm{aspect-ratio:4/5}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}.hero-fig{order:-1;margin-bottom:.5rem}}

/* ---------- REC indicator + trust row ---------- */
.trust{display:flex;flex-wrap:wrap;gap:.9rem 1.9rem;margin-top:2rem}
.trust div{font-family:var(--f-code);font-size:.63rem;letter-spacing:.13em;text-transform:uppercase;color:var(--bone-faint);display:flex;align-items:center;gap:.5rem}
.trust div::before{content:'';width:5px;height:5px;background:var(--gold);border-radius:50%;flex:none}
.paper .trust div{color:#8C8378}
.paper .trust div::before{background:var(--gold-deep)}

/* ---------- stats: read as exposure data ---------- */
.stats{background:var(--night);border-top:1px solid var(--hair-solid);border-bottom:1px solid var(--hair-solid)}
.stats-inner{max-width:var(--maxw);margin:0 auto;padding:clamp(1.9rem,4vw,2.9rem) clamp(1.15rem,4vw,3rem);display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem}
.stat{position:relative;padding-left:1.3rem}
.stat::before{content:'';position:absolute;left:0;top:.35rem;bottom:.35rem;width:1px;background:var(--hair)}
.stat b{display:block;font-family:var(--f-display);font-size:clamp(2.1rem,4vw,3.2rem);font-weight:400;line-height:.9;color:var(--bone)}
.stat b i{font-style:italic;color:var(--gold)}
.stat span{display:block;font-family:var(--f-code);font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-faint);margin-top:.7rem}
@media(max-width:760px){.stats-inner{grid-template-columns:repeat(2,1fr);gap:1.7rem}}

/* ---------- marquee of moments ---------- */
.ticker{overflow:hidden;background:var(--gold);color:var(--night);padding:.85rem 0}
.ticker-track{display:flex;gap:2.2rem;white-space:nowrap;width:max-content;animation:tick 52s linear infinite}
.ticker-track span{font-family:var(--f-code);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;display:flex;align-items:center;gap:2.2rem}
.ticker-track span::after{content:'\2726';opacity:.5}
@keyframes tick{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.ticker-track{animation:none}}

/* ---------- feature ---------- */
.feat{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.2rem,6vw,5.5rem);align-items:center}
.feat.rev .feat-fig{order:2}
@media(max-width:880px){.feat{grid-template-columns:1fr}.feat.rev .feat-fig{order:0}}

/* ---------- grids ---------- */
.grid{display:grid;gap:clamp(1rem,2.2vw,1.7rem)}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:980px){.g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.g2,.g3,.g4{grid-template-columns:1fr}}

/* service cards: a frame with the label hung underneath */
.card{display:block;transition:transform .45s var(--ease)}
.card .frm{aspect-ratio:4/3}
.card:hover{transform:translateY(-6px)}
.card:hover .frm img{filter:saturate(1.05)}
.card-body{padding:1.25rem 0 0;border-top:1px solid var(--hair);margin-top:1.1rem}
.card-body h3{margin-bottom:.5rem}
.card:hover .card-body h3{color:var(--gold)}
.card-body p{font-size:.93rem}
.card .more{display:inline-block;margin-top:1rem;font-family:var(--f-code);font-size:.62rem;letter-spacing:.17em;text-transform:uppercase;color:var(--gold)}
.paper .card-body{border-color:rgba(10,10,12,.16)}
.paper .card:hover .card-body h3{color:var(--gold-deep)}

.tile{border-left:1px solid var(--hair);padding:0 0 0 clamp(1rem,2vw,1.5rem);height:100%}
.tile .n{display:block;font-family:var(--f-code);font-size:.68rem;letter-spacing:.2em;color:var(--gold);margin-bottom:.85rem}
.tile p{font-size:.92rem}
.paper .tile{border-color:rgba(10,10,12,.16)}
a.tile{transition:border-color .3s,transform .3s var(--ease)}
a.tile:hover{border-color:var(--gold);transform:translateX(4px)}

/* ---------- INDEX ROWS: big type list, the occasions pattern ---------- */
.index{border-top:1px solid var(--hair)}
.index-row{display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;gap:clamp(.9rem,3vw,2.4rem);
  padding:clamp(1.1rem,2.4vw,1.85rem) clamp(.5rem,1.5vw,1.1rem);border-bottom:1px solid var(--hair);
  transition:background .35s var(--ease),padding-left .35s var(--ease)}
.index-row:hover{background:rgba(216,169,60,.05);padding-left:clamp(1rem,2.5vw,2rem)}
.index-row .ix-n{font-family:var(--f-code);font-size:.66rem;letter-spacing:.16em;color:rgba(242,237,227,.3)}
.index-row .ix-t{font-family:var(--f-display);font-size:clamp(1.6rem,4vw,2.9rem);line-height:1;transition:color .3s}
.index-row:hover .ix-t{color:var(--gold)}
.index-row .ix-t em{font-style:italic}
.index-row .ix-d{font-size:.83rem;color:var(--bone-faint);max-width:34ch;text-align:right;line-height:1.45}
.index-row .ix-t::after{content:'\2192';font-family:var(--f-body);font-size:.5em;margin-left:.6rem;opacity:0;transform:translateX(-8px);display:inline-block;transition:all .3s var(--ease)}
.index-row:hover .ix-t::after{opacity:1;transform:none}
@media(max-width:820px){
  .index-row{grid-template-columns:auto 1fr;gap:.7rem 1.1rem}
  .index-row .ix-d{grid-column:2;text-align:left;max-width:none;margin-top:.35rem}
}

/* ---------- run of show / steps ---------- */
.steps{counter-reset:s;border-top:1px solid var(--hair)}
.step{counter-increment:s;position:relative;display:grid;grid-template-columns:auto 1fr;gap:clamp(1.1rem,3.5vw,3rem);
  padding:clamp(1.5rem,3.2vw,2.4rem) 0;border-bottom:1px solid var(--hair)}
.step::before{content:counter(s,decimal-leading-zero);font-family:var(--f-code);font-size:.78rem;letter-spacing:.14em;
  color:var(--gold);padding-top:.5rem;white-space:nowrap}
/* spine: connects the steps into one timeline */
.step::after{content:'';position:absolute;left:.52rem;top:3.1rem;bottom:0;width:1px;background:var(--hair)}
.step:last-child::after{display:none}
.paper .step::after{background:rgba(10,10,12,.14)}
.step p{font-size:.95rem;max-width:64ch;margin-top:.45rem}
.paper .step::before{color:var(--gold-deep)}

/* ---------- pricing ---------- */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--hair)}
@media(max-width:900px){.price-grid{grid-template-columns:1fr}}
.price{padding:clamp(1.6rem,3vw,2.3rem);display:flex;flex-direction:column;border-right:1px solid var(--hair);position:relative}
.price:last-child{border-right:none}
@media(max-width:900px){.price{border-right:none;border-bottom:1px solid var(--hair)}.price:last-child{border-bottom:none}}
.price.feature{background:rgba(216,169,60,.055)}
.price.feature::before{content:'MOST BOOKED';position:absolute;top:0;left:0;background:var(--gold);color:var(--night);
  font-family:var(--f-code);font-size:.54rem;letter-spacing:.17em;padding:.34rem .7rem}
.price.feature .tier{margin-top:1.3rem}
.price .tier{font-family:var(--f-code);font-size:.63rem;letter-spacing:.2em;text-transform:uppercase;color:var(--bone-faint)}
.price .amt{font-family:var(--f-display);font-size:clamp(2.4rem,4.2vw,3.2rem);line-height:.95;margin:.75rem 0 .3rem;color:var(--bone)}
.price .amt s{color:var(--bone-faint);font-size:.28em;text-decoration:none;font-family:var(--f-code);letter-spacing:.2em;text-transform:uppercase;display:block;margin-bottom:.5rem}
.price .btn{margin-top:auto;justify-content:center}
.price ul.ticks{margin-bottom:1.6rem}
.price ul.ticks li{font-size:.88rem}
.paper .price{border-color:rgba(10,10,12,.16)}
.paper .price-grid{border-color:rgba(10,10,12,.16)}
.paper .price.feature{background:rgba(138,106,30,.07)}
.paper .price .amt{color:var(--night)}
.paper .price .tier,.paper .price .amt s{color:#8C8378}

/* ---------- FAQ ---------- */
.faq{border-top:1px solid var(--hair)}
.faq details{border-bottom:1px solid var(--hair)}
.faq summary{list-style:none;cursor:pointer;padding:1.3rem 2.6rem 1.3rem 0;position:relative;
  font-family:var(--f-display);font-size:clamp(1.15rem,2vw,1.5rem);line-height:1.2;transition:color .25s}
.faq summary:hover{color:var(--gold)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'';position:absolute;right:.35rem;top:50%;width:11px;height:1px;background:var(--gold);transform:translateY(-50%)}
.faq summary::before{content:'';position:absolute;right:.85rem;top:50%;width:1px;height:11px;background:var(--gold);transform:translateY(-50%);transition:opacity .25s}
.faq details[open] summary::before{opacity:0}
.faq .ans{padding:0 2.6rem 1.6rem 0}
.faq .ans p{font-size:.96rem}
.paper .faq summary:hover{color:var(--gold-deep)}
.paper .faq summary::after,.paper .faq summary::before{background:var(--gold-deep)}

/* ---------- forms ---------- */
.form label{display:block;font-family:var(--f-code);font-size:.6rem;letter-spacing:.17em;text-transform:uppercase;color:var(--bone-faint);margin:1.1rem 0 .42rem}
.form input,.form select,.form textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--hair);
  padding:.7rem 0;font-family:var(--f-body);font-weight:300;font-size:1rem;color:var(--bone);border-radius:0;transition:border-color .25s}
.form textarea{min-height:110px;resize:vertical}
.form input::placeholder,.form textarea::placeholder{color:rgba(242,237,227,.24)}
.form select option{background:var(--panel-2);color:var(--bone)}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--gold);outline:none}
.form .row2{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem}
@media(max-width:640px){.form .row2{grid-template-columns:1fr}}
.form button{margin-top:1.9rem;width:100%;justify-content:center}
.form-note{margin-top:1rem;font-size:.92rem}
.paper .form label{color:#8C8378}
.paper .form input,.paper .form select,.paper .form textarea{color:var(--night);border-color:rgba(10,10,12,.2)}
.paper .form input::placeholder,.paper .form textarea::placeholder{color:rgba(10,10,12,.3)}
.paper .form input:focus,.paper .form select:focus,.paper .form textarea:focus{border-color:var(--gold-deep)}

/* ---------- breadcrumb ---------- */
.crumb{padding-top:clamp(6.5rem,12vw,9rem);padding-bottom:0}
.crumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;font-family:var(--f-code);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-faint)}
.crumb li+li::before{content:'/';margin-right:.5rem;opacity:.4}
.crumb a:hover{color:var(--gold)}

/* ---------- interior page hero ---------- */
.phero{padding-top:clamp(1.8rem,3vw,2.8rem);padding-bottom:clamp(2.5rem,5vw,4rem)}
.phero h1{max-width:16ch}
.phero .lede{max-width:60ch;margin-top:1.6rem}

/* ---------- contact sheet gallery ---------- */
.sheet{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(.6rem,1.5vw,1.15rem)}
@media(max-width:900px){.sheet{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.sheet{grid-template-columns:1fr}}
.sheet .frame{position:relative;transition:transform .5s var(--ease)}
.sheet .frame:nth-child(3n+1){transform:rotate(-.9deg)}
.sheet .frame:nth-child(3n+3){transform:rotate(.8deg)}
.sheet .frame:hover{transform:rotate(0deg) scale(1.02);z-index:5}
.sheet .frame.hidden{display:none}
.filter{display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:2rem}
.filter button{background:transparent;border:1px solid var(--hair);color:var(--bone-faint);font-family:var(--f-code);
  font-size:.61rem;letter-spacing:.15em;text-transform:uppercase;padding:.62rem 1.05rem;cursor:pointer;transition:all .25s}
.filter button[aria-pressed="true"]{background:var(--gold);border-color:var(--gold);color:var(--night)}
.filter button:hover{border-color:var(--gold);color:var(--gold)}
.filter button[aria-pressed="true"]:hover{color:var(--night)}

/* ---------- pull quote ---------- */
.quote{border-left:1px solid var(--gold);padding-left:clamp(1.2rem,2.6vw,2rem)}
.quote p{font-family:var(--f-display);font-size:clamp(1.5rem,3.2vw,2.4rem);line-height:1.15;color:var(--bone);font-style:italic}
.quote cite{display:block;font-style:normal;font-family:var(--f-code);font-size:.62rem;letter-spacing:.17em;text-transform:uppercase;color:var(--bone-faint);margin-top:1.2rem}

/* ---------- CTA band: full bleed, biggest type on the page ---------- */
.cta-band{text-align:center;background:
  radial-gradient(ellipse at 50% 120%,rgba(216,169,60,.16),transparent 62%),var(--night);
  border-top:1px solid var(--hair-solid)}
.cta-band h2{font-size:clamp(2.6rem,7.5vw,6rem)}
.cta-band .btn-row{justify-content:center}
.cta-band .stamp-row{justify-content:center}
.cta-band .stamp-row::after{display:none}
.cta-band p{max-width:56ch;margin-left:auto;margin-right:auto}

/* ---------- link list ---------- */
.linklist{list-style:none;columns:2;column-gap:2.5rem}
.linklist li{margin-bottom:.6rem;break-inside:avoid}
.linklist a{font-size:.93rem;color:var(--bone-dim);border-bottom:1px solid var(--hair);transition:color .2s,border-color .2s}
.linklist a:hover{color:var(--gold);border-color:var(--gold)}
@media(max-width:620px){.linklist{columns:1}}

/* ---------- table ---------- */
.tbl{width:100%;border-collapse:collapse;font-size:.92rem}
.tbl th,.tbl td{text-align:left;padding:.95rem 1.1rem;border-bottom:1px solid var(--hair)}
.tbl th{font-family:var(--f-code);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-faint)}
.tbl td{color:var(--bone-dim)}
.tbl td:last-child{white-space:nowrap;color:var(--gold);font-family:var(--f-code)}
.paper .tbl td{color:#4A443A}
.paper .tbl td:last-child{color:var(--gold-deep)}
.tbl-scroll{overflow-x:auto}

/* ---------- landing page bits ---------- */
.lp-bar{background:var(--gold);color:var(--night);text-align:center;font-family:var(--f-code);font-size:.66rem;
  letter-spacing:.15em;text-transform:uppercase;padding:.7rem 1rem}
.lp-bar a{border-bottom:1px solid rgba(10,10,12,.4)}
.lp-form-wrap{border:1px solid var(--hair);padding:clamp(1.5rem,3.5vw,2.4rem);background:var(--panel)}
.paper .lp-form-wrap{background:rgba(10,10,12,.03);border-color:rgba(10,10,12,.16)}

/* ---------- footer ---------- */
footer.site{background:var(--night);border-top:1px solid var(--hair-solid);padding:clamp(3rem,6vw,5rem) 0 2rem}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:clamp(1.7rem,3vw,3rem)}
@media(max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.foot-grid{grid-template-columns:1fr}}
.foot-brand p{font-size:.87rem;margin-top:1.1rem;max-width:44ch;color:var(--bone-faint)}
.foot-col h5{font-family:var(--f-code);font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem}
.foot-col ul{list-style:none}
.foot-col li{margin-bottom:.55rem}
.foot-col a{font-size:.87rem;color:var(--bone-dim);transition:color .25s}
.foot-col a:hover{color:var(--gold)}
.foot-bot{margin-top:clamp(2.4rem,4vw,3.4rem);padding-top:1.5rem;border-top:1px solid var(--hair-solid);
  display:flex;flex-wrap:wrap;gap:.8rem 1.5rem;justify-content:space-between;
  font-family:var(--f-code);font-size:.62rem;letter-spacing:.12em;color:var(--bone-faint)}
.foot-bot a:hover{color:var(--gold)}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(22px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.09s}.rv.d2{transition-delay:.18s}.rv.d3{transition-delay:.27s}.rv.d4{transition-delay:.36s}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ---------- Stolen Heart bright editorial theme ---------- */
body{background:#fffaf8;color:#21191a;font-weight:400}
p,.lede{color:#665b5d}
strong{color:#21191a}
::selection{background:#f3a8b8;color:#21191a}

header.site{background:rgba(255,250,248,.94);border-bottom:1px solid rgba(33,25,26,.1);backdrop-filter:blur(14px)}
.logo .lg-1,.nav-links a{color:#21191a}
.logo .lg-1 i,.logo .lg-2,.nav-links a:hover,.nav-links a[aria-current="page"]{color:#e85c78}
.nav-cta{background:#21191a!important;border-color:#21191a!important;color:#fff!important}
.nav-cta:hover{background:#e85c78!important;border-color:#e85c78!important;color:#fff!important}
.sub{background:#fff;border-color:#eadde0;box-shadow:0 24px 55px rgba(61,35,41,.14)}
.sub a:hover{background:#fff0f3;color:#c74360}
.nav-toggle span{background:#21191a}
@media(max-width:1100px){
  .nav-links{background:#fffaf8;border-color:#eadde0}
  .nav-backdrop{background:rgba(33,25,26,.35)}
}

h1 em,h2 em,h3 em{color:#e85c78}
.stamp{color:#74686a}
.stamp b{color:#e85c78}
.stamp::before{background:#e85c78;box-shadow:0 0 0 3px rgba(232,92,120,.14)}
.stamp-row::after{background:linear-gradient(90deg,rgba(33,25,26,.14),transparent)}

.btn{border-color:rgba(33,25,26,.24)}
.btn-solid{background:#21191a;border-color:#21191a;color:#fff}
.btn-solid:hover{background:#e85c78;border-color:#e85c78;color:#fff}
.btn-ghost{background:#fff;color:#21191a}
.btn-ghost:hover{border-color:#e85c78;color:#c74360}

.dark,.paper{background:#faf0f2;color:#21191a;border-color:#eadde0}
.dark p,.dark .lede,.paper p,.paper .lede{color:#665b5d}
.dark h1,.dark h2,.dark h3,.dark h4,.paper h1,.paper h2,.paper h3,.paper h4{color:#21191a}
.dark strong,.paper strong{color:#21191a}
.dark .btn-ghost,.paper .btn-ghost{background:transparent;color:#21191a;border-color:rgba(33,25,26,.25)}
.dark .stamp,.paper .stamp{color:#74686a}
.dark .stamp b,.paper .stamp b,.dark h1 em,.dark h2 em,.paper h1 em,.paper h2 em{color:#c74360}

.hero::before{background:radial-gradient(ellipse at 50% 0%,rgba(232,92,120,.12),transparent 58%)}
.hero-fig::before{border-color:rgba(33,25,26,.15)}
.hero-fig::after{border-color:rgba(232,92,120,.35)}
.hero-fig>.frm,.feat-fig>.frm{box-shadow:0 28px 65px rgba(61,35,41,.15)}
.frm{background:#f7e9ec}
.frm::after{display:none}
.chip{background:rgba(255,250,248,.9);border-left-color:#e85c78;color:#21191a}
.chip b,.chip i{color:#c74360}

.trust div{color:#74686a}
.trust div::before{background:#e85c78}
.stats{background:#fff;border-color:#eadde0}
.stat::before{background:rgba(33,25,26,.14)}
.stat b{color:#21191a}
.stat b i,.stat span{color:#e85c78}
.ticker{background:#f3a8b8;color:#21191a}

.tile,.card-body,.steps,.step,.faq,.faq details,.price-grid,.price{border-color:rgba(33,25,26,.14)}
.tile .n,.card .more,.step::before{color:#e85c78}
.tile p,.card-body p,.step p,.faq .ans p{color:#665b5d}
.card:hover .card-body h3,.faq summary:hover{color:#c74360}

.price-grid{gap:1rem;border:0}
.price{background:#fff;border:1px solid rgba(33,25,26,.13);border-radius:2px;box-shadow:0 14px 38px rgba(61,35,41,.06)}
.price:last-child{border-right:1px solid rgba(33,25,26,.13)}
.price.feature{background:#fff0f3;border-color:#f0b6c2;transform:translateY(-8px)}
.price.feature::before{background:#e85c78;color:#fff}
.price .tier,.price .amt s{color:#817476}
.price .amt{color:#21191a}
.price ul.ticks li{color:#665b5d}
ul.ticks li::before{background:#e85c78;box-shadow:0 4px 0 #e85c78}
@media(max-width:900px){.price.feature{transform:none}.price{border:1px solid rgba(33,25,26,.13)!important}}

.cta-band{background:linear-gradient(135deg,#fff7f8,#f9e8ec);border-color:#eadde0}
.cta-band h2{color:#21191a}
.cta-band p{color:#665b5d}
.crumb ol{color:#74686a}
.crumb a:hover{color:#e85c78}
.fine{color:#817476}
.filter button{border-color:rgba(33,25,26,.18);color:#74686a}
.filter button[aria-pressed="true"]{background:#21191a;border-color:#21191a;color:#fff}

footer.site{background:#21191a;border-color:#21191a;color:#fff}
footer.site .logo .lg-1,footer.site strong{color:#fff}
footer.site .logo .lg-1 i,footer.site .foot-col h5{color:#f3a8b8}
footer.site .logo .lg-2,footer.site .foot-brand p,footer.site .foot-col a,footer.site .foot-bot{color:rgba(255,255,255,.68)}
footer.site .foot-bot{border-color:rgba(255,255,255,.14)}
footer.site a:hover{color:#f3a8b8}
