/* v3 — "Your Identity Book". Her archive's visual system: triangles, highlight bars,
   black handwritten slides, confetti dots, book labels. Layers on site.css + v2.css. */

:root{--mint:#00F2A6;--mint-deep:#00F2A6;--tint:#00F2A6;--black:#000}
.head-quiz{border-color:var(--line)!important}
@media (max-width:1180px){.head-quiz{display:none}}

/* book-style labels ("My Personality", "this looks like…") */
.bk{font:700 12px/1 var(--body);letter-spacing:.02em;display:inline-flex;align-items:center;gap:10px;margin-bottom:18px}
.bk::before{content:"";width:14px;height:12px;background:var(--mint);clip-path:polygon(0 0,100% 0,50% 100%)}
.bg-ink .bk{color:#fff}
.hbar{background:var(--mint);color:var(--ink);padding:0 .14em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.page-no{display:flex;justify-content:space-between;font:400 12px/1 var(--body);color:var(--muted);margin-top:56px;padding-top:14px;border-top:1px solid var(--line)}
.bg-ink .page-no{color:rgba(255,255,255,.5);border-color:rgba(255,255,255,.15)}

/* ---------- hero: portrait in triangle over a triangle field ---------- */
.h3{padding:clamp(28px,4vw,56px) 0 clamp(64px,8vw,110px);overflow:hidden}
.h3-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(28px,5vw,80px);align-items:center}
.h3 h1{font-size:clamp(42px,5vw,80px);line-height:.98;letter-spacing:-.035em}
.h3 h1 em{font-style:normal;background:linear-gradient(transparent 60%,var(--mint) 60%,var(--mint) 92%,transparent 92%)}
.h3 .lead{margin:26px 0 34px;max-width:500px}
.tri-field{position:relative;aspect-ratio:1/1.02}
.tri-field .tf{position:absolute;inset:0;display:grid;grid-template-columns:repeat(9,1fr);gap:6%;align-content:space-between;padding:2%}
.tri-field .tf i{aspect-ratio:1.15/1;background:var(--mint);clip-path:polygon(0 0,100% 0,50% 100%);opacity:0;transform:translateY(-8px) scale(.7);transition:opacity .5s var(--ease),transform .6s var(--ease)}
.tri-field.go .tf i{opacity:1;transform:none}
.tri-field .big{position:absolute;left:12%;right:12%;top:-2%;height:88%;clip-path:polygon(0 0,100% 0,50% 100%);background:#fff;padding:0;transform:scale(.6);opacity:0;transition:transform 1.3s var(--ease) .35s,opacity .8s var(--ease) .35s}
.tri-field .big img{width:100%;height:100%;object-fit:cover;object-position:50% 18%}
.tri-field.go .big{transform:none;opacity:1}
.tri-field .tag{position:absolute;right:0;bottom:4%;background:#fff;border-radius:18px;padding:14px 18px;box-shadow:var(--shadow);transform:rotate(3deg);opacity:0;transition:opacity .6s 1.4s}
.tri-field .tag b{display:block;font:700 11px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;margin-bottom:6px}
.tri-field .tag span{font:400 22px/1.1 var(--hand)}
.tri-field.go .tag{opacity:1}
.tri-field .spk{position:absolute;left:-4%;bottom:14%;width:70px;opacity:0;transition:opacity .6s 1.6s}
.tri-field.go .spk{opacity:1;animation:float 6s ease-in-out infinite}

/* ---------- two quiz doors ---------- */
.doors{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:48px}
.door{position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:440px;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(24px,3vw,40px);color:#fff;text-decoration:none;text-align:left;border:0;font:inherit;cursor:pointer;isolation:isolate}
.door img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1.2s var(--ease)}
.door::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(0,0,0,.78))}
.door.mintd::before{background:linear-gradient(180deg,rgba(0,40,24,.1) 20%,rgba(0,40,24,.85));mix-blend-mode:multiply}
.door:hover img{transform:scale(1.05)}
.door .lbl{position:absolute;top:22px;left:22px;font:700 11px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;background:var(--mint);color:var(--ink);padding:9px 12px;border-radius:6px}
.door .time{position:absolute;top:22px;right:22px;font:400 13px/1 var(--body);background:rgba(255,255,255,.18);backdrop-filter:blur(6px);padding:9px 12px;border-radius:999px}
.door h3{font-size:clamp(28px,3vw,42px);margin-bottom:10px;max-width:420px}
.door p{margin:0 0 22px;color:rgba(255,255,255,.82);max-width:420px}
.door .go{align-self:flex-start;display:inline-flex;gap:10px;align-items:center;background:#fff;color:var(--ink);font:700 15px/1 var(--body);padding:15px 22px;border-radius:999px;transition:background .3s,transform .4s var(--ease)}
.door:hover .go{background:var(--mint);transform:translateX(4px)}

/* ---------- full-screen recommender ---------- */
.qx{padding:0}
.qx .box{width:min(1100px,100%);height:min(720px,100vh);max-height:100vh;display:grid;grid-template-columns:.85fr 1.15fr;padding:0;overflow:hidden;border-radius:clamp(0px,2vw,28px)}
.qx .qside{position:relative;background:var(--ink);overflow:hidden}
.qx .qimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .3s,transform 1.2s var(--ease)}
.qx .qimg.out{opacity:0;transform:scale(1.04)}
.qx .qtri{position:absolute;left:50%;bottom:-1px;width:56%;aspect-ratio:1.15/1;transform:translateX(-50%);background:var(--mint);clip-path:polygon(50% 0,100% 100%,0 100%);z-index:2;opacity:.95}
.qx .qnote{position:absolute;left:0;right:0;bottom:10%;z-index:3;text-align:center;font-size:24px;color:var(--ink);padding:0 20%}
.qx .qmain{position:relative;padding:clamp(28px,4vw,56px);overflow:auto;display:flex;flex-direction:column}
.qx .qbar{margin:4px 56px 34px 0}
.qx h3{font-size:clamp(26px,2.8vw,38px);line-height:1.1;margin-bottom:28px}
.qx .answers{display:grid;gap:10px}
.qx .answers button{display:flex;align-items:center;gap:16px;justify-content:flex-start;padding:16px 18px;animation:chipIn .5s var(--ease) both}
.qx .answers button::after{margin-left:auto}
.qx .answers .lt{flex:none;width:32px;height:32px;border-radius:8px;display:grid;place-items:center;font:700 13px/1 var(--body);background:var(--stone);transition:background .25s}
.qx .answers button:hover .lt,.qx .answers button.picked .lt{background:var(--mint)}
.qx .answers button.picked{border-color:var(--ink);background:var(--stone)}
.qx .result .kicker{margin-bottom:6px}
.qx .result h3{margin-bottom:6px}
.qx .r-line{font:700 15px/1.3 var(--body);color:var(--mint-deep);margin:0 0 16px}
.qx .r-text{font-size:17px;color:var(--ink-2)}
.qx .r-price{font-size:13.5px;color:var(--muted);margin:0 0 24px}
.qx .r-alt{font-size:14.5px;color:var(--muted);margin:22px 0 0}
.qx .r-alt a{font-weight:700}
.qx .result>*{animation:fadeup .6s var(--ease) both}
.qx .result>*:nth-child(2){animation-delay:.08s}.qx .result>*:nth-child(3){animation-delay:.16s}.qx .result>*:nth-child(4){animation-delay:.24s}.qx .result>*:nth-child(5){animation-delay:.32s}.qx .result>*:nth-child(6){animation-delay:.4s}.qx .result>*:nth-child(7){animation-delay:.48s}
@media (max-width:820px){
  .qx .box{grid-template-columns:1fr;grid-template-rows:180px 1fr;height:100vh;border-radius:0}
  .qx .qnote{font-size:18px;bottom:8%}
  .qx .qtri{width:40%}
}

/* ---------- Identity Clues → book page ---------- */
.clues3{display:grid;grid-template-columns:.62fr 1.38fr;border-radius:var(--r-lg);overflow:hidden;background:#fff;color:var(--ink);box-shadow:0 50px 100px -40px rgba(0,0,0,.6);min-height:540px}
.c3-side{position:relative;background:var(--mint);overflow:hidden}
.c3-side img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .4s}
.c3-side .c3-tag{position:absolute;left:16px;top:16px;right:16px;font:700 11px/1.3 var(--body);letter-spacing:.12em;text-transform:uppercase;background:var(--mint);padding:9px 11px;border-radius:6px;display:inline-block;width:auto;max-width:max-content}
.c3-side .c3-dots{position:absolute;left:16px;bottom:16px;display:flex;gap:6px}
.c3-side .c3-dots i{width:26px;height:4px;border-radius:4px;background:rgba(255,255,255,.5)}
.c3-side .c3-dots i.on{background:#fff}
.clues3.done .c3-side img{opacity:.0}
.clues3.done .c3-side{background:var(--mint) url(../img/arch/book-cover.jpg) center/cover}
.c3-stage{padding:clamp(24px,3.5vw,48px);display:flex;flex-direction:column}
.c3-step{animation:fadeup .5s var(--ease)}
.c3-count{font-size:13px;color:var(--muted);margin:24px 0 0}
.book-page{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:24px;border:1px solid var(--line);border-radius:6px;padding:28px 26px 40px;background:#fff;box-shadow:0 20px 40px -24px rgba(0,0,0,.35);animation:cardIn .8s cubic-bezier(.3,1.3,.5,1) both}
.bp-label{display:block;font:700 13px/1 var(--body);margin-bottom:18px}
.bp-label::before{content:"";display:inline-block;width:10px;height:9px;background:var(--mint);clip-path:polygon(0 0,100% 0,50% 100%);margin-right:8px}
.bp-circles{display:flex;flex-wrap:wrap;gap:8px}
.bp-circles span{width:104px;height:104px;border-radius:50%;background:var(--mint);display:grid;place-items:center;text-align:center;font:700 14.5px/1.1 var(--body);padding:8px;animation:pop .7s cubic-bezier(.3,1.5,.5,1) both}
.bp-circles span:nth-child(2){background:var(--tint)}
.bp-circles span:nth-child(3){background:var(--ink);color:#fff}
@keyframes pop{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:none}}
.bp-right ul{list-style:none;padding:0;margin:0;display:grid;gap:12px;font-size:14.5px;line-height:1.4}
.bp-right li{animation:fadeup .6s var(--ease) both}
.bp-right li b{background:var(--mint);padding:0 .2em}
.bp-sign{font-size:22px;color:var(--mint-deep);margin:18px 0 0}
.bp-foot{position:absolute;left:26px;bottom:14px;font:400 10.5px/1 var(--body);color:var(--muted)}
.c3-note{font-size:15px;color:var(--ink-2);margin:22px 0 18px}

/* ---------- black handwritten slide ---------- */
.slide-black{background:#000;color:#fff;text-align:center;padding:clamp(80px,12vw,150px) 0}
.slide-black .q{font:400 clamp(26px,3.2vw,46px)/1.55 var(--hand)}
.slide-black .q span{color:var(--mint)}
.slide-black .spk{width:56px;margin:0 auto 26px}

/* ---------- map vs how to use it ---------- */
.mapvs{display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(14px,2vw,28px);align-items:stretch}
.mv{border-radius:var(--r-lg);padding:clamp(26px,3.5vw,44px);display:flex;flex-direction:column;gap:14px;text-decoration:none;transition:transform .5s var(--ease),box-shadow .5s var(--ease);text-align:left;border:0;font:inherit;cursor:pointer;color:inherit}
.mv:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.mv.map{background:var(--stone)}
.mv.use{background:var(--ink);color:#fff}
.mv .gly{width:46px;height:40px;background:var(--mint)}
.mv.map .gly{clip-path:polygon(0 0,100% 0,50% 100%)}
.mv.use .gly{clip-path:polygon(0 0,100% 0,50% 50%,100% 100%,0 100%,50% 50%);width:34px}
.mv h3{font-size:clamp(26px,2.6vw,36px)}
.mv .en{font:700 15px/1 var(--body);color:var(--mint-deep)}
.mv.use .en{color:var(--mint)}
.mv p{margin:0;opacity:.78}
.mv ul{list-style:none;padding:0;margin:6px 0 0;display:grid;gap:8px;font-size:15px}
.mv li::before{content:"✦ ";color:var(--mint-deep)}
.mv.use li::before{color:var(--mint)}
.mv .foot{margin-top:auto;padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;font-size:13.5px;opacity:.8}
.mv.use .foot{border-color:rgba(255,255,255,.15)}
.mv-arrow{display:grid;place-items:center}
.mv-arrow span{writing-mode:vertical-rl;transform:rotate(180deg);font:400 22px/1 var(--hand);color:var(--mint-deep)}

/* ---------- journey (method page) ---------- */
.journey3{position:relative;display:grid;gap:0;margin-top:56px;padding-left:64px}
.j3-line{position:absolute;left:21px;top:10px;bottom:10px;width:3px;background:var(--line);border-radius:3px}
.j3-line i{position:absolute;left:0;top:0;width:100%;background:var(--mint);border-radius:3px;height:0}
.j3-step{position:relative;display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(20px,4vw,60px);padding:0 0 clamp(48px,6vw,80px);align-items:start}
.j3-step::before{content:"";position:absolute;left:-53px;top:4px;width:26px;height:22px;background:var(--line);clip-path:polygon(0 0,100% 0,50% 100%);transition:background .4s}
.j3-step.lit::before{background:var(--mint)}
.j3-step .ph{font:700 12px/1 var(--body);letter-spacing:.14em;color:var(--muted)}
.j3-step h3{font-size:clamp(26px,2.8vw,40px);margin:12px 0 6px}
.j3-step .hand{font-size:24px;color:var(--mint-deep);display:block;margin-bottom:14px}
.j3-step p{color:var(--ink-2);margin:0 0 12px}
.j3-step .chipsx{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.j3-step .chipsx span{font-size:13px;border:1px solid var(--line);border-radius:999px;padding:6px 11px}
.j3-step .media{border-radius:20px;aspect-ratio:4/3}

/* ---------- "Who I Am" mock card ---------- */
.whoami{border-radius:8px;background:#fff;color:var(--ink);box-shadow:0 40px 80px -30px rgba(0,0,0,.45);padding:clamp(22px,3vw,36px);display:grid;grid-template-columns:auto 1fr;gap:22px 28px;position:relative;overflow:hidden}
.whoami .wa-photo{width:120px;aspect-ratio:3/4;border:2px solid var(--mint);padding:5px}
.whoami .wa-photo div{width:100%;height:100%;background:var(--stone) url(../img/arch/fingerprint.jpg) center/cover}
.whoami h4{font:700 22px/1.1 var(--display);margin:0 0 14px}
.whoami dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:7px 14px;font-size:13.5px}
.whoami dt{font-weight:700}
.whoami dd{margin:0;color:var(--ink-2)}
.whoami .wa-wow{position:absolute;right:16px;top:14px;font:700 15px/.9 var(--display);color:var(--mint);text-align:right}
.whoami .sample{position:absolute;right:16px;bottom:14px;font:700 10px/1 var(--body);letter-spacing:.14em;color:var(--muted)}

/* this looks like → that means */
.tll{display:grid;grid-template-columns:1fr 1fr;gap:0;border-radius:8px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(0,0,0,.35);margin-top:18px}
.tll>div{padding:24px 26px;background:#fff;color:var(--ink)}
.tll>div+div{background:var(--tint)}
.tll .hand{font-size:22px;color:var(--mint-deep);display:block;margin-bottom:10px}
.tll>div+div .hand{color:var(--ink)}
.tll ul{margin:0;padding-left:18px;font-size:14.5px;display:grid;gap:6px}

/* ---------- tools ---------- */
.tools3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.t3{border-radius:22px;padding:28px;background:var(--stone);position:relative;overflow:hidden;min-height:250px;display:flex;flex-direction:column}
.t3.dk{background:var(--ink);color:#fff}
.t3.mt{background:var(--mint)}
.t3 .tm{font:700 11px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;opacity:.6;margin-bottom:auto}
.t3 h3{font-size:26px;margin:28px 0 10px}
.t3 p{margin:0;font-size:15px;opacity:.8}
.t3 .acr{font:700 34px/1 var(--display);letter-spacing:.08em;color:var(--mint);margin-top:18px}
.t3.mt .acr{color:var(--ink)}

/* Aura Style Grid */
.asg{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,60px);align-items:center}
.asg-field{position:relative;aspect-ratio:1;border-radius:24px;background:#fff;border:1.5px solid var(--ink);overflow:hidden}
.asg-field .q{position:absolute;width:50%;height:50%;transition:background .5s}
.asg-field .q[data-q=cb]{left:0;top:0}.asg-field .q[data-q=eb]{right:0;top:0}.asg-field .q[data-q=cs]{left:0;bottom:0}.asg-field .q[data-q=es]{right:0;bottom:0}
.asg-field .q.lit{background:var(--tint)}
.asg-field::before,.asg-field::after{content:"";position:absolute;background:var(--ink);z-index:1}
.asg-field::before{left:50%;top:0;bottom:0;width:1.5px}
.asg-field::after{top:50%;left:0;right:0;height:1.5px}
.asg-field .ax{position:absolute;z-index:2;font:700 11px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;background:#fff;padding:5px 8px;border-radius:6px}
.asg-field .ax.t{top:10px;left:50%;transform:translateX(-50%)}.asg-field .ax.b{bottom:10px;left:50%;transform:translateX(-50%)}
.asg-field .ax.l{left:10px;top:50%;transform:translateY(-50%)}.asg-field .ax.r{right:10px;top:50%;transform:translateY(-50%)}
.asg-field .dot{position:absolute;z-index:3;transform:translate(-50%,-50%);background:var(--ink);color:#fff;font:700 11.5px/1 var(--body);padding:8px 10px;border-radius:999px;white-space:nowrap;animation:pop .5s cubic-bezier(.3,1.5,.5,1) both}
.asg-chips{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}
.asg-chips button{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:11px 15px;font:400 14.5px/1 var(--body);transition:all .25s}
.asg-chips button:hover{border-color:var(--ink)}
.asg-chips button[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.asg-out{border-radius:18px;padding:20px 22px;background:var(--stone);display:grid;gap:6px;transition:background .4s}
.asg-out b{font:700 22px/1.1 var(--display)}
.asg-out span{font-size:15px;color:var(--ink-2)}
.asg-out[data-level="2"]{background:var(--tint)}
.asg-out[data-level="3"]{background:var(--mint)}

/* Shopping checklist */
.shopcheck{border-radius:var(--r-lg);background:#fff;color:var(--ink);padding:clamp(24px,3.5vw,44px);box-shadow:0 40px 80px -30px rgba(0,0,0,.5)}
.shopcheck ol{list-style:none;padding:0;margin:0 0 22px;display:grid;gap:6px;counter-reset:c}
.shopcheck label{display:flex;gap:14px;align-items:center;padding:12px 14px;border-radius:12px;cursor:pointer;transition:background .2s;counter-increment:c}
.shopcheck label:hover{background:var(--stone)}
.shopcheck input{position:absolute;opacity:0}
.shopcheck .bx{flex:none;width:26px;height:26px;border-radius:8px;border:1.5px solid var(--ink);display:grid;place-items:center;transition:all .25s}
.shopcheck input:checked+.bx{background:var(--mint);border-color:var(--mint)}
.shopcheck input:checked+.bx::after{content:"✓";font:700 15px/1 var(--body)}
.shopcheck input:focus-visible+.bx{outline:2px solid var(--ink);outline-offset:2px}
.sc-meter{height:8px;border-radius:8px;background:var(--stone);overflow:hidden}
.sc-meter i{display:block;height:100%;width:0;background:var(--mint);transition:width .5s var(--ease)}
.sc-verdict{display:grid;gap:4px;margin-top:16px}
.sc-verdict b{font:700 22px/1.1 var(--display)}
.sc-verdict span{font-size:14.5px;color:var(--ink-2)}

/* deck strip */
.deckstrip{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px var(--gut) 18px;margin:40px calc(var(--gut)*-1) 0;scrollbar-width:none}
.deckstrip figure{flex:0 0 clamp(260px,32vw,420px);margin:0;scroll-snap-align:start}
.deckstrip img{width:100%;border-radius:10px;box-shadow:0 20px 40px -24px rgba(0,0,0,.4);aspect-ratio:16/9;object-fit:cover}
.deckstrip figcaption{font-size:13px;color:var(--muted);margin-top:8px}

@media (max-width:980px){
  .h3-grid,.asg{grid-template-columns:1fr}
  .tri-field{max-width:520px;margin:0 auto;width:100%}
  .doors{grid-template-columns:1fr}
  .door{min-height:380px}
  .clues3{grid-template-columns:1fr}
  .c3-side{min-height:220px}
  .mapvs{grid-template-columns:1fr}
  .mv-arrow span{writing-mode:horizontal-tb;transform:none}
  .tools3{grid-template-columns:1fr 1fr}
  .j3-step{grid-template-columns:1fr}
}
@media (max-width:620px){
  .book-page{grid-template-columns:1fr}
  .bp-circles span{width:88px;height:88px;font-size:13px}
  .tools3{grid-template-columns:1fr}
  .journey3{padding-left:44px}
  .j3-line{left:12px}.j3-step::before{left:-42px;width:20px;height:17px}
  .whoami{grid-template-columns:1fr}
  .tll{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .tri-field .tf i,.tri-field .big,.tri-field .tag,.tri-field .spk{opacity:1;transform:none}
}
.asg-wrap{display:block}
.asg-out{background:#fff}
.asg-out[data-level="2"]{background:var(--tint)}
.asg-out[data-level="3"]{background:var(--mint)}

/* about: brand-design credentials */
.cred{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.14);border-radius:22px;overflow:hidden;margin-top:48px}
.cred>div{background:var(--ink);padding:24px 22px}
.cred b{display:block;font:700 clamp(24px,2.4vw,34px)/1.05 var(--display);color:var(--mint);margin-bottom:10px;letter-spacing:-.02em}
.cred span{font-size:14px;color:rgba(255,255,255,.7)}
.workstrip{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px var(--gut) 18px;margin:40px calc(var(--gut)*-1) 0;scrollbar-width:none}
.workstrip::-webkit-scrollbar{display:none}
.workstrip figure{flex:0 0 clamp(260px,30vw,400px);margin:0;scroll-snap-align:start}
.workstrip img{width:100%;aspect-ratio:848/530;object-fit:cover;border-radius:14px;transition:transform .7s var(--ease)}
.workstrip figure:hover img{transform:scale(1.03)}
.workstrip figcaption{font-size:13px;color:rgba(255,255,255,.6);margin-top:10px}
.workstrip figcaption b{display:block;color:#fff;font-size:15px;margin-bottom:2px}
.bridge{display:grid;grid-template-columns:1fr auto 1fr;gap:20px;align-items:center;margin-top:48px}
.bridge>div{border-radius:22px;padding:28px;border:1px solid rgba(255,255,255,.18)}
.bridge>div:last-child{background:var(--mint);color:var(--ink);border-color:var(--mint)}
.bridge .k3{font:700 11px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;opacity:.6}
.bridge h3{font-size:clamp(22px,2.2vw,30px);margin:10px 0 8px}
.bridge p{margin:0;opacity:.8}
.bridge .arrow{width:56px;height:56px;border-radius:50%;background:#fff;color:var(--ink);display:grid;place-items:center;font:700 22px/1 var(--body)}
.clients{margin-top:36px;font-size:14.5px;color:rgba(255,255,255,.65);max-width:980px}
.clients b{color:#fff}
@media (max-width:900px){.cred{grid-template-columns:1fr 1fr}.bridge{grid-template-columns:1fr}.bridge .arrow{transform:rotate(90deg);margin:0 auto}}

/* sealed book: shows the Book exists, never its contents */
.sealed{position:relative;width:min(380px,80%);aspect-ratio:3/4;margin:30px auto;perspective:1600px}
.sealed .pg{position:absolute;inset:0;border-radius:4px 10px 10px 4px;background:#fff;box-shadow:0 30px 60px -30px rgba(0,0,0,.4);padding:30px 26px;overflow:hidden;transition:transform .8s var(--ease)}
.sealed .pg i{display:block;height:9px;border-radius:6px;background:var(--line);margin:0 0 12px;filter:blur(2px)}
.sealed .pg i.m{background:var(--tint);height:46px;width:46px;border-radius:50%;display:inline-block;margin-right:8px}
.sealed .pg.p1{transform:rotate(-7deg) translateX(-14%)}
.sealed .pg.p2{transform:rotate(5deg) translateX(12%)}
.sealed:hover .pg.p1{transform:rotate(-11deg) translateX(-22%)}
.sealed:hover .pg.p2{transform:rotate(9deg) translateX(20%)}
.sealed .cover{position:absolute;inset:0;border-radius:4px 10px 10px 4px;background:#fff;box-shadow:0 40px 80px -30px rgba(0,0,0,.5);padding:28px 24px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.sealed .cover p{margin:0;font:700 clamp(26px,3vw,36px)/1 var(--display);letter-spacing:-.02em;position:relative;z-index:1;max-width:62%}
.sealed .cover p .hand{display:block;font-size:.7em;margin-bottom:4px}
.sealed .cover img{position:absolute;right:8%;bottom:14%;width:42%}
.sealed .cover small{font:700 11px/1 var(--body);letter-spacing:.06em}
.sealed .seal{position:absolute;right:-18px;top:18%;z-index:3;width:104px;height:104px;border-radius:50%;background:var(--ink);color:var(--mint);display:grid;place-items:center;text-align:center;font:400 19px/1.05 var(--hand);transform:rotate(-12deg);box-shadow:0 14px 30px -10px rgba(0,0,0,.5)}
.sealed .seal::before{content:"";position:absolute;inset:6px;border:1.5px dashed rgba(0,242,166,.6);border-radius:50%}
.bg-ink .sealed .pg,.bg-ink .sealed .cover{color:var(--ink)}
.locked-note{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--muted);margin-top:14px}
.locked-note::before{content:"";width:14px;height:12px;background:var(--mint);clip-path:polygon(0 0,100% 0,50% 100%)}
.bp-tease{font-size:14.5px;line-height:1.45;margin:0 0 14px;color:var(--ink-2)}
.bp-blur i{display:block;height:9px;border-radius:6px;background:var(--line);margin-bottom:10px;filter:blur(2.5px)}
.bp-blur i:nth-child(2){width:80%}.bp-blur i:nth-child(3){width:90%}.bp-blur i:nth-child(4){width:60%}