/* Design your HeartWise Workplace programme (workplace-plan.html). Builds on site.css. Owner: plan.
   Same look as the Workplace page: deep teal, gold light, serif accents. Everything animated honours prefers-reduced-motion
   and every state also works with no animation; the intro works without JavaScript (the designer itself needs it and says so). */

.pn{--tl:#14606B;--tl-d:#0B4A53;--tl-t:#D7ECEE;--gold:#F2B632;--wd:#fff;--wh:#FFF8EE}
.pn [hidden]{display:none!important}
.pn [id]{scroll-margin-top:92px}
.pn .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pn .btn{line-height:1.25}
.pn .btn-p{background:var(--coral-d);box-shadow:0 10px 24px rgba(182,63,37,.35)}
.pn .btn-p:hover{background:#962F1A}
.pn .btn-light{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.65)}
.pn .btn-light:hover{background:#fff;color:var(--ink)}
.pn h2 .serif,.pn h3 .serif{color:var(--tl)}
.pn .eyebrow{line-height:1.4;border-radius:20px;text-align:center}
.pn .eyebrow.sun{color:var(--sun-d);background:var(--sun-t)}
.pn .sec-head{margin-bottom:44px}
.pn .h2like{font-size:clamp(1.7rem,3.2vw,2.5rem);margin-bottom:.4em}
.pn .note{color:var(--ink-2);font-size:.95rem}
.pn-center{text-align:center;justify-content:center}
.pn-ic{display:block;flex:none;max-width:none}

@keyframes pn-float{0%,100%{transform:translate(0,0);opacity:.3}50%{transform:translate(12px,-26px);opacity:1}}
@keyframes pn-breathe{0%,100%{opacity:.75;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}
@keyframes pn-beat{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}
@keyframes pn-glow{0%,100%{box-shadow:0 0 0 6px rgba(242,182,50,.25),0 0 26px 8px rgba(242,182,50,.55)}50%{box-shadow:0 0 0 10px rgba(242,182,50,.18),0 0 38px 14px rgba(242,182,50,.7)}}
@keyframes pn-fwd{from{opacity:0;transform:translateX(44px)}to{opacity:1;transform:none}}
@keyframes pn-back{from{opacity:0;transform:translateX(-44px)}to{opacity:1;transform:none}}
@keyframes pn-fade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes pn-pop{0%{transform:scale(0)}60%{transform:scale(1.25)}100%{transform:scale(1)}}
@keyframes pn-bounce{0%{transform:scale(1)}35%{transform:scale(1.16) rotate(-4deg)}65%{transform:scale(.96) rotate(2deg)}100%{transform:scale(1)}}
@keyframes pn-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-7px)}75%{transform:translateX(7px)}}
@keyframes pn-flick{0%,100%{transform:scale(1) rotate(0)}30%{transform:scale(1.05,1.1) rotate(-2deg)}60%{transform:scale(.97,1.04) rotate(2deg)}}
@keyframes pn-spin{to{transform:rotate(360deg)}}
@keyframes pn-heart{0%{opacity:0;transform:translate(0,0) scale(.4)}15%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(var(--r)) scale(1.1)}}
@keyframes pn-run{from{left:0}to{left:100%}}
@keyframes pn-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* ================= fireflies ================= */
.pn-fly{position:absolute;width:8px;height:8px;border-radius:50%;background:#FFE9A8;box-shadow:0 0 12px 4px rgba(255,233,168,.55);animation:pn-float 7s ease-in-out infinite;z-index:1;pointer-events:none}
.pn-fly.f1{left:6%;top:14%}.pn-fly.f2{right:5%;top:30%;animation-delay:1.8s}.pn-fly.f3{left:46%;top:8%;animation-delay:3.2s}.pn-fly.f4{left:20%;bottom:20%;animation-delay:4.4s}

/* ================= hero ================= */
.pn-hero{position:relative;overflow:hidden;color:#DDEFF0;padding:64px 0 170px;
  background:radial-gradient(720px 460px at 78% 34%,rgba(242,182,50,.2),transparent 62%),linear-gradient(165deg,#062A33 0%,#0B4A53 48%,#14395A 100%)}
.pn-hero .wrap{display:grid;grid-template-columns:1.04fr .96fr;gap:40px;align-items:center;position:relative;z-index:2}
.pn-hero h1{color:#fff;font-size:clamp(2.3rem,5vw,4.1rem)}
.pn-hero h1 .serif{color:var(--gold)}
.pn-hero h1:focus{outline:none}
.pn-hero .lead{color:#CFE6E8;margin:20px 0 22px}
.pn-hero .eyebrow{margin-bottom:20px}
.pn-hero .wave{z-index:3}
.pn-three{list-style:none;margin:0 0 28px;padding:0;display:grid;gap:12px;max-width:560px}
.pn-three li{display:flex;gap:14px;align-items:center;padding:12px 16px 12px 12px;border-radius:22px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2)}
.pn-three .ic{flex:none}
.pn-three b{display:block;color:#fff;font:600 1.1rem/1.25 var(--f-head)}
.pn-three span{color:#CFE6E8;font-size:.98rem;line-height:1.45}
.pn-chips{list-style:none;margin:22px 0 0;padding:0;display:flex;gap:10px;flex-wrap:wrap}
.pn-chips li{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.35);border-radius:999px;padding:9px 16px;font-weight:800;font-size:.92rem;color:#fff}
.pn-noscript{margin-top:22px;padding:14px 18px;border-left:4px solid var(--gold);background:rgba(255,255,255,.1);border-radius:0 14px 14px 0;color:#fff;font-weight:700}
.pn-rcard{margin-top:26px;padding:16px 20px;border-left:4px solid var(--gold);background:rgba(255,255,255,.1);border-radius:0 18px 18px 0;max-width:560px}
.pn-rcard p{color:#fff;font-weight:800;margin:0 0 12px}
.pn-hero-v{position:relative}
.pn-teaser{position:relative;width:100%;max-width:560px;margin-left:auto;--wd:rgba(255,255,255,.07);--wh:#0B4A53}
.pn-teaser .pn-hub b{color:#fff}
.pn-teaser::before{content:"";position:absolute;inset:-4%;border-radius:50%;background:radial-gradient(closest-side,rgba(242,182,50,.28),transparent 70%);animation:pn-breathe 6s ease-in-out infinite}
.pn-teaser .pn-wsvg{position:relative}
@media (max-width:900px){
  .pn-hero{padding:40px 0 130px}
  .pn-hero .wrap{grid-template-columns:1fr;gap:34px}
  .pn-teaser{margin:0 auto;max-width:400px}
}

/* ================= the wheel (shared by the teaser and the result) ================= */
.pn-wsvg{display:block;width:100%;height:auto;overflow:visible}
.pn-wdisc{fill:var(--wd)}
.pn-whub{fill:var(--wh)}
.pn-wdot{fill:none;stroke:var(--tl);stroke-opacity:.35;stroke-width:3;stroke-dasharray:2 10;stroke-linecap:round;transform-origin:300px 300px;animation:pn-spin 90s linear infinite}
.pn-teaser .pn-wdot{stroke:#fff}
.pn-tr{fill:none;stroke-width:30;stroke-linecap:round;opacity:.2}
.pn-teaser .pn-tr{opacity:.3}
.pn-fill{fill:none;stroke-width:30;stroke-linecap:round;opacity:0;stroke-dasharray:100 100;stroke-dashoffset:100;transition:stroke-dashoffset 1.2s var(--ease) var(--dl,0s),opacity .01s linear var(--dl,0s)}
.in .pn-fill,.pn-wheel.in .pn-fill{opacity:1;stroke-dashoffset:0}
.pn-hit{fill:none;stroke:transparent;stroke-width:90;pointer-events:stroke}
.pn-seg{outline:none;transition:opacity .3s}
.pn-seg[role="button"]{cursor:pointer}
.pn-seg:focus-visible .pn-hit{stroke:rgba(20,96,107,.2)}
.pn-seg.sel .pn-tr{opacity:.36}
.pn-wheel.hov .pn-seg:not(.hv){opacity:.55}
.pn-bd circle{transition:fill .3s}
.pn-bd text{font-family:var(--f-head);fill:var(--ink);transition:fill .3s}
.pn-seg.sel .pn-bd circle,.pn-seg:hover .pn-bd circle{fill:var(--sc)}
.pn-seg.sel .pn-bd text,.pn-seg:hover .pn-bd text{fill:#fff}
.pn-teaser .pn-bd text{fill:var(--ink)}
.pn-hub{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 26%;pointer-events:none}
.pn-hub b{font:600 clamp(.82rem,1.9vw,1.22rem)/1.2 var(--f-head);color:var(--tl-d);margin-top:6px}
.pn-hubheart{width:21%;height:auto;fill:var(--coral);animation:pn-beat 2.6s ease-in-out infinite}
.pn-wheel{position:relative;max-width:620px;margin:0 auto;--wd:#fff}

/* ================= how it works / gets / faq ================= */
.pn-how-sec{padding:64px 0 90px}
.pn-map{position:relative;max-width:980px;height:44px;margin:0 auto 34px}
.pn-map .line{position:absolute;left:0;right:0;top:19px;height:6px;border-radius:6px;background:rgba(20,96,107,.16)}
.pn-map .line i{position:absolute;inset:0;border-radius:6px;background:linear-gradient(90deg,var(--gold),var(--coral));transform-origin:left;transform:scaleX(0);box-shadow:0 0 14px rgba(242,182,50,.6)}
.pn-map .orb{position:absolute;left:0;top:9px;width:26px;height:26px;margin-left:-13px;border-radius:50%;background:radial-gradient(circle,#fff 0,#FFE9A8 40%,var(--gold) 100%);animation:pn-glow 2.4s ease-in-out infinite}
.pn-map.run .line i{animation:pn-grow 2.8s var(--ease) forwards}
.pn-map.run .orb{animation:pn-run 2.8s var(--ease) forwards,pn-glow 2.4s ease-in-out infinite}
.pn-csteps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pn-cstep{position:relative;background:#fff;border-radius:var(--r-l);padding:26px 22px 24px;box-shadow:var(--sh-1);text-align:center;display:flex;flex-direction:column;align-items:center}
.pn-cstep .n{position:absolute;left:16px;top:16px;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--gold);color:#3A2600;font:700 1.05rem/1 var(--f-head)}
.pn-cstep h3{font-size:1.22rem;margin:12px 0 6px}
.pn-cstep p{margin:0;color:var(--ink-2);font-size:.98rem}
@media (max-width:900px){.pn-csteps{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.pn-csteps{grid-template-columns:1fr}}
.pn-gets-sec{padding:84px 0 100px}
.pn-gets{list-style:none;margin:0 0 36px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pn-get{background:#fff;border-radius:var(--r-l);padding:24px 22px;box-shadow:var(--sh-1);display:flex;flex-direction:column;gap:6px;transition:transform .35s var(--ease),box-shadow .35s}
.pn-get:hover{transform:translateY(-6px);box-shadow:var(--sh-2)}
.pn-get h3{font-size:1.22rem;margin:6px 0 4px}
.pn-get p{margin:0;color:var(--ink-2);font-size:.98rem}
@media (max-width:900px){.pn-gets{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.pn-gets{grid-template-columns:1fr}}
.pn-faq-sec{padding:60px 0 100px}
.pn-faq details{background:#fff;border-radius:var(--r-m);box-shadow:var(--sh-1);margin-bottom:12px;overflow:hidden}
.pn-faq details[open]{box-shadow:var(--sh-2)}
.pn-faq summary{list-style:none;cursor:pointer;padding:20px 62px 20px 24px;font:600 1.15rem/1.3 var(--f-head);position:relative;min-height:44px}
.pn-faq summary::-webkit-details-marker{display:none}
.pn-faq summary::before,.pn-faq summary::after{content:"";position:absolute;right:26px;top:50%;width:16px;height:3px;margin-top:-1px;border-radius:3px;background:var(--coral-d);transition:transform .35s var(--ease)}
.pn-faq summary::after{transform:rotate(90deg)}
.pn-faq details[open] summary::after{transform:rotate(0)}
.pn-faq .a{padding:0 24px 20px;color:var(--ink-2)}
.pn-faq .a p{margin:0}
.pn-faq .a a{font-weight:700}
.pn-faq-sec .note{margin-top:28px}

/* ================= the designer ================= */
.pn-quiz{position:relative;overflow:hidden;min-height:calc(100vh - 74px);padding:34px 0 70px;color:#fff;
  background:radial-gradient(760px 480px at 80% 0%,rgba(242,182,50,.18),transparent 62%),linear-gradient(170deg,#062A33,#0B3C47 55%,#17284F)}
.pn-quiz .wrap{position:relative;z-index:2;max-width:1120px}
.pn-top{margin-bottom:26px}
.pn-jbar{position:relative;height:84px;margin:0 22px 30px}
.pn-jsvg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.pn-jsvg .base{stroke:rgba(255,255,255,.3);stroke-width:4;stroke-dasharray:2 10;stroke-linecap:round}
.pn-jsvg .fill{stroke-width:6;stroke-linecap:round;filter:drop-shadow(0 0 6px rgba(242,182,50,.7))}
.pn-jstart{position:absolute;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;background:#fff;border:4px solid var(--gold);z-index:2}
.pn-jn{position:absolute;transform:translate(-50%,-50%);z-index:2;text-align:center}
.pn-jn .c{display:block;width:46px;height:46px;border-radius:50%;border:3px solid rgba(255,255,255,.3);background:#0B3C47;overflow:hidden;transition:all .5s var(--ease)}
.pn-jn .c svg{width:100%;height:100%;filter:grayscale(.75) opacity(.55);transition:filter .5s}
.pn-jn.done .c{border-color:var(--gold);box-shadow:0 0 0 5px rgba(242,182,50,.25),0 0 18px rgba(242,182,50,.6)}
.pn-jn.done .c svg,.pn-jn.now .c svg{filter:none}
.pn-jn.now .c{border-color:#fff;transform:scale(1.16);box-shadow:0 0 0 5px rgba(255,255,255,.2)}
.pn-jn .lb{position:absolute;left:50%;top:100%;transform:translateX(-50%);margin-top:6px;width:120px;font:800 .7rem/1.25 var(--f-body);letter-spacing:.06em;text-transform:uppercase;color:#CFE6E8}
.pn-jn.now .lb{color:#FFE9A8}
.pn-orb{position:absolute;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;background:radial-gradient(circle,#fff 0,#FFE9A8 38%,var(--gold) 100%);z-index:3;animation:pn-glow 2.4s ease-in-out infinite;pointer-events:none}
.pn-meta{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-weight:800;font-size:.95rem;color:#CFE6E8}
.pn-meta #pn-count{color:#FFE9A8}
.pn-stage{position:relative;background:var(--paper);color:var(--ink);border-radius:var(--r-xl);padding:clamp(22px,4vw,46px) clamp(16px,3vw,40px) clamp(26px,4vw,44px);box-shadow:0 30px 70px rgba(0,0,0,.38);min-height:420px}
.pn-stage::before{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(closest-side,rgba(242,182,50,.22),transparent 70%);pointer-events:none}
.pn-q{animation:pn-fwd .5s var(--ease) both;text-align:center}
.pn-q.back{animation-name:pn-back}
.pn-q.none{animation:pn-fade .5s var(--ease) both}
.pn-welcome{font:italic 600 clamp(1.15rem,2vw,1.45rem)/1.35 var(--f-serif);color:var(--tl);margin:0 0 14px}
.pn-kicker{display:inline-block;margin:0 0 8px;font:800 .78rem/1.2 var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:var(--sun-d);background:var(--sun-t);padding:7px 14px;border-radius:999px}
.pn-qh{font-size:clamp(1.55rem,3.4vw,2.5rem);max-width:22ch;margin:.2em auto .25em}
.pn-qh:focus{outline:none}
.pn-q-help{color:var(--ink-2);font-size:1.05rem;max-width:56ch;margin:0 auto}
.pn-opts{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin-top:28px}
.pn-opt{position:relative;flex:0 1 calc(33.333% - 11px);min-width:200px;display:flex;flex-direction:column;align-items:center;gap:10px;padding:22px 16px 20px;
  border-radius:30px;background:#fff;border:3px solid var(--line);color:var(--ink);font:inherit;text-align:center;cursor:pointer;
  box-shadow:var(--sh-1);transition:transform .35s var(--ease),box-shadow .35s,border-color .25s,background .25s;animation:pn-fade .55s var(--ease) both;animation-delay:calc(var(--k,0)*.05s + .12s)}
.pn-opts[data-n="4"] .pn-opt,.pn-opts[data-n="7"] .pn-opt,.pn-opts[data-n="8"] .pn-opt{flex-basis:calc(25% - 12px);min-width:190px}
.pn-opt:hover{transform:translateY(-5px);box-shadow:var(--sh-2);border-color:#CFE0E2}
.pn-opt:active{transform:translateY(-1px) scale(.98)}
.pn-opt .t b{display:block;font:600 1.12rem/1.25 var(--f-head);color:var(--ink)}
.pn-opt .t span{display:block;font-size:.92rem;line-height:1.4;color:var(--ink-2);margin-top:4px}
.pn-opt .pn-ic{width:104px;height:104px;transition:transform .45s var(--ease)}
.pn-opt:hover .pn-ic{transform:scale(1.07) rotate(-2deg)}
.pn-opt .chk{position:absolute;right:12px;top:12px;width:32px;height:32px;border-radius:50%;background:var(--tl);display:grid;place-items:center;transform:scale(0);box-shadow:0 4px 10px rgba(11,74,83,.35)}
.pn-opt .chk svg{width:18px;height:18px}
.pn-opt.on{border-color:var(--tl);background:linear-gradient(180deg,#fff,#EAF6F6);box-shadow:0 0 0 5px rgba(20,96,107,.14),var(--sh-2)}
.pn-opt.on .chk{transform:scale(1);animation:pn-pop .45s var(--ease)}
.pn-opt.bump .pn-ic{animation:pn-bounce .6s var(--ease)}
.pn-opt.shake{animation:pn-shake .35s linear}
.pn-opt.ex{border-style:dashed;background:#FBF6EC}
.pn-opt.ex.on{background:#EAF6F6}
.pn-opt:focus-visible{outline:4px solid var(--sky);outline-offset:3px}
@media (max-width:760px){
  .pn-opt,.pn-opts[data-n="4"] .pn-opt,.pn-opts[data-n="7"] .pn-opt,.pn-opts[data-n="8"] .pn-opt{flex:0 0 100%;min-width:0;flex-direction:row;text-align:left;gap:14px;padding:12px 52px 12px 12px;border-radius:24px}
  .pn-opt .pn-ic{width:64px;height:64px}
  .pn-opt .t b{font-size:1.05rem}
  .pn-opt .chk{top:50%;right:12px;margin-top:-16px}
  .pn-opts{gap:12px;margin-top:22px}
}

/* the glowing dial: four flames */
.pn-dial-issue{display:flex;gap:18px;align-items:center;max-width:640px;margin:22px auto 0;padding:14px 22px 14px 14px;border-radius:30px;background:#fff;box-shadow:var(--sh-1);text-align:left}
.pn-dial-issue b{display:block;font:600 1.2rem/1.25 var(--f-head)}
.pn-dial-issue span{display:block;color:var(--ink-2);font-size:.98rem;line-height:1.45;margin-top:4px}
.pn-dialq .pn-q-help{margin-top:18px}
.pn-flames{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-width:720px;margin:22px auto 0}
.pn-fb{display:flex;flex-direction:column;align-items:center;gap:8px;padding:6px 4px 12px;border:0;border-radius:24px;background:transparent;font:inherit;cursor:pointer;color:var(--ink);transition:background .3s}
.pn-fb:hover{background:rgba(242,182,50,.12)}
.pn-fb:focus-visible{outline:4px solid var(--sky);outline-offset:3px}
.pn-fb .fw{display:flex;align-items:flex-end;justify-content:center;height:112px;width:100%}
.pn-fb .fl{width:calc(30px + var(--k)*11px);height:auto;transition:transform .4s var(--ease)}
.pn-fb .fl .o{fill:#E6DFCD;transition:fill .4s}
.pn-fb .fl .i{fill:#F3EEE0;transition:fill .4s}
.pn-fb.lit .fl{filter:drop-shadow(0 0 14px rgba(242,182,50,.85));animation:pn-flick 2.2s ease-in-out infinite;animation-delay:calc(var(--k)*.2s)}
.pn-fb.lit .fl .o{fill:#F2B632}
.pn-fb.lit .fl .i{fill:#FFF3B8}
.pn-fb[data-l="3"].lit .fl .o{fill:#F29A3A}
.pn-fb[data-l="4"].lit .fl .o{fill:#E4694A}
.pn-fb[data-l="4"].lit .fl .i{fill:#FFD98A}
.pn-fb .fw.pop .fl{animation:pn-bounce .6s var(--ease)}
.pn-fb b{font:600 1.05rem/1.2 var(--f-head)}
.pn-fb.cur b{color:var(--coral-d);text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:5px}
@media (max-width:560px){
  .pn-flames{gap:4px}
  .pn-fb .fw{height:84px}
  .pn-fb .fl{width:calc(22px + var(--k)*8px)}
  .pn-fb b{font-size:.9rem}
  .pn-dial-issue{flex-direction:column;text-align:center;padding:16px}
}

.pn-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:24px}
.pn-leave{background:none;border:0;color:#CFE6E8;text-decoration:underline;text-underline-offset:4px;font:800 .95rem var(--f-body);cursor:pointer;min-height:44px;padding:0 8px}
.pn-leave:hover{color:#fff}
.pn .btn-p.pn-ghost{background:rgba(255,255,255,.1);border:2px solid rgba(255,255,255,.7);box-shadow:none;color:#fff}
.pn .btn-p.pn-ghost:hover{background:#fff;color:var(--ink)}
.pn-reassure{margin:22px 0 0;text-align:center;color:#CFE6E8;font-weight:700}
@media (max-width:560px){
  .pn-quiz{padding:22px 0 50px}
  .pn-jbar{height:62px;margin:0 14px 18px}
  .pn-jn .c{width:34px;height:34px;border-width:2px}
  .pn-jn .lb{display:none}
  .pn-orb{width:20px;height:20px;margin:-10px 0 0 -10px}
  .pn-nav .btn{padding-left:20px;padding-right:20px}
  .pn-stage{border-radius:30px}
  .pn-leave{font-size:.85rem}
}

/* the plan is being put together */
.pn-build{min-height:calc(100vh - 74px);display:grid;place-items:center;text-align:center;color:#fff;padding:60px 24px;
  background:radial-gradient(700px 440px at 50% 40%,rgba(242,182,50,.22),transparent 62%),linear-gradient(170deg,#062A33,#0B3C47 55%,#17284F)}
.pn-build h2{color:#fff;margin-top:10px}
.pn-build p{color:#CFE6E8;font-size:1.15rem}
.pn-lamp{width:140px;margin:0 auto;filter:drop-shadow(0 0 30px rgba(242,182,50,.7));animation:pn-flick 1.8s ease-in-out infinite}
.pn-lamp .pn-ic{width:140px;height:140px}

/* ================= the result ================= */
.pn-print-head{display:none}
.pn-res-hero{position:relative;overflow:hidden;color:#DDEFF0;padding:56px 0 150px;
  background:radial-gradient(720px 440px at 80% 20%,rgba(242,182,50,.22),transparent 62%),linear-gradient(165deg,#062A33 0%,#0B4A53 50%,#14395A 100%)}
.pn-res-hero .wrap{position:relative;z-index:2;text-align:center}
.pn-res-hero h2{color:#fff;font-size:clamp(2.2rem,5vw,3.8rem);margin:.3em 0 .2em}
.pn-res-hero h2:focus{outline:none}
.pn-res-hero h2 .serif{color:var(--gold)}
.pn-res-hero .lead{color:#CFE6E8;max-width:54ch;margin:0 auto 14px}
.pn-res-hero .eyebrow{margin-bottom:8px}
.pn-disc-top{max-width:56ch;margin:0 auto 22px;padding:12px 18px;border:1px solid rgba(255,255,255,.3);border-radius:18px;background:rgba(255,255,255,.08);color:#fff;font-weight:800}
.pn-res-hero .wave{z-index:3}
.pn-tools{justify-content:center}
.pn-anchors{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:22px}
.pn-anchors a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid rgba(255,255,255,.4);color:#fff;font-weight:800;font-size:.92rem;text-decoration:none;transition:all .25s}
.pn-anchors a:hover{background:#fff;color:var(--ink)}
.pn-r{padding:70px 0}
.pn-r .sec-head{margin-bottom:38px}
.pn-r-wheel{padding-top:40px}

/* wheel section */
.pn-wheel-grid{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,1fr);gap:44px;align-items:center}
.pn-wheel-box{padding:10px}
.pn-key{list-style:none;margin:0 0 14px;padding:0;display:flex;gap:18px;flex-wrap:wrap;font-size:.95rem;color:var(--ink-2)}
.pn-key li{display:flex;align-items:center;gap:8px}
.pn-key i{display:block;width:30px;height:12px;border-radius:6px}
.pn-key .k1{background:var(--tl)}
.pn-key .k2{background:repeating-linear-gradient(45deg,var(--tl) 0 4px,#B4D3D7 4px 8px)}
.pn-legend{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.pn-lg{display:grid;grid-template-columns:30px 44px 1fr;gap:10px;align-items:center;width:100%;text-align:left;padding:10px 14px 10px 10px;border-radius:20px;background:#fff;border:2px solid transparent;box-shadow:var(--sh-1);font:inherit;color:var(--ink);cursor:pointer;transition:all .25s}
.pn-lg:hover{transform:translateX(4px)}
.pn-lg.sel{border-color:var(--sc);box-shadow:0 0 0 4px color-mix(in srgb,var(--sc) 20%,transparent),var(--sh-2)}
.pn-lg:focus-visible{outline:4px solid var(--sky);outline-offset:2px}
.pn-lg .num{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--sc);color:#fff;font:700 .95rem/1 var(--f-head)}
.pn-lg .pn-ic{width:44px;height:44px}
.pn-lg .nm b{display:block;font:600 1.05rem/1.2 var(--f-head);margin-bottom:5px}
.pn-lg .row{display:grid;grid-template-columns:14px 62px 1fr;align-items:center;gap:8px;font-size:.84rem;line-height:1.3;color:var(--ink-2)}
.pn-lg .row em{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.pn-lg .row::before{content:"";width:14px;height:8px;border-radius:4px;background:var(--sc)}
.pn-lg .row:last-of-type::before{background:repeating-linear-gradient(45deg,var(--sc) 0 2px,color-mix(in srgb,var(--sc) 25%,#fff) 2px 4px)}
.pn-mb{display:block;height:8px;border-radius:5px;background:color-mix(in srgb,var(--sc) 16%,#fff);overflow:hidden}
.pn-mb i{display:block;height:100%;background:var(--sc);border-radius:5px}
.pn-mb.h i{background:repeating-linear-gradient(45deg,var(--sc) 0 4px,color-mix(in srgb,var(--sc) 35%,#fff) 4px 8px)}
.pn-detail{margin-top:16px;padding:20px 22px;border-radius:24px;background:#fff;border-left:8px solid var(--sc,var(--tl));box-shadow:var(--sh-2);animation:pn-fade .4s var(--ease)}
.pn-detail h4{display:flex;align-items:center;gap:12px;font-size:1.3rem;margin:0 0 8px}
.pn-detail h4 i{font:700 1rem/1 var(--f-head);font-style:normal;display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--sc);color:#fff;margin-right:6px}
.pn-detail p{margin:0 0 10px;color:var(--ink-2)}
.pn-detail .two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.pn-detail .two p{margin:4px 0 0;font-size:.95rem}
.pn-detail .two b{font:600 1rem/1.3 var(--f-head);color:var(--ink)}
.pn-detail .hint{margin:0}
.pn-wnote{margin:14px 0 0;padding:12px 16px;border-radius:16px;background:var(--sun-t);color:var(--ink);font-weight:700}
.pn-explain{max-width:820px;margin:40px auto 0;padding:26px 30px;border-radius:var(--r-l);background:#fff;box-shadow:var(--sh-1);border-top:6px solid var(--gold)}
.pn-explain p{margin:0 0 10px;color:var(--ink-2)}
.pn-explain p:last-child{margin:0}
.pn-honest{color:var(--tl-d)!important;font-size:1.2rem;font-family:var(--f-head)}
.pn-explain a{font-weight:700}
@media (max-width:900px){
  .pn-wheel-grid{grid-template-columns:1fr;gap:26px}
  .pn-detail .two{grid-template-columns:1fr}
}
@media (max-width:480px){
  .pn-lg{grid-template-columns:28px 1fr;padding:10px}
  .pn-lg .pn-ic{display:none}
  .pn-lg .row{grid-template-columns:14px 52px 1fr}
}

/* route */
.pn-r-route{background:#fff}
.pn-rcs{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch;padding-top:14px}
.pn-rc{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;background:var(--paper);border-radius:var(--r-l);padding:34px 24px 24px;border:2px solid var(--line);opacity:.94}
.pn-rc.rec{background:linear-gradient(180deg,#fff,#E6F3F4);border-color:var(--tl);box-shadow:0 0 0 7px rgba(20,96,107,.1),var(--sh-3);transform:translateY(-8px);opacity:1}
.pn-rc .ribbon{position:absolute;top:-15px;left:22px;background:var(--coral-d);color:#fff;font:800 .74rem/1 var(--f-body);letter-spacing:.08em;text-transform:uppercase;padding:9px 15px;border-radius:999px}
.pn-rc .ribbon.alt{background:#5A5170}
.pn-rc .tag{font:800 .74rem/1.2 var(--f-body);letter-spacing:.1em;text-transform:uppercase;color:var(--tl-d);background:var(--tl-t);padding:6px 12px;border-radius:999px;margin-top:8px}
.pn-rc h4{font-size:1.4rem;margin:6px 0 4px}
.pn-rc p{margin:0;color:var(--ink-2);font-size:1rem}
.pn-rc .best{font-weight:800;color:var(--ink);margin-top:8px}
.pn-why{margin-top:34px;padding:26px 30px;border-radius:var(--r-l);background:var(--paper);border:2px dashed #CFE0E2}
.pn-why h4{font-size:1.3rem;margin:0 0 12px}
.pn-why ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.pn-why li{position:relative;padding-left:36px;color:var(--ink-2);line-height:1.55}
.pn-why li::before{content:"";position:absolute;left:0;top:.1em;width:24px;height:24px;border-radius:50%;background:var(--tl) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.5 3.5 7-8' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
@media (max-width:900px){
  .pn-rcs{grid-template-columns:1fr;gap:26px}
  .pn-rc{order:var(--o,0)}
  .pn-rc.rec{transform:none}
}

/* journey (dark) */
.pn-r-journey{background:radial-gradient(900px 500px at 85% 0%,rgba(242,182,50,.14),transparent 60%),linear-gradient(170deg,#062A33,#0B3C47 55%,#17284F);color:#DDEFF0}
.pn-r-journey .sec-head h3{color:#fff}
.pn-r-journey .sec-head h3 .serif{color:var(--gold)}
.pn-r-journey .sec-head .lead{color:#CFE6E8}
.pn-journey{position:relative;max-width:1000px;margin:0 auto}
.pn-rail{position:absolute;left:40px;top:40px;bottom:40px;width:0;border-left:4px dotted rgba(255,255,255,.28);transform:translateX(-2px)}
.pn-rail i{position:absolute;left:-4px;top:0;width:4px;height:var(--p,100%);background:linear-gradient(180deg,var(--gold),var(--coral),var(--vio));border-radius:4px;box-shadow:0 0 10px rgba(242,182,50,.6)}
.pn-rail b{position:absolute;left:-15px;top:var(--p,100%);width:26px;height:26px;margin-top:-13px;border-radius:50%;background:radial-gradient(circle,#fff 0,#FFE9A8 40%,var(--gold) 100%);box-shadow:0 0 0 7px rgba(242,182,50,.28),0 0 26px 8px rgba(242,182,50,.55);opacity:0;transition:opacity .4s}
[data-live] > .pn-rail b{opacity:1}
.pn-js{list-style:none;margin:0;padding:0;display:grid;gap:30px}
.pn-j{position:relative;padding-left:120px}
.pn-j .node{position:absolute;left:0;top:26px;width:80px;height:80px;border-radius:50%;display:grid;place-items:center;background:#0B3C47;border:5px solid rgba(255,255,255,.35);font:700 2rem/1 var(--f-head);color:#fff;z-index:2;transition:all .6s var(--ease)}
.pn-j.on .node,.pn-journey:not([data-live]) .node{background:var(--gold);border-color:#fff;color:#3A2600;box-shadow:0 0 0 10px rgba(242,182,50,.25),0 0 40px rgba(242,182,50,.5)}
.pn-j .card{background:#fff;color:var(--ink);padding:30px 32px;border-radius:var(--r-l);box-shadow:var(--sh-3);transition:opacity .7s var(--ease),transform .7s var(--ease)}
[data-live] .pn-j:not(.on) .card{opacity:.82;transform:translateX(26px)}
.pn-j.later .card{border:3px dashed #B4D3D7}
.pn-later{display:inline-block;margin:0 0 12px;padding:8px 16px;border-radius:999px;background:var(--sun-t);color:var(--sun-d);font:800 .8rem/1.2 var(--f-body);letter-spacing:.06em;text-transform:uppercase}
.pn-j .num{display:inline-block;font:800 .74rem/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:var(--tl-d);background:var(--tl-t);padding:7px 12px;border-radius:999px;margin-bottom:12px}
.pn-j h4{font-size:clamp(1.4rem,2.5vw,1.9rem);margin-bottom:8px}
.pn-j .card > p{color:var(--ink-2);margin:0 0 12px}
.pn-j .more{display:inline-flex;align-items:center;min-height:44px;font-weight:800;color:var(--tl-d);text-decoration-thickness:2px;text-underline-offset:4px}
.pn-j .watch{margin:14px 0 0;padding:12px 16px;border-radius:16px;background:var(--sun-t);color:var(--ink);font-weight:700}
.pn-dayparts{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px;counter-reset:d}
.pn-dayparts li{counter-increment:d;padding:8px 14px 8px 36px;border-radius:999px;background:var(--tl-t);color:var(--tl-d);font-weight:800;font-size:.92rem;position:relative}
.pn-dayparts li::before{content:counter(d);position:absolute;left:8px;top:50%;width:22px;height:22px;margin-top:-11px;border-radius:50%;background:var(--tl);color:#fff;display:grid;place-items:center;font:700 .8rem/1 var(--f-head)}
.pn-mods{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.pn-mod{--mc:var(--tl);position:relative;display:flex;gap:12px;align-items:flex-start;padding:14px 56px 14px 14px;border-radius:var(--r-m);background:color-mix(in srgb,var(--mc) 8%,#fff);border:1px solid color-mix(in srgb,var(--mc) 28%,#fff);border-left:6px solid var(--mc)}
.pn-mod.t6{grid-column:1/-1;padding-right:14px;background:linear-gradient(90deg,color-mix(in srgb,var(--mc) 14%,#fff),#fff)}
.pn-mod.extra{grid-column:1/-1;padding-right:14px;border-style:dashed;background:#fff}
.pn-mod .code{flex:none;display:grid;place-items:center;min-width:42px;height:32px;border-radius:999px;background:var(--mc);color:#fff;font:700 .95rem/1 var(--f-head)}
.pn-mod b{display:block;font:600 1.08rem/1.25 var(--f-head);color:var(--ink)}
.pn-mod .emph{display:inline-block;font:800 .68rem/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;font-style:normal;padding:5px 9px;border-radius:999px;margin:5px 0 3px}
.pn-mod.e-main .emph{background:var(--coral-d);color:#fff}
.pn-mod.e-support .emph,.pn-mod.extra .emph{background:var(--sun-t);color:var(--sun-d)}
.pn-mod.e-found .emph{background:var(--tl-t);color:var(--tl-d)}
.pn-mod.e-leaders .emph{background:#2A3068;color:#fff}
.pn-mod.e-main{background:color-mix(in srgb,var(--mc) 14%,#fff)}
.pn-mod .line{display:block;font-size:.9rem;color:var(--ink-2);line-height:1.4}
.pn-mod .why{display:block;font-size:.9rem;color:var(--ink);line-height:1.45;margin-top:6px;font-weight:700}
.pn-mod .ord{position:absolute;right:14px;top:14px;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--ink);color:#fff;font:700 1rem/1 var(--f-head)}
.pn-asl{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:10px}
.pn-as{display:flex;gap:14px;align-items:flex-start;padding:12px 14px;border-radius:var(--r-m);background:var(--paper)}
.pn-as.first{background:var(--sun-t)}
.pn-as b{display:block;font:600 1.08rem/1.25 var(--f-head)}
.pn-as b em{font:800 .66rem/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;font-style:normal;background:var(--coral-d);color:#fff;padding:4px 8px;border-radius:999px;margin-left:6px;vertical-align:middle}
.pn-as span{display:block;font-size:.93rem;color:var(--ink-2);line-height:1.45}
.pn-as .why{color:var(--ink);font-weight:700;margin-top:4px}
.pn-as .newtag{display:inline-block;margin-top:6px;font:800 .68rem/1 var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:var(--vio-d);background:var(--vio-t);padding:5px 9px;border-radius:999px}
.pn-aud{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.pn-aud li{display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:var(--r-m);background:var(--paper)}
.pn-aud .pin{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--gold);color:#3A2600;font:700 1.2rem/1 var(--f-head)}
.pn-aud b{display:block;font:600 1.15rem/1.2 var(--f-head)}
.pn-aud span{display:block;font-size:.92rem;color:var(--ink-2);line-height:1.4}
.pn-j.road .card{background:linear-gradient(135deg,#fff,#EFE8F8)}
@media (max-width:900px){
  .pn-rail{left:30px}
  .pn-j{padding-left:86px}
  .pn-j .node{width:60px;height:60px;font-size:1.5rem;top:22px}
  .pn-j .card{padding:24px 20px}
  .pn-mods,.pn-aud{grid-template-columns:1fr}
}
@media (max-width:480px){
  .pn-rail{left:22px}
  .pn-j{padding-left:62px}
  .pn-j .node{width:44px;height:44px;font-size:1.15rem;border-width:4px;top:18px}
  .pn-j .card{padding:22px 16px}
}

/* measure and steps */
.pn-r-measure{background:linear-gradient(180deg,var(--paper),#E8F3F4)}
.pn-inds{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.pn-ind{display:flex;gap:16px;align-items:flex-start;background:#fff;border-radius:var(--r-l);padding:20px 22px;box-shadow:var(--sh-1);border-top:5px solid var(--tl)}
.pn-ind b{display:block;font:600 1.15rem/1.25 var(--f-head);margin-bottom:5px}
.pn-ind span{display:block;color:var(--ink-2);font-size:.97rem;line-height:1.5}
.pn-ind em{display:inline-block;margin-top:8px;margin-right:6px;font:800 .68rem/1 var(--f-body);letter-spacing:.08em;text-transform:uppercase;font-style:normal;padding:6px 10px;border-radius:999px}
.pn-ind em.t{background:var(--leaf-t);color:var(--leaf-d)}
.pn-ind em.s{background:var(--sun-t);color:var(--sun-d)}
.pn-mwhen{margin:26px 0 6px;font-size:1.08rem;color:var(--ink)}
.pn-mnote{margin:0;color:var(--ink-2);font-size:.95rem}
@media (max-width:760px){.pn-inds{grid-template-columns:1fr}}
.pn-r-steps{background:var(--leaf-t)}
.pn-stepl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;counter-reset:s}
.pn-step{position:relative;background:#fff;border-radius:var(--r-l);padding:26px 22px 24px;box-shadow:var(--sh-1);display:flex;flex-direction:column;gap:10px}
.pn-step .no{position:absolute;right:18px;top:14px;font:700 3rem/1 var(--f-head);color:var(--leaf);opacity:.28}
.pn-step .tg{display:inline-block;font:800 .72rem/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:var(--leaf-d);background:var(--leaf-t);padding:6px 10px;border-radius:999px}
.pn-step h4{font-size:1.25rem;margin:8px 0 6px}
.pn-step p{margin:0;color:var(--ink-2);font-size:.98rem;line-height:1.55}
@media (max-width:900px){.pn-stepl{grid-template-columns:1fr}}

/* send */
.pn-r-send{background:linear-gradient(180deg,#FFF3E2,var(--paper))}
.pn-send{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:start}
.pn-links{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:12px}
.pn-links li{background:#fff;border-radius:var(--r-m);padding:14px 18px;box-shadow:var(--sh-1)}
.pn-links a{font:600 1.12rem/1.3 var(--f-head);color:var(--tl-d);display:inline-flex;align-items:center;min-height:44px}
.pn-links span{display:block;color:var(--ink-2);font-size:.95rem}
.pn-send-r{background:#fff;border-radius:var(--r-xl);padding:34px;box-shadow:var(--sh-2)}
.pn-form{gap:18px}
.pn-form .req{font-weight:700;font-size:.82em;color:var(--ink-3)}
.pn-form .hint{font-size:.88rem;color:var(--ink-3);margin:6px 0 0}
.pn-form .err{font-size:.92rem;color:#A5281B;font-weight:800;margin:6px 0 0}
.pn-form [aria-invalid="true"]{border-color:#A5281B!important;box-shadow:0 0 0 4px #FBE0DB!important}
.pn-form-msg{border-radius:var(--r-s);font-weight:800;outline:none}
.pn-form-msg:not(:empty){padding:14px 18px;background:#FDE2D9;color:#7A1E10;border:2px solid #E9A895}
.pn-form-msg ul{margin:6px 0 0;padding-left:20px;font-weight:700}
.pn .chk{display:flex;gap:12px;align-items:center;font-weight:800;cursor:pointer;min-height:44px}
.pn .chk input{width:24px;height:24px;flex:none;accent-color:var(--coral-d);cursor:pointer}
.pn-sent{text-align:center;padding:30px 22px;background:var(--leaf-t);border-radius:var(--r-l);animation:pn-fade .6s var(--ease);outline:none}
.pn-sent-ic{display:flex;justify-content:center;margin-bottom:10px;animation:pn-beat 2.4s ease-in-out infinite}
.pn-sent h3{font-size:1.6rem}
.pn-saved{font-weight:800;color:var(--ink)}
.pn-disc{max-width:62ch;margin:34px auto 0;padding:16px 22px;border-radius:20px;background:var(--sun-t);color:var(--ink);font-weight:800;text-align:center}
.pn-print-note{display:none}
@media (max-width:900px){.pn-send{grid-template-columns:1fr;gap:30px}.pn-send-r{padding:24px 18px}}

/* confetti of hearts */
.pn-conf{position:fixed;left:50%;top:38%;width:0;height:0;pointer-events:none;z-index:300}
.pn-conf span{position:absolute;left:0;top:0;width:var(--s);height:var(--s);fill:var(--c);opacity:0;animation:pn-heart 1.7s cubic-bezier(.2,.8,.3,1) forwards}
.pn-conf svg{width:100%;height:100%;fill:var(--c)}

/* ================= reduced motion ================= */
@media (prefers-reduced-motion:reduce){
  .pn *,.pn *::before,.pn *::after{animation:none!important;transition:none!important}
  .pn-fill{opacity:1;stroke-dashoffset:0}
  .pn-map .line i{transform:none}
  .pn-map .orb{left:100%}
  .pn-conf{display:none}
}

/* ================= print: the plan only, clean ================= */
@media print{
  @page{margin:14mm}
  html,body{background:#fff!important}
  .hdr,.ftr,.skip,.wow-progress,.wow-amb,.wow-garden,.pn-fly,#pn-intro,.pn-quiz,.pn-build,.pn-tools,.pn-anchors,.pn-send,.pn-links,.pn-key{display:none!important}
  .pn-res{display:block!important;color:#000}
  .pn-print-head{display:block;padding:0 0 10px;margin-bottom:10px;border-bottom:3px solid #14606B;font-size:14pt;color:#0B4A53}
  .pn-res-hero{background:none!important;color:#000;padding:0 0 10px}
  .pn-res-hero h2,.pn-res-hero .lead{color:#000!important}
  .pn-res-hero .wave,.pn-res-hero .eyebrow{display:none}
  .pn-disc-top{border-color:#999;background:none;color:#000}
  .pn-r{padding:14px 0!important;background:none!important;break-inside:auto}
  .pn-r .sec-head{margin-bottom:12px}
  .pn-r-journey,.pn-r-journey .sec-head h3,.pn-r-journey .sec-head .lead{color:#000!important;background:none!important}
  .pn-r-journey .sec-head h3 .serif{color:#14606B!important}
  .pn-wheel-grid{grid-template-columns:1fr 1fr;gap:16px}
  .pn-wheel,.pn-wsvg{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .pn-fill{opacity:1!important;stroke-dashoffset:0!important;transition:none!important}
  .pn-legend{display:grid!important}
  .pn-lg{box-shadow:none;border:1px solid #ccc;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .pn-detail,.pn-explain,.pn-why,.pn-rc,.pn-ind,.pn-step,.pn-mod,.pn-as,.pn-aud li,.pn-j .card{box-shadow:none!important;break-inside:avoid;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .pn-rcs{grid-template-columns:repeat(3,1fr);gap:10px}
  .pn-rc.rec{transform:none;box-shadow:none}
  .pn-rail{display:none}
  .pn-j{padding-left:0}
  .pn-j .node{position:static;display:inline-grid;width:34px;height:34px;font-size:1rem;border-width:3px;margin-bottom:6px;box-shadow:none!important}
  .pn-j .card,[data-live] .pn-j:not(.on) .card{opacity:1!important;transform:none!important;box-shadow:none!important;border:1px solid #bbb}
  .pn-js{gap:12px}
  .pn-stepl,.pn-inds{gap:10px}
  .reveal{opacity:1!important;transform:none!important}
  .pn-print-note{display:block;text-align:center;font-size:10pt;color:#555;margin-top:14px}
  .pn-disc{background:none;border:1px solid #999;color:#000}
  .pn-r-send{display:block!important;background:none!important;padding:0!important}
  .pn-send{display:none}
  a{text-decoration:none;color:inherit}
}

.pn-cap{text-align:center;color:#CFE6E8;font:italic 600 1.15rem/1.3 var(--f-serif);margin:14px 0 0}
.pn-wheel-box{position:sticky;top:92px;align-self:start}
.pn-key li{white-space:nowrap}
@media (max-width:900px){.pn-wheel-box{position:static}}

@media (max-width:760px){
  .pn-nav{position:sticky;bottom:0;z-index:20;margin:18px -24px 0;padding:10px 24px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(0deg,#0B3C47 70%,rgba(11,60,71,0))}
  .pn-dial-issue{flex-direction:row;text-align:left;padding:10px 14px 10px 10px;gap:12px;margin-top:14px}
  .pn-dial-issue .pn-ic{width:68px;height:68px}
  .pn-dial-issue b{font-size:1.05rem}
  .pn-dial-issue span{font-size:.9rem}
  .pn-dialq .pn-q-help{margin-top:12px}
  .pn-flames{margin-top:12px}
  .pn-fb .fw{height:76px}
}
.pn-res{padding:0!important}

@media (max-width:480px){
  .pn-r-journey .wrap{padding:0 10px}
  .pn-rail{left:16px;top:24px}
  .pn-j{padding-left:46px}
  .pn-j .node{width:32px;height:32px;font-size:1rem;border-width:3px;top:14px}
  .pn-j .card{padding:18px 12px;border-radius:24px}
  .pn-mod{padding:10px 40px 10px 8px;gap:8px}
  .pn-mod.t6,.pn-mod.extra{padding-right:8px}
  .pn-mod .code{min-width:34px;height:26px;font-size:.8rem}
  .pn-mod .emph{white-space:nowrap;font-size:.6rem;letter-spacing:.05em}
  .pn-mod .ord{right:8px;top:8px;width:26px;height:26px;font-size:.85rem}
  .pn-mod b{font-size:1rem}
  .pn-as{padding:10px 8px;gap:8px}
  .pn-as .pn-ic{width:44px;height:44px}
  .pn-later{font-size:.7rem}
  .pn-ind{padding:16px 14px;gap:12px}
  .pn-ind .pn-ic{width:52px;height:52px}
  .pn-step .pn-ic{width:64px;height:64px}
}
.pn-teaser:empty,.pn-teaser:empty + .pn-cap{display:none}


/* ================= final fix pass ================= */
/* two choices fill the card (e.g. "If one hope came first") */
.pn-opts[data-n="2"] .pn-opt{flex:1 1 calc(50% - 8px);max-width:none;min-height:190px;justify-content:center}
/* progress map: compact after the first question so Back and Skip are visible on a short screen */
.pn-quiz.compact .pn-top{margin-bottom:12px}
.pn-quiz.compact .pn-jbar{height:52px;margin:0 22px 8px}
.pn-quiz.compact .pn-jn .c{width:34px;height:34px;border-width:2px}
.pn-quiz.compact .pn-jn .lb{display:none}
.pn-quiz.compact .pn-orb{width:20px;height:20px;margin:-10px 0 0 -10px}
.pn-quiz.compact .pn-stage{min-height:0;padding-top:18px;padding-bottom:20px}
.pn-quiz.compact .pn-opts{margin-top:16px;gap:12px}
.pn-quiz.compact .pn-opt{padding:14px 14px 14px}
.pn-quiz.compact .pn-opt .pn-ic{width:72px;height:72px}
.pn-quiz.compact .pn-nav{margin-top:14px}
.pn-quiz.compact .pn-reassure{margin-top:10px}
@media (max-height:800px) and (min-width:561px){
  .pn-opt .pn-ic{width:80px;height:80px}
  .pn-opts{margin-top:18px}
  .pn-quiz.compact .pn-opt .pn-ic{width:60px;height:60px}
  .pn-quiz.compact .pn-opt{padding:10px 12px}
  .pn-quiz.compact .pn-stage{padding-top:14px;padding-bottom:16px}
}
/* chips in the dark hero: readable contrast */
.pn-hero .pn-chips li,.pn-res-hero .pn-chips li{background:rgba(4,24,31,.5);color:#fff;border-color:rgba(255,255,255,.55)}
/* form fields: a stronger border */
.pn-form input:not([type=checkbox]),.pn-form select,.pn-form textarea{border-color:#B9A98A}
.pn-priv{margin:10px 0 0;font-size:.95rem}
.pn-priv a{font-weight:700}
/* underline colour on the dark sections: gold at about 60% */
.pn-hero a:not(.btn),.pn-res-hero a:not(.btn),.pn-quiz a:not(.btn),.pn-journey a:not(.btn){text-decoration-color:rgba(242,182,50,.6);text-underline-offset:3px}
.pn-faq summary:focus-visible{outline:3px solid var(--wp,#14606B);outline-offset:-3px}
.pn-sent.fail .pn-sent-h{color:#7A1E10}
.pn-sent.fail .pn-saved{background:#FDE2D9;border:2px solid #E9A895;color:#7A1E10;border-radius:var(--r-m);padding:12px 16px}

@media (max-height:800px) and (min-width:761px){
  .pn-quiz.compact .pn-opts:not([data-n="2"]):not([data-n="3"]):not([data-n="4"]) .pn-opt{flex-direction:row;text-align:left;gap:12px;padding:8px 44px 8px 10px;min-width:0;flex:1 1 calc(33.333% - 11px)}
  .pn-quiz.compact .pn-opts:not([data-n="2"]):not([data-n="3"]):not([data-n="4"]) .pn-opt .pn-ic{width:52px;height:52px;flex:none}
  .pn-quiz.compact .pn-opts:not([data-n="2"]):not([data-n="3"]):not([data-n="4"]) .pn-opt .chk{top:50%;right:10px;margin-top:-16px}
  .pn-quiz.compact .pn-opts[data-n="4"] .pn-opt{padding:10px 12px}
  .pn-quiz.compact .pn-dial-issue{margin-top:10px;padding:8px 18px 8px 10px}
  .pn-quiz.compact .pn-dial-issue .pn-ic{width:64px;height:64px}
  .pn-quiz.compact .pn-flames{margin-top:8px}
  .pn-quiz.compact .pn-fb .fw{height:78px}
  .pn-quiz.compact .pn-fb{padding-bottom:6px}
  .pn-quiz.compact .pn-dialq .pn-q-help{margin-top:8px}
}

@media (max-height:800px) and (min-width:761px){
  .pn-quiz.compact .pn-qh{font-size:clamp(1.4rem,2.4vw,1.9rem);max-width:34ch;margin:.1em auto .15em}
  .pn-quiz.compact .pn-q-help{font-size:.98rem}
  .pn-quiz.compact .pn-kicker{margin-bottom:4px;padding:5px 12px}
  .pn-quiz.compact .pn-stage{padding-left:clamp(16px,3vw,32px);padding-right:clamp(16px,3vw,32px)}
  .pn-quiz.compact .pn-opts[data-n="7"] .pn-opt,.pn-quiz.compact .pn-opts[data-n="8"] .pn-opt{flex:1 1 calc(25% - 12px)}
}

@media (max-height:800px) and (min-width:761px){
  .pn-quiz.compact .pn-opts:not([data-n="2"]):not([data-n="3"]):not([data-n="4"])[data-n="7"] .pn-opt,
  .pn-quiz.compact .pn-opts:not([data-n="2"]):not([data-n="3"]):not([data-n="4"])[data-n="8"] .pn-opt{flex:1 1 calc(25% - 12px)}
  .pn-quiz.compact .pn-opts:not([data-n="2"]):not([data-n="3"]):not([data-n="4"]) .pn-opt{padding-top:6px;padding-bottom:6px}
  .pn-quiz.compact .pn-opts:not([data-n="2"]):not([data-n="3"]):not([data-n="4"]) .pn-opt .pn-ic{width:46px;height:46px}
  .pn-quiz.compact .pn-opts{gap:10px;margin-top:12px}
}