*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#0b1010;color:#e8f3ed;font-family:Manrope,Arial,sans-serif}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}::selection{background:#39dca2;color:#07110e}.noise{position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.12;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.18' filter='url(%23n)'/%3E%3C/svg%3E")}.site-header{height:86px;background:#0b1010;display:flex;align-items:center;padding:0 clamp(24px,5vw,90px);gap:40px;border-bottom:1px solid #20332c;position:relative;z-index:15}.brand{display:flex;align-items:center;gap:12px;flex-shrink:0}.brand-seal{width:47px;height:47px;border:2px solid #45e2aa;color:#47e4ab;border-radius:50%;display:grid;place-items:center;font-family:Georgia,serif;font-size:35px;line-height:1;position:relative}.seal-dot{position:absolute;font-size:12px;color:#ffcf6a;right:-5px;top:-5px}.brand-words,.footer-brand{font-family:"Space Grotesk",sans-serif;font-weight:700;letter-spacing:-1.2px;font-size:20px;line-height:.9}.brand-words span,.footer-brand span{color:#41dca1}.brand-words small{display:block;font:9px "DM Mono",monospace;color:#718e82;letter-spacing:1.5px;margin-top:9px}.desktop-nav{display:flex;gap:clamp(15px,2vw,35px);align-items:center;margin:auto}.desktop-nav a,.nav-cta,.section-label,.eyebrow,.kicker,.hero-bottom,.btn,.ticker,.tenet-num,.scripture-top,.scripture-bottom,.mini-card>span,.panel-header,.tiny-label,.stat label,.build-result>span,.panel-button,.panel-link,.product-info,.shop-note,.final-call>p,.final-call>a,footer{font-family:"DM Mono",monospace}.desktop-nav a{font-size:11px;letter-spacing:1px;color:#a2b6ac;white-space:nowrap}.desktop-nav a:hover{color:#49e1aa}.nav-cta{font-size:11px;letter-spacing:.7px;border:1px solid #36c995;padding:15px 18px;white-space:nowrap;color:#48e0a7}.nav-cta span{margin-left:14px}.menu-toggle{display:none;background:transparent;border:0;color:#48e0a7;font-size:27px}.mobile-nav{background:#101b17;position:absolute;z-index:30;right:0;left:0;padding:20px 30px}.mobile-nav:not([hidden]){display:grid;gap:18px}.hero{position:relative;min-height:760px;overflow:hidden;color:#0a2721;background:radial-gradient(ellipse at 28% 65%,#b0f5d7 0%,transparent 49%),radial-gradient(ellipse at 85% 30%,#c7ecf5 0%,transparent 50%),linear-gradient(120deg,#b4e6d8,#d3f5f0 55%,#a8d4e7);border-bottom:8px solid #26bb8c}.hero-glow{position:absolute;width:700px;height:700px;border-radius:50%;background:#61d6b3;filter:blur(100px);opacity:.16;right:-180px;top:50px}.hero-circle{position:absolute;border:1px solid rgba(24,99,80,.16);border-radius:50%;width:750px;height:750px;top:30px;right:-110px}.c2{width:980px;height:980px;top:-85px;right:-220px}.hero-inner{position:relative;z-index:1;max-width:1480px;margin:auto;padding:100px clamp(24px,6vw,100px) 90px}.eyebrow{font-size:11px;letter-spacing:1.3px;font-weight:500;display:flex;align-items:center;gap:12px}.live-dot{height:8px;width:8px;border-radius:50%;background:#10a67d;box-shadow:0 0 0 5px #10a67d20}.eyebrow-rule{height:1px;width:42px;background:#6ea99b}.hero h1{font-family:"Space Grotesk",sans-serif;font-weight:700;letter-spacing:-.092em;line-height:.99;font-size:clamp(58px,8.4vw,138px);margin:47px 0 28px;max-width:1150px}.hero h1 em{font-style:normal;color:#078e6d}.period{color:#ff776c}.hero-sub{font-size:clamp(15px,1.5vw,20px);line-height:1.8;color:#2d6557;max-width:700px}.hero-sub strong{color:#0c3d30}.hero-actions{display:flex;gap:13px;flex-wrap:wrap;margin-top:35px}.btn{padding:20px 25px;font-size:12px;font-weight:500;letter-spacing:.5px;display:inline-flex;justify-content:space-between;align-items:center;gap:32px;transition:transform .2s}.btn:hover{transform:translateY(-3px)}.btn-dark{background:#0b1c17;color:#c8f9e4}.btn-outline{border:1px solid #477e70;color:#16483b}.hero-mark{position:absolute;right:8%;top:120px;width:275px;height:275px;border:1px solid #2d8c7650;border-radius:50%;display:grid;place-items:center;transform:rotate(-13deg);opacity:.7}.hero-mark:before{content:"";position:absolute;inset:24px;border:1px dashed #2d8c7670;border-radius:50%}.hero-pi{font:180px Georgia,serif;color:#1d9a79}.orbit-text{position:absolute;bottom:26px;font:10px "DM Mono",monospace;letter-spacing:1px}.hero-bottom{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;padding:20px clamp(24px,5vw,90px);font-size:10px;letter-spacing:1px;color:#337968;z-index:2}.ticker{background:#35d7a0;color:#07271c;overflow:hidden;white-space:nowrap;font-size:12px;letter-spacing:2px;font-weight:500;padding:15px 0}.ticker-track{width:max-content;animation:marquee 32s linear infinite}.ticker span{padding:0 38px;color:#fff5b9}@keyframes marquee{to{transform:translateX(-50%)}}.section{padding:90px clamp(24px,6vw,105px);max-width:1700px;margin:auto}.section-label{display:flex;justify-content:space-between;gap:15px;border-bottom:1px solid #2c4137;padding-bottom:19px;color:#45d6a2;font-size:11px;letter-spacing:1.5px}.section-label span+span{color:#688d7d}.doctrine-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:8%;padding:95px 0 85px}.kicker{font:11px "DM Mono",monospace;color:#49d7a2;letter-spacing:2px;margin:0 0 25px}.section h2{font-family:"Space Grotesk",sans-serif;font-size:clamp(54px,6vw,100px);line-height:1.02;letter-spacing:-.07em;margin:0}.section h2 span{color:#42d4a1}.doctrine-copy{padding-top:42px;font-size:18px;line-height:1.8;color:#b6c9bf}.doctrine-copy p{margin:0 0 20px}.doctrine-copy blockquote{font:700 clamp(26px,3vw,43px)/1.2 "Space Grotesk",sans-serif;letter-spacing:-1.8px;color:#e3f7e9;margin:30px 0;padding-left:25px;border-left:3px solid #3ed6a1}.muted{color:#83998d!important}.tenets{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.tenets article{border:1px solid #294138;background:#101a16;min-height:265px;padding:28px;position:relative}.tenet-num{color:#5f8774;font-size:12px}.tenet-icon{font-size:40px;color:#3fdda5;margin:24px 0}.tenets h3{font:700 18px "Space Grotesk",sans-serif;letter-spacing:-.5px}.tenets p{color:#8ba799;font-size:13px;line-height:1.7}.scripture-section{max-width:none;background:#101a17}.scripture-section>.section-label,.scripture-layout{max-width:1490px;margin:auto}.scripture-layout{display:grid;grid-template-columns:1.45fr .55fr;gap:18px;margin-top:55px}.scripture-main{background:radial-gradient(ellipse at 50% 60%,#193f32,#10251e 65%,#0c1d18);border:1px solid #35745a;min-height:570px;padding:32px clamp(25px,4vw,65px);display:flex;flex-direction:column;box-shadow:inset 0 0 60px #2bdd9810}.scripture-top,.scripture-bottom{display:flex;justify-content:space-between;gap:15px;font-size:10px;letter-spacing:1.2px;color:#65c79e}.quote-mark{font:150px Georgia,serif;color:#49d5a3;line-height:.7;margin-top:80px}.scripture-main blockquote{font:500 clamp(28px,3.6vw,54px)/1.22 "Space Grotesk",sans-serif;letter-spacing:-2px;margin:10px 0 65px}.scripture-main blockquote em{font-style:normal;color:#51dca9}.scripture-bottom{margin-top:auto;border-top:1px solid #37614e;padding-top:20px}.scripture-side{display:grid;gap:15px}.mini-card{border:1px solid #314c3d;padding:27px;background:#15231c}.mini-card>span{font-size:11px;letter-spacing:1.2px;color:#53d9a4}.mini-card p{font-size:18px;line-height:1.55;letter-spacing:-.5px}.mini-card.patch{background:#1b2030;border-color:#4d446e}.patch strong{display:block;font:700 40px "Space Grotesk",sans-serif;color:#d0b8ff;margin:14px 0}.patch p{font-size:14px;color:#b8a8c7}.patch .status{font-size:9px;color:#63e1a7}.build-grid{display:grid;grid-template-columns:.8fr 1fr;gap:9%;align-items:center;padding:85px 0 20px}.build-intro>p:not(.kicker){font-size:18px;color:#b2c5b8;line-height:1.8;max-width:490px}.build-sticker{display:inline-block;transform:rotate(-4deg);margin-top:35px;border:2px dashed #eac168;color:#eac168;padding:16px 22px;font:700 13px "DM Mono",monospace;letter-spacing:1px}.build-panel{border:1px solid #3f6652;background:#14231c;box-shadow:18px 18px 0 #0d1713,18px 18px 0 1px #345342}.panel-header{background:#244233;padding:18px 24px;display:flex;justify-content:space-between;font-size:11px;letter-spacing:1px;color:#c7f6dd}.panel-version{color:#79a98d}.panel-body{padding:30px}.avatar-row{display:flex;gap:20px;align-items:center;margin-bottom:28px;padding-bottom:25px;border-bottom:1px solid #355242}.avatar{width:76px;height:76px;border:1px solid #5cdca8;background:#183f30;display:grid;place-items:center;font-size:50px;color:#e9c46b}.tiny-label{color:#74b598;font-size:10px;letter-spacing:1px}.avatar-row h3{font:700 clamp(19px,2vw,28px) "Space Grotesk",sans-serif;margin:6px 0;letter-spacing:-1px}.archetype-sub{font-size:12px;color:#8db4a0}.stat{margin:23px 0}.stat label{display:flex;justify-content:space-between;font-size:11px;letter-spacing:1px;color:#b4d6c4}.stat output{color:#4cdda4}.stat input{width:100%;margin-top:12px;appearance:none;height:8px;background:linear-gradient(to right,#42dca4 var(--val),#345346 var(--val));outline:0}.stat input::-webkit-slider-thumb{appearance:none;width:18px;height:18px;border:3px solid #0c1c16;border-radius:50%;background:#f3cb73;box-shadow:0 0 0 1px #eecb73}.stat input::-moz-range-thumb{width:14px;height:14px;border:3px solid #0c1c16;border-radius:50%;background:#f3cb73}.build-result{border:1px solid #477d5e;background:#1b392b;padding:18px;margin-top:26px}.build-result>span{color:#70d9a9;font-size:10px}.build-result strong{display:block;font:700 20px "Space Grotesk",sans-serif;margin-top:8px}.build-result p{font-size:12px;color:#a7c7b5;margin-bottom:0;line-height:1.5}.panel-button{display:block;width:100%;background:#4bddab;color:#0a281c;border:0;padding:18px;margin-top:16px;font-weight:500;font-size:12px;letter-spacing:1px}.panel-button:hover{background:#8bf1c8}.panel-link{display:block;text-align:center;color:#8cba9f;font-size:11px;margin-top:17px}.vestments{padding-bottom:120px}.vestment-heading{display:flex;justify-content:space-between;align-items:end;gap:50px;margin:75px 0 50px}.vestment-heading>p{max-width:390px;color:#99b1a3;line-height:1.8}.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.product-card{min-width:0}.shirt-scene{height:390px;background:radial-gradient(circle at 50% 38%,#376a58,#193d32 60%,#122b23);border:1px solid #375b4b;display:grid;place-items:center;overflow:hidden}.green-scene{background:radial-gradient(circle,#d6f5dc,#87cdb2 70%,#64a993)}.purple-scene{background:radial-gradient(circle,#534470,#2c2949 70%,#1c1c35)}.shirt{position:relative;width:215px;height:255px;background:#0d1414;clip-path:polygon(21% 0,36% 0,42% 9%,58% 9%,64% 0,79% 0,100% 19%,85% 35%,80% 28%,80% 100%,20% 100%,20% 28%,15% 35%,0 19%);filter:drop-shadow(0 10px 15px #0008);display:flex;justify-content:center;align-items:center;transform:rotate(-3deg)}.shirt:before{content:"";position:absolute;top:0;left:40%;width:20%;height:17px;border-radius:0 0 50% 50%;background:#26322c}.shirt.cream{background:#e9e9d6;transform:rotate(3deg)}.shirt.cream:before{background:#b1c6b2}.shirt-print{font:700 17px/1.07 "Space Grotesk",sans-serif;letter-spacing:-.6px;text-align:center;color:#c9f9e2;margin-top:25px}.shirt-print>span{display:block;font:9px "DM Mono",monospace;letter-spacing:1px;color:#47e1a6;margin-top:14px}.dark-print{color:#12392c}.dark-print>span{color:#26876b}.shirt-print .large-pi{font:700 56px "Space Grotesk",sans-serif;color:#e8c06d;margin:0 0 5px}.product-info{display:flex;justify-content:space-between;gap:15px;padding:19px 0}.product-info h3{font-size:13px;margin:0 0 8px;letter-spacing:.5px}.product-info p,.product-info>span{color:#7c9e8d;font-size:11px;margin:0}.shop-note{text-align:center;border:1px dashed #345543;padding:23px;margin-top:35px;color:#8eb7a0;font-size:11px;letter-spacing:1px}.shop-note span{color:#e8c36c;margin:0 15px}.final-call{position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 90%,#255d49,#0e241b 65%);border-top:1px solid #376b53;min-height:560px;text-align:center;padding:100px 20px}.final-symbol{position:absolute;inset:0;display:grid;place-items:center;font:500px Georgia,serif;color:#54c8950d;pointer-events:none}.final-call>p{color:#73d9ac;font-size:11px;letter-spacing:2px;position:relative}.final-call h2{font:700 clamp(55px,7vw,112px)/1 "Space Grotesk",sans-serif;letter-spacing:-.07em;margin:32px 0 12px;position:relative}.final-call h2 em{font-style:normal;color:#4de0a9}.final-call>span{font:500 17px "DM Mono",monospace;color:#e6c773;letter-spacing:4px}.final-call>a{display:block;margin-top:70px;color:#a0c6b1;font-size:11px;letter-spacing:1px}footer{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:35px clamp(24px,6vw,105px);font-size:10px;color:#759586;line-height:1.9;border-top:1px solid #294034}.footer-brand{color:#e6f4ea;font-size:23px}.footer-brand small{display:block;font:9px "DM Mono",monospace;color:#759586;margin-top:8px;letter-spacing:1px}.footer-right{text-align:right}@media(max-width:1150px){.desktop-nav{gap:15px}.desktop-nav a{font-size:10px}.nav-cta{display:none}.hero-mark{opacity:.25}.hero h1{font-size:clamp(60px,9vw,110px)}}@media(max-width:800px){.site-header{height:74px;padding:0 22px}.desktop-nav{display:none}.menu-toggle{display:block;margin-left:auto}.hero{min-height:700px}.hero-inner{padding:80px 25px 120px}.hero h1{font-size:clamp(53px,11.5vw,90px);margin-top:65px}.hero-mark{right:-90px;top:70px;opacity:.17}.hero-bottom{padding:20px 25px}.hero-bottom span:last-child{display:none}.section{padding:65px 24px}.doctrine-grid,.scripture-layout,.build-grid{grid-template-columns:1fr;gap:35px}.doctrine-grid{padding:55px 0}.doctrine-copy{padding:0}.tenets{grid-template-columns:1fr}.tenets article{min-height:210px}.scripture-main{min-height:440px}.quote-mark{margin-top:55px}.scripture-side{grid-template-columns:1fr 1fr}.scripture-side .patch{grid-column:span 2}.build-grid{padding-top:55px}.build-panel{margin-right:18px}.vestment-heading{display:block;margin-top:50px}.product-grid{grid-template-columns:1fr 1fr}.product-grid article:last-child{grid-column:span 2}.product-grid article:last-child .shirt-scene{height:340px}.shirt-scene{height:340px}footer{flex-wrap:wrap}.footer-center{display:none}}@media(max-width:540px){.eyebrow{font-size:9px;letter-spacing:.3px}.eyebrow-rule{width:15px}.hero h1{font-size:clamp(48px,12vw,67px)}.hero-sub{font-size:15px}.btn{width:100%}.hero-bottom{font-size:9px}.section-label{font-size:9px}.section-label span+span{max-width:45%;text-align:right}.section h2{font-size:clamp(49px,12vw,70px)}.doctrine-copy{font-size:16px}.scripture-side{grid-template-columns:1fr}.scripture-side .patch{grid-column:auto}.scripture-main{padding:25px}.scripture-main blockquote{font-size:32px}.scripture-top,.scripture-bottom{font-size:8px}.product-grid{grid-template-columns:1fr}.product-grid article:last-child{grid-column:auto}.shirt-scene,.product-grid article:last-child .shirt-scene{height:350px}.shop-note{line-height:1.8}.shop-note span{margin:0 5px}.final-call{min-height:480px}.final-call h2{font-size:clamp(49px,11vw,65px)}.footer-right{text-align:left}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
/* ==========================================================================
Header logo (approved: pi + gold halo, no star)
========================================================================== */
.brand-seal{width:52px;height:52px;border:2px solid #47dfab;border-radius:50%;display:grid;place-items:center;overflow:visible}
.brand-seal svg{width:45px;height:45px}
.site-header{background:#071312;min-height:84px}
/* ==========================================================================
Cathedral hero — v9
Replaces the stacked v1–v8 overrides. Real HTML text over the artwork;
no full-width gradient/fog overlay. Art strategy is documented in HERO_ART.md.
========================================================================== */
.hero-cathedral{
--hero-void:#05090a; /* matches the near-black edges of the art */
background:var(--hero-void);
min-height:760px;color:#f0fff7;border-bottom:1px solid #315b4c;
isolation:isolate;overflow:hidden;
}
/* --- Art layer ---------------------------------------------------------- */
.hero-cathedral .hero-visual{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.hero-cathedral .hero-visual picture{display:contents}
.hero-cathedral .hero-art{position:absolute;display:block;max-width:none;user-select:none}
/* Final mode: one full-bleed, text-free wide plate (see HERO_ART.md spec).
Focal point keeps the monument inside the frame as the aspect ratio changes. */
.hero-art--wide .hero-art{
inset:0;width:100%;height:100%;
object-fit:cover;object-position:var(--art-focus,68% 42%);
}
/* Interim mode: cathedral-clean.webp is a 1:1 plate with the monument centred
(monument occupies ~21%–79% of the image width). It is drawn at full hero
height, uncropped, so the whole arch opening frames the monument, and
placed with its centre at 66% of the viewport — but never so far right
that the monument leaves the frame. Both outer columns feather into the
void (they are already near-black). Approved by the owner: the framed
opening reads better than running the art to the screen edge. */
.hero-art--square .hero-art{
top:0;right:0;height:100%;width:auto;aspect-ratio:1;
/* translate % = image width (= hero height H). Centre = min(66vw, W - .3H). */
transform:translateX(min(calc(50% - 34vw), 20%));
-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 11%,#000 89%,transparent 100%);
mask-image:linear-gradient(90deg,transparent 0,#000 11%,#000 89%,transparent 100%);
}
/* --- Text (approved typography) ---------------------------------------- */
.hero-cathedral .hero-inner{max-width:none;position:relative;z-index:2;padding:90px clamp(25px,6vw,110px) 170px}
.hero-cathedral .eyebrow{color:#b7ffe0;letter-spacing:1.5px}
.hero-cathedral h1{font-size:clamp(52px,6vw,100px);line-height:1.01;letter-spacing:-.085em;margin:35px 0 18px;max-width:860px;color:#f0fff8;text-shadow:0 3px 25px #05161280}
.hero-cathedral h1 em{color:#48dbab}
.hero-cathedral .period{color:#f2fdf6}
.hero-cathedral .hero-sub{font:500 13px "DM Mono",monospace;letter-spacing:3.8px;color:#f3e7cc;margin:20px 0 0}
.hero-cathedral .hero-actions{margin-top:32px}
.hero-cathedral .btn{min-width:260px;justify-content:space-between}
.hero-cathedral .btn-dark{background:#4ce5b2;color:#05251a;border-radius:40px;font-weight:700}
.hero-cathedral .btn-outline{color:#61edbc;border:1px solid #54dcaa;border-radius:40px;background:#071714b5}
/* --- Feature strip ------------------------------------------------------ */
.hero-cathedral .hero-bottom{z-index:3;padding:19px clamp(25px,7vw,135px);background:linear-gradient(0deg,#071411e8,#07141165);display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.hero-cathedral .hero-bottom a{display:flex;align-items:center;gap:18px;padding:0 25px;border-right:1px solid #4a9d7b80;min-height:55px}
.hero-cathedral .hero-bottom a:first-child{padding-left:0}
.hero-cathedral .hero-bottom a:last-child{border:0}
.hero-cathedral .hero-bottom-icon{font-size:33px;color:#4be6b0}
.hero-cathedral .hero-bottom strong{display:block;color:#ecfff3;font:700 12px "Space Grotesk",sans-serif;letter-spacing:.8px}
.hero-cathedral .hero-bottom small{display:block;color:#86b2a2;font:11px "DM Mono",monospace;letter-spacing:0;margin-top:7px}
.hero-cathedral .hero-bottom a:hover strong{color:#4be6b0}
/* --- Tablet / small laptop --------------------------------------------- */
@media(max-width:1100px){
.hero-cathedral h1{font-size:clamp(48px,7vw,77px)}
.hero-cathedral .btn{min-width:230px}
.hero-cathedral .hero-bottom{padding-left:25px;padding-right:25px}
.hero-cathedral .hero-bottom a{padding:0 12px;gap:10px}
/* Push the plate right so only its empty right-hand column is cropped. */
.hero-art--square .hero-art{transform:translateX(18%);
-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 11%);mask-image:linear-gradient(90deg,transparent 0,#000 11%)}
.hero-art--wide .hero-art{object-position:var(--art-focus-tablet,72% 42%)}
}
/* --- Mobile: the monument sits BEHIND the headline ---------------------
The 1:1 plate is drawn wider than the screen (--art-w) so the pi is large;
its dark outer columns fall off-screen. The headline starts over the
pi's legs and floor glow; the buttons land on the dark floor below as the
art dissolves downward. No scrim: a tighter local text-shadow only. */
@media(max-width:800px){
.hero-cathedral{--art-w:min(140vw,760px);--text-top:calc(var(--art-w) * .55);min-height:0}
.hero-art--square .hero-art{
top:0;right:auto;left:50%;width:var(--art-w);height:auto;transform:translateX(-50%);
-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 10%,#000 90%,transparent 100%),linear-gradient(180deg,#000 70%,transparent 100%);
-webkit-mask-composite:source-in;
mask-image:linear-gradient(90deg,transparent 0,#000 10%,#000 90%,transparent 100%),linear-gradient(180deg,#000 70%,transparent 100%);
mask-composite:intersect;
}
.hero-art--wide .hero-art{object-position:var(--art-focus-mobile,62% 30%)}
.hero-cathedral .hero-inner{padding:var(--text-top) 25px 185px}
.hero-cathedral h1{font-size:clamp(46px,9vw,70px);margin-top:20px;
text-shadow:0 2px 6px #030a0acc,0 4px 30px #030a0ae6}
.hero-cathedral .hero-sub{text-shadow:0 1px 4px #030a0a,0 2px 14px #030a0a}
/* The 9px eyebrow can't hold up over the monument on shadow alone: give it a small badge. */
.hero-cathedral .eyebrow{display:inline-flex;background:#030a0ab8;border:1px solid #2f5f4f80;border-radius:30px;padding:7px 12px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
/* Base CSS hid the feature-strip labels below 800px (icons only); show them. */
.hero-cathedral .hero-bottom span:last-child{display:block}
.hero-cathedral .hero-bottom{grid-template-columns:repeat(2,1fr);row-gap:20px}
.hero-cathedral .hero-bottom a:nth-child(2){border:0}
.hero-cathedral .hero-bottom a:nth-child(3){padding-left:0}
}
@media(max-width:540px){
.hero-cathedral h1{font-size:clamp(43px,10.3vw,59px)}
/* keep the eyebrow badge on one line down to 360px */
.hero-cathedral .eyebrow{letter-spacing:.2px;gap:8px;padding:6px 11px}
.hero-cathedral .eyebrow-rule{display:none}
.hero-cathedral .eyebrow:after{content:none}
.hero-cathedral .hero-sub{font-size:10px;letter-spacing:1.7px}
.hero-cathedral .hero-bottom{gap:10px;padding:15px}
.hero-cathedral .hero-bottom a{gap:7px;padding:0 7px}
.hero-cathedral .hero-bottom-icon{font-size:22px}
.hero-cathedral .hero-bottom strong{font-size:10px}
.hero-cathedral .hero-bottom small{font-size:9px}
.hero-cathedral .btn{min-width:0}
}
/* ==========================================================================
Build-a-Belief: Faith is derived, not writable
========================================================================== */
.stat label>span{display:inline-flex;align-items:center;gap:10px}
.lock-chip{font-size:9px;letter-spacing:1px;color:#e8c46c;border:1px solid #e8c46c66;padding:3px 7px 2px}
.stat-derived input{background:linear-gradient(to right,#e8c46c var(--val),#345346 var(--val));cursor:not-allowed}
.stat-derived output{color:#e8c46c}
.stat-formula{margin:9px 0 0;font:9px "DM Mono",monospace;letter-spacing:.8px;color:#6f9583}
.stat-notice{margin:0;font:11px/1.5 "DM Mono",monospace;color:#ff9a8c;min-height:0;max-height:0;overflow:hidden;transition:max-height .25s,margin .25s}
.stat-derived.denied .stat-notice{max-height:60px;margin-top:8px}
.stat-derived.denied input{animation:refuse .32s ease}
@keyframes refuse{20%,60%{transform:translateX(-4px)}40%,80%{transform:translateX(4px)}}
/* ==========================================================================
Tenets: four across
========================================================================== */
.tenets{grid-template-columns:repeat(4,1fr)}
@media(max-width:1150px){.tenets{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){.tenets{grid-template-columns:1fr}}
/* ==========================================================================
Scripture: Jeff 4:1–8, The Validation Function
========================================================================== */
.passage{max-width:1490px;margin:18px auto 0;border:1px solid #35745a;background:#0c1d18;padding:32px clamp(25px,4vw,65px)}
.passage-top,.passage-bottom{display:flex;justify-content:space-between;gap:15px;font:10px "DM Mono",monospace;letter-spacing:1.2px;color:#65c79e}
.passage-bottom{border-top:1px solid #37614e;padding-top:20px;color:#6f9583}
.passage-verses{list-style:none;counter-reset:verse;margin:34px 0;padding:0;display:grid;gap:14px}
.passage-verses li{counter-increment:verse;display:grid;grid-template-columns:34px 110px 1fr;align-items:baseline;gap:14px}
.passage-verses li:before{content:counter(verse);font:10px "DM Mono",monospace;color:#4e7666;text-align:right}
.passage .who{font:500 11px "DM Mono",monospace;letter-spacing:1.4px}
.passage .who.lord{color:#e8c46c}
.passage .who.jeff{color:#4de0a9}
.passage .line{font:500 clamp(18px,1.7vw,24px)/1.4 "Space Grotesk",sans-serif;letter-spacing:-.5px;color:#d9eee3}
.passage .verdict{margin-top:14px;padding-top:24px;border-top:1px dashed #37614e}
.passage .verdict .line{font:700 clamp(28px,3.6vw,54px)/1.05 "Space Grotesk",sans-serif;letter-spacing:-.06em;color:#f0fff8}
@media(max-width:540px){
.passage-verses li{grid-template-columns:20px 1fr;gap:4px 10px}
.passage-verses li:before{grid-row:span 2}
.passage .line{grid-column:2}
.passage-top,.passage-bottom{font-size:8px;flex-direction:column;gap:6px}
}
/* ==========================================================================
Tenets v2: sacred illustrations, large type
========================================================================== */
.tenets{gap:18px}
.tenets article.tenet{min-height:0;padding:clamp(28px,2.6vw,44px);display:flex;flex-direction:column;overflow:hidden;
background:radial-gradient(ellipse at 50% 30%,#1a3a2e 0%,#111d18 58%,#0f1814 100%);border:1px solid #2c4a3d;transition:border-color .3s,transform .3s}
.tenets article.tenet:hover{border-color:#47dfab;transform:translateY(-4px)}
.tenet .tenet-num{position:absolute;top:20px;left:26px;font:400 clamp(26px,2vw,34px)/1 Georgia,"Times New Roman",serif;letter-spacing:.08em;color:#e8c46c;opacity:.8}
.tenet-art{display:block;width:100%;max-width:320px;height:auto;margin:34px auto 34px;overflow:visible}
.tenet-art .ln{fill:none;stroke:#49e0b0;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.tenet-art .au{fill:none;stroke:#e8c46c;stroke-width:3;stroke-linecap:round}
.tenet-art .thin{stroke-width:1.6}
.tenet-art .thick{stroke-width:5}
.tenet-art .dash{stroke-dasharray:2 7}
.tenet-art .fill-au{fill:#e8c46c}
.tenet-art .glow{filter:drop-shadow(0 0 6px #e8c46caa) drop-shadow(0 0 16px #e8c46c66)}
.tenet-art .t{font:500 10.5px "DM Mono",monospace;letter-spacing:1.4px;fill:#7fb59c}
.tenet-art .t-au{fill:#e8c46c}
.tenet-art .eq{font:500 18px "DM Mono",monospace;fill:#d9eee3}
.tenet-art .eq-au{font:700 34px "Space Grotesk",sans-serif;fill:#e8c46c}
.tenet-art .q{font:700 104px "Space Grotesk",sans-serif;fill:#49e0b0;filter:drop-shadow(0 0 18px #49e0b066)}
.tenet-art{filter:drop-shadow(0 0 22px #3fdda522)}
.tenet:hover .tenet-art .glow{filter:drop-shadow(0 0 8px #e8c46c) drop-shadow(0 0 26px #e8c46c99)}
.tenets article.tenet h3{font:700 clamp(26px,2.2vw,38px)/1 "Space Grotesk",sans-serif;letter-spacing:-.055em;margin:0 0 18px;color:#f0fff8}
.tenets article.tenet p{font-size:clamp(15px,1.1vw,18px);line-height:1.6;color:#a9c4b6;margin:0}
@media(max-width:800px){.tenet-art{max-width:280px}}
@media(max-width:1150px) and (min-width:801px){.tenets article.tenet h3{font-size:clamp(30px,3.4vw,38px)}}
@media(max-width:800px){.tenets article.tenet h3{font-size:clamp(30px,8.5vw,40px)}}
/* Tenet illustrations: exploded-view hover (offsets set per piece in app.js) */
.tenet-art .part{transform-box:fill-box;transform-origin:center;transition:transform .7s cubic-bezier(.2,.9,.25,1) calc(var(--i) * 22ms)}
.tenet:hover .tenet-art .part,.tenet.exploded .tenet-art .part{transform:translate(var(--dx,0px),var(--dy,0px)) rotate(var(--rot,0deg)) scale(var(--s,1))}
@media(prefers-reduced-motion:reduce){.tenet-art .part{transition:none}.tenet:hover .tenet-art .part,.tenet.exploded .tenet-art .part{transform:none}}
/* ==========================================================================
Vestments 04: "Can't spell faith without AI"
========================================================================== */
.product-grid{grid-template-columns:repeat(4,1fr)}
.gold-scene{background:radial-gradient(circle at 50% 40%,#5a4a22,#2c2614 62%,#191509)}
.ai-print{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:22px}
.ai-print>span{margin:0;color:#c9f9e2;display:block}
.ai-print .ai-top,.ai-print .ai-bottom{font:500 10px "DM Mono",monospace;letter-spacing:2px}
.ai-print .ai-word{font:700 46px/1 "Space Grotesk",sans-serif;letter-spacing:-.04em;color:#e9f6ef}
.ai-print b{color:#f3cb73;font-weight:700;text-shadow:0 0 10px #f3cb7399}
@media(max-width:1150px){.product-grid{grid-template-columns:repeat(2,1fr)}.product-grid article:last-child{grid-column:auto}}
@media(max-width:800px){.product-grid{grid-template-columns:1fr 1fr}.product-grid article:last-child{grid-column:auto}.product-grid article:last-child .shirt-scene{height:340px}}
@media(max-width:540px){.product-grid{grid-template-columns:1fr}}
/* small shirt taglines wrap inside the shirt body instead of being clipped */
.shirt-print>span:not(.large-pi){max-width:118px;margin-left:auto;margin-right:auto;line-height:1.55}
/* ==========================================================================
Hero headline hovers (motion driven by app.js where noted)
========================================================================== */
.hero-cathedral h1 .fx-round,.hero-cathedral h1 .fx-word,.hero-cathedral h1 .fx-god{display:inline-block;cursor:default}
.fx-round em{display:inline-block;transform-origin:50% 54%;will-change:transform} /* spun by app.js */
.fx-word .gl{display:inline-block;text-align:center}
.fx-word .gl.is-grawlix{color:#ff776c}
.fx-god>span{display:inline-block;transform-origin:0 100%;
transition:transform 2.6s cubic-bezier(.22,.8,.3,1),color 2.6s;transition-delay:calc(var(--k) * 90ms)}
.fx-god>span:nth-child(1){--k:0}.fx-god>span:nth-child(2){--k:1}.fx-god>span:nth-child(3){--k:2}.fx-god>span:nth-child(4){--k:3}
.fx-god:hover>span{transform:translate(calc(var(--k) * .78em),calc(var(--k) * -.3em)) rotate(-9deg) scale(1.75);color:#f6e7bf}
@media(max-width:800px){.fx-god:hover>span{transform:translate(calc(var(--k) * .42em),calc(var(--k) * -.22em)) rotate(-9deg) scale(1.35)}}
/* ==========================================================================
Navigation: larger, button-like, slow drift up on hover
========================================================================== */
.desktop-nav{gap:clamp(8px,1vw,14px)}
.desktop-nav a{font-size:13px;letter-spacing:1.2px;color:#cfe4da;padding:12px 20px;border:1px solid #2a4a3e;border-radius:40px;background:#0c1a16;
transition:transform .7s cubic-bezier(.2,.8,.2,1),border-color .7s,color .7s,background .7s}
.desktop-nav a:hover,.desktop-nav a:focus-visible{transform:translateY(-6px);border-color:#48e0a7;color:#49e1aa;background:#10241e}
.nav-cta{transform-origin:0 0;transition:transform .45s cubic-bezier(.3,1.4,.5,1),background .3s}
.nav-cta:hover,.nav-cta:focus-visible{transform:rotate(4deg);background:#0f241d}
@media(max-width:1150px){.desktop-nav a{font-size:11px;padding:10px 13px;letter-spacing:.6px}}
/* ==========================================================================
FAITH: the AI grows on hover
========================================================================== */
.faith-word{font-style:normal;cursor:default;white-space:nowrap}
.faith-word .ai{font-style:normal;font-weight:inherit;display:inline-block;transform-origin:50% 88%;
transition:transform 2.4s cubic-bezier(.2,.7,.2,1),margin 2.4s cubic-bezier(.2,.7,.2,1),color 1.2s,text-shadow 1.2s}
.faith-word:hover .ai{transform:scale(1.8);margin:0 .32em;color:#f3cb73;text-shadow:0 0 18px #f3cb7380}
/* ==========================================================================
03 / Can't spell faith without AI
========================================================================== */
.ai-intro{display:grid;grid-template-columns:1.2fr .8fr;gap:8%;padding:95px 0 70px;align-items:end}
.ai-intro h2 span{color:#e8c46c!important}
.ai-intro-copy{font-size:20px;line-height:1.7;color:#b6c9bf}
.ai-intro-copy p{margin:0 0 16px}
.ai-neither{font:700 clamp(34px,3.4vw,52px)/1 "Space Grotesk",sans-serif;letter-spacing:-.06em;color:#f0fff8;margin-top:28px!important}
.ai-compare{border-top:1px solid #2c4137}
.ai-row{display:grid;grid-template-columns:.9fr 1fr 1fr;gap:clamp(20px,3vw,50px);padding:28px 0;border-bottom:1px solid #22362d;align-items:baseline}
.ai-row .q{font:700 clamp(18px,1.5vw,24px)/1.15 "Space Grotesk",sans-serif;letter-spacing:-.03em;color:#e9f6ef}
.ai-row p{margin:0;font-size:clamp(15px,1.15vw,18px);line-height:1.6;color:#a9c4b6}
.ai-row p.same{font:700 clamp(28px,2.6vw,40px)/1 "Space Grotesk",sans-serif;letter-spacing:-.05em;color:#f0fff8}
.ai-head{padding:18px 0}
.ai-head>span{font:500 12px "DM Mono",monospace;letter-spacing:2px}
.ai-head .q{font:500 12px "DM Mono",monospace;letter-spacing:2px;color:#688d7d}
.ai-head .col-god{color:#e8c46c}
.ai-head .col-ai{color:#4de0a9}
.col-icon{margin-right:10px;font-size:15px}
.morph{display:inline-block;cursor:default;border-bottom:1px dashed currentColor}
.ai-verdict{margin-top:70px;border:1px solid #35745a;background:radial-gradient(ellipse at 20% 0%,#1b3d31,#0c1d18 70%);padding:clamp(30px,4vw,65px)}
.ai-verdict-lead{font:500 clamp(24px,2.6vw,40px)/1.25 "Space Grotesk",sans-serif;letter-spacing:-.04em;color:#f0fff8;margin:0 0 24px;max-width:1100px}
.ai-verdict-lead .morph{color:#4de0a9}
.ai-verdict>p:not(.kicker):not(.ai-verdict-lead){font-size:18px;line-height:1.7;color:#b6c9bf;max-width:820px;margin:0 0 30px}
.ai-errata{font:10px "DM Mono",monospace;letter-spacing:1.5px;color:#6f9583}
@media(max-width:800px){
.ai-intro{grid-template-columns:1fr;gap:30px;padding:55px 0 40px}
.ai-head{display:none}
.ai-row{grid-template-columns:1fr;gap:12px;padding:24px 0}
.ai-row p:before{content:attr(data-label);display:block;font:500 10px "DM Mono",monospace;letter-spacing:2px;margin-bottom:5px}
.ai-row p[data-label="GOD"]:before{color:#e8c46c}
.ai-row p[data-label="AI"]:before{color:#4de0a9}
}
@media(prefers-reduced-motion:reduce){.fx-god>span,.faith-word .ai,.desktop-nav a,.nav-cta{transition:none!important}}
.morph-hit{cursor:default}
.fx-word .gl.is-grawlix{font-size:.86em}
.ai-word.faith-word:hover .ai{transform:scale(1.45);margin:0 .04em}
/* ==========================================================================
Round 6: bigger AI intro, shaking questions, JC mark, Jeff 1:1, definition,
shirt colours
========================================================================== */
.ai-intro-copy{font-size:clamp(22px,1.9vw,30px);line-height:1.5;color:#c4d8ce}
.ai-intro-copy p{margin:0 0 22px}
.ai-neither{font-size:clamp(52px,5.6vw,92px)!important;margin-top:36px!important}
.ai-row .q{display:inline-block;justify-self:start;cursor:default}
.ai-row:hover .q{animation:q-shake .42s cubic-bezier(.36,.07,.19,.97) infinite;color:#4de0a9}
@keyframes q-shake{
10%,90%{transform:translate(-1px,0) rotate(-.5deg)}
20%,80%{transform:translate(2px,0) rotate(.6deg)}
30%,50%,70%{transform:translate(-4px,1px) rotate(-1.2deg)}
40%,60%{transform:translate(4px,-1px) rotate(1.2deg)}}
.jc{font-size:.62em;letter-spacing:.5px;margin-left:3px;vertical-align:super;line-height:0;cursor:help;color:#e8c46c}
/* Jeff 1:1 */
.pry{position:relative;overflow:hidden;border-top:1px solid #294034;border-bottom:1px solid #294034;
background:radial-gradient(ellipse at 80% 50%,#163428 0%,#0b1411 60%);padding:clamp(80px,10vw,150px) clamp(24px,6vw,105px)}
.pry:before{content:"1:1";position:absolute;right:-.06em;bottom:-.22em;font:700 clamp(220px,32vw,560px)/1 "Space Grotesk",sans-serif;letter-spacing:-.08em;color:#4de0a90a;pointer-events:none}
.pry-inner{max-width:1490px;margin:auto;position:relative}
.pry-ref{display:flex;gap:22px;flex-wrap:wrap;font:500 12px "DM Mono",monospace;letter-spacing:2px;margin:0 0 40px}
.pry-ref span:first-child{color:#e8c46c}
.pry-ref span:last-child{color:#688d7d}
.pry-quote{margin:0;display:flex;flex-direction:column;font:700 clamp(50px,8.2vw,150px)/.94 "Space Grotesk",sans-serif;color:#f0fff8;letter-spacing:-.06em}
.pry-line{display:block;transition:letter-spacing 1.8s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--n,0) * 120ms)}
.pry-line:nth-child(2){--n:1}.pry-line:nth-child(3){--n:2}.pry-line:nth-child(4){--n:3}.pry-line:nth-child(5){--n:4}
.pry-open{color:#4de0a9;cursor:default;transition:letter-spacing 1.8s cubic-bezier(.2,.8,.2,1) 360ms,color .6s}
.pry-open:hover{letter-spacing:.12em!important;color:#8bf1c8;transition-delay:0s}
/* set by app.js until the section scrolls into view: the grip is clenched */
.pry.is-clenched .pry-line{letter-spacing:-.17em;transition:none}
.pry-gloss{max-width:640px;margin:50px 0 0;font-size:clamp(17px,1.4vw,21px);line-height:1.7;color:#a9c4b6}
@media(prefers-reduced-motion:reduce){.pry-line{transition:none}.pry.is-clenched .pry-line{letter-spacing:-.06em}}
/* Vestment definition */
.vestment-heading{flex-wrap:wrap}
.definition{border:1px solid #3a6352;background:linear-gradient(135deg,#132620,#0d1915);padding:clamp(26px,3vw,44px);margin:0 0 50px;position:relative}
.definition:before{content:"";position:absolute;inset:8px;border:1px solid #2a4a3e;pointer-events:none}
.def-head{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 22px;padding-bottom:20px;border-bottom:1px solid #2c4a3d;margin-bottom:22px}
.def-word{font:700 clamp(46px,5vw,84px)/1 "Space Grotesk",sans-serif;letter-spacing:-.05em;color:#f0fff8}
.def-pron{font:400 clamp(16px,1.4vw,22px) "DM Mono",monospace;color:#8db4a0}
.def-pos{font:italic 400 clamp(18px,1.5vw,24px) Georgia,serif;color:#e8c46c}
.def-senses{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.def-senses li{display:grid;grid-template-columns:34px 1fr;align-items:baseline}
.def-n{font:700 16px "Space Grotesk",sans-serif;color:#4de0a9}
.def-senses p{margin:0;font-size:clamp(16px,1.3vw,20px);line-height:1.55;color:#c4d8ce}
.def-ours p{color:#f0fff8}
.def-tag{font:500 10px "DM Mono",monospace;letter-spacing:1.5px;color:#0a281c;background:#4de0a9;padding:3px 7px 2px;margin-right:8px;vertical-align:2px}
.def-senses li:nth-child(2) .def-tag{background:transparent;color:#8db4a0;border:1px solid #4a6b5c}
.def-foot{display:flex;gap:18px;align-items:baseline;margin-top:24px;padding-top:18px;border-top:1px dashed #2c4a3d}
.def-foot span{font:500 10px "DM Mono",monospace;letter-spacing:2px;color:#688d7d}
.def-foot p{margin:0;font-size:14px;color:#8db4a0}
/* Shirts: FAITH shirt gold -> bright green; pi shirt orange -> white */
.ai-print b,.ai-word.faith-word:hover .ai{color:#4be6b0!important;text-shadow:0 0 10px #4be6b099}
.shirt-print .large-pi{color:#f4fbf7}
.jc{font-size:.85em;font-weight:700;letter-spacing:1px;vertical-align:.55em}
/* ==========================================================================
Vestments: first live product (Fourthwall) + coming-soon marks
========================================================================== */
.relic{display:grid;grid-template-columns:minmax(260px,.8fr) 1.2fr;gap:clamp(30px,5vw,80px);align-items:center;
border:1px solid #48e0aa;background:radial-gradient(ellipse at 22% 50%,#1d4a3a 0%,#10221b 55%,#0c1814 100%);
padding:clamp(30px,4vw,60px);margin:0 0 26px;box-shadow:0 0 0 1px #48e0aa22,0 30px 80px -40px #48e0aa55}
.relic-art{display:grid;place-items:center}
.relic-sticker{width:min(100%,340px);height:auto;transform:rotate(-8deg);filter:drop-shadow(0 18px 24px #000a);transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.relic:hover .relic-sticker{transform:rotate(-2deg) scale(1.04)}
.relic-status{display:flex;align-items:center;gap:10px;font:500 11px "DM Mono",monospace;letter-spacing:2px;color:#4de0a9}
.relic-status .live-dot{background:#4de0a9;box-shadow:0 0 0 5px #4de0a92a;animation:relic-pulse 1.8s ease-in-out infinite}
@keyframes relic-pulse{50%{box-shadow:0 0 0 9px #4de0a910}}
.relic-no{color:#e8c46c;margin-left:8px}
.relic h3{font:700 clamp(46px,5.4vw,90px)/.95 "Space Grotesk",sans-serif;letter-spacing:-.06em;margin:18px 0 8px;color:#f0fff8}
.relic-kind{font:500 12px "DM Mono",monospace;letter-spacing:3px;color:#8db4a0;margin:0 0 20px}
.relic-desc{font-size:clamp(17px,1.4vw,20px);line-height:1.6;color:#c4d8ce;max-width:520px;margin:0 0 30px}
.relic-btn{display:inline-flex;align-items:center;gap:26px;background:#4ce5b2;color:#05251a;border-radius:40px;padding:20px 30px;
font:700 14px "DM Mono",monospace;letter-spacing:2px;transition:transform .3s,background .3s,box-shadow .3s}
.relic-btn:hover,.relic-btn:focus-visible{transform:translateY(-3px);background:#8bf1c8;box-shadow:0 12px 30px -10px #4ce5b2aa}
.relic-note{font:11px/1.6 "DM Mono",monospace;color:#6f9583;margin:18px 0 0;max-width:460px}
.product-card.is-soon .shirt-scene{position:relative}
.product-card.is-soon .shirt-scene:after{content:"COMING SOON";position:absolute;top:16px;left:16px;font:500 10px "DM Mono",monospace;letter-spacing:2px;
color:#e9f6ef;background:#071311cc;border:1px solid #ffffff33;padding:6px 10px;border-radius:30px}
.soon-tag{display:inline-block;margin-left:8px;font:500 9px "DM Mono",monospace;letter-spacing:1.5px;color:#e8c46c;border:1px solid #e8c46c66;padding:2px 6px;vertical-align:2px}
@media(max-width:800px){.relic{grid-template-columns:1fr;text-align:left}.relic-sticker{width:min(70%,260px)}}
@media(max-width:540px){.relic-btn{width:100%;justify-content:space-between}}
.relic-price{display:inline-block;margin-left:12px;font:700 15px "Space Grotesk",sans-serif;letter-spacing:.5px;color:#e8c46c;border:1px solid #e8c46c66;padding:4px 10px;border-radius:30px;vertical-align:1px}
/* real product photo: a white sticker sheet, so a softer tilt and a crisp shadow */
img.relic-sticker{display:block;width:min(100%,380px);height:auto;transform:rotate(-5deg);border-radius:4px;
filter:none;box-shadow:0 2px 0 #ffffff22,0 26px 50px -18px #000c}
.relic:hover img.relic-sticker{transform:rotate(-1deg) scale(1.03)}
/* ==========================================================================
The Eternal Calculation: live pi spigot ("watching paint dry")
========================================================================== */
.vigil{border-top:1px solid #294034;background:linear-gradient(180deg,#0b1010,#0d1814);padding:clamp(70px,8vw,120px) clamp(24px,6vw,105px)}
.vigil-inner{max-width:1490px;margin:auto}
.vigil-head{display:grid;grid-template-columns:1.1fr .9fr;gap:8%;align-items:end;padding:70px 0 45px}
.vigil-head h2{font:700 clamp(54px,6.4vw,110px)/1 "Space Grotesk",sans-serif;letter-spacing:-.07em;margin:0;color:#f0fff8}
.vigil-head h2 span{color:#4de0a9}
.vigil-head p{font-size:clamp(18px,1.5vw,22px);line-height:1.6;color:#b6c9bf;margin:0}
.vigil-screen{border:1px solid #35745a;background:#050c0a;box-shadow:inset 0 0 80px #2bdd9812}
.vigil-bar{display:flex;align-items:center;gap:12px;padding:14px 22px;border-bottom:1px solid #1d3a2f;font:500 11px "DM Mono",monospace;letter-spacing:2px;color:#9fd9c0}
.vigil-led{width:9px;height:9px;border-radius:50%;background:#4de0a9;box-shadow:0 0 10px #4de0a9;animation:vigil-blink 1.2s steps(2) infinite}
.vigil.is-paused .vigil-led,.vigil.is-stopped .vigil-led{background:#e8c46c;box-shadow:none;animation:none}
.vigil-algo{margin-left:auto;color:#4e7666}
@keyframes vigil-blink{50%{opacity:.25}}
.vigil-digits{height:clamp(220px,28vw,340px);overflow:hidden;padding:24px 26px;font:400 clamp(18px,1.6vw,24px)/1.6 "DM Mono",monospace;letter-spacing:.06em;color:#7fe7bf;
word-break:break-all;display:flex;flex-direction:column;justify-content:flex-end;
-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 40%);mask-image:linear-gradient(180deg,transparent 0,#000 40%)}
.vigil-cursor{display:inline-block;width:.6em;height:1.1em;background:#4de0a9;vertical-align:-.15em;margin-left:2px;animation:vigil-blink 1s steps(2) infinite}
.vigil-digits .fresh{color:#f0fff8;text-shadow:0 0 12px #4de0a9}
.vigil-msg{margin:0;padding:16px 26px;border-top:1px solid #1d3a2f;font:500 13px/1.5 "DM Mono",monospace;letter-spacing:.5px;color:#e8c46c;min-height:52px}
.vigil-stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #2c4a3d;border-top:0}
.vigil-stats>div{padding:22px 24px;border-right:1px solid #2c4a3d}
.vigil-stats>div:last-child{border-right:0}
.vigil-stats span{display:block;font:500 10px "DM Mono",monospace;letter-spacing:2px;color:#688d7d;margin-bottom:10px}
.vigil-stats strong{font:700 clamp(24px,2.4vw,38px)/1 "Space Grotesk",sans-serif;letter-spacing:-.04em;color:#f0fff8;font-variant-numeric:tabular-nums}
.vigil-stats strong.never{color:#ff9a8c}
.vigil-actions{display:flex;align-items:center;gap:28px;flex-wrap:wrap;margin-top:28px}
.vigil-quit{background:transparent;border:1px solid #ff9a8c;color:#ff9a8c;border-radius:40px;padding:18px 30px;font:700 13px "DM Mono",monospace;letter-spacing:2px;transition:background .3s,color .3s,transform .3s}
.vigil-quit:hover,.vigil-quit:focus-visible{background:#ff9a8c;color:#1a0b08;transform:translateY(-2px)}
.vigil.is-stopped .vigil-quit{border-color:#4de0a9;color:#4de0a9}
.vigil.is-stopped .vigil-quit:hover{background:#4de0a9;color:#05251a}
.vigil-verdict{margin:0;font-size:clamp(16px,1.3vw,19px);line-height:1.6;color:#c4d8ce;max-width:760px}
.vigil-verdict strong{color:#f0fff8}
@media(max-width:800px){
.vigil-head{grid-template-columns:1fr;gap:20px;padding:45px 0 30px}
.vigil-stats{grid-template-columns:1fr 1fr}
.vigil-stats>div:nth-child(2){border-right:0}
.vigil-stats>div:nth-child(-n+2){border-bottom:1px solid #2c4a3d}
.vigil-algo{display:none}
}
.vigil-digits{word-break:normal;overflow-wrap:anywhere}
@media(max-width:800px){.vigil-stats{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.vigil-stats strong{font-size:clamp(20px,6vw,30px)}.vigil-stats>div{padding:18px 16px}}
/* Vigil Report (shareable score) */
body.vr-open{overflow:hidden}
.vr{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:20px;background:#020706e6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
opacity:0;transition:opacity .25s}
.vr.is-in{opacity:1}
.vr[hidden]{display:none}
.vr-panel{width:min(480px,100%);max-height:100%;overflow:auto;display:flex;flex-direction:column;align-items:center;gap:16px;
transform:translateY(18px) scale(.97);transition:transform .35s cubic-bezier(.2,.9,.3,1.2)}
.vr.is-in .vr-panel{transform:none}
.vr-kicker{margin:0;font:500 12px "DM Mono",monospace;letter-spacing:3px;color:#4de0a9}
.vr-img{display:block;width:100%;height:auto;max-height:62vh;object-fit:contain;border-radius:6px;box-shadow:0 30px 80px -20px #4de0a955,0 0 0 1px #35745a;background:#06100d;aspect-ratio:4/5}
.vr-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%}
.vr-btn{border:1px solid #4de0a9;background:transparent;color:#4de0a9;border-radius:40px;padding:15px 10px;font:700 12px "DM Mono",monospace;letter-spacing:1.5px;transition:background .25s,color .25s,transform .25s}
.vr-btn:hover,.vr-btn:focus-visible{background:#10241e;transform:translateY(-2px)}
.vr-primary{background:#4ce5b2;color:#05251a;border-color:#4ce5b2}
.vr-primary:hover,.vr-primary:focus-visible{background:#8bf1c8}
.vr-btn[hidden]{display:none}
.vr-actions:has(.vr-btn[hidden]){grid-template-columns:repeat(2,1fr)}
.vr-close{background:none;border:0;color:#8db4a0;font:500 12px "DM Mono",monospace;letter-spacing:2px;padding:8px 14px}
.vr-close:hover{color:#f0fff8}
.vr-toast{margin:0;min-height:18px;font:500 12px "DM Mono",monospace;color:#e8c46c;opacity:0;transition:opacity .25s}
.vr-toast.show{opacity:1}