/* Nerusalem marketing site - VERSION 4 = version 3 + enhancements.
   Loaded AFTER site-v3.css; only adds or refines. White background rule
   still applies. */

/* ---------- four-colour reading progress ---------- */
.readbar{position:fixed;inset:0 0 auto;z-index:70;height:3px;pointer-events:none}
.readbar span{display:block;height:100%;transform-origin:left;transform:scaleX(0);background:linear-gradient(90deg,var(--navy),var(--maroon) 35%,var(--teal) 70%,var(--amber))}

/* ---------- pointer spotlight on cards ---------- */
.rc4,.app,.prod,.lpc,.vs-card{position:relative;isolation:isolate}
.rc4::before,.app::before,.prod::before,.lpc::before,.vs-card::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;opacity:0;transition:opacity .3s;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(10,36,99,.07),transparent 70%)}
.rc4:hover::before,.app:hover::before,.prod:hover::before,.lpc:hover::before,.vs-card:hover::before{opacity:1}

/* ---------- directory cards: one message per role ---------- */
.rc4{width:300px;padding:20px 20px 16px;border-radius:22px;overflow:hidden}
.rc4::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;opacity:.9}
.tone-navy::after{background:var(--navy)}.tone-maroon::after{background:var(--maroon)}.tone-teal::after{background:var(--teal)}.tone-amber::after{background:var(--amber)}.tone-lilac::after{background:#7c6cf0}
.rc4 .top{gap:10px}
.rc4 .ri{width:38px;height:38px;border-radius:12px}
.rc4 .ri .i{width:19px;height:19px}
.rc4 .rname{font-size:.86rem;font-weight:600;color:var(--muted);line-height:1.3}
.rc4 .rline{margin-top:14px;font-size:1.18rem;font-weight:700;line-height:1.25;letter-spacing:-.02em;color:var(--ink);min-height:2.5em}
.rc4 ul{margin:14px 0 16px;gap:8px}
.rc4 li{font-size:.9rem;color:var(--ink-2)}
.rc4 .j{border-top:1px dashed var(--line);padding-top:14px}
.rc4 .ja{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:var(--t-navy);transition:background-color .25s,color .25s,transform .3s}
.rc4 .ja .i{width:15px;height:15px}
.rc4:hover .ja{background:var(--navy);color:#fff;transform:rotate(-45deg)}
.rc4:hover .j .i{transform:none}

/* ---------- numbered, colour-coded solution cards ---------- */
.stack{counter-reset:sol}
.scard{counter-increment:sol;overflow:hidden}
.scard::before{content:"0" counter(sol) " / 05";position:absolute;top:22px;right:26px;font-size:.8rem;font-weight:700;letter-spacing:.08em;color:var(--muted)}
.scard::after{content:"";position:absolute;left:0;top:0;bottom:0;width:5px}
.scard:nth-child(1)::after{background:var(--navy)}
.scard:nth-child(2)::after{background:var(--teal)}
.scard:nth-child(3)::after{background:var(--maroon)}
.scard:nth-child(4)::after{background:#7c6cf0}
.scard:nth-child(5)::after{background:var(--amber)}

/* ---------- before / after ---------- */
.versus{display:grid;grid-template-columns:1fr auto 1.15fr;gap:20px;align-items:center;margin-top:56px}
.vs-card{padding:clamp(22px,3vw,34px);border-radius:var(--r-lg)}
.vs-before{background:var(--soft);color:var(--muted)}
.vs-after{background:#fff;box-shadow:0 0 0 1px var(--line-2),var(--e3)}
.vs-after::after{content:"";position:absolute;inset:-1px;z-index:-2;border-radius:inherit;padding:1px;background:linear-gradient(135deg,var(--navy),var(--maroon),var(--teal),var(--amber));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.vs-tag{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:#fff;font-size:.85rem;font-weight:700;color:var(--ink-2);box-shadow:var(--e1)}
.vs-after .vs-tag{background:var(--t-navy);color:var(--navy);box-shadow:none}
.vs-card ul{display:grid;gap:14px;margin:22px 0 4px}
.vs-card li{display:flex;align-items:flex-start;gap:12px;font-size:1.02rem;line-height:1.45}
.vs-before li{text-decoration:line-through;text-decoration-color:rgba(95,99,104,.35)}
.vs-after li{color:var(--ink);font-weight:500}
.vx,.vk{width:24px;height:24px;flex:none;display:grid;place-items:center;border-radius:50%;margin-top:1px}
.vx{background:#eceef1;color:#80868b}
.vk{background:var(--t-teal);color:var(--teal)}
.vx .i,.vk .i{width:14px;height:14px;stroke-width:3}
.vs-after .btn{margin-top:24px}
.vs-mid span{width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:#fff;box-shadow:var(--e2);color:var(--navy)}
@media (max-width:900px){.versus{grid-template-columns:1fr}.vs-mid{justify-self:center;transform:rotate(90deg)}}

/* =====================================================================
   Hero background layer (v4 home only). Everything is very light so the
   page still reads as white. Motion is slow and stops under
   prefers-reduced-motion.
   ===================================================================== */
.hero{position:relative;isolation:isolate;overflow-x:clip}
.hero>.wrap,.hero>.collage{position:relative;z-index:1}
.hero-fx{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 72%,transparent 100%);mask-image:linear-gradient(180deg,#000 0%,#000 72%,transparent 100%)}

/* soft colour glows */
.fx-orb{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;will-change:transform}
.fx-o1{width:520px;height:520px;left:-140px;top:-120px;background:radial-gradient(circle,#dbe5ff 0%,rgba(219,229,255,0) 70%);animation:orb1 26s ease-in-out infinite alternate}
.fx-o2{width:460px;height:460px;right:-120px;top:40px;background:radial-gradient(circle,#d4f1ec 0%,rgba(212,241,236,0) 70%);animation:orb2 30s ease-in-out infinite alternate}
.fx-o3{width:420px;height:420px;left:38%;top:520px;background:radial-gradient(circle,#fdeccb 0%,rgba(253,236,203,0) 70%);opacity:.5;animation:orb3 34s ease-in-out infinite alternate}
@keyframes orb1{to{transform:translate(90px,60px) scale(1.08)}}
@keyframes orb2{to{transform:translate(-80px,90px) scale(1.12)}}
@keyframes orb3{to{transform:translate(-100px,-50px) scale(.94)}}

/* fine grid, fading out from the headline */
.fx-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(60,64,67,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(60,64,67,.07) 1px,transparent 1px);background-size:44px 44px;background-position:center top;-webkit-mask-image:radial-gradient(52% 42% at 50% 30%,#000 0%,rgba(0,0,0,.45) 45%,transparent 75%);mask-image:radial-gradient(52% 42% at 50% 30%,#000 0%,rgba(0,0,0,.45) 45%,transparent 75%)}

/* thin rings behind the headline */
.fx-rings{position:absolute;left:calc(50% - 600px);top:-230px;width:1200px;height:1200px;-webkit-mask-image:radial-gradient(closest-side,#000 55%,transparent);mask-image:radial-gradient(closest-side,#000 55%,transparent)}
.fx-rings circle{fill:none;stroke:rgba(60,64,67,.09);stroke-width:1}
.fx-rings .spin{stroke:rgba(10,36,99,.14);stroke-dasharray:2 14;stroke-linecap:round;transform-origin:600px 600px;animation:spin 120s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* flowing lines behind the photos */
.fx-flow{position:absolute;left:0;right:0;bottom:4%;width:100%;height:380px;opacity:.9}
.fx-flow path{fill:none;stroke-width:1.2;stroke-linecap:round;stroke-dasharray:1400;stroke-dashoffset:0;animation:flow 22s ease-in-out infinite alternate}
.fx-flow path:nth-child(1){stroke:rgba(10,36,99,.12)}
.fx-flow path:nth-child(2){stroke:rgba(15,157,138,.14);animation-duration:26s}
.fx-flow path:nth-child(3){stroke:rgba(139,0,0,.08);animation-duration:30s}
@keyframes flow{from{stroke-dasharray:900 500;stroke-dashoffset:0}to{stroke-dasharray:1400 0;stroke-dashoffset:-500}}

/* small medical plus marks that twinkle */
.fx-plus{position:absolute;width:14px;height:14px;opacity:.5;animation:twinkle 6s ease-in-out infinite}
.fx-plus::before,.fx-plus::after{content:"";position:absolute;left:50%;top:50%;border-radius:2px;background:currentColor;transform:translate(-50%,-50%)}
.fx-plus::before{width:100%;height:3px}
.fx-plus::after{width:3px;height:100%}
.p1{left:9%;top:14%;color:var(--navy)}
.p2{left:22%;top:44%;color:var(--teal);width:10px;height:10px;animation-delay:-1.5s}
.p3{right:12%;top:12%;color:var(--maroon);animation-delay:-3s}
.p4{right:24%;top:40%;color:var(--amber);width:10px;height:10px;animation-delay:-4.5s}
.p5{left:5%;top:58%;color:var(--amber);width:11px;height:11px;animation-delay:-2s}
.p6{right:6%;top:55%;color:var(--navy);width:11px;height:11px;animation-delay:-5s}
.p7{left:31%;top:6%;color:var(--maroon);width:9px;height:9px;animation-delay:-3.5s}
.p8{right:33%;top:7%;color:var(--teal);width:9px;height:9px;animation-delay:-.5s}
@keyframes twinkle{0%,100%{opacity:.15;transform:scale(.8) rotate(0)}50%{opacity:.55;transform:scale(1) rotate(45deg)}}

/* film grain */
.fx-noise{position:absolute;inset:0;opacity:.028;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:180px 180px}

/* glass behind the search so the pattern never hurts reading */
.hero .sbox{background:rgba(255,255,255,.92);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}

@media (max-width:760px){
  .fx-rings{width:760px;height:760px;top:-120px;left:calc(50% - 380px)}
  .fx-o1{width:320px;height:320px}.fx-o2{width:300px;height:300px}.fx-o3{display:none}
  .p2,.p4,.p7,.p8{display:none}
  .fx-flow{height:220px}
}
@media (prefers-reduced-motion:reduce){
  .fx-orb,.fx-rings .spin,.fx-flow path,.fx-plus{animation:none}
}

/* Hero background stays pure white (2026-09-29): no colour glows, no grain.
   Only the thin line graphics remain on top of white. */
.hero{background:#fff}
.fx-orb,.fx-noise{display:none}

/* Hero is PURE white (2026-09-29, requested twice): no background layer and
   no pastel shapes around the photos. Photos and their label chips stay. */
.hero{background:#fff}
.hero-fx,.collage .deco,.collage .dotgrid{display:none!important}

/* =====================================================================
   Hero: logo tile, join pill and floating app cards (2026-09-29).
   Background stays pure white. Cards only show on wide screens, where
   they sit in the empty side space and never cover the headline.
   ===================================================================== */
.hero{position:relative;overflow-x:clip}
.hero>.wrap{position:relative;z-index:2}

.logo-tile{width:72px;height:72px;margin:0 auto 20px;display:grid;place-items:center;border-radius:22px;background:#fff;box-shadow:0 0 0 1px var(--line-2),0 10px 24px -10px rgba(10,36,99,.35)}
.logo-tile img{width:50px;height:50px}

.join-pill{display:inline-flex;align-items:center;gap:10px;margin-bottom:26px;padding:5px 5px 5px 6px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px var(--line-2),0 2px 8px -2px rgba(60,64,67,.15);font-size:.92rem;font-weight:500;color:var(--ink-2);transition:box-shadow .2s}
.join-pill:hover{box-shadow:0 0 0 1px var(--line),0 6px 16px -6px rgba(60,64,67,.3)}
.jp-av{display:flex}
.jp-av img{width:28px;height:28px;border-radius:50%;object-fit:cover;border:2px solid #fff}
.jp-av img+img{margin-left:-9px}
.jp-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:var(--navy);color:#fff;font-weight:600;font-size:.86rem}
.jp-btn .i{width:15px;height:15px;transition:transform .2s}
.join-pill:hover .jp-btn .i{transform:translateX(3px)}
@media (max-width:520px){.jp-txt{display:none}}

/* floating cards */
.float-ui{position:absolute;inset:0;z-index:1;pointer-events:none;display:none}
@media (min-width:1180px){.float-ui{display:block}}
.fu{position:absolute;width:270px;padding:16px 18px;border-radius:20px;background:#fff;box-shadow:0 0 0 1px var(--line-2),0 18px 40px -18px rgba(10,36,99,.35);font-size:.84rem;color:var(--ink-2)}
.fu-l1{left:-34px;top:70px;rotate:-9deg}
.fu-l2{left:-10px;top:400px;rotate:7deg;width:250px}
.fu-r1{right:-30px;top:96px;rotate:8deg}
.fu-r2{right:-14px;top:420px;rotate:-6deg;width:250px}
@media (min-width:1500px){.fu-l1{left:2%}.fu-l2{left:3%}.fu-r1{right:2%}.fu-r2{right:3%}}

.fu-h{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
.fu-t{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:.95rem;color:var(--ink)}
.fu-t .i{width:18px;height:18px;color:var(--teal)}
.fu-h small{font-size:.74rem;color:var(--muted)}
.fu-kv{display:flex;justify-content:space-between;align-items:center;padding:7px 0;border-top:1px solid var(--line-2)}
.fu-kv span{color:var(--muted)}
.fu-kv b{display:inline-flex;align-items:center;gap:4px;font-weight:600;color:var(--ink)}
.fu-kv b.ok{color:var(--teal)}
.fu-kv b .i{width:14px;height:14px;stroke-width:3}
.fu-line{font-weight:600;color:var(--ink)}
.fu-bar{height:8px;margin-top:10px;border-radius:8px;background:var(--line-2);overflow:hidden}
.fu-bar i{display:block;height:100%;border-radius:8px;background:linear-gradient(90deg,var(--navy),var(--teal))}
.fu-foot{display:flex;justify-content:space-between;align-items:center;margin-top:12px}
.fu-av{display:inline-flex;align-items:center;gap:8px;color:var(--muted)}
.fu-av img{width:24px;height:24px;border-radius:50%;object-fit:cover}
.fu-foot b{font-size:.8rem;color:var(--muted)}
.fu-todo{display:grid;gap:9px}
.fu-todo li{display:flex;align-items:center;gap:10px}
.fu-todo li span{width:16px;height:16px;flex:none;border-radius:50%;border:2px solid #c6cbd3}
.fu-todo li.done{color:var(--muted);text-decoration:line-through;text-decoration-color:rgba(95,99,104,.5)}
.fu-todo li.done span{border:0;background:var(--teal);box-shadow:inset 0 0 0 4px #fff,0 0 0 2px var(--teal)}
.fu-big{font-size:1.2rem;font-weight:800;color:var(--ink);letter-spacing:-.02em}
.fu-chart{display:block;width:100%;height:70px;margin-top:2px}
.fu-days{display:flex;justify-content:space-between;margin-top:6px;font-size:.7rem;color:var(--faint)}

/* pin and paperclip */
.pin{position:absolute;left:50%;top:-24px;width:30px;height:40px;margin-left:-15px;filter:drop-shadow(0 4px 4px rgba(10,36,99,.25))}
.clip{position:absolute;right:28px;top:-26px;width:22px;height:50px}

/* the dotted underline plus marks etc. are gone; keep the collage clean */
.hero .collage{z-index:1}
/* 1180-1499px (most laptops): pull the cards in so their text stays readable */
@media (min-width:1180px) and (max-width:1499px){.fu-l1{left:-8px}.fu-l2{left:8px}.fu-r1{right:-4px}.fu-r2{right:10px}}
/* suggestions must sit above the chips and buttons below the search box */
.hero .search{z-index:40}
.suggest{max-height:min(420px,60vh);overflow-y:auto;overscroll-behavior:contain}

/* =====================================================================
   Platform tiles (ported from v2, restyled for v4's white Google look).
   All classes are b2-* so nothing collides with the rest of the page.
   ===================================================================== */
.grad-v4{background:linear-gradient(90deg,var(--navy) 0%,#3b5bd6 50%,var(--maroon) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.bento2{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-top:56px}
.b2{position:relative;display:flex;flex-direction:column;padding:26px;border-radius:24px;background:#fff;box-shadow:0 0 0 1px var(--line-2),0 1px 2px rgba(60,64,67,.06);overflow:hidden;transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s}
.b2:hover{transform:translateY(-4px);box-shadow:0 0 0 1px transparent,var(--e3)}
.b2-a,.b2-b{grid-column:span 3}.b2-c,.b2-d,.b2-e{grid-column:span 2}
.b2-ic{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;margin-bottom:18px;box-shadow:inset 0 0 0 1px rgba(60,64,67,.06)}
.b2-ic .i{width:21px;height:21px}
.b2 h3{font-size:1.25rem;letter-spacing:-.025em}
.b2>p{margin-top:6px;color:var(--muted);font-size:.95rem}
.b2-ui{margin-top:auto;padding-top:24px}
.b2 .i{flex:none}

.b2-verify{display:flex;align-items:center;gap:12px;padding:14px;border-radius:16px;background:var(--soft)}
.b2-verify img{width:46px;height:46px;border-radius:50%;object-fit:cover}
.b2-verify b{display:flex;align-items:center;gap:5px;font-size:.92rem}
.b2-verify b .i{width:15px;height:15px;color:#1a73e8}
.b2-verify small{display:block;font-size:.8rem;color:var(--muted)}
.b2-steps{margin-left:auto;display:grid;gap:5px}
.b2-steps span{display:flex;align-items:center;gap:6px;font-size:.74rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--teal)}
.b2-steps .i{width:13px;height:13px;stroke-width:3}

.b2-jobs{display:grid;gap:8px}
.b2-jobs div{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:var(--soft);font-size:.88rem}
.b2-jobs .i{width:17px;height:17px;color:var(--navy)}
.b2-jobs b{font-weight:600}
.b2-jobs em{font-style:normal;color:var(--muted)}
.b2-jobs em::before{content:"· "}
.b2-jobs small{margin-left:auto;padding:3px 10px;border-radius:999px;font-size:.72rem;font-weight:700}
.st-a{background:var(--t-teal);color:#0b6b5e}.st-r{background:var(--t-amber);color:#8a6400}.st-s{background:var(--t-navy);color:var(--navy)}

.b2-learn{display:flex;align-items:center;gap:18px}
.b2-ring{--p:64;width:76px;height:76px;flex:none;display:grid;place-items:center;border-radius:50%;background:conic-gradient(var(--navy) calc(var(--p)*1%),var(--line-2) 0)}
.b2-ring::before{content:"";grid-area:1/1;width:58px;height:58px;border-radius:50%;background:#fff}
.b2-ring span{grid-area:1/1;position:relative;font-weight:700;font-size:.85rem}
.b2-learn ul{flex:1;display:grid;gap:7px}
.b2-learn li{display:flex;justify-content:space-between;font-size:.86rem;color:var(--muted)}
.b2-learn li b{color:var(--ink);font-weight:600}

.b2-chat{display:grid;gap:10px}
.b2-msg{display:flex;align-items:flex-end;gap:8px}
.b2-msg img{width:28px;height:28px;border-radius:50%;object-fit:cover}
.b2-msg p{padding:9px 13px;border-radius:14px 14px 14px 4px;background:var(--soft);font-size:.85rem}
.b2-msg.me{flex-direction:row-reverse}
.b2-msg.me p{border-radius:14px 14px 4px 14px;background:var(--navy);color:#fff}

.b2-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center;font-size:.76rem;color:var(--faint)}
.b2-cal span{padding:7px 0;border-radius:8px}
.b2-cal .hd{color:var(--muted);font-weight:600}
.b2-cal .ev{background:var(--t-navy);color:var(--navy);font-weight:700}
.b2-cal .ev.r{background:var(--t-maroon);color:var(--maroon)}
.b2-cal .ev.g{background:var(--t-teal);color:#0b6b5e}

@media (max-width:980px){.bento2{grid-template-columns:1fr 1fr}.b2-a,.b2-b{grid-column:1/-1}.b2-c,.b2-d{grid-column:span 1}.b2-e{grid-column:1/-1}}
@media (max-width:620px){.bento2{grid-template-columns:1fr}.b2-c,.b2-d,.b2-e{grid-column:auto}}

/* =====================================================================
   Grouped directory (replaces the three moving lanes, 2026-09-29):
   3 group cards on the left, an app-style role list on the right.
   ===================================================================== */
.dirx{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(20px,3vw,36px);align-items:stretch;margin-top:56px}
.gx-list{display:grid;gap:14px;align-content:start}
.gx{border-radius:24px;background:var(--soft);transition:background-color .35s,box-shadow .35s}
.gx-btn{display:flex;align-items:center;gap:16px;width:100%;padding:22px 24px;border:0;background:transparent;text-align:left;cursor:pointer;font:inherit;color:inherit;border-radius:24px}
.gx-ic{width:48px;height:48px;flex:none;display:grid;place-items:center;border-radius:14px;background:var(--t-navy);color:var(--navy);transition:background-color .35s,color .35s}
.gx-ic .i{width:23px;height:23px}
.gx-title{font-size:1.35rem;font-weight:600;letter-spacing:-.02em;color:var(--ink)}
.gx-count{margin-left:auto;padding:4px 10px;border-radius:999px;background:#fff;color:var(--muted);font-size:.8rem;font-weight:600;white-space:nowrap}
.gx:not(.is-on):hover{background:#eef1f5}
.gx-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s cubic-bezier(.2,.7,.2,1)}
.gx-body>*{overflow:hidden}
.gx-body p{padding:0 24px;color:rgba(255,255,255,.85);font-size:1.06rem;line-height:1.6}
.gx-link{display:inline-flex;align-items:center;gap:8px;margin:14px 24px 24px;color:#fff;font-weight:600}
.gx-link .i{width:18px;height:18px;transition:transform .25s}
.gx-link:hover .i{transform:translate(2px,-2px)}
.gx.is-on{background:var(--navy);box-shadow:0 24px 48px -24px rgba(10,36,99,.6)}
.gx.is-on .gx-body{grid-template-rows:1fr}
.gx.is-on .gx-title{color:#fff;font-size:1.6rem}
.gx.is-on .gx-ic{background:rgba(255,255,255,.14);color:#fff}
.gx.is-on .gx-count{background:rgba(255,255,255,.14);color:#fff}
.gx.is-on .gx-btn{padding-top:26px;cursor:default}

/* right: tinted stage with an app window */
.gx-stage{position:relative;padding:clamp(18px,3vw,34px) 0 clamp(18px,3vw,34px) clamp(18px,3vw,34px);border-radius:28px;background:linear-gradient(160deg,#d9e3ff 0%,#eef2ff 100%);overflow:hidden}
.gx-window{height:100%;display:flex;flex-direction:column;border-radius:20px 0 0 20px;background:#fff;box-shadow:0 20px 50px -24px rgba(10,36,99,.45)}
.gx-bar{display:flex;align-items:center;gap:8px;padding:14px 16px;border-bottom:1px solid var(--line-2)}
.gx-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:10px;background:#fff;box-shadow:0 0 0 1px var(--line);font-size:.84rem;font-weight:600;color:var(--ink-2);white-space:nowrap}
.gx-chip.ghost{color:var(--muted);font-weight:500}
.gx-chip .i{width:15px;height:15px}
.gx-cta{margin-left:auto;margin-right:clamp(0px,1vw,8px);display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:10px;background:var(--navy);color:#fff;font-size:.86rem;font-weight:600;white-space:nowrap}
.gx-cta .i{width:15px;height:15px}
.gx-cta:hover{background:var(--navy-2)}
.gx-rows{flex:1;min-height:0;max-height:430px;overflow-y:auto;overscroll-behavior:contain;padding:6px 0;scrollbar-width:thin;scrollbar-color:#c6cbd3 transparent}
.gx-row{display:flex;align-items:center;gap:12px;padding:11px 16px;border-bottom:1px solid var(--line-2);transition:background-color .2s}
.gx-row:last-child{border-bottom:0}
.gx-row:hover{background:#f6f8fe}
.gx-dot{width:8px;height:8px;flex:none;border-radius:2px;filter:saturate(3) brightness(.8)}
.gx-ri{width:36px;height:36px;flex:none;display:grid;place-items:center;border-radius:11px}
.gx-ri .i{width:18px;height:18px}
.gx-name{min-width:0}
.gx-name b{display:block;font-weight:600;font-size:.95rem}
.gx-name small{display:block;color:var(--muted);font-size:.84rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gx-join{margin-left:auto;display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:var(--t-navy);color:var(--navy);font-size:.8rem;font-weight:600;white-space:nowrap;opacity:.85;transition:background-color .2s,color .2s,opacity .2s}
.gx-join .i{width:14px;height:14px}
.gx-row:hover .gx-join{background:var(--navy);color:#fff;opacity:1}
.gx-hint{position:absolute;left:clamp(8px,2vw,20px);top:46%;display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:10px;background:var(--navy);color:#fff;font-size:.8rem;font-weight:600;box-shadow:0 10px 24px -10px rgba(10,36,99,.7);pointer-events:none}
.gx-hint .i{width:15px;height:15px}
.gx-window.swap .gx-rows{animation:gxIn .45s cubic-bezier(.2,.7,.2,1)}
@keyframes gxIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

@media (max-width:960px){
  .dirx{grid-template-columns:1fr}
  .gx-stage{padding:14px 0 14px 14px}
  .gx-hint{display:none}
}
@media (max-width:560px){
  .gx-chip.ghost{display:none}
  .gx-join{padding:6px 8px;font-size:0;gap:0}
  .gx-join .i{width:16px;height:16px}
  .gx-title{font-size:1.15rem}.gx.is-on .gx-title{font-size:1.3rem}
}
@media (prefers-reduced-motion:reduce){.gx-body{transition:none}.gx-window.swap .gx-rows{animation:none}}
/* grid columns must be allowed to shrink below their content (long taglines) */
.dirx{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)}
.gx-stage,.gx-window,.gx-rows{min-width:0}
.gx-name{flex:1;min-width:0}
@media (max-width:960px){.dirx{grid-template-columns:minmax(0,1fr)}}
/* hint sits in the tinted strip under the window, never over a row */
.gx-hint{top:auto;bottom:clamp(4px,.6vw,8px);left:clamp(18px,3vw,34px)}

/* =====================================================================
   Platform cards v2 (2026-09-29): soft colour blocks with a cut-out
   corner. The notch is page-white pieces laid over the card edge, so it
   relies on the section background being white (it is). No borders and
   no box-shadow: a shadow would draw around the full rectangle and give
   the trick away.
   ===================================================================== */
.bento3{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-top:56px;--nw:78px;--cr:22px}
.b3{position:relative;display:flex;flex-direction:column;min-height:300px;padding:30px;border-radius:30px;overflow:hidden;transition:transform .35s cubic-bezier(.2,.7,.2,1),filter .35s}
.b3:hover{transform:translateY(-4px);filter:saturate(1.08) brightness(.99)}
.b3-verify{grid-column:span 3;min-height:470px;background:#e2e8f3}
.b3-jobs{grid-column:span 3;min-height:470px;background:#cfdcff}
.b3-learn{grid-column:span 2;background:#dff1ec}
.b3-chat{grid-column:span 2;background:#ebe6fb}
.b3-events{grid-column:span 2;background:#fde9dc}

.b3-text{position:relative;z-index:2;max-width:420px;padding-right:calc(var(--nw) - 10px)}
.b3 h3{font-size:clamp(1.45rem,2.2vw,1.9rem);font-weight:600;letter-spacing:-.03em;line-height:1.12;color:var(--ink)}
.b3 p{margin-top:12px;color:#454b57;font-size:1rem;line-height:1.6}
.b3-text-bottom{margin-top:auto;padding-right:calc(var(--nw) + 10px)}

/* ---- the cut-out corner ---- */
.nt{position:absolute;z-index:3;width:var(--nw);height:var(--nw);background:#fff}
.nt::before,.nt::after{content:"";position:absolute;width:var(--cr);height:var(--cr)}
.nt-tr{top:0;right:0;border-bottom-left-radius:26px}
.nt-tr::before{top:0;right:100%;background:radial-gradient(circle at 0 100%,transparent calc(var(--cr) - .5px),#fff var(--cr))}
.nt-tr::after{top:100%;right:0;background:radial-gradient(circle at 0 100%,transparent calc(var(--cr) - .5px),#fff var(--cr))}
.nt-br{bottom:0;right:0;border-top-left-radius:26px}
.nt-br::before{bottom:0;right:100%;background:radial-gradient(circle at 0 0,transparent calc(var(--cr) - .5px),#fff var(--cr))}
.nt-br::after{bottom:100%;right:0;background:radial-gradient(circle at 0 0,transparent calc(var(--cr) - .5px),#fff var(--cr))}
.nt-tile{position:absolute;width:calc(var(--nw) - 14px);height:calc(var(--nw) - 14px);display:grid;place-items:center;border-radius:20px;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.nt-tr .nt-tile{top:0;right:0}
.nt-br .nt-tile{bottom:0;right:0}
.nt-tile .i{width:26px;height:26px}
.b3:hover .nt-tile{transform:rotate(-8deg) scale(1.05)}

/* ---- verified: faces on rings ---- */
.orbit3{position:absolute;left:50%;bottom:-38%;width:120%;aspect-ratio:1;transform:translateX(-50%);pointer-events:none}
.o3{position:absolute;border-radius:50%;inset:0}
.o3a{background:rgba(255,255,255,.35);border:1px dashed rgba(10,36,99,.18)}
.o3b{inset:17%;background:rgba(255,255,255,.45);border:1px dashed rgba(10,36,99,.18)}
.o3c{inset:33%;background:rgba(207,220,255,.7)}
.orb-av{position:absolute;width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;object-fit:cover;border:3px solid #fff;box-shadow:0 8px 18px -8px rgba(10,36,99,.45)}
.orb-av.sm{width:42px;height:42px;margin:-21px 0 0 -21px}
.orb-core{position:absolute;left:50%;top:38%;width:70px;height:70px;margin:-35px 0 0 -35px;display:grid;place-items:center;border-radius:22px;background:#fff;color:var(--teal);box-shadow:0 14px 30px -14px rgba(10,36,99,.5)}
.orb-core .i{width:34px;height:34px}
.orb-chip{position:absolute;left:50%;top:50%;transform:translateX(-50%);display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;background:#fff;font-size:.84rem;font-weight:600;color:#0b6b5e;white-space:nowrap;box-shadow:0 10px 22px -12px rgba(10,36,99,.5)}
.orb-chip .i{width:15px;height:15px;stroke-width:3}

/* ---- jobs: hub and spokes ---- */
.hub{position:relative;width:calc(100% + 30px);margin:0 -30px 18px 0;aspect-ratio:2/1}
.hub-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hub-lines path{fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;vector-effect:non-scaling-stroke}
.hub-lines circle{fill:#fff}
.hub-core{position:absolute;left:27.5%;top:50%;width:92px;height:92px;margin:-46px 0 0 -46px;display:grid;place-items:center;border-radius:24px;background:#fff;box-shadow:0 18px 36px -18px rgba(10,36,99,.55)}
.hub-core img{width:60px;height:60px}
.hub-node{position:absolute;width:50px;height:50px;margin:-25px 0 0 -25px;display:grid;place-items:center;border-radius:14px;background:#fff;color:var(--navy);box-shadow:0 10px 22px -12px rgba(10,36,99,.5)}
.hub-node .i{width:23px;height:23px}

/* ---- small cards: white inner panel ---- */
.b3-panel{margin-top:auto;padding:16px;border-radius:20px;background:rgba(255,255,255,.85)}
.b3-panel.b2-learn{display:flex}
.b3 .b2-msg p{background:#f1f3f7}
.b3 .b2-msg.me p{background:var(--navy)}
.b3-learn .b2-ring{background:conic-gradient(#0f9d8a calc(var(--p)*1%),#e3ece9 0)}

@media (max-width:980px){
  .bento3{grid-template-columns:1fr 1fr}
  .b3-verify,.b3-jobs{grid-column:1/-1;min-height:420px}
  .b3-learn,.b3-chat{grid-column:span 1}
  .b3-events{grid-column:1/-1}
}
@media (max-width:620px){
  .bento3{grid-template-columns:1fr;--nw:66px;--cr:18px}
  .b3-learn,.b3-chat,.b3-events{grid-column:auto}
  .b3{padding:24px}
  .orb-av.sm{display:none}
}
@media (prefers-reduced-motion:reduce){.b3,.nt-tile{transition:none}}
.o3a{background:rgba(255,255,255,.18)}

/* =====================================================================
   Cut-out card style, PAGE-WIDE (2026-09-29).
   .cc = soft colour block, no border, no shadow, with a notch (.nt) from
   the platform-cards block above. Tones below. The notch is white, so it
   only works on white sections (every v4 section is white).
   ===================================================================== */
.cc{position:relative;overflow:hidden;border:0!important;box-shadow:none!important;border-radius:28px;--nw:64px;--cr:18px}
.cc::before{border-radius:inherit}
.cc-navy{background:#e4ebfb}
.cc-teal{background:#dff1ec}
.cc-maroon{background:#fbe7e7}
.cc-amber{background:#fcefd6}
.cc-lilac{background:#ebe6fb}
.cc-grey{background:#eef0f3}
.bg-white{background:#fff}.bg-grey{background:#e3e6ea;color:#5f6368}
.cc .nt-tile{border-radius:16px}
.cc .nt-tile .i{width:22px;height:22px}
.cc .nt-tile img{width:34px;height:34px}
.cc .nt-tile.bg-white{box-shadow:0 6px 16px -10px rgba(10,36,99,.5)}
.cc:hover .nt-tile{transform:rotate(-8deg) scale(1.05)}

/* platform tools */
.app.cc{min-height:112px;padding:20px 20px 18px;border-radius:24px;transform:none}
.app.cc:hover{transform:translateY(-3px)}
.app.cc>div:last-child{padding-right:calc(var(--nw) - 14px)}
.app.cc b{font-size:1.05rem}
.app.cc small{color:#4a505c}

/* before / after */
.vs-card.cc{--nw:70px;--cr:20px;padding:34px 34px 32px}
.vs-card.cc .vs-tag{margin-right:calc(var(--nw) - 10px)}
.vs-after.cc::after{display:none}
.vs-after.cc .vs-tag{background:#fff;color:var(--navy)}
.vs-before.cc li{color:#5f6368}

/* solution stack */
.scard.cc{--nw:80px;--cr:22px;border-radius:34px}
.scard.cc::before,.scard.cc::after{display:none}
.scard.cc .who{background:#fff}
.scard.cc .smedia{border-radius:24px}
.scard.cc>div:first-of-type{padding-right:10px}

/* marketplace */
.prod.cc{--nw:58px;--cr:16px;border-radius:26px}
.prod.cc .art{height:150px;background:transparent!important}
.prod.cc .art .blob{background:#fff;opacity:.6}
.prod.cc .bd{padding:4px 22px 24px}

/* partner card */
.pcard.cc{--nw:84px;--cr:24px;border-radius:36px;background:#e4ebfb!important}
.pcard.cc .plist li{box-shadow:none}
.pcard.cc .pmedia .code{box-shadow:0 14px 30px -16px rgba(10,36,99,.45)}

/* latest partners */
.lpc.cc{--nw:56px;--cr:16px;padding:22px 22px 22px;border-radius:24px}
.lpc.cc>div{padding-right:calc(var(--nw) - 18px)}
.lpc.cc .mono{background:#fff!important}

/* trust row */
.tr.cc{--nw:58px;--cr:16px;padding:24px;border-radius:24px}
.tr.cc>div{padding-right:calc(var(--nw) - 14px)}
/* older ".tr span{display:block}" hit the notch tile; restore it */
.tr.cc .nt-tile{display:grid;margin:0}
.tr.cc .nt{margin:0}
.tr.cc.cc-teal .nt-tile{color:var(--teal)}.tr.cc.cc-navy .nt-tile{color:var(--navy)}.tr.cc.cc-maroon .nt-tile{color:var(--maroon)}
.lpc.cc .nt-tile,.pcard.cc .nt-tile,.prod.cc .nt-tile{color:var(--navy)}

/* Lighter card tints (2026-09-29): same hues, ~40% closer to white */
.cc-navy{background:#eef2fd}
.cc-teal{background:#ecf7f3}
.cc-maroon{background:#fdf1f1}
.cc-amber{background:#fdf6e8}
.cc-lilac{background:#f3f0fd}
.cc-grey{background:#f4f5f7}
.pcard.cc{background:#eef2fd!important}
.b3-verify{background:#edf1f8}
.b3-jobs{background:#e0e9ff}
.b3-learn{background:#ecf7f3}
.b3-chat{background:#f3f0fd}
.b3-events{background:#fef3ec}
.o3c{background:rgba(214,226,255,.6)}

/* sky tone, used by the healthcare professionals solution card */
.cc-sky{background:#eef6fd}
.bg-sky{background:#dcedfb}.fg-sky{color:#1a6aa3}
/* six stacked cards now: the 6th needs its own sticky offset */
.scard:nth-child(6){top:176px}

/* =====================================================================
   Menu with dropdowns (Individuals / Institutions), drawer groups and
   breadcrumbs - shared by the home page and every inner page.
   ===================================================================== */
.nav{align-items:center}
.nav>a,.dd-top{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;color:var(--ink-2);font-size:.95rem;font-weight:500;transition:background-color .2s,color .2s}
.nav>a:hover,.dd:hover .dd-top,.dd:focus-within .dd-top{background:#f1f3f4}
.nav>a[aria-current="page"],.dd.is-cur .dd-top{background:var(--t-navy);color:var(--navy)}
.caret{width:7px;height:7px;margin-top:-3px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);opacity:.6;transition:transform .2s}
.dd{position:relative}
.dd:hover .caret,.dd:focus-within .caret{transform:rotate(225deg);margin-top:3px}
.dd-menu{position:absolute;left:-8px;top:calc(100% + 8px);z-index:70;width:320px;padding:8px;border-radius:20px;background:#fff;box-shadow:0 0 0 1px var(--line-2),0 24px 48px -20px rgba(10,36,99,.35);opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .18s,transform .18s,visibility .18s}
.dd::after{content:"";position:absolute;left:0;right:0;top:100%;height:12px}
.dd:hover .dd-menu,.dd:focus-within .dd-menu{opacity:1;visibility:visible;transform:none}
.dd-menu a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;color:var(--ink)}
.dd-menu a:hover,.dd-menu a[aria-current="page"]{background:#f4f6fb}
.dd-menu b{display:block;font-weight:600;font-size:.95rem}
.dd-menu small{display:block;color:var(--muted);font-size:.82rem}
.dd-ic{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:12px}
.dd-ic .i{width:19px;height:19px}
.dd-menu .dd-hub{justify-content:space-between;margin-bottom:4px;padding:10px 12px;font-size:.84rem;font-weight:600;color:var(--navy);background:#f6f8fe}
.dd-menu .dd-hub .i{width:16px;height:16px}
.dr-h{margin:14px 0 2px;padding:0 10px;font-size:.76rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.dr-h a{padding:0!important;color:var(--muted)!important;background:none!important}
.bg-sky{background:#dcedfb}.fg-sky{color:#1a6aa3}

/* breadcrumbs */
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding-top:22px;font-size:.88rem;color:var(--muted)}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.crumbs .sep{width:6px;height:6px;border-right:1.5px solid #9aa0a6;border-top:1.5px solid #9aa0a6;transform:rotate(45deg);margin:0 4px}
.crumbs [aria-current]{color:var(--ink);font-weight:600}

/* =====================================================================
   Graphical mega menu (Individuals / Institutions). Picture cards in the
   page's cut-out card style + a side card. Opens on hover and on keyboard
   focus (focus-within), so it works without JavaScript.
   ===================================================================== */
.hdr-in{position:relative}
.dd.mega{position:static}
.mg-panel{position:absolute;left:50%;top:calc(100% + 6px);z-index:70;display:grid;grid-template-columns:1fr 250px;gap:14px;width:min(1040px,calc(100vw - 32px));padding:14px;border-radius:28px;background:#fff;box-shadow:0 0 0 1px var(--line-2),0 30px 60px -28px rgba(10,36,99,.4);opacity:0;visibility:hidden;transform:translate(-50%,-8px);transition:opacity .2s,transform .2s,visibility .2s}
.dd.mega::after{content:"";position:absolute;left:0;right:0;top:100%;height:14px}
.dd.mega:hover .mg-panel,.dd.mega:focus-within .mg-panel{opacity:1;visibility:visible;transform:translate(-50%,0)}
.mg-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mg-card{position:relative;display:flex;flex-direction:column;padding:10px 10px 16px;border-radius:22px;color:var(--ink);transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.mg-card:hover{transform:translateY(-3px)}
.mg-card.cc-teal{background:#ecf7f3}.mg-card.cc-navy{background:#eef2fd}.mg-card.cc-sky{background:#eef6fd}
.mg-card.cc-lilac{background:#f3f0fd}.mg-card.cc-maroon{background:#fdf1f1}
.mg-pic{display:block;height:128px;border-radius:16px;overflow:hidden}
.mg-pic img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.mg-card:hover .mg-pic img{transform:scale(1.05)}
.mg-ic{position:absolute;left:20px;top:108px;width:40px;height:40px;display:grid;place-items:center;border-radius:12px;box-shadow:0 0 0 4px #fff}
.mg-ic .i{width:19px;height:19px}
.mg-card b{margin:26px 6px 0;font-size:1.02rem;font-weight:600}
.mg-card small{margin:2px 6px 0;color:var(--muted);font-size:.85rem;line-height:1.4}
.mg-go{position:absolute;right:16px;bottom:16px;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:#fff;color:var(--navy);transition:transform .25s}
.mg-go .i{width:14px;height:14px}
.mg-card:hover .mg-go{transform:translateX(3px)}
.mg-card[aria-current="page"]{box-shadow:inset 0 0 0 2px var(--navy)}
.mg-side{position:relative;overflow:hidden;display:flex;flex-direction:column;padding:22px 20px 18px;border-radius:22px;background:#eef2fd;--nw:60px;--cr:16px}
.mg-side .nt-tile{border-radius:16px;box-shadow:0 6px 16px -10px rgba(10,36,99,.5)}
.mg-side .nt-tile .i{width:22px;height:22px}
.mg-side b{margin-top:4px;padding-right:44px;font-size:1.2rem;font-weight:700;letter-spacing:-.02em;line-height:1.2}
.mg-side p{margin-top:8px;color:var(--muted);font-size:.9rem;line-height:1.5}
.mg-side .btn{margin-top:auto;min-height:42px;font-size:.9rem}
.mg-all{display:inline-flex;align-items:center;justify-content:center;gap:6px;margin-top:10px;color:var(--navy);font-size:.86rem;font-weight:600}
.mg-all .i{width:15px;height:15px}
@media (max-width:1180px){.mg-panel{grid-template-columns:1fr}.mg-side{flex-direction:row;flex-wrap:wrap;align-items:center;gap:6px 14px}.mg-side p{margin:0;flex:1}.mg-side .btn{margin:0}}
@media (max-width:1000px){.mg-panel{display:none}}
/* the header nav link style (pill, grey hover) must not reach inside the mega panel */
.nav .mg-panel a{border-radius:22px;padding:0;font-weight:inherit;font-size:inherit}
.nav .mg-panel a:hover{background:none}
.nav .mg-card{padding:10px 10px 16px;color:var(--ink)}
.nav .mg-card.cc-teal,.nav .mg-card.cc-teal:hover{background:#ecf7f3}.nav .mg-card.cc-navy,.nav .mg-card.cc-navy:hover{background:#eef2fd}.nav .mg-card.cc-sky,.nav .mg-card.cc-sky:hover{background:#eef6fd}
.nav .mg-card.cc-lilac,.nav .mg-card.cc-lilac:hover{background:#f3f0fd}.nav .mg-card.cc-maroon,.nav .mg-card.cc-maroon:hover{background:#fdf1f1}
.nav .mg-side .btn{padding:0 20px;border-radius:999px;justify-content:center}
.nav .mg-side .btn-fill,.nav .mg-side .btn-fill:hover{background:var(--navy);color:#fff}
.nav .mg-all{padding:6px 0;border-radius:8px;color:var(--navy)}
.nav .mg-panel a.mg-card{padding:10px 10px 18px}
.nav .mg-panel a.mg-all{padding:6px 0}

/* .cc sets position:relative, which cancelled the sticky stack and turned the
   per-card "top" offsets into downward shifts (last card overlapped the next
   section). Solution cards must stay sticky; phones keep them static. */
.scard.cc{position:sticky}
@media (max-width:900px){.scard.cc{position:relative;top:auto!important}}

/* =====================================================================
   Staircase steps (2026-09-29). Each step is a colour block with a raised
   "shelf" on its top-right that carries the step number; the steps drop
   lower one after another. The concave joint under the shelf is drawn with
   a radial gradient in the card's own colour (--c), so it works on white.
   ===================================================================== */
.stairs{--n:3;--shelf:52px;--shelf-h:118px;--cr:22px;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:0;margin-top:56px;padding-bottom:calc((var(--n) - 1) * 56px)}
.stp{position:relative;display:flex;flex-direction:column;min-height:340px;margin-right:var(--shelf);padding:28px 30px 32px;border-radius:26px 0 26px 26px;background:var(--c)}
.stp:nth-child(2){margin-top:56px}
.stp:nth-child(3){margin-top:112px}
.stp:nth-child(4){margin-top:168px}
.stp:last-child{margin-right:0;border-radius:26px}
/* the shelf */
.stp::before{content:"";position:absolute;left:100%;top:0;width:var(--shelf);height:var(--shelf-h);background:var(--c);border-radius:0 26px 26px 0}
/* concave joint below the shelf */
.stp::after{content:"";position:absolute;left:100%;top:var(--shelf-h);width:var(--cr);height:var(--cr);background:radial-gradient(circle at 100% 100%,transparent calc(var(--cr) - .5px),var(--c) var(--cr))}
.stp:last-child::before,.stp:last-child::after{display:none}
.stp-n{position:absolute;z-index:2;right:calc(var(--shelf) * -1 + 10px);top:22px;width:62px;height:62px;display:grid;place-items:center;border-radius:50%;background:#fdf6c9;color:var(--ink);font-size:1.35rem;font-weight:600;letter-spacing:-.02em;box-shadow:0 6px 16px -10px rgba(10,36,99,.35)}
.stp:last-child .stp-n{right:22px}
.stp-ic{width:48px;height:48px;display:grid;place-items:center;border-radius:15px;background:#fff;color:var(--navy);box-shadow:0 6px 16px -12px rgba(10,36,99,.4)}
.stp-ic .i{width:23px;height:23px}
.stp h3{margin-top:auto;padding-top:64px;font-size:clamp(1.4rem,2.1vw,1.8rem);font-weight:500;letter-spacing:-.03em;line-height:1.18;color:var(--ink)}
.stp p{margin-top:10px;color:#4a505c;font-size:.98rem;line-height:1.55}
/* progressively deeper tints, grey to blue (as in the reference) */
.stp:nth-child(1){--c:#e9edf1}
.stp:nth-child(2){--c:#e0e8f3}
.stp:nth-child(3){--c:#d6e5fb}
.stp:nth-child(4){--c:#cbdffc}
.stairs.n4{--n:4;--shelf:40px}
.stairs.n4 .stp{padding:24px 22px 26px;min-height:320px}
.stairs.n4 .stp-n{width:54px;height:54px;font-size:1.15rem;right:calc(var(--shelf) * -1 + 6px)}
.stairs.n4 .stp:last-child .stp-n{right:18px}
.stairs.n4 h3{font-size:clamp(1.25rem,1.7vw,1.5rem)}
@media (max-width:900px){
  .stairs,.stairs.n4{grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding-bottom:56px;row-gap:22px}
  .stp:nth-child(n){margin-top:0}
  .stp:nth-child(even){margin-top:56px}
  .stp:nth-child(2n){margin-right:0;border-radius:26px}
  .stp:nth-child(2n)::before,.stp:nth-child(2n)::after{display:none}
  .stp:nth-child(2n) .stp-n{right:22px}
}
@media (max-width:560px){
  .stairs,.stairs.n4{grid-template-columns:minmax(0,1fr);padding-bottom:0}
  .stp:nth-child(n){margin:0;border-radius:26px;min-height:0}
  .stp::before,.stp::after{display:none}
  .stp .stp-n,.stairs.n4 .stp .stp-n{right:20px}
  .stp h3{padding-top:36px}
}
/* each step drops as a whole (tops AND bottoms staggered) */
.stairs,.stairs.n4{align-items:start;padding-bottom:0}

/* Steps v2: huge gaps + faint line-drawn buildings behind (as in the reference) */
.stairs{position:relative;isolation:isolate;column-gap:clamp(28px,4vw,64px);margin-top:72px;padding:24px 0 40px}
.stairs::before{content:"";position:absolute;z-index:-1;left:-4%;right:-4%;top:-40px;bottom:-60px;background:url(/assets/img/stairs-bg.svg) center bottom/100% auto no-repeat;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 18%,#000 82%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 18%,#000 82%,transparent 100%)}
.stairs.n4{column-gap:clamp(22px,3vw,44px)}
.stp:nth-child(2){margin-top:80px}.stp:nth-child(3){margin-top:160px}.stp:nth-child(4){margin-top:240px}
.stp{box-shadow:none}
@media (max-width:900px){.stp:nth-child(n){margin-top:0}.stp:nth-child(even){margin-top:64px}}
@media (max-width:560px){.stp:nth-child(n){margin-top:0}.stairs{row-gap:18px}.stairs::before{display:none}}

/* =====================================================================
   Footer v2 (2026-09-29): sign-up band, "Ask your AI", newsletter (coming
   soon), link columns and a large outlined wordmark. White background.
   ===================================================================== */
.ftr.ftr-x{margin-top:clamp(40px,6vw,80px);padding-top:0;background:#fff;border-top:0}
.fx-cta{position:relative;display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(32px,5vw,64px);border-radius:36px;background:#eef2fd;--nw:82px;--cr:24px}
.fx-cta .nt-tile{border-radius:20px;box-shadow:0 8px 18px -12px rgba(10,36,99,.5)}
.fx-cta .nt-tile .i{width:26px;height:26px}
.fx-cta h2{margin-top:16px;font-size:clamp(2.2rem,4.6vw,3.8rem);letter-spacing:-.045em;line-height:1.02;max-width:14ch}
.fx-cta p{margin-top:14px;color:#4a505c;font-size:1.12rem}
.fx-cta .btns{margin-top:28px}
.fx-cta-list{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.fx-cta-list li{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:20px;background:#fff;box-shadow:0 10px 24px -18px rgba(10,36,99,.5)}
.fx-cta-list .i{width:22px;height:22px;flex:none;color:var(--navy)}
.fx-cta-list b{display:block;font-weight:600}
.fx-cta-list small{display:block;color:var(--muted);font-size:.86rem}

.fx-row{display:grid;grid-template-columns:1.35fr .65fr;gap:16px;margin-top:16px}
.fx-ask,.fx-news{position:relative;padding:clamp(24px,3vw,36px);border-radius:32px}
.fx-ask{background:#f4f6fb}
.fx-news{background:#fdf6e8;display:flex;flex-direction:column}
.fx-kicker{display:inline-flex;align-items:center;gap:8px;font-size:.88rem;font-weight:700;letter-spacing:.02em;color:var(--navy)}
.fx-kicker .i{width:17px;height:17px;color:var(--maroon)}
.fx-ask h3,.fx-news h3{margin-top:12px;font-size:clamp(1.35rem,2.2vw,1.75rem);letter-spacing:-.03em;line-height:1.2}
.fx-ask textarea{display:block;width:100%;margin-top:18px;padding:14px 16px;border:1.5px solid #d6dae0;border-radius:18px;background:#fff;font:500 1rem/1.5 var(--font);color:var(--ink);resize:none;transition:border-color .2s,box-shadow .2s}
.fx-ask textarea:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 4px rgba(10,36,99,.1)}
.ask-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.ask-chip{padding:7px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;font:500 .84rem var(--font);color:var(--ink-2);cursor:pointer;transition:border-color .2s,background-color .2s}
.ask-chip:hover{border-color:var(--navy);background:#f6f8fe}
.ai-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:18px}
.ai-btn{display:flex;align-items:center;gap:9px;padding:11px 12px;border-radius:14px;background:#fff;box-shadow:0 0 0 1px var(--line-2);font-weight:600;font-size:.9rem;color:var(--ink);transition:box-shadow .2s,transform .2s}
.ai-btn:hover{box-shadow:0 0 0 1px transparent,0 10px 22px -14px rgba(10,36,99,.5);transform:translateY(-2px)}
.ai-dot{width:10px;height:10px;flex:none;border-radius:50%}
.ai-go{margin-left:auto;width:15px;height:15px;color:var(--muted);transition:transform .2s}
.ai-btn:hover .ai-go{transform:translate(2px,-2px);color:var(--navy)}
.fx-note{margin-top:14px;color:var(--muted);font-size:.84rem}
.soon{margin-left:4px;padding:3px 9px;border-radius:999px;background:#fff;color:#8a6400;font-size:.72rem;font-weight:700;letter-spacing:.04em}
.news-form{display:flex;gap:8px;margin-top:auto;padding-top:22px}
.news-form input{flex:1;min-width:0;height:50px;padding:0 16px;border:1.5px solid #e7dcc8;border-radius:999px;background:#fff;font:500 .95rem var(--font);color:var(--ink)}
.news-form input:disabled,.news-form .btn:disabled{opacity:.7;cursor:not-allowed}
.news-form .btn{min-height:50px}

.ftr.ftr-x .ftr-top{padding:64px 0 40px}
.ftr.ftr-x .ftr-bot{border-top:1px solid var(--line-2)}
.ftr-word{margin:10px 0 -.18em;font-size:clamp(4rem,17vw,15rem);font-weight:800;letter-spacing:-.05em;line-height:.9;text-align:center;color:transparent;-webkit-text-stroke:1.5px #e3e7ee;user-select:none;white-space:nowrap;overflow:hidden}

@media (max-width:1000px){.fx-cta,.fx-row{grid-template-columns:1fr}.ai-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.news-form{flex-direction:column}}
.news-list{display:grid;gap:10px;margin:20px 0 0;padding:0;list-style:none}
.news-list li{display:flex;align-items:center;gap:10px;color:#4a505c;font-size:.95rem}
.news-list .i{width:34px;height:34px;padding:8px;flex:none;border-radius:11px;background:#fff;color:#8a6400}

/* AI logo tiles ("Ask AI about Nerusalem") */
.ai-h{margin-top:22px;font-size:1rem;font-weight:700;color:var(--ink)}
.ai-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.ai-tile{position:relative;width:52px;height:52px;display:grid;place-items:center;border-radius:14px;box-shadow:0 6px 14px -8px rgba(0,0,0,.45);transition:transform .2s cubic-bezier(.2,.7,.2,1),box-shadow .2s}
.ai-tile svg{width:26px;height:26px}
.ai-tile:hover,.ai-tile:focus-visible{transform:translateY(-3px);box-shadow:0 12px 22px -10px rgba(0,0,0,.5)}
.ai-tile::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%) translateY(4px);padding:5px 9px;border-radius:8px;background:var(--ink);color:#fff;font-size:.74rem;font-weight:600;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s,transform .15s}
.ai-tile:hover::after,.ai-tile:focus-visible::after{opacity:1;transform:translateX(-50%)}
.ai-word{color:#fff;font-weight:800;font-size:.86rem;letter-spacing:-.02em}

/* Social links + payment-safety notice (footer, 2026-10-17) */
.soc-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.soc-tile{position:relative;width:44px;height:44px;display:grid;place-items:center;border-radius:999px;border:1.5px solid var(--line-2);background:#fff;color:var(--ink);transition:color .2s,border-color .2s,transform .2s cubic-bezier(.2,.7,.2,1)}
.soc-tile svg{width:20px;height:20px}
.soc-tile:hover,.soc-tile:focus-visible{color:var(--brand);border-color:var(--brand);transform:translateY(-3px)}
.soc-tile::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%) translateY(4px);padding:5px 9px;border-radius:8px;background:var(--ink);color:#fff;font-size:.74rem;font-weight:600;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s,transform .15s}
.soc-tile:hover::after,.soc-tile:focus-visible::after{opacity:1;transform:translateX(-50%)}
.pay-notice{display:flex;gap:14px;align-items:flex-start;margin:0 0 28px;padding:18px 20px;border-radius:18px;background:#fff7e6;border:1px solid #f1dfb8;color:#4a505c;font-size:.9rem;line-height:1.55}
.pay-notice .i{width:22px;height:22px;flex:none;margin-top:1px;color:#8a6400}
.pay-notice p{margin:0}
.pay-notice b{color:var(--ink)}
.pay-notice a{color:var(--ink);font-weight:600;text-decoration:underline;text-underline-offset:2px}

/* USP band: 100% verified (switch: VERIFIED_CLAIM in _build/chrome.py) */
.usp-sec{padding-top:clamp(24px,4vw,48px)}
.usp{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);align-items:center;padding:clamp(28px,5vw,60px);border-radius:36px;background:#ecf7f3;--nw:80px;--cr:22px}
.usp .nt-tile{border-radius:20px;box-shadow:0 8px 18px -12px rgba(10,36,99,.5)}
.usp .nt-tile .i{width:28px;height:28px}
.usp-big{display:flex;align-items:baseline;gap:12px;font-size:1.4rem;font-weight:700;color:#0b6b5e}
.usp-big span{font-size:clamp(4.2rem,9vw,7.5rem);font-weight:800;letter-spacing:-.06em;line-height:.9;background:linear-gradient(135deg,#0f9d8a,var(--navy));-webkit-background-clip:text;background-clip:text;color:transparent}
.usp h2{margin-top:14px;font-size:clamp(1.8rem,3.4vw,2.6rem);letter-spacing:-.04em}
.usp-text>p:last-child{margin-top:12px;max-width:470px;color:#4a505c;font-size:1.08rem;line-height:1.6}
.usp-checks{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.usp-checks li{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:20px;background:#fff;box-shadow:0 10px 24px -18px rgba(10,36,99,.45)}
.uc-ic{width:42px;height:42px;flex:none;display:grid;place-items:center;border-radius:13px}
.uc-ic .i{width:20px;height:20px}
.usp-checks b{display:block;font-weight:600}
.usp-checks small{display:block;color:var(--muted);font-size:.86rem}
.uc-ok{margin-left:auto;width:28px;height:28px;flex:none;display:grid;place-items:center;border-radius:50%;background:#0f9d8a;color:#fff}
.uc-ok .i{width:15px;height:15px;stroke-width:3}
@media (max-width:900px){.usp{grid-template-columns:1fr}}

/* Footer v3: compact AI tiles in the brand column + slim newsletter strip */
.ftr-brand .ai-h{margin-top:24px;font-size:.9rem}
.ftr-brand .ai-row{gap:8px;margin-top:10px;max-width:300px}
.ftr-brand .ai-tile{width:40px;height:40px;border-radius:11px}
.ftr-brand .ai-tile svg{width:20px;height:20px}
.ftr-brand .ai-word{font-size:.72rem}
.fx-news-slim{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:16px;padding:22px 28px;border-radius:26px}
.fx-news-slim h3{margin-top:6px;font-size:1.2rem}
.fx-news-slim .news-form{flex:0 1 460px;margin:0;padding:0}
@media (max-width:860px){.fx-news-slim{flex-direction:column;align-items:stretch}.fx-news-slim .news-form{flex:auto}}
.fx-news.fx-news-slim{flex-direction:row}
.fx-news-slim .news-form{align-items:center}
.fx-news-slim .news-form .btn{min-height:50px;height:50px}
@media (max-width:860px){.fx-news.fx-news-slim{flex-direction:column}}
.ftr-brand .ai-row{flex-wrap:nowrap;gap:6px;max-width:none}
.ftr-brand .ai-tile{width:33px;height:33px;border-radius:9px;flex:none}
.ftr-brand .ai-tile svg{width:17px;height:17px}
.ftr-brand .ai-word{font-size:.62rem}
@media (max-width:420px){.ftr-brand .ai-row{flex-wrap:wrap}}

/* =====================================================================
   Resolution range: 100px watches to 8K screens (2026-09-29)
   ===================================================================== */

/* 1) nothing may cause sideways scrolling (clip keeps position:sticky working) */
html,body{overflow-x:clip}
h1,h2,h3{overflow-wrap:break-word}

/* 2) real overhang fixes */
.phero{overflow-x:clip}
@media (max-width:1100px){.pchip.a{left:0}.pchip.b{right:0}.pvis .blob1{right:0}.pvis .grid{right:0}}
.orbit{width:calc(min(100%,480px) - 64px)}
.stairs::before{left:0;right:0}
@media (min-width:1180px) and (max-width:1340px){.fu-r1{right:10px}.fu-r2{right:16px}.fu-l1{left:6px}.fu-l2{left:14px}}
@media (max-width:560px){
  .track{grid-template-columns:minmax(0,1fr)}
  .cycle{width:min(100%,300px)}
  .cnode{width:96px;margin-left:-48px}
  .cnode .cyc-ic{width:50px;height:50px}
  .cnode small{display:none}
}

/* 3a) tiny screens (<320px): keep the 320px phone layout and scale it down */
@media (max-width:319px){html{zoom:.8}}
@media (max-width:255px){html{zoom:.64}}
@media (max-width:204px){html{zoom:.5}}
@media (max-width:159px){html{zoom:.4}}
@media (max-width:127px){html{zoom:.3125}}

/* 3b) large screens (>1800px): keep ~1600px desktop proportions and scale up,
   so 2K / 4K / 5K / 8K screens see the same design, just bigger and sharper */
@media (min-width:1800px){html{zoom:1.125}}
@media (min-width:2100px){html{zoom:1.3}}
@media (min-width:2500px){html{zoom:1.6}}
@media (min-width:3200px){html{zoom:2}}
@media (min-width:3800px){html{zoom:2.4}}
@media (min-width:4800px){html{zoom:3}}
@media (min-width:6000px){html{zoom:3.75}}
@media (min-width:7200px){html{zoom:4.5}}

/* Hero collage v2 (2026-09-29): verified badges, soft float, slow zoom,
   flowing connector line. White background kept. Uses the individual
   "translate"/"scale" properties so it never fights GSAP's transform. */
.collage .sh{overflow:hidden;transition:translate .5s cubic-bezier(.2,.7,.2,1)}
.collage .sh img{border-radius:inherit;box-shadow:0 22px 40px -24px rgba(10,36,99,.45);animation:kb 18s ease-in-out infinite alternate}
.collage .sh:hover{translate:0 -8px}
.collage .c1{animation:bob 6.5s ease-in-out infinite}
.collage .c2{animation:bob 7.5s ease-in-out -2s infinite}
.collage .c3{animation:bob 6s ease-in-out -4s infinite}
.collage .c4{animation:bob 8s ease-in-out -1s infinite}
.collage .c5{animation:bob 7s ease-in-out -3s infinite}
.collage .c6{animation:bob 6.8s ease-in-out -5s infinite}
@keyframes bob{0%,100%{translate:0 0}50%{translate:0 -12px}}
@keyframes kb{from{scale:1}to{scale:1.06}}
.collage .sh img{transform-origin:50% 35%}
.collage figure.sh>img{display:block;width:100%;height:100%;object-fit:cover}
.vbadge{position:absolute;right:6%;bottom:6%;z-index:2;width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:#0f9d8a;color:#fff;box-shadow:0 0 0 3px #fff,0 8px 16px -6px rgba(15,157,138,.6)}
.vbadge .i{width:15px;height:15px;stroke-width:3}
.s-circle .vbadge{right:9%;bottom:9%}
.collage-line{position:absolute;inset:6% 0 0;width:100%;height:88%;z-index:0;pointer-events:none}
.collage-line path{fill:none;stroke:#d7dde6;stroke-width:1.6;stroke-dasharray:3 9;stroke-linecap:round;vector-effect:non-scaling-stroke;animation:flowdash 14s linear infinite}
@keyframes flowdash{to{stroke-dashoffset:-240}}
.collage .sh,.collage .label-chip{z-index:1}
@media (max-width:760px){.vbadge{width:22px;height:22px;box-shadow:0 0 0 2px #fff}.vbadge .i{width:12px;height:12px}.collage-line{display:none}}
@media (prefers-reduced-motion:reduce){.collage .sh,.collage .sh img,.collage-line path{animation:none}}
/* badges sit inside each shape's safe area (frames clip the slow zoom) */
.collage .s-circle .vbadge{right:17%;bottom:13%}
.collage .s-pill .vbadge{right:9%;bottom:auto;top:44%}
.collage .s-squircle .vbadge{right:10%;bottom:10%}
.collage .s-arch .vbadge{right:8%;bottom:6%}
/* 100% section entrance (only armed when motion is allowed) */
.usp-armed .usp-checks li{opacity:0;translate:24px 0;transition:opacity .5s,translate .6s cubic-bezier(.2,.7,.2,1)}
.usp-armed .uc-ok{scale:0;transition:scale .45s cubic-bezier(.34,1.56,.64,1)}
.usp-on .usp-checks li{opacity:1;translate:0 0}
.usp-on .uc-ok{scale:1}
.usp-on .usp-checks li:nth-child(1),.usp-on .usp-checks li:nth-child(1) .uc-ok{transition-delay:.15s}
.usp-on .usp-checks li:nth-child(2),.usp-on .usp-checks li:nth-child(2) .uc-ok{transition-delay:.45s}
.usp-on .usp-checks li:nth-child(3),.usp-on .usp-checks li:nth-child(3) .uc-ok{transition-delay:.75s}
.usp-on .usp-checks li:nth-child(4),.usp-on .usp-checks li:nth-child(4) .uc-ok{transition-delay:1.05s}
.usp-big span{font-variant-numeric:tabular-nums;min-width:3.1ch;display:inline-block}

/* ---- Verification pipeline (technographic, inside the USP block) ---- */
.pipe{position:relative;overflow:hidden;margin-top:18px;padding:clamp(28px,4vw,48px);border-radius:32px;background:#fff;box-shadow:0 0 0 1px var(--line-2)}
.pipe-circuit{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.pipe-circuit path{fill:none;stroke:#e8ecf2;stroke-width:1.5;vector-effect:non-scaling-stroke}
.pipe-circuit .pk{stroke:#0f9d8a;stroke-width:2.5;stroke-linecap:round;stroke-dasharray:28 1400;stroke-dashoffset:1430;animation:packet 6s linear infinite;opacity:.55}
.pipe-circuit .pk2{stroke:var(--navy);animation-duration:7.5s;animation-delay:-2s}
@keyframes packet{to{stroke-dashoffset:0}}
.pipe-kicker{position:relative;display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--navy)}
.pipe-kicker .i{width:18px;height:18px;color:var(--maroon)}
.pipe-track{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:30px}
.pipe-line{position:absolute;left:12.5%;right:12.5%;top:31px;height:3px;border-radius:3px;background:#e3e7ee;overflow:visible}
.pipe-dot{position:absolute;top:50%;left:0;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;background:#0f9d8a;box-shadow:0 0 0 6px rgba(15,157,138,.18),0 0 22px 4px rgba(15,157,138,.55);animation:travel 8s cubic-bezier(.6,0,.4,1) infinite}
@keyframes travel{0%{left:0;opacity:0}6%{opacity:1}75%{left:100%;opacity:1}82%,100%{left:100%;opacity:0}}
.pipe-n{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px}
.pn-ic{width:64px;height:64px;display:grid;place-items:center;border-radius:20px;background:#f4f6fb;color:#9aa3b2;box-shadow:0 0 0 6px #fff;transition:none;animation:light 8s infinite}
.pn-ic .i{width:28px;height:28px}
.pipe-n b{margin-top:8px;font-size:1rem}
.pipe-n small{color:var(--muted);font-size:.86rem}
.n1 .pn-ic{animation-delay:0s}.n2 .pn-ic{animation-delay:2s}.n3 .pn-ic{animation-delay:4s}.n4 .pn-ic{animation-delay:6s}
@keyframes light{0%{background:#e6f5f1;color:#0f9d8a;box-shadow:0 0 0 6px #fff,0 0 0 10px rgba(15,157,138,.18);scale:1.06}22%,100%{background:#f4f6fb;color:#9aa3b2;box-shadow:0 0 0 6px #fff;scale:1}}
.pipe-card{position:relative;display:flex;align-items:center;gap:12px;width:max-content;max-width:100%;margin:30px auto 0;padding:10px 14px 10px 10px;border-radius:18px;background:#fff;box-shadow:0 16px 34px -18px rgba(10,36,99,.45)}
.pipe-card img{width:42px;height:42px;border-radius:50%;object-fit:cover}
.pipe-card b{display:block;font-size:.95rem}
.pipe-card small{display:block;color:var(--muted);font-size:.8rem}
.pc-st{position:relative;display:grid;margin-left:18px}
.pc-st>span{grid-area:1/1;display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border-radius:999px;font-size:.8rem;font-weight:700;white-space:nowrap}
.st-pend{background:#fdf3d7;color:#8a6400;animation:pend 8s infinite}
.st-ok{background:#e0f4f1;color:#0b6b5e;opacity:0;animation:okk 8s infinite}
.st-ok .i{width:14px;height:14px;stroke-width:3}
@keyframes pend{0%,76%{opacity:1}80%,97%{opacity:0}100%{opacity:1}}
@keyframes okk{0%,76%{opacity:0;scale:.8}80%,97%{opacity:1;scale:1}100%{opacity:0}}
@media (max-width:760px){.pipe-track{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:26px}.pipe-line{display:none}}
@media (prefers-reduced-motion:reduce){.pipe-circuit .pk,.pipe-dot,.pn-ic,.st-pend,.st-ok{animation:none}.pipe-dot{display:none}.st-pend{opacity:0}.st-ok{opacity:1}.n4 .pn-ic{background:#e6f5f1;color:#0f9d8a}}

/* ---- Colleges: how a Unit works ---- */
.unit-map{position:relative;margin-top:48px;padding:clamp(24px,4vw,44px);border-radius:34px;background:#f3f0fd}
.um-root{position:relative;display:flex;align-items:center;gap:14px;width:max-content;max-width:100%;margin:0 auto;padding:14px 18px 14px 14px;border-radius:22px;background:#fff;box-shadow:0 16px 34px -18px rgba(10,36,99,.45)}
.um-ri{width:52px;height:52px;display:grid;place-items:center;border-radius:16px;background:var(--navy);color:#fff}
.um-ri .i{width:26px;height:26px}
.um-root b{display:block;font-size:1.1rem}
.um-root small{display:block;color:var(--muted);font-size:.86rem}
.um-ok{display:inline-flex;align-items:center;gap:5px;margin-left:10px;padding:5px 10px;border-radius:999px;background:#e0f4f1;color:#0b6b5e;font-size:.76rem;font-weight:700;white-space:nowrap}
.um-ok .i{width:14px;height:14px}
.um-lines{display:block;width:75%;height:56px;margin:0 auto}
.um-lines path{fill:none;stroke:#c5bdea;stroke-width:2;stroke-dasharray:6 6;vector-effect:non-scaling-stroke;animation:flowdash 12s linear infinite}
.um-branches{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.um-br{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:20px 16px;border-radius:22px;background:#fff}
.um-bi{width:48px;height:48px;display:grid;place-items:center;border-radius:15px}
.um-bi .i{width:23px;height:23px}
.um-br b{margin-top:6px;font-size:1.1rem}
.um-br small{color:var(--muted);font-size:.86rem}
.um-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:8px}
.um-tags span{padding:4px 10px;border-radius:999px;background:#f4f6fb;font-size:.78rem;font-weight:600;color:var(--ink-2)}
.um-tools{margin-top:22px;text-align:center}
.um-tools p{font-size:.84rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.um-tools>div{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:10px}
.um-tool{display:inline-flex;align-items:center;gap:7px;padding:8px 14px 8px 10px;border-radius:999px;background:#fff;font-size:.9rem;font-weight:600;color:var(--navy)}
.um-tool .i{width:17px;height:17px}
.um-roles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0 0;padding:0;list-style:none}
.um-roles li{display:flex;flex-direction:column;gap:4px;padding:18px;border-radius:20px;background:#f4f6fb}
.um-roles .i{width:20px;height:20px;color:var(--navy)}
.um-roles b{margin-top:6px}
.um-roles span{color:var(--muted);font-size:.88rem}
@media (max-width:760px){.um-branches,.um-roles{grid-template-columns:minmax(0,1fr)}.um-lines{display:none}.um-root{flex-wrap:wrap}.um-ok{margin-left:0}}
@media (max-width:1000px) and (min-width:761px){.um-roles{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---- hero-net: technographic network over the photo collage ---- */
.hero-net{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;overflow:visible}
.hn-line{fill:none;stroke:#cfd8e6;stroke-width:1.5;stroke-dasharray:2 6;stroke-linecap:round}
.hn-line.x{stroke:#e4e9f0}
.hn-pk{fill:none;stroke:#0f9d8a;stroke-width:3;stroke-linecap:round;stroke-dasharray:4 96;stroke-dashoffset:100;animation:hnpk 5s linear infinite;filter:drop-shadow(0 0 4px rgba(15,157,138,.7))}
.hn-pk:nth-of-type(4n){stroke:var(--navy);filter:drop-shadow(0 0 4px rgba(10,36,99,.55))}
@keyframes hnpk{to{stroke-dashoffset:0}}
.hn-node{fill:#fff;stroke:#0f9d8a;stroke-width:2.5;animation:hnnode 2.4s ease-in-out infinite}
@keyframes hnnode{0%,100%{stroke-width:2.5;r:5}50%{stroke-width:6;r:6}}
.hn-pop{position:absolute;z-index:3;display:inline-flex;align-items:center;gap:7px;padding:7px 12px 7px 8px;border-radius:12px;background:#fff;box-shadow:0 12px 26px -12px rgba(10,36,99,.45);font-size:.8rem;font-weight:600;color:var(--ink);white-space:nowrap;opacity:0;pointer-events:none}
.hn-pop .i{width:22px;height:22px;padding:4px;border-radius:7px;background:#e0f4f1;color:#0f9d8a}
.hn-pop.on{animation:hnpop 2.5s ease forwards}
@keyframes hnpop{0%{opacity:0;translate:0 8px;scale:.94}12%,78%{opacity:1;translate:0 0;scale:1}100%{opacity:0;translate:0 -6px}}
@media (max-width:760px){.hn-line.x,.hn-pop{display:none}}
@media (prefers-reduced-motion:reduce){.hn-pk,.hn-node{animation:none}.hn-pk{display:none}}
.hn-line{stroke:#c3cede;stroke-width:1.6;stroke-dasharray:3 7}
.hn-line.x{stroke:#d9e0ea}
.collage{overflow:visible}
.hero .collage{margin-top:clamp(80px,10vw,130px);margin-bottom:60px}
/* nursing space map (nurses + students), reuses the Unit map layout */
.unit-map.sm-nurse{background:#eef2fd}
.sm-nurse .um-lines path{stroke:#b9c7ec}
.sm-nurse .um-br:first-child{box-shadow:0 0 0 2px #0f9d8a33,0 18px 36px -22px rgba(10,36,99,.45)}
.sm-nurse .um-br{transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.sm-nurse .um-br:hover{transform:translateY(-4px)}
/* stacked solution cards: only sticky when the screen is tall enough to show a
   whole card; on short laptop screens they scroll normally so nothing is cut off */
@media (max-height:880px){.scard.cc{position:relative;top:auto!important;min-height:0}}
/* 2026-10-05 (Naveen): "Made for every side of healthcare" scrolls normally on
   every screen, as it already did on laptops - no sticky stacking. */
.scard.cc{position:relative;top:auto!important;min-height:0}

/* =====================================================================
   Phone fixes (2026-09-29). Phone-only: nothing here applies above 760px.
   ===================================================================== */
@media (max-width:760px){
  /* sections breathe, but 160px of white between every block is too much on a phone */
  .sec{padding:clamp(48px,13vw,64px) 0}
  /* hero photos sit inside the page gutter instead of touching the screen edges */
  .hero .collage{margin-left:16px;margin-right:16px}
  /* newsletter: stacked field + button, both full width */
  .fx-news-slim .news-form{flex-direction:column;align-items:stretch;gap:10px}
  .fx-news-slim .news-form input{flex:none;width:100%;height:50px}
  .fx-news-slim .news-form .btn{width:100%;justify-content:center}
  /* outlined wordmark fits the screen width */
  .ftr-word{font-size:15.5vw}
  /* the two photo labels sat on top of each other at phone widths */
  .hero .lc1{top:72%}.hero .lc2{top:92%}
}

/* contact page: office phone */
.off-tel{display:inline-block;margin-top:6px;font-weight:600;color:var(--navy);text-decoration:none}
.off-tel:hover{text-decoration:underline}

/* Logo (2026-10-01): crest + NERUSALEM wordmark (Lovelo Black, as outlines).
   The word is exactly the crest's visible height: the crest's 38px box draws
   the laurel 31.5px tall, so the wordmark is 31.5px. Phones keep the crest only. */
/* 2026-10-01: smaller on the page (image files unchanged) - at 38px the logo was
   ~290px wide. A 30px crest box draws the laurel 30*270/305*0.936 = 24.9px tall,
   so the word is 24.9px (~230px total). */
.logo{gap:9px;letter-spacing:0}
.logo>img:first-child{width:30px;height:30px}
.logo .logo-word{display:block;width:auto;height:24.9px}
@media (max-width:560px){.logo .logo-word{display:none}}

/* Footer logo trademark (Naveen, 2026-10-01 - the mark is granted, so TM) */
.logo .tm{align-self:flex-start;margin-left:-5px;font-size:.62rem;font-weight:700;line-height:1;color:var(--navy)}
/* Big outlined footer NERUSALEM: smaller so the final M is never clipped */
.ftr-word{font-size:clamp(2.6rem,13.4vw,12.5rem)}
@media (max-width:760px){.ftr-word{font-size:13.4vw}}

/* Contact page: office phone + WhatsApp (same number on both offices) */
.off-phone{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin-top:6px}
.off-phone .off-tel{margin-top:0}
.off-wa{display:inline-flex;align-items:center;gap:6px;padding:4px 11px 4px 8px;border-radius:999px;background:#e7f8ee;color:#128c4a;font-size:.86rem;font-weight:600;text-decoration:none;font-style:normal}
.off-wa svg{width:16px;height:16px;color:#25d366}
.off-wa:hover{background:#d4f3e1}

/* office label never runs under the corner icon tile */
.off .off-k{padding-right:52px}

/* RGUHS question-bank offer (home, 2026-10-05). Navy band, amber accents. */
.qbo{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,64px);align-items:center;padding:clamp(28px,4.5vw,60px);border-radius:36px;background:linear-gradient(135deg,#0A2463 0%,#153585 100%);color:#fff;overflow:hidden;isolation:isolate}
.qbo::before,.qbo::after{content:"";position:absolute;z-index:-1;border-radius:50%}
.qbo::before{width:420px;height:420px;right:-120px;top:-160px;background:radial-gradient(circle,rgba(233,168,0,.28),transparent 68%)}
.qbo::after{width:360px;height:360px;left:-140px;bottom:-200px;background:radial-gradient(circle,rgba(15,157,138,.3),transparent 70%)}
.qbo-tag{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 6px;border-radius:999px;background:rgba(255,255,255,.12);font-size:.86rem;font-weight:700;letter-spacing:.01em}
.qbo-tag b{padding:4px 10px;border-radius:999px;background:var(--amber);color:var(--navy);font-size:.74rem;letter-spacing:.08em;text-transform:uppercase}
.qbo h2{margin-top:18px;font-size:clamp(2rem,4.2vw,3.2rem);line-height:1.05;color:#fff}
.qbo h2 em{font-style:normal;color:var(--amber)}
.qbo-lead{margin-top:14px;max-width:34em;font-size:1.08rem;color:rgba(255,255,255,.84)}
.qbo-pts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px;margin:22px 0 0;padding:0;list-style:none}
.qbo-pts li{display:flex;align-items:center;gap:10px;font-weight:600}
.qbo-pts .i{width:28px;height:28px;padding:6px;border-radius:9px;background:rgba(255,255,255,.12);color:var(--amber);flex:none}
.qbo .btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.qbo .btn-fill{background:var(--amber);color:var(--navy)}
.qbo .btn-fill:hover{background:#ffc21a;color:var(--navy)}
.qbo .btn-out{background:transparent;border-color:rgba(255,255,255,.45);color:#fff}
.qbo .btn-out:hover{background:rgba(255,255,255,.1);border-color:#fff}
.qbo-fine{margin-top:18px;font-size:.78rem;color:rgba(255,255,255,.62)}
.qbo-vis{position:relative;display:grid;place-items:center;padding:24px 0}
.qbo-card{width:min(100%,380px);padding:18px;border-radius:24px;background:#fff;color:var(--ink);box-shadow:0 30px 60px -24px rgba(0,0,0,.45);transform:rotate(-2deg)}
.qbo-ch{display:flex;align-items:center;gap:10px}
.qbo-ch img{width:28px;height:28px}
.qbo-ch b{font-size:.98rem}
.qbo-ch span{margin-left:auto;padding:3px 10px;border-radius:999px;background:var(--t-navy);color:var(--navy);font-size:.72rem;font-weight:800;letter-spacing:.06em}
.qbo-sems{display:flex;gap:5px;margin-top:14px}
.qbo-sems i{flex:1;padding:5px 0;border-radius:8px;background:#f1f3f8;color:var(--muted);font-style:normal;font-size:.72rem;font-weight:700;text-align:center}
.qbo-sems i.on{background:var(--navy);color:#fff}
.qbo-meta{margin-top:14px;font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--maroon)}
.qbo-q{margin-top:6px;font-weight:700;line-height:1.35}
.qbo-op{display:flex;align-items:center;gap:10px;margin-top:8px;padding:9px 12px;border:1px solid var(--line-2);border-radius:12px;font-size:.88rem;color:var(--ink-2)}
.qbo-op b{color:var(--navy)}
.qbo-op.ok{border-color:#9fdcd2;background:#e0f4f1;color:#0b6b5e;font-weight:600}
.qbo-op.ok b{color:#0f9d8a}
.qbo-op .i{width:16px;height:16px;margin-left:auto}
.qbo-why{display:flex;gap:9px;margin-top:12px;padding:10px 12px;border-radius:12px;background:var(--t-amber);font-size:.82rem;line-height:1.4;color:#5c4300}
.qbo-why .i{width:16px;height:16px;flex:none;margin-top:1px;color:#a77800}
.qbo-stat{position:absolute;right:-30px;top:50%;display:grid;place-items:center;width:118px;height:118px;border-radius:50%;background:var(--amber);color:var(--navy);text-align:center;transform:rotate(8deg);box-shadow:0 16px 30px -14px rgba(0,0,0,.45)}
.qbo-stat b{display:block;font-size:1.6rem;font-weight:800;line-height:1}
.qbo-stat small{display:block;margin-top:3px;font-size:.66rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;line-height:1.2}
@media (max-width:900px){.qbo{grid-template-columns:1fr}.qbo-vis{padding-top:8px}}
@media (max-width:560px){.qbo-pts{grid-template-columns:1fr}.qbo .btns .btn{width:100%;justify-content:center}.qbo-stat{display:none}.qbo-stat b{font-size:1.3rem}}

/* Brochure download (colleges page, 2026-10-05) */
.broch{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(28px,5vw,64px);align-items:center;padding:clamp(24px,4vw,52px);border-radius:36px;background:#f3f0fd}
.broch h2{font-size:clamp(1.9rem,3.6vw,2.7rem)}
.broch>div>p.say{margin-top:12px;color:var(--muted);font-size:1.06rem}
.broch .btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.broch-meta{display:flex;align-items:center;gap:8px;margin-top:14px;font-size:.84rem;color:var(--muted)}
.broch-meta .i{width:16px;height:16px}
.broch-pics{position:relative;padding:4% 2% 10%}
.broch-pics a{display:block;border-radius:14px;overflow:hidden;box-shadow:0 26px 50px -24px rgba(10,36,99,.5);transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.broch-pics a:hover{transform:translateY(-4px)}
.broch-pics img{display:block;width:100%;height:auto}
.broch-pics .b1{width:88%;transform:rotate(-2deg)}
.broch-pics .b2{position:absolute;right:0;bottom:0;width:62%;transform:rotate(3deg)}
.broch-pics .b2:hover{transform:rotate(3deg) translateY(-4px)}
.broch-pics .b1:hover{transform:rotate(-2deg) translateY(-4px)}
@media (max-width:900px){.broch{grid-template-columns:1fr}}
@media (max-width:560px){.broch .btns .btn{width:100%;justify-content:center}}

/* Promo top bar, every marketing page (2026-10-05). Scrolls away; the sticky header stays. */
.topbar{display:flex;align-items:center;justify-content:center;gap:12px;min-height:42px;padding:8px 16px;background:var(--navy);color:#fff;font-size:.9rem;font-weight:500;line-height:1.3;text-decoration:none;text-align:center}
.topbar:hover .tb-go{text-decoration:underline;text-underline-offset:3px}
.topbar:focus-visible{outline:3px solid var(--amber);outline-offset:-3px}
.tb-free{flex:none;padding:3px 9px;border-radius:999px;background:var(--amber);color:var(--navy);font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.tb-go{flex:none;display:inline-flex;align-items:center;gap:5px;font-weight:700;color:var(--amber)}
.tb-go .i{width:15px;height:15px}
.tb-short{display:none}
@media (max-width:760px){.topbar{gap:9px;font-size:.84rem}.tb-long{display:none}.tb-short{display:inline}}
@media (max-width:380px){.tb-go{font-size:0;gap:0}.tb-go .i{width:18px;height:18px}}

/* ===================================================================
   2026-10-15: question banks, brand film, feature clips, pricing
   (build_qbank.py + chrome.py home sections + qb-v4.js)
   Additive only: every selector below is new except .mg-panel.mg-qb.
   =================================================================== */
/* ---- Question banks mega panel: one banner-size RGUHS card + coming soon */
.mg-panel.mg-qb{grid-template-columns:1fr 280px}
.qbm-banner{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:20px;align-items:center;padding:26px 26px 26px 30px;border-radius:22px;background:linear-gradient(135deg,#0A2463 0%,#153585 100%);color:#fff;overflow:hidden;isolation:isolate;transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.qbm-banner::after{content:"";position:absolute;right:-60px;top:-80px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(233,168,0,.35),rgba(233,168,0,0) 70%);z-index:-1}
.qbm-banner:hover{transform:translateY(-2px)}
.nav .mg-panel a.qbm-banner{color:#fff}
.qbm-text{display:flex;flex-direction:column;gap:10px}
.qbm-tag{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;padding:4px 12px 4px 8px;border-radius:999px;background:rgba(255,255,255,.14);font-size:.76rem;font-weight:700;letter-spacing:.02em}
.qbm-tag .i{width:14px;height:14px;color:var(--amber)}
.qbm-h{font-size:1.45rem;line-height:1.15;letter-spacing:-.02em;font-weight:700}
.qbm-p{font-size:.9rem;color:rgba(255,255,255,.8);line-height:1.45}
.qbm-stats{display:flex;flex-wrap:wrap;gap:8px}
.qbm-stats span{display:flex;flex-direction:column;padding:8px 12px;border-radius:14px;background:rgba(255,255,255,.1);font-size:.72rem;color:rgba(255,255,255,.75);line-height:1.25}
.qbm-stats b{font-size:1rem;color:#fff}
.qbm-cta{display:inline-flex;align-items:center;gap:6px;margin-top:4px;font-weight:700;font-size:.92rem;color:var(--amber)}
.qbm-cta .i{width:18px;height:18px}
.qbm-card{display:flex;flex-direction:column;gap:8px;padding:16px;border-radius:18px;background:#fff;color:var(--ink);box-shadow:0 24px 40px -22px rgba(0,0,0,.5);transform:rotate(2deg)}
.qbm-meta{font-size:.66rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--maroon)}
.qbm-q{font-size:1.05rem;font-weight:700}
.qbm-asked{align-self:flex-start;padding:3px 10px;border-radius:999px;background:var(--t-amber);color:#5c4300;font-size:.74rem;font-weight:700}
.qbm-years{display:flex;flex-wrap:wrap;gap:4px}
.qbm-years i{font-style:normal;padding:2px 7px;border-radius:7px;background:var(--t-navy);color:var(--navy);font-size:.7rem;font-weight:600}
.qbm-price{margin-top:2px;font-size:.82rem;color:var(--muted)}
.qbm-price b{color:var(--navy)}
.qbm-side{gap:8px}
.qbm-side>b{font-size:1.02rem}
.qbm-soon{display:grid;gap:10px;margin:4px 0 6px;padding:0;list-style:none}
.qbm-soon li{display:flex;flex-direction:column;font-size:.8rem;line-height:1.35;color:var(--muted)}
.qbm-soon li b{font-size:.86rem;color:var(--ink)}
@media (max-width:1180px){.mg-panel.mg-qb{grid-template-columns:1fr}}

/* ---- question bank heroes */
.qhero .qhero-grid{align-items:center}
.qh-price{margin-top:18px;color:var(--muted);font-size:1rem}
.qh-price b{color:var(--navy);font-size:1.15rem}
.qh-price s,.qbo-price s,.qpr-p s,.hp-n s{opacity:.75;margin-left:4px}
.qhero-vis{position:relative;display:grid;place-items:center;padding:30px 0;isolation:isolate}
.qhero-vis::before{content:"";position:absolute;inset:6% 4%;border-radius:40px;background:linear-gradient(135deg,var(--t-amber),var(--t-navy));z-index:-1}
.qh-card{width:min(100%,400px);padding:20px;border-radius:24px;background:#fff;color:var(--ink);box-shadow:0 30px 60px -26px rgba(10,36,99,.45),0 0 0 1px var(--line-2);transform:rotate(-1.5deg)}
.qh-top{display:flex;align-items:center;gap:10px}
.qh-top b{font-size:.95rem}
.qh-top span{margin-left:auto;padding:3px 10px;border-radius:999px;background:var(--navy);color:#fff;font-size:.72rem;font-weight:700}
.qh-meta{margin-top:16px;font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--maroon)}
.qh-q{margin-top:4px;font-size:1.35rem;font-weight:700;letter-spacing:-.02em}
.qh-ans{margin-top:12px;font-size:.9rem;color:var(--ink-2);line-height:1.5;-webkit-mask-image:linear-gradient(#000 40%,transparent);mask-image:linear-gradient(#000 40%,transparent)}
.qh-lock{display:inline-flex;align-items:center;gap:6px;margin-top:6px;font-size:.8rem;font-weight:700;color:var(--navy)}
.qh-lock .i{width:15px;height:15px}
.qhero-hub{padding-bottom:clamp(24px,4vw,40px)}
.qhero-hub .lead{max-width:640px}
.qstats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:clamp(36px,5vw,56px) 0 0;padding:0;list-style:none}
.qstats li{display:flex;flex-direction:column;padding:18px 20px;border-radius:20px;background:var(--soft);box-shadow:inset 0 0 0 1px var(--line-2)}
.qstats b{font-size:clamp(1.4rem,2.6vw,2rem);letter-spacing:-.03em;color:var(--navy);line-height:1.1}
.qstats span{font-size:.88rem;color:var(--muted)}
@media (max-width:760px){.qstats{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* "asked N times" + years (hero card, preview list, home) */
.qbp-asked{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin-top:10px}
.qbp-x{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;background:var(--t-amber);color:#5c4300;font-size:.78rem;font-weight:700}
.qbp-x .i{width:14px;height:14px}
.qbp-years{display:flex;flex-wrap:wrap;gap:4px}
.qbp-years i{font-style:normal;padding:2px 7px;border-radius:7px;background:var(--t-navy);color:var(--navy);font-size:.72rem;font-weight:600}

/* ---- tabs (without JS every panel shows) */
.qtabs .qtab-bar{display:none}
.qtabs.is-js .qtab-bar{display:flex;flex-wrap:wrap;gap:6px;margin:0 auto 28px;padding:6px;width:max-content;max-width:100%;border-radius:999px;background:var(--soft);box-shadow:inset 0 0 0 1px var(--line-2)}
.qtab-bar [role=tab]{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 18px;border:0;border-radius:999px;background:transparent;font-weight:600;font-size:.94rem;color:var(--muted);cursor:pointer}
.qtab-bar [role=tab] .i{width:18px;height:18px}
.qtab-bar [role=tab][aria-selected=true]{background:#fff;color:var(--navy);box-shadow:var(--e1)}
.qtabs:not(.is-js) .qtab-p+.qtab-p{margin-top:56px}
.qtab-h{margin:0 0 22px;font-size:clamp(1.4rem,2.6vw,1.9rem);text-align:center}
@media (max-width:560px){.qtabs.is-js .qtab-bar{width:100%;border-radius:22px}.qtab-bar [role=tab]{flex:1 1 100%;justify-content:center}}

/* ---- preview list */
.qbp-filter{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:22px}
.qbp-chip{min-height:38px;padding:0 16px;border:1px solid var(--line);border-radius:999px;background:#fff;font-weight:600;font-size:.88rem;color:var(--ink-2);cursor:pointer}
.qbp-chip.is-on{background:var(--navy);border-color:var(--navy);color:#fff}
.qbp-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.qbp-item{display:flex;flex-direction:column;padding:22px;border-radius:22px;background:#fff;box-shadow:0 0 0 1px var(--line-2),var(--e1)}
.qbp-item[hidden]{display:none}
.qbp-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:.8rem;color:var(--muted)}
.qbp-meta span{padding:2px 9px;border-radius:999px;background:var(--navy);color:#fff;font-size:.72rem;font-weight:700}
.qbp-q{margin-top:10px;font-size:1.18rem;line-height:1.3;letter-spacing:-.01em}
.qbp-n{margin-right:6px;color:var(--muted);font-weight:600}
.qbp-show{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;margin-top:16px;min-height:40px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:#fff;font-weight:600;font-size:.88rem;color:var(--navy);cursor:pointer}
.qbp-show .i{width:16px;height:16px}
.qbp-show[aria-expanded=true]{background:var(--t-navy);border-color:transparent}
.qbp-ans{margin-top:14px}
.qbp-ans>p:first-child{max-height:9.5em;overflow:hidden;font-size:.94rem;line-height:1.55;color:var(--ink-2);-webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}
.qbp-lock{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:6px;padding:12px 14px;border-radius:14px;background:var(--t-amber);font-size:.86rem;color:#5c4300}
.qbp-lock .i{width:16px;height:16px}
.qbp-lock span{flex:1 1 200px}
.qbp-lock a{font-weight:700;color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.qbp-end{margin-top:26px;padding:24px;border-radius:24px;background:var(--soft);text-align:center}
.qbp-end p{color:var(--ink-2)}
.qbp-end .btns{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:16px}
@media (max-width:800px){.qbp-list{grid-template-columns:minmax(0,1fr)}}

/* ---- semesters */
.qsems{display:grid;gap:10px;max-width:900px;margin:0 auto}
.qsem{border-radius:20px;background:#fff;box-shadow:0 0 0 1px var(--line-2)}
.qsem summary{display:flex;align-items:center;gap:14px;padding:16px 20px;cursor:pointer;list-style:none}
.qsem summary::-webkit-details-marker{display:none}
.qsem summary h3{flex:1;font-size:1.05rem;letter-spacing:-.01em}
.qsem-n{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:12px;background:var(--t-navy);color:var(--navy);font-weight:800}
.qsem .pm{position:relative;width:16px;height:16px;flex:none}
.qsem .pm::before,.qsem .pm::after{content:"";position:absolute;left:0;top:7px;width:16px;height:2px;border-radius:2px;background:var(--navy);transition:transform .2s}
.qsem .pm::after{transform:rotate(90deg)}
.qsem[open] .pm::after{transform:rotate(0)}
.qsem-b{padding:0 20px 20px 70px}
.qsem-subs{font-size:.95rem;color:var(--ink-2)}
.qsem-k{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0;padding:0;list-style:none}
.qsem-k li{display:flex;flex-direction:column;padding:8px 12px;border-radius:12px;background:var(--soft);font-size:.76rem;color:var(--muted);line-height:1.3}
.qsem-k b{font-size:1rem;color:var(--navy)}
@media (max-width:560px){.qsem-b{padding:0 16px 18px}}

/* ---- what's inside */
.qin{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.qin-c{position:relative;padding:24px;border-radius:24px}
.qin-ic{display:grid;place-items:center;width:46px;height:46px;border-radius:14px}
.qin-c h3{margin-top:16px;font-size:1.15rem}
.qin-c p{margin-top:8px;color:var(--muted);font-size:.95rem;line-height:1.5}
@media (max-width:900px){.qin{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.qin{grid-template-columns:minmax(0,1fr)}}

/* ---- prices (RGUHS page) */
.qprs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;max-width:900px;margin:44px auto 0}
.qpr{position:relative;display:flex;flex-direction:column;padding:28px;border-radius:28px;background:#fff;box-shadow:0 0 0 1px var(--line-2),var(--e1)}
.qpr-best{box-shadow:0 0 0 2px var(--amber),var(--e3)}
.qpr-badge{position:absolute;top:-13px;left:24px;padding:4px 12px;border-radius:999px;background:var(--amber);color:var(--navy);font-size:.76rem;font-weight:800}
.qpr-k{font-size:.8rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.qpr-p{margin-top:10px}
.qpr-p b{font-size:2.6rem;letter-spacing:-.04em;color:var(--navy)}
.qpr-s{margin-top:4px;color:var(--muted)}
.qpr .bul{margin-top:18px}
.qpr .btns{margin-top:auto;padding-top:22px}
.qpr .btn{width:100%;justify-content:center}
.qless{max-width:900px;margin:22px auto 0;padding:24px;border-radius:24px;background:var(--soft)}
.qless-h{font-weight:800;color:var(--navy)}
.qless ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:14px 0 0;padding:0;list-style:none}
.qless li{display:flex;gap:12px;align-items:flex-start}
.ql-ic{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:12px}
.ql-ic .i{width:19px;height:19px}
.qless li b{display:block;font-size:.95rem}
.qless li small{display:block;margin-top:2px;font-size:.84rem;color:var(--muted);line-height:1.4}
.qless-eg{margin-top:16px;padding-top:14px;border-top:1px solid var(--line-2);font-size:.9rem;color:var(--ink-2)}
.qfine{display:flex;gap:8px;align-items:flex-start;max-width:900px;margin:16px auto 0;font-size:.84rem;color:var(--muted)}
.qfine .i{width:17px;height:17px;flex:none;margin-top:2px;color:var(--teal)}
@media (max-width:760px){.qprs,.qless ul{grid-template-columns:minmax(0,1fr)}}

/* ---- long-form guide + disclaimer */
.qguide{max-width:780px;margin:0 auto}
.qguide h2{font-size:clamp(1.6rem,3vw,2.3rem)}
.qguide h3{margin-top:28px;font-size:1.25rem}
.qguide p{margin-top:16px;color:var(--ink-2);font-size:1.04rem;line-height:1.7}
.qguide ul{margin-top:12px;padding-left:20px;list-style:disc;color:var(--ink-2);line-height:1.7}
.qguide li+li{margin-top:6px}
/* RGUHS question papers by semester/subject, blueprint and scheme tables (2026-10-18) */
.qguide.qwide{max-width:900px;margin-bottom:22px}
.qguide a{color:var(--navy);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.qpap .qsem-b{padding:0 20px 22px}
.qpap-s{margin-top:18px;padding-top:18px;border-top:1px solid var(--line-2)}
.qpap-s h4{font-size:1.05rem;letter-spacing:-.01em;color:var(--ink)}
.qpap-m,.qpap-u{margin-top:8px;color:var(--ink-2);font-size:.94rem;line-height:1.6}
.qpap-u b{color:var(--ink)}
.qpap-h{margin-top:12px;font-size:.86rem;font-weight:700;color:var(--navy)}
.qpap-q{margin:8px 0 0;padding-left:20px;color:var(--ink-2);font-size:.94rem;line-height:1.55}
.qpap-q li+li{margin-top:6px}
.qpap-q span{display:block;color:var(--muted);font-size:.8rem}
.qtbl-w{margin-top:16px;overflow-x:auto;border-radius:16px;box-shadow:0 0 0 1px var(--line-2)}
.qtbl{width:100%;border-collapse:collapse;font-size:.9rem;line-height:1.45;background:#fff}
.qtbl th{padding:10px 12px;background:var(--soft);color:var(--ink);font-weight:700;text-align:left;white-space:nowrap}
.qtbl td{padding:10px 12px;border-top:1px solid var(--line-2);color:var(--ink-2);vertical-align:top}
.qguide p.qsrc{margin-top:10px;font-size:.84rem;color:var(--muted)}
@media (max-width:640px){.qtbl{font-size:.82rem}.qtbl th,.qtbl td{padding:8px 9px}}
.qdisc{max-width:780px;margin:0 auto;font-size:.82rem;color:var(--muted);text-align:center}
.inl{color:var(--navy);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* ---- question banks hub */
a.qbo-link{color:#fff}
.qbo-price{margin-top:16px;color:rgba(255,255,255,.85)}
.qbo-price b{color:var(--amber);font-size:1.15rem}
.qbo-price s{color:rgba(255,255,255,.55)}
.qbo .qbo-go{margin-top:22px}
.qbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.qbs-g{padding:22px;border-radius:24px;background:var(--soft);box-shadow:inset 0 0 0 1px var(--line-2)}
.qbs-g h3{font-size:1.05rem}
.qbs-g ul{display:grid;gap:10px;margin:14px 0 0;padding:0;list-style:none}
.qbs-g li{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:16px;background:#fff;box-shadow:0 0 0 1px var(--line-2)}
.qbs-n{flex:1;display:flex;flex-direction:column;line-height:1.3}
.qbs-n small{font-size:.8rem;color:var(--muted)}
.qbs-soon{flex:none;padding:3px 9px;border-radius:999px;background:var(--t-navy);color:var(--navy);font-size:.72rem;font-weight:700}
@media (max-width:900px){.qbs{grid-template-columns:minmax(0,1fr)}}

/* ---- home: brand film */
.film{position:relative;overflow:hidden;border-radius:32px;background:var(--t-navy);box-shadow:0 40px 80px -40px rgba(10,36,99,.5),0 0 0 1px var(--line-2)}
.film video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--t-navy)}
.film-bar{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;padding:18px 22px;background:#fff}
.film-bar p{flex:1 1 260px;display:flex;flex-direction:column;line-height:1.35}
.film-bar p b{font-size:1.05rem}
.film-bar p span{font-size:.9rem;color:var(--muted)}
.film-bar .btn{margin:0}

/* ---- home: feature clips */
.clips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.clipc{margin:0;padding:10px 10px 16px;border-radius:26px}
.clip-box{overflow:hidden;border-radius:18px;background:var(--soft);aspect-ratio:4/3}
.clip-box video{display:block;width:100%;height:100%;object-fit:cover}
.clipc figcaption{display:flex;gap:12px;align-items:flex-start;padding:14px 8px 0}
.clip-ic{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:12px}
.clip-ic .i{width:20px;height:20px}
.clipc figcaption b{display:block;font-size:1.05rem}
.clipc figcaption small{display:block;margin-top:2px;font-size:.9rem;color:var(--muted);line-height:1.4}
@media (max-width:980px){.clips{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.clips{grid-template-columns:minmax(0,1fr)}}

/* ---- home: pricing */
.hp{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:stretch}
.hp-card{position:relative;display:flex;flex-direction:column;padding:26px 22px 22px;border-radius:26px}
.hp-best{box-shadow:0 0 0 2px var(--amber),var(--e3)}
.hp-badge{align-self:flex-start;margin:-8px 0 12px;padding:4px 12px;border-radius:999px;background:var(--amber);color:var(--navy);font-size:.72rem;font-weight:800}
.hp-k{font-size:.74rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.hp-card h3{margin-top:6px;font-size:1.3rem}
.hp-p{margin-top:14px;font-size:2.2rem;font-weight:700;letter-spacing:-.04em;color:var(--navy);line-height:1}
.hp-p small{font-size:.95rem;font-weight:600;letter-spacing:0;color:var(--muted)}
.hp-n{margin-top:8px;min-height:2.8em;font-size:.88rem;color:var(--muted);line-height:1.4}
.hp-card ul{display:grid;gap:9px;margin:18px 0 22px;padding:0;list-style:none}
.hp-card li{display:flex;gap:9px;font-size:.92rem;line-height:1.4;color:var(--ink-2)}
.hp-card li .i{width:17px;height:17px;flex:none;margin-top:2px;color:var(--teal)}
.hp-card .btn{margin-top:auto;justify-content:center}
@media (max-width:1100px){.hp{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.hp{grid-template-columns:minmax(0,1fr)}.hp-n{min-height:0}}

/* ===================================================================
   2026-10-15 (b): fixes and additions after review
   =================================================================== */
/* mega banner: the generic ".nav .mg-panel a:hover{background:none}" and
   ".nav .mg-panel a{padding:0}" were wiping the navy banner on hover */
.nav .mg-panel a.qbm-banner,.nav .mg-panel a.qbm-banner:hover{padding:26px 26px 26px 30px;border-radius:22px;background:linear-gradient(135deg,#0A2463 0%,#153585 100%);color:#fff}
.nav .mg-panel a.qbm-banner:hover{box-shadow:0 18px 36px -18px rgba(10,36,99,.6)}

/* RGUHS hero: four feature tiles instead of counts */
.qstats li{flex-direction:row;align-items:center;gap:14px}
.qstats li>div{display:flex;flex-direction:column;min-width:0}
.qstats b{font-size:clamp(1.1rem,1.8vw,1.35rem);letter-spacing:-.02em}
.qs-ic{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:14px}
.qs-ic .i{width:21px;height:21px}
.qbp-x.qbp-model{background:var(--t-teal);color:#0b6b5e}

/* subjects by semester */
.qsem-c{flex:none;padding:3px 10px;border-radius:999px;background:var(--soft);color:var(--muted);font-size:.78rem;font-weight:600}
.qsem-p{color:var(--ink-2);font-size:.95rem;line-height:1.6}
.qsem-subs{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0;padding:0;list-style:none}
.qsem-subs li{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:12px;background:var(--t-navy);color:var(--navy);font-size:.86rem;font-weight:600;line-height:1.3}
.qsem-subs .i{width:15px;height:15px;flex:none}
.qsem-f{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:14px;font-size:.85rem;color:var(--muted)}
.qsem-f span{display:inline-flex;align-items:center;gap:5px}
.qsem-f .i{width:15px;height:15px;color:var(--teal)}
@media (max-width:560px){.qsem-c{display:none}}

/* hub hero: the open bank on top, coming-soon banks behind */
.qbk-stack{position:relative;display:grid;gap:12px;width:min(100%,420px);padding:26px 0}
.qbk{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:18px;background:#fff;box-shadow:0 0 0 1px var(--line-2),0 16px 30px -22px rgba(10,36,99,.45)}
.qbk>div{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.3}
.qbk b{font-size:.98rem}
.qbk small{font-size:.82rem;color:var(--muted)}
.qbk-ic{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:13px}
.qbk-ic .i{width:20px;height:20px}
.qbk-open{padding:18px;box-shadow:0 0 0 2px var(--amber),0 26px 50px -26px rgba(10,36,99,.55);transform:rotate(-1.5deg)}
.qbk-1{margin-left:24px;opacity:.92}.qbk-2{margin-left:48px;opacity:.82}.qbk-3{margin-left:72px;opacity:.72}
.qbk-tag{flex:none;padding:3px 10px;border-radius:999px;background:var(--t-navy);color:var(--navy);font-size:.74rem;font-weight:700}
.qbk-tag.is-open{background:var(--amber);color:var(--navy)}
.qbk-chip{position:absolute;right:-6px;top:4px;display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;background:#fff;box-shadow:0 14px 30px -14px rgba(10,36,99,.45),0 0 0 1px var(--line-2);font-size:.84rem;font-weight:700;color:var(--ink)}
.qbk-chip .i{width:16px;height:16px;color:var(--amber)}
@media (max-width:560px){.qbk-1,.qbk-2,.qbk-3{margin-left:0}.qbk-chip{display:none}}

/* home brand film in a MacBook-style frame (graphite bezel, silver base) */
.film{background:none;box-shadow:none;border-radius:0;overflow:visible}
.mac{width:min(820px,100%);margin:0 auto}
.mac-screen{position:relative;padding:2.4% 2.4% 3%;border-radius:22px 22px 6px 6px;background:#2b2f36;box-shadow:inset 0 0 0 2px #464b55,0 30px 60px -36px rgba(10,36,99,.6)}
.mac-cam{position:absolute;left:50%;top:1%;width:7px;height:7px;margin-left:-3.5px;border-radius:50%;background:#4a505c;box-shadow:inset 0 0 0 2px #3a3f48}
.mac-screen video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:4px;background:#eef2fd}
.mac-base{position:relative;width:112%;height:18px;margin-left:-6%;border-radius:2px 2px 18px 18px;background:linear-gradient(180deg,#e9ecf1 0%,#cfd4dc 55%,#aeb4be 100%);box-shadow:0 18px 30px -18px rgba(10,36,99,.5)}
.mac-notch{position:absolute;left:50%;top:0;width:15%;height:7px;transform:translateX(-50%);border-radius:0 0 10px 10px;background:linear-gradient(180deg,#c3c8d0,#d9dde3)}
.film-bar{width:min(820px,100%);margin:22px auto 0;padding:0;background:none}
@media (max-width:560px){.mac-base{height:12px}.mac-screen{border-radius:14px 14px 4px 4px}}
@media (max-width:560px){.qstats{grid-template-columns:minmax(0,1fr)}}

/* Help centre + release notes (/docs/, 2026-10-19) */
.dhero{padding:clamp(28px,5vw,56px) 0 clamp(8px,2vw,16px)}
.dhero h1{margin-top:14px;font-size:clamp(2rem,4.6vw,3.2rem);letter-spacing:-.03em;line-height:1.08;max-width:880px}
.dhero .lead{margin-top:14px;max-width:720px;color:var(--ink-2);font-size:clamp(1.02rem,1.6vw,1.15rem);line-height:1.6}
.dsearch{position:relative;max-width:620px;margin-top:22px}
.dsearch .i{position:absolute;left:18px;top:50%;width:20px;height:20px;transform:translateY(-50%);color:var(--muted)}
.dsearch input{width:100%;height:56px;padding:0 18px 0 50px;border:1.5px solid var(--line-2);border-radius:999px;background:#fff;font:500 1rem var(--font);color:var(--ink)}
.dsearch input:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 4px var(--t-navy)}
.dsearch-none{margin-top:12px;color:var(--muted)}
.dsearch-none a,.dart a,.drel a{color:var(--navy);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.dgroup+.dgroup{margin-top:clamp(32px,5vw,52px)}
.dgroup-h{display:flex;align-items:center;gap:14px}
.dgroup-h h2{font-size:clamp(1.4rem,2.6vw,1.8rem);letter-spacing:-.02em}
.dgroup-h p{margin-top:2px;color:var(--ink-2)}
.dcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;margin-top:18px}
.dcard,.drel-card{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:18px;background:#fff;box-shadow:0 0 0 1px var(--line-2);color:var(--ink);transition:box-shadow .2s,transform .2s}
.dcard:hover,.dcard:focus-visible,.drel-card:hover,.drel-card:focus-visible{box-shadow:0 0 0 1.5px var(--navy),0 12px 24px -16px rgba(10,36,99,.35);transform:translateY(-2px)}
.dcard-ic{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:14px}
.dcard-ic .i{width:22px;height:22px}
.dcard-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.dcard-t b{font-size:1rem;line-height:1.3}
.dcard-t small{color:var(--muted);font-size:.86rem;line-height:1.45}
.dcard>.i,.drel-card>.i{flex:none;color:var(--muted)}
.drel-card{margin-top:clamp(32px,5vw,52px);max-width:620px;background:#fff7e6;box-shadow:0 0 0 1px #f1dfb8}
.dlayout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:clamp(24px,4vw,56px);align-items:start}
.dart{max-width:760px;margin:0}
.dart h2{margin-top:36px;font-size:clamp(1.3rem,2.4vw,1.6rem);scroll-margin-top:96px}
.dart>h2:first-child,.dtoc+h2{margin-top:8px}
.dtoc{margin-bottom:28px;padding:18px 20px;border-radius:18px;background:var(--soft)}
.dtoc p{margin:0!important;font-size:.82rem!important;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)!important}
.dtoc ol{margin:8px 0 0;padding-left:20px;list-style:decimal;color:var(--ink-2)}
.dtoc a{color:var(--navy);font-weight:600}
.dsteps{display:grid;gap:10px;margin:16px 0 0;padding:0;list-style:none}
.dsteps li{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;border-radius:16px;background:#fff;box-shadow:0 0 0 1px var(--line-2);color:var(--ink-2);line-height:1.6}
.dstep-n{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:10px;background:var(--t-navy);color:var(--navy);font-weight:800;font-size:.9rem}
.dnote{display:flex;gap:12px;align-items:flex-start;margin-top:18px;padding:14px 16px;border-radius:16px;background:var(--t-navy);color:var(--ink-2)}
.dnote .i{flex:none;width:20px;height:20px;margin-top:3px;color:var(--navy)}
.dnote p{margin:0!important}
.dnote-warn{background:#fff7e6}.dnote-warn .i{color:#8a6400}
.dupd{margin-top:32px!important;font-size:.86rem!important;color:var(--muted)!important}
.dside{position:sticky;top:96px;display:grid;gap:10px}
.dside>p{font-size:.82rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.dside .dcard{padding:12px 14px}.dside .dcard-ic{width:36px;height:36px;border-radius:12px}.dside .dcard-t small{display:none}
.drels{max-width:900px;margin:0 auto}
.drel{display:grid;grid-template-columns:180px minmax(0,1fr);gap:24px;padding:28px 0;border-top:1px solid var(--line-2)}
.drel:first-child{border-top:0;padding-top:0}
.drel-d time{position:sticky;top:96px;display:inline-block;font-weight:700;color:var(--navy)}
.drel-b h2{font-size:clamp(1.2rem,2.2vw,1.45rem);letter-spacing:-.01em}
.drel-b h3{margin-top:16px}
.drel-b ul{margin-top:8px;padding-left:20px;list-style:disc;color:var(--ink-2);line-height:1.65}
.drel-b li+li{margin-top:5px}
.dtag{display:inline-block;padding:3px 10px;border-radius:999px;font-size:.76rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase}
@media (max-width:900px){.dlayout{grid-template-columns:1fr}.dside{position:static}.drel{grid-template-columns:1fr;gap:8px}}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
