
:root{--ink:#080b08;--deep:#0b1a0d;--green:#5df62f;--green2:#0f8e38;--gold:#d9aa47;--gold2:#f5d987;--red:#69151b;--purple:#842cc9;--parch:#ead7a8;--muted:#d4c38e;--line:rgba(217,170,71,.42);--shadow:0 22px 60px rgba(0,0,0,.55)}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background-color:#030503;color:#f5e7bc;font-family:Georgia,'Times New Roman',serif;line-height:1.55;background-image:radial-gradient(circle at 50% -10%,rgba(61,255,58,.16),transparent 26rem),radial-gradient(circle at 90% 18%,rgba(132,44,201,.10),transparent 24rem),linear-gradient(180deg,rgba(2,3,2,.84),rgba(8,16,6,.86) 34%,rgba(3,5,3,.9) 100%),url('../images/victorian-gothic-wallpaper-tile.png');background-size:auto,auto,auto,540px 540px;background-repeat:no-repeat,no-repeat,no-repeat,repeat;background-position:center top,center top,center top,left top;overflow-x:hidden} body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 12% 18%,rgba(255,255,255,.05),transparent 10rem),radial-gradient(circle at 88% 28%,rgba(77,255,39,.08),transparent 14rem),linear-gradient(rgba(0,0,0,.18),rgba(0,0,0,.64));pointer-events:none;z-index:-1}.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;z-index:20;background:var(--gold);color:#111;padding:.5rem}.wrap{width:min(1180px,92vw);margin:auto}.site-header{position:sticky;top:0;z-index:15;background:linear-gradient(180deg,#060805,#030403);border-bottom:1px solid var(--line);box-shadow:0 8px 25px rgba(0,0,0,.45)}.nav{min-height:76px;display:flex;align-items:center;gap:1rem}.brand{display:flex;align-items:center;gap:.75rem;color:#fff;text-decoration:none;font-weight:800;letter-spacing:.04em}.brand img{width:150px;max-height:58px;object-fit:contain;filter:drop-shadow(0 0 12px rgba(72,255,46,.45))}.nav-links{margin-left:auto;display:flex;gap:.3rem;align-items:center}.nav-links a,.buy-mini{color:#f0d482;text-decoration:none;text-transform:uppercase;font-size:.75rem;letter-spacing:.08em;padding:.55rem .75rem;border:1px solid transparent}.nav-links a:hover,.nav-links a.active{border-color:var(--line);background:rgba(217,170,71,.08);color:white}.buy-mini{background:linear-gradient(180deg,#6d161a,#34100e);border-color:var(--gold);border-radius:3px}.menu-toggle{display:none;margin-left:auto;background:#111;color:#f0d482;border:1px solid var(--line);padding:.6rem .8rem}.hero{position:relative;min-height:720px;display:grid;align-items:center;overflow:hidden;border-bottom:1px solid var(--line)}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,5,2,.96) 0%,rgba(4,8,4,.86) 41%,rgba(4,8,4,.35) 100%),url('../images/room-overhead-1.png') center right/880px auto no-repeat;transform:perspective(1200px);filter:saturate(1.05)}.hero:after{content:"";position:absolute;right:-90px;top:92px;width:510px;height:520px;background:url('../images/character-group.png') center/contain no-repeat;filter:drop-shadow(0 0 35px rgba(255,233,39,.4));opacity:.96}.hero-inner{position:relative;z-index:1;padding:6rem 0 4rem;width:min(780px,88vw)}.hero-logo{width:min(510px,82vw);filter:drop-shadow(0 0 30px rgba(78,255,32,.55));margin-bottom:1.2rem}.eyebrow{color:var(--gold2);text-transform:uppercase;letter-spacing:.18em;font-size:.8rem}.hero h1,.page-hero h1{font-size:clamp(2.5rem,7vw,5.8rem);line-height:.92;margin:.5rem 0;color:#f3d58a;text-shadow:0 0 25px rgba(217,170,71,.25)}.hero p{font-size:clamp(1.08rem,2vw,1.45rem);max-width:640px;color:#f3e4bd}.btn{display:inline-flex;align-items:center;gap:.45rem;justify-content:center;text-decoration:none;color:#fff;background:linear-gradient(180deg,#1a742d,#073f18);border:1px solid var(--gold);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 12px 25px rgba(0,0,0,.28);padding:.9rem 1.08rem;border-radius:3px;text-transform:uppercase;letter-spacing:.08em;font-weight:800;font-size:.82rem}.btn:hover{transform:translateY(-1px);filter:brightness(1.12)}.btn.red{background:linear-gradient(180deg,#75161c,#3b0c0f)}.btn.purple{background:linear-gradient(180deg,#5b248b,#24103f)}.btn.ghost{background:rgba(2,4,2,.45)}.cta-row{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.6rem}.tube{height:55px;margin:-27px auto 0;position:relative;z-index:3;width:min(760px,80vw);background:url('../images/green-light.gif') center/contain no-repeat}.section{position:relative;padding:5rem 0;border-top:1px solid rgba(217,170,71,.16)}.section:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 13% 30%,rgba(48,255,31,.08),transparent 22rem),radial-gradient(circle at 83% 60%,rgba(217,170,71,.08),transparent 24rem);pointer-events:none}.section.dark{background:rgba(0,0,0,.3)}.section-title{text-align:center;margin:0 0 1.8rem}.section-title .kicker{color:var(--gold2);letter-spacing:.18em;text-transform:uppercase;font-size:.78rem}.section-title h2{font-size:clamp(2rem,4vw,3.25rem);line-height:1;margin:.35rem 0;color:#f4d182}.section-title p{max-width:760px;margin:.7rem auto;color:#dfd0a7}.grid{display:grid;gap:1.15rem}.grid.two{grid-template-columns:repeat(2,1fr)}.grid.three{grid-template-columns:repeat(3,1fr)}.grid.four{grid-template-columns:repeat(4,1fr)}.card{position:relative;background:linear-gradient(180deg,rgba(14,23,13,.92),rgba(5,8,5,.96));border:1px solid var(--line);box-shadow:var(--shadow);padding:1.25rem;overflow:hidden}.card:before{content:"";position:absolute;inset:5px;border:1px solid rgba(217,170,71,.17);pointer-events:none}.card h3{margin:.5rem 0 .4rem;color:#f7d582;font-size:1.45rem;line-height:1.05}.card p{color:#d8ca9f}.card img{width:100%;height:220px;object-fit:cover;border:1px solid rgba(217,170,71,.35);background:#060806}.feature-card{text-align:center}.feature-card img{height:138px;object-fit:contain;border:0;filter:drop-shadow(0 0 18px rgba(69,255,34,.2))}.feature-card:nth-child(2) h3{color:#d161ff}.feature-card:nth-child(3) h3{color:#ff6464}.feature-card:nth-child(4) h3{color:#f3d15f}.split{display:grid;grid-template-columns:1.05fr .95fr;gap:2rem;align-items:center}.parchment{background:linear-gradient(135deg,#d9c090,#f1dfb0 55%,#c6a26c);color:#21170a;border:2px solid #6e4b1b;box-shadow:var(--shadow);padding:2rem;position:relative}.parchment h2,.parchment h3{color:#321b0c}.ornate-frame{border:1px solid var(--line);padding:.5rem;background:#050805;box-shadow:var(--shadow);position:relative}.ornate-frame img{width:100%;display:block}.room-window{aspect-ratio:1/1;border:1px solid var(--line);background:url('../images/room-overhead-5.png') center/cover no-repeat;box-shadow:0 0 0 8px rgba(8,4,0,.52),var(--shadow);transform:rotate(-2deg);position:relative}.room-window:after{content:"";position:absolute;inset:-28px;background:radial-gradient(circle,transparent 56%,rgba(0,0,0,.75) 74%);pointer-events:none}.expansion-card img{height:150px;object-fit:contain;background:#050505}.product-panel{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;align-items:center}.price-card{background:linear-gradient(180deg,#130b07,#050503);border:1px solid var(--gold);padding:1.4rem;text-align:center}.price{font-size:3rem;color:#f3d15f;line-height:1;margin:.2rem 0}.download-list{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.download{display:flex;flex-direction:column;gap:.7rem}.download img{height:260px;object-fit:cover;object-position:top}.form-panel{display:grid;grid-template-columns:.8fr 1.2fr;gap:1.5rem;align-items:center}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}.form-grid .full{grid-column:1/-1}input,select,textarea{width:100%;padding:.95rem;background:#090d08;border:1px solid rgba(217,170,71,.42);color:#f7e5b8;font-family:inherit}textarea{min-height:130px}.footer{background:#020302;border-top:1px solid var(--line);padding:3rem 0 1rem;color:#d8c99d}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:1.4rem}.footer h3{color:#f0ce75}.footer a{color:#f2d581}.tiny{font-size:.85rem;color:#c8b886}.subfooter{border-top:1px solid rgba(217,170,71,.18);padding-top:1rem;margin-top:2rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}.page-hero{padding:6rem 0 4rem;background:linear-gradient(90deg,rgba(0,0,0,.92),rgba(0,0,0,.72)),url('../images/library-room-3d.png') center/cover;border-bottom:1px solid var(--line)}.page-hero p{max-width:740px;font-size:1.2rem;color:#e5d3a5}.table{width:100%;border-collapse:collapse;background:rgba(0,0,0,.35)}.table th,.table td{border:1px solid rgba(217,170,71,.22);padding:.8rem;text-align:left}.table th{color:#f4d182}.video-embed{aspect-ratio:16/9;background:#080908;border:1px solid var(--line);display:grid;place-items:center;color:#f2d581}.gallery{columns:3 260px;column-gap:1rem}.gallery img{width:100%;margin:0 0 1rem;border:1px solid var(--line);break-inside:avoid;cursor:pointer}.notice{border-left:4px solid var(--green);background:rgba(62,255,44,.08);padding:1rem;color:#e7d8ae}.badge-row{display:flex;gap:.6rem;flex-wrap:wrap}.badge{border:1px solid var(--line);padding:.4rem .65rem;background:rgba(217,170,71,.07);color:#f4d182;font-size:.85rem}.door-divider{height:145px;background:linear-gradient(90deg,transparent,rgba(0,0,0,.82),transparent),url('../images/room-overhead-4.png') center/cover;border-block:1px solid var(--line);position:relative}.door-divider img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);height:64px;filter:drop-shadow(0 0 20px rgba(77,255,32,.55))}@media (max-width:950px){.nav-links{display:none;position:absolute;top:76px;left:0;right:0;flex-direction:column;background:#020302;padding:1rem;border-bottom:1px solid var(--line)}.nav-links.open{display:flex}.menu-toggle{display:block}.hero{min-height:auto}.hero:after{opacity:.35;right:-190px}.grid.four,.grid.three,.grid.two,.split,.product-panel,.form-panel,.footer-grid,.download-list{grid-template-columns:1fr}.download img{height:auto}.form-grid{grid-template-columns:1fr}.card img{height:auto}.hero-inner{padding-top:4rem}.nav{min-height:70px}.brand img{width:115px}}


/* ==========================================================
   v1.2 immersive homepage layer — bringing the creative mockup
   into real HTML/CSS rather than using it as a flat image.
   ========================================================== */
:root{
  --black:#020403; --near:#070a06; --emerald:#49ef31; --emerald-dark:#0b5d26;
  --antique:#d6a348; --antique-2:#f2d58b; --oxblood:#711018; --violet:#8a3bd6;
  --ghost:#dfffd7; --panel:rgba(5,8,5,.82);
}
body.immersive-home{
  background:
    radial-gradient(circle at 22% 8%, rgba(78,255,48,.16), transparent 24rem),
    radial-gradient(circle at 76% 20%, rgba(138,59,214,.12), transparent 26rem),
    linear-gradient(180deg,#020403 0%,#061006 42%,#020403 100%);
}
body.immersive-home::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.32;background-image:radial-gradient(circle at 50% 8%,rgba(49,255,28,.24),transparent 17rem),repeating-linear-gradient(90deg,rgba(214,163,72,.05) 0 1px,transparent 1px 14px);mix-blend-mode:screen}.theatre-header{background:linear-gradient(180deg,#050604,#010201);border-bottom:1px solid rgba(214,163,72,.55)}.theatre-header::before,.theatre-header::after{content:"";position:absolute;top:9px;width:72px;height:42px;border-top:1px solid rgba(214,163,72,.7);border-bottom:1px solid rgba(214,163,72,.45);opacity:.55}.theatre-header::before{left:10px;border-left:1px solid rgba(214,163,72,.45);border-radius:18px 0 0 0}.theatre-header::after{right:10px;border-right:1px solid rgba(214,163,72,.45);border-radius:0 18px 0 0}.nav-links a{position:relative}.nav-links a.active::after{content:"";position:absolute;left:50%;bottom:.15rem;transform:translateX(-50%);width:18px;height:2px;background:var(--emerald);box-shadow:0 0 10px var(--emerald)}
.hero-stage{min-height:760px;position:relative;overflow:hidden;isolation:isolate;border-bottom:1px solid rgba(214,163,72,.35);background:#020403}.hero-stage::before{content:"";position:absolute;inset:0;z-index:-4;background:linear-gradient(90deg,rgba(0,0,0,.97) 0%,rgba(2,5,3,.86) 49%,rgba(2,5,3,.55) 100%),url('../images/library-room-3d.png') center/cover no-repeat;filter:saturate(1.1) brightness(.55)}.hero-stage::after{content:"";position:absolute;inset:0;z-index:-3;background:radial-gradient(circle at 38% 42%,rgba(70,255,40,.18),transparent 21rem),radial-gradient(circle at 96% 36%,rgba(72,255,53,.22),transparent 18rem),linear-gradient(180deg,transparent 0%,rgba(0,0,0,.52) 100%)}.hero-stage-grid{display:grid;grid-template-columns:minmax(330px,.9fr) minmax(420px,1.05fr);gap:3rem;align-items:center;min-height:760px;padding:5.5rem 0 5rem}.hero-copy{position:relative;z-index:3}.hero-copy .hero-logo{width:min(520px,90%);filter:drop-shadow(0 0 14px rgba(64,255,35,.9)) drop-shadow(0 0 38px rgba(64,255,35,.32))}.hero-copy h1{font-size:clamp(3.2rem,7vw,6.25rem);line-height:.9;margin:.2rem 0 .6rem;color:#f6d98a;letter-spacing:.02em;text-shadow:0 0 24px rgba(214,163,72,.24)}.hero-copy .lead{font-size:clamp(1.35rem,2.1vw,1.8rem);line-height:1.25;color:#f4deb0;max-width:620px}.hero-copy p:not(.lead){font-size:1.1rem;color:#d9c696;max-width:650px}.hero-ctas .btn{min-width:170px}.rules-pills{display:flex;flex-wrap:wrap;gap:.55rem;align-items:center;margin-top:1.05rem;color:#cbb678;text-transform:uppercase;letter-spacing:.12em;font-size:.72rem}.rules-pills a{color:#f7e2a3;text-decoration:none;border:1px solid rgba(214,163,72,.42);background:rgba(0,0,0,.4);padding:.35rem .6rem;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)}.gaslamp{position:absolute;width:98px;height:250px;z-index:2;background:radial-gradient(circle at 50% 42%,rgba(86,255,59,.85),rgba(86,255,59,.18) 24%,transparent 44%),linear-gradient(90deg,transparent 14%,rgba(214,163,72,.72) 15% 19%,transparent 20% 80%,rgba(214,163,72,.72) 81% 85%,transparent 86%),linear-gradient(180deg,transparent 0 9%,rgba(214,163,72,.65) 10% 13%,transparent 14% 86%,rgba(214,163,72,.65) 87% 90%,transparent 91%);border:1px solid rgba(214,163,72,.45);border-radius:50px;filter:drop-shadow(0 0 26px rgba(60,255,45,.45));opacity:.72}.gaslamp-left{left:2.2vw;top:130px}.green-fog{position:absolute;z-index:-1;filter:blur(18px);opacity:.45;border-radius:50%;background:radial-gradient(circle,rgba(71,255,46,.55),transparent 68%);animation:fog-drift 10s ease-in-out infinite alternate}.fog-a{right:9%;top:30%;width:330px;height:430px}.fog-b{left:9%;bottom:6%;width:280px;height:260px;animation-delay:-4s}@keyframes fog-drift{from{transform:translateY(-12px) translateX(-5px) scale(.98)}to{transform:translateY(16px) translateX(14px) scale(1.06)}}
.hero-room{position:relative;min-height:560px;perspective:1300px}.room-frame{position:absolute;right:78px;top:16px;width:min(520px,72vw);aspect-ratio:1/1;transform:rotate(8deg) rotateX(8deg) rotateY(-13deg);background:#040402;padding:14px;border:2px solid rgba(214,163,72,.65);box-shadow:0 30px 80px rgba(0,0,0,.75),0 0 45px rgba(54,255,35,.18),inset 0 0 0 8px rgba(214,163,72,.12)}.room-frame::before{content:"";position:absolute;inset:-18px;border:1px solid rgba(214,163,72,.28);background:linear-gradient(135deg,rgba(214,163,72,.08),transparent 35%,rgba(214,163,72,.08));box-shadow:inset 0 0 90px rgba(0,0,0,.85);pointer-events:none}.room-frame img{width:100%;height:100%;object-fit:cover;filter:saturate(.92) contrast(1.04) brightness(.78);display:block}.room-glow{position:absolute;width:80px;height:80px;border-radius:50%;background:radial-gradient(circle,#fff6a2 0 8%,#f6e72e 9% 22%,rgba(246,231,46,.18) 42%,transparent 70%);filter:blur(.2px);mix-blend-mode:screen;opacity:.7}.room-glow.one{right:20%;bottom:18%}.room-glow.two{left:18%;top:18%}.red-door{position:absolute;right:-8px;top:64px;width:150px;height:410px;background:linear-gradient(120deg,#a32028,#5d1116 55%,#260509);border:4px solid #40070a;box-shadow:0 16px 55px rgba(0,0,0,.75),0 0 40px rgba(69,255,35,.2);transform:rotateY(-24deg) rotateZ(4deg);transform-origin:left center}.red-door::before{content:"";position:absolute;inset:22px 20px;border:2px solid rgba(255,218,110,.16);box-shadow:inset 0 0 18px rgba(0,0,0,.55)}.red-door span{position:absolute;left:18px;top:48%;width:20px;height:20px;border-radius:50%;background:radial-gradient(circle,#ffe077,#a16715);box-shadow:0 0 12px rgba(255,217,81,.6)}.expansion-note{position:absolute;right:50px;bottom:16px;width:230px;padding:1rem;background:linear-gradient(180deg,rgba(13,18,10,.96),rgba(4,5,4,.96));border:1px solid rgba(214,163,72,.58);box-shadow:0 18px 45px rgba(0,0,0,.55);color:#f0d58a;text-align:center}.expansion-note::before{content:"";position:absolute;inset:5px;border:1px solid rgba(214,163,72,.18);pointer-events:none}.expansion-note strong{display:block;text-transform:uppercase;letter-spacing:.09em;font-size:1.05rem}.expansion-note span{display:block;color:#d2bd86;font-size:.86rem;margin:.25rem 0 .65rem}.expansion-note a{color:#fff;text-decoration:none;text-transform:uppercase;font-size:.72rem;border:1px solid rgba(214,163,72,.5);padding:.4rem .55rem;display:inline-block;background:#38145c}.tube-divider{height:58px;margin:-29px auto 0;position:relative;z-index:7;text-align:center}.tube-divider img{height:100%;max-width:min(640px,76vw);filter:drop-shadow(0 0 22px rgba(77,255,39,.55))}.section-title.compact{max-width:840px;margin-left:auto;margin-right:auto}.portal-cards{align-items:stretch}.portal-card{position:relative;min-height:520px;padding:1rem;border:1px solid rgba(214,163,72,.55);background:linear-gradient(180deg,rgba(8,14,8,.94),rgba(2,4,2,.98));box-shadow:0 22px 55px rgba(0,0,0,.56);display:flex;flex-direction:column;text-align:left;overflow:hidden}.portal-card::before{content:"";position:absolute;inset:6px;border:1px solid rgba(214,163,72,.18);pointer-events:none}.portal-card::after{content:"";position:absolute;left:50%;top:-32px;transform:translateX(-50%);width:36px;height:110px;border:1px solid rgba(214,163,72,.5);border-radius:20px;background:radial-gradient(circle at 50% 50%,rgba(72,255,38,.75),rgba(72,255,38,.08) 34%,transparent 66%)}.portal-image{height:210px;margin:-.1rem -.1rem 1rem;border:1px solid rgba(214,163,72,.3);background:#050705;overflow:hidden}.portal-image img{width:100%;height:100%;object-fit:cover;display:block;transition:.35s ease}.portal-card:hover .portal-image img{transform:scale(1.05)}.portal-card h3{font-size:1.55rem;line-height:1.04;text-transform:uppercase;letter-spacing:.03em;margin:.2rem 0 .55rem;color:var(--emerald)}.portal-card p{color:#d8c89b;flex:1}.portal-card small{display:block;margin-top:.85rem;color:#bda972;text-transform:uppercase;letter-spacing:.1em;font-size:.68rem}.purple-card h3{color:#d76aff}.red-card h3{color:#ff555f}.product-stage{display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:center}.product-copy h2{font-size:clamp(2.3rem,4vw,4rem);line-height:.95;color:#f4d182}.product-copy p{font-size:1.12rem;color:#dccda0}.product-art{transform:rotate(-1.5deg)}.expansions-theatre{background:linear-gradient(180deg,rgba(5,15,6,.6),rgba(0,0,0,.1))}.expansion-portals{align-items:stretch}.expansion-portal{position:relative;text-align:center;padding:1.25rem;min-height:330px;background:radial-gradient(circle at 50% 14%,rgba(133,46,201,.16),transparent 10rem),linear-gradient(180deg,rgba(10,8,10,.95),rgba(4,5,4,.98));border:1px solid rgba(214,163,72,.5);box-shadow:0 18px 45px rgba(0,0,0,.52);overflow:hidden}.expansion-portal::before{content:"";position:absolute;inset:7px;border:1px solid rgba(214,163,72,.17);pointer-events:none}.expansion-portal img{width:85%;max-height:138px;object-fit:contain;margin:.5rem auto 1rem;filter:drop-shadow(0 0 18px rgba(132,44,201,.42))}.expansion-portal h3{color:#f2d58b;font-size:1.5rem}.expansion-portal p{color:#d8c89b}.center-actions{text-align:center;margin-top:1.4rem}.lore-frame{display:grid;grid-template-columns:130px 1.4fr 1fr 130px;gap:1rem;align-items:center;border:1px solid rgba(214,163,72,.45);padding:1rem;background:linear-gradient(90deg,rgba(9,11,7,.9),rgba(18,13,8,.8),rgba(9,11,7,.9));box-shadow:0 25px 60px rgba(0,0,0,.5)}.portrait{aspect-ratio:1/1.25;border-radius:50%;border:2px solid rgba(214,163,72,.55);background:linear-gradient(180deg,#21170f,#050403);box-shadow:inset 0 0 25px rgba(0,0,0,.8),0 0 25px rgba(214,163,72,.14)}.portrait-left::before,.portrait-right::before{content:"";display:block;width:58%;height:72%;margin:18% auto;border-radius:45%;background:linear-gradient(180deg,rgba(242,213,139,.25),rgba(0,0,0,.4))}.parchment-mini{background:linear-gradient(135deg,#c4a46f,#efdcb0 55%,#b9905d);color:#1f160b;padding:1.25rem;border:1px solid #6e4b1b}.parchment-mini h2{margin:0 0 .4rem;color:#2d1b0c}.mansion-window{height:210px;border:1px solid rgba(214,163,72,.38);overflow:hidden}.mansion-window img{width:100%;height:100%;object-fit:cover;filter:sepia(.18) saturate(.85) brightness(.78)}.media-rail{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;position:relative}.media-tile{position:relative;display:block;text-decoration:none;color:#f2d58b;border:1px solid rgba(214,163,72,.45);background:#050705;padding:.5rem;text-align:center;box-shadow:0 16px 35px rgba(0,0,0,.42)}.media-tile img{width:100%;height:150px;object-fit:cover;display:block;filter:brightness(.73)}.media-tile span{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:1px solid rgba(242,213,139,.8);background:rgba(0,0,0,.45);box-shadow:0 0 18px rgba(242,213,139,.18)}.media-tile strong{display:block;text-transform:uppercase;letter-spacing:.08em;margin:.55rem 0 .25rem}.join-frame{display:grid;grid-template-columns:.95fr 1.05fr;gap:2rem;border:1px solid rgba(214,163,72,.5);padding:1.4rem;background:linear-gradient(90deg,rgba(2,4,2,.96),rgba(9,14,8,.92));box-shadow:0 25px 70px rgba(0,0,0,.55)}.join-still-life{min-height:290px;padding:2rem;background:linear-gradient(90deg,rgba(0,0,0,.25),rgba(0,0,0,.5)),url('../images/desk-green-book.png') center/cover;border:1px solid rgba(214,163,72,.25);display:flex;flex-direction:column;justify-content:flex-end}.join-still-life h2{font-size:clamp(2rem,4vw,3.3rem);color:var(--emerald);margin:0;text-shadow:0 0 18px rgba(78,255,48,.35)}.join-still-life p{color:#f1ddb3;max-width:560px}.sign-up-form{align-self:center}.sign-up-form label{color:#d9bf75;text-transform:uppercase;letter-spacing:.09em;font-size:.72rem}.privacy-note{font-size:.85rem;color:#c4b080}.footer-logo{width:210px;max-width:100%;filter:drop-shadow(0 0 16px rgba(78,255,32,.35))}.footer-signup{display:flex;gap:.4rem}.footer-signup input{min-width:0}.footer-signup button{width:44px;border:1px solid rgba(214,163,72,.5);background:#0d4c1f;color:#fff}.immersive-footer{position:relative}.immersive-footer::before,.immersive-footer::after{content:"";position:absolute;bottom:10px;width:210px;height:31px;background:center/contain no-repeat;opacity:.85;filter:drop-shadow(0 0 14px rgba(76,255,35,.35))}.immersive-footer::before{left:10px;background-image:url('../images/green-light.gif')}.immersive-footer::after{right:10px;background-image:url('../images/purple-light.gif')}.page-hero{position:relative;overflow:hidden}.page-hero::after{content:"";position:absolute;right:-7rem;top:-3rem;width:24rem;height:24rem;background:url('../images/hitl-logo.png') center/contain no-repeat;opacity:.08;filter:drop-shadow(0 0 45px rgba(78,255,48,.6));transform:rotate(-8deg)}
@media (max-width:1100px){.hero-stage-grid{grid-template-columns:1fr;min-height:auto}.hero-room{min-height:470px}.room-frame{left:6%;right:auto;width:min(500px,74vw)}.red-door{right:7%;top:40px}.expansion-note{right:3%;bottom:0}.gaslamp-left{display:none}.portal-cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:900px){.product-stage,.lore-frame,.media-rail,.join-frame{grid-template-columns:1fr}.portrait{display:none}.mansion-window{height:230px}.portal-cards{grid-template-columns:1fr}.portal-card{min-height:auto}.hero-stage-grid{padding-top:4rem}.hero-room{min-height:360px}.room-frame{width:78vw;left:2%;top:20px}.red-door{width:92px;height:260px;right:1rem}.expansion-note{position:relative;right:auto;bottom:auto;margin:280px auto 0}.media-tile img{height:180px}.immersive-footer::before,.immersive-footer::after{display:none}}
@media (max-width:600px){.hero-copy h1{font-size:3.4rem}.hero-stage-grid{gap:1rem}.hero-room{min-height:330px}.room-frame{width:86vw;transform:rotate(4deg)}.red-door{display:none}.expansion-note{margin-top:235px}.portal-image{height:180px}.join-still-life{min-height:240px;padding:1rem}.footer-signup{display:grid}.footer-signup button{width:100%}}

/* v1.3 wallpaper integration */
.section.dark,.portal-card,.expansion-portal,.join-frame,.footer{backdrop-filter:saturate(1.02);}
.section.dark{background:rgba(0,0,0,.22)}


/* ==========================================================
   v1.4 matching header/footer treatment
   Uses the gothic wallpaper tile as a coherent brand skin for
   the top navigation, page heroes, section separators and footer.
   ========================================================== */

.site-header{
  background:
    linear-gradient(180deg,rgba(0,0,0,.92),rgba(2,4,2,.97)),
    url('../images/victorian-gothic-wallpaper-tile.png') center top/420px 420px repeat;
  border-bottom:1px solid rgba(217,170,71,.62);
  box-shadow:
    0 12px 36px rgba(0,0,0,.62),
    inset 0 -1px 0 rgba(92,255,48,.16);
}

.site-header::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-2px;
  height:2px;
  background:linear-gradient(90deg,transparent,rgba(93,246,47,.55),rgba(217,170,71,.65),rgba(93,246,47,.55),transparent);
  box-shadow:0 0 18px rgba(93,246,47,.35);
  pointer-events:none;
}

.nav{
  position:relative;
}

.nav::before,
.nav::after{
  content:"";
  position:absolute;
  top:50%;
  width:76px;
  height:28px;
  transform:translateY(-50%);
  opacity:.55;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 50%,rgba(217,170,71,.9) 0 2px,transparent 3px),
    linear-gradient(90deg,transparent,rgba(217,170,71,.45),transparent);
}

.nav::before{left:-96px}
.nav::after{right:-96px}

.brand{
  padding:.3rem .5rem;
  border:1px solid rgba(217,170,71,.22);
  background:rgba(0,0,0,.32);
  box-shadow:
    inset 0 0 18px rgba(93,246,47,.08),
    0 0 22px rgba(93,246,47,.08);
}

.nav-links a,
.buy-mini{
  border-radius:2px;
}

.nav-links a:hover,
.nav-links a.active{
  background:
    linear-gradient(180deg,rgba(217,170,71,.12),rgba(0,0,0,.15)),
    url('../images/victorian-gothic-wallpaper-tile.png') center/260px 260px repeat;
  box-shadow:inset 0 0 18px rgba(93,246,47,.08);
}

.buy-mini{
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.06),
    0 0 18px rgba(217,170,71,.18);
}

/* Dark damask top cap for normal internal page heroes */
.page-hero{
  background:
    linear-gradient(90deg,rgba(0,0,0,.94),rgba(0,0,0,.68)),
    radial-gradient(circle at 18% 20%,rgba(93,246,47,.16),transparent 22rem),
    url('../images/victorian-gothic-wallpaper-tile.png') center top/560px 560px repeat,
    url('../images/library-room-3d.png') center/cover;
}

.page-hero::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:92px;
  background:
    linear-gradient(180deg,transparent,rgba(0,0,0,.72)),
    linear-gradient(90deg,transparent,rgba(217,170,71,.35),transparent);
  border-bottom:1px solid rgba(217,170,71,.42);
  pointer-events:none;
}

.door-divider{
  background:
    linear-gradient(90deg,rgba(0,0,0,.9),rgba(0,0,0,.36),rgba(0,0,0,.9)),
    url('../images/victorian-gothic-wallpaper-tile.png') center/480px 480px repeat,
    url('../images/room-overhead-4.png') center/cover;
}

/* Footer now reads as part of the same wallpapered library */
.footer{
  background:
    linear-gradient(180deg,rgba(1,2,1,.96),rgba(0,0,0,.98)),
    url('../images/victorian-gothic-wallpaper-tile.png') center bottom/460px 460px repeat;
  border-top:1px solid rgba(217,170,71,.62);
  box-shadow:
    inset 0 1px 0 rgba(93,246,47,.15),
    0 -18px 50px rgba(0,0,0,.55);
  position:relative;
}

.footer::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:2px;
  background:linear-gradient(90deg,transparent,rgba(93,246,47,.6),rgba(217,170,71,.7),rgba(93,246,47,.6),transparent);
  box-shadow:0 0 20px rgba(93,246,47,.28);
}

.footer-grid{
  position:relative;
  border:1px solid rgba(217,170,71,.18);
  padding:1.25rem;
  background:rgba(0,0,0,.28);
  box-shadow:inset 0 0 45px rgba(0,0,0,.38);
}

.footer-grid > div{
  position:relative;
}

.footer-grid > div:not(:last-child)::after{
  content:"";
  position:absolute;
  top:.25rem;
  right:-.7rem;
  width:1px;
  height:calc(100% - .5rem);
  background:linear-gradient(transparent,rgba(217,170,71,.35),transparent);
}

.subfooter{
  background:rgba(0,0,0,.24);
  padding:1rem;
  border:1px solid rgba(217,170,71,.12);
}

/* A reusable damask plaque layer for cards and panels */
.card,
.portal-card,
.expansion-portal,
.media-tile,
.lore-frame,
.join-frame{
  background-image:
    linear-gradient(180deg,rgba(8,14,8,.90),rgba(2,4,2,.96)),
    url('../images/victorian-gothic-wallpaper-tile.png');
  background-size:auto,360px 360px;
  background-repeat:no-repeat,repeat;
  background-position:center,center;
}

.parchment,
.parchment-mini{
  box-shadow:
    0 24px 60px rgba(0,0,0,.56),
    0 0 0 1px rgba(217,170,71,.28);
}

/* Fine ornamental top/bottom rails on main sections */
.section{
  background-image:
    radial-gradient(circle at 13% 30%,rgba(48,255,31,.08),transparent 22rem),
    radial-gradient(circle at 83% 60%,rgba(217,170,71,.08),transparent 24rem);
}

.section > .wrap{
  position:relative;
}

.section > .wrap::before{
  content:"";
  display:block;
  width:min(420px,70%);
  height:1px;
  margin:0 auto 1.25rem;
  background:linear-gradient(90deg,transparent,rgba(217,170,71,.55),rgba(93,246,47,.38),rgba(217,170,71,.55),transparent);
  box-shadow:0 0 14px rgba(93,246,47,.18);
}

/* Keep readability strong on small screens */
@media (max-width:900px){
  .footer-grid > div:not(:last-child)::after{display:none}
  .footer-grid{padding:1rem}
  .nav::before,.nav::after{display:none}
}


/* ==========================================================
   v1.5 layout refinements from review
   - reduce muddy wallpaper feel
   - restore cleaner buttons
   - simplify cluttered decorative elements
   - promote Hermione character hero image on homepage
   ========================================================== */
body{
  background-image:
    radial-gradient(circle at 10% 14%, rgba(61,255,58,.06), transparent 14rem),
    radial-gradient(circle at 90% 18%, rgba(132,44,201,.05), transparent 16rem),
    linear-gradient(180deg,#010201 0%, #071006 34%, #020302 100%) !important;
  background-size:auto !important;
  background-repeat:no-repeat !important;
  background-position:center top !important;
}
body:before{
  background:
    radial-gradient(circle at 0% 20%, rgba(76,255,35,.08), transparent 16rem),
    radial-gradient(circle at 100% 24%, rgba(76,255,35,.08), transparent 16rem),
    linear-gradient(rgba(0,0,0,.08), rgba(0,0,0,.56)) !important;
}
.site-header,.footer{
  background-image:
    linear-gradient(180deg,rgba(1,2,1,.96),rgba(0,0,0,.98)),
    url('../images/victorian-gothic-wallpaper-tile.png');
  background-size:auto, 760px 760px;
  background-repeat:no-repeat, repeat;
  background-position:center top, center top;
}
.nav::before,.nav::after,.gaslamp-left,.immersive-footer::before,.immersive-footer::after{display:none !important}
.site-header{box-shadow:0 10px 30px rgba(0,0,0,.55)}
.brand img{width:162px;max-height:62px}
.nav{min-height:72px}
.nav-links a:hover,.nav-links a.active{
  background:rgba(217,170,71,.08) !important;
  border-color:rgba(217,170,71,.35);
  box-shadow:none !important;
}
.buy-mini{
  background:linear-gradient(180deg,#6d161a,#34100e) !important;
  border-color:var(--gold) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06),0 0 18px rgba(217,170,71,.18) !important;
}
.hero-stage{
  min-height:700px;
  background:
    radial-gradient(circle at 77% 28%, rgba(94,255,42,.18), transparent 16rem),
    linear-gradient(90deg,rgba(0,0,0,.97) 0%,rgba(2,5,3,.92) 44%,rgba(0,0,0,.86) 100%);
}
.hero-stage::after{
  background:url('../images/hitl-logo.png') center/contain no-repeat;
  opacity:.08;
}
.hero-stage-grid{grid-template-columns: .95fr 1.05fr; align-items:center; gap:1.5rem; min-height:700px; padding-top:2.8rem; padding-bottom:2.2rem}
.hero-copy{max-width:540px; position:relative; z-index:2}
.hero-copy .hero-logo{width:min(390px,82vw)}
.hero-copy .lead{font-size:1.45rem; max-width:36rem}
.hero-art-stage{position:relative; min-height:560px}
.hero-characters{position:absolute; left:-4%; bottom:-8px; width:min(520px,54vw); z-index:4; filter:drop-shadow(0 0 32px rgba(255,230,71,.28))}
.hero-characters img{width:100%; height:auto; display:block}
.hero-room-frame{position:absolute; right:28px; top:22px; width:min(360px,42vw); transform:rotate(7deg) rotateX(7deg) rotateY(-10deg); z-index:2}
.red-door{right:-2px; top:78px; width:132px; height:350px; z-index:3}
.expansion-note{right:20px; bottom:14px; width:220px; z-index:5}
.expansion-note a{background:#38145c}
.portal-card,.expansion-portal,.join-frame,.footer-grid,.subfooter,.lore-refined{background-image:none !important}
.portal-card,.expansion-portal{background:linear-gradient(180deg,rgba(8,14,8,.96),rgba(2,4,2,.99)) !important}
.card,.media-tile,.join-frame,.lore-refined{background-color:rgba(4,8,4,.88)}
.section.dark{background:rgba(0,0,0,.22)}
.product-stage{grid-template-columns:.9fr 1.1fr; gap:1.6rem}
.product-art{max-width:430px; justify-self:center}
.lore-refined{display:grid; grid-template-columns:1.05fr .95fr; gap:1.5rem; align-items:center; border:1px solid rgba(214,163,72,.42); padding:1rem; box-shadow:0 25px 60px rgba(0,0,0,.46)}
.lore-refined .parchment-mini{height:100%; display:flex; flex-direction:column; justify-content:center}
.lore-refined .btn{align-self:flex-start; margin-top:.6rem}
.lore-visual img{display:block; width:100%; height:100%; object-fit:cover; min-height:240px; filter:sepia(.12) saturate(.86) brightness(.8)}
.join-frame.refined-join{grid-template-columns:.95fr 1.05fr; gap:1.2rem; padding:1rem; background:linear-gradient(90deg,rgba(2,4,2,.94),rgba(7,12,7,.92))}
.sign-up-form{padding:1.2rem; border:1px solid rgba(214,163,72,.24); background:rgba(0,0,0,.28)}
.join-still-life{min-height:250px; background:linear-gradient(90deg,rgba(0,0,0,.2),rgba(0,0,0,.42)),url('../images/desk-purple-books.png') center/cover; border:1px solid rgba(214,163,72,.25)}
.footer-grid{padding:1rem; background:rgba(0,0,0,.18)}
.subfooter{padding:1rem 0 0; background:none; border:0}
.btn,.btn.red,.btn.purple,.btn.ghost{
  background-image:none !important;
}
.btn{background:linear-gradient(180deg,#1a742d,#073f18) !important}
.btn.red{background:linear-gradient(180deg,#75161c,#3b0c0f) !important}
.btn.purple{background:linear-gradient(180deg,#5b248b,#24103f) !important}
.btn.ghost{background:rgba(2,4,2,.45) !important}
@media (max-width:1100px){
  .hero-stage-grid{grid-template-columns:1fr; min-height:auto}
  .hero-art-stage{min-height:500px}
  .hero-characters{left:0; width:min(500px,76vw)}
  .hero-room-frame{right:5%; width:min(320px,54vw)}
  .expansion-note{right:5%; bottom:10px}
}
@media (max-width:900px){
  .product-stage,.lore-refined,.join-frame.refined-join,.media-rail{grid-template-columns:1fr}
  .hero-stage{min-height:auto}
  .hero-stage-grid{padding-top:2rem; padding-bottom:1.5rem}
  .hero-copy{max-width:none}
  .hero-art-stage{min-height:470px}
  .hero-characters{position:relative; left:auto; bottom:auto; width:min(520px,92vw); margin:0 auto}
  .hero-room-frame{top:180px; right:3%; width:min(300px,56vw)}
  .red-door{top:220px; right:2%; width:84px; height:230px}
  .expansion-note{position:relative; right:auto; bottom:auto; margin:170px auto 0}
}
@media (max-width:600px){
  .brand img{width:120px}
  .hero-characters{width:96vw}
  .hero-room-frame{position:relative; top:auto; right:auto; margin:-30px auto 0; width:88vw; transform:rotate(4deg)}
  .red-door{display:none}
  .expansion-note{margin-top:1rem}
}


/* ==========================================================
   v1.6 product layout fix
   Fixes the large empty gap in the homepage product showcase.
   ========================================================== */
.fixed-product-stage{
  grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr) !important;
  align-items:start !important;
  gap:2rem !important;
}
.fixed-product-stage .product-copy{
  align-self:start;
  padding-top:.25rem;
  max-width:640px;
}
.fixed-product-stage .product-copy .kicker{
  margin-bottom:1rem;
}
.fixed-product-stage .product-copy h2{
  margin:.2rem 0 1rem;
}
.fixed-product-stage .product-copy p{
  max-width:38rem;
}
.fixed-product-stage .badge-row{
  margin:1.1rem 0 1.4rem;
}
.fixed-product-stage .product-art{
  align-self:start;
  justify-self:end;
  width:min(100%,430px);
  max-width:430px;
  transform:none;
  margin-top:0;
}
.fixed-product-stage .product-art img{
  display:block;
  width:100%;
  height:auto;
}
@media (max-width:900px){
  .fixed-product-stage{
    grid-template-columns:1fr !important;
    gap:1.35rem !important;
  }
  .fixed-product-stage .product-art{
    justify-self:center;
    width:min(100%,520px);
    order:-1;
  }
  .fixed-product-stage .product-copy{
    max-width:none;
  }
}


/* ==========================================================
   v1.7 homepage spacing and alignment clean-up
   - removes disconnected fuse/tube decorations for now
   - removes stray ornamental horizontal lines
   - tightens homepage vertical rhythm
   - aligns cards, product panel, lore, media and signup areas
   ========================================================== */

.tube-divider,
.tube,
.immersive-footer::before,
.immersive-footer::after,
.footer::before,
.site-header::before,
.section > .wrap::before,
.nav::before,
.nav::after{
  display:none !important;
  content:none !important;
}

/* Remove the odd thin/stray green-gold rails and keep clean section separation */
.section{
  padding:4.2rem 0 !important;
  border-top:1px solid rgba(217,170,71,.12) !important;
}

.homepage-block + .homepage-block{
  margin-top:0;
}

.section-title{
  margin-bottom:2rem !important;
}

.section-title.compact{
  max-width:780px !important;
}

.section-title h2{
  margin-top:.45rem !important;
  margin-bottom:.55rem !important;
}

/* Hero: slightly less vertical sprawl and better right-side composition */
.hero-stage{
  min-height:660px !important;
  border-bottom:1px solid rgba(217,170,71,.22) !important;
}

.hero-stage-grid{
  min-height:660px !important;
  padding-top:2rem !important;
  padding-bottom:2.3rem !important;
  gap:2rem !important;
}

.hero-copy{
  padding-top:0 !important;
}

.hero-copy .hero-logo{
  margin-bottom:.8rem !important;
}

.hero-copy h1{
  margin:.4rem 0 .65rem !important;
}

.hero-copy p{
  margin:.6rem 0 !important;
}

.hero-ctas{
  margin-top:1.2rem !important;
}

.rules-pills{
  margin-top:1rem !important;
}

.hero-art-stage{
  min-height:520px !important;
}

.hero-characters{
  bottom:6px !important;
  left:-2% !important;
  width:min(540px,52vw) !important;
}

.hero-room-frame{
  right:10px !important;
  top:24px !important;
  width:min(350px,39vw) !important;
}

.red-door{
  right:-10px !important;
  top:80px !important;
  height:330px !important;
}

.expansion-note{
  right:8px !important;
  bottom:4px !important;
}

/* Card grid alignment */
.portal-cards{
  gap:1.05rem !important;
}

.portal-card{
  min-height:500px !important;
  padding:1rem !important;
}

.portal-card::after{
  display:none !important;
}

.portal-image{
  height:190px !important;
}

.portal-card h3{
  min-height:3.1rem;
  display:flex;
  align-items:flex-end;
}

.portal-card p{
  min-height:5rem;
}

.portal-card .btn{
  align-self:flex-start;
}

/* Product showcase, now neatly aligned */
.product-showcase{
  padding-top:4rem !important;
  padding-bottom:4rem !important;
}

.fixed-product-stage{
  max-width:1040px;
}

.fixed-product-stage .product-copy h2{
  font-size:clamp(2.4rem,4vw,4.2rem) !important;
}

.fixed-product-stage .product-art{
  width:min(100%,390px) !important;
}

/* Expansion cards: reduce dead space */
.expansion-portals{
  max-width:980px;
  margin:0 auto;
}

.expansion-portal{
  min-height:300px !important;
  padding:1.1rem !important;
}

.expansion-portal img{
  max-height:115px !important;
}

/* Lore section: no fake empty portraits, cleaner two-column content */
.lore-band{
  padding-top:4rem !important;
  padding-bottom:4rem !important;
}

.lore-refined{
  max-width:980px;
  margin:0 auto;
  grid-template-columns:1fr 1fr !important;
  align-items:stretch !important;
}

.lore-refined .parchment-mini{
  padding:1.6rem !important;
}

.lore-refined .parchment-mini h2{
  font-size:clamp(1.8rem,3vw,2.7rem);
}

.lore-visual img{
  min-height:260px !important;
}

/* Media strip: more uniform thumbnails */
.media-rail{
  max-width:980px;
  margin:0 auto;
  gap:1rem !important;
}

.media-tile img{
  height:128px !important;
}

.media-tile strong{
  min-height:2rem;
}

/* Signup: form and image now sit as a deliberate block */
.join-stage{
  padding-bottom:4.6rem !important;
}

.join-frame.refined-join{
  max-width:980px;
  margin:0 auto;
  grid-template-columns:1fr 1fr !important;
  align-items:stretch !important;
}

.sign-up-form{
  align-self:stretch !important;
  display:grid !important;
  align-content:center;
}

.join-still-life{
  min-height:300px !important;
}

/* Footer cleaned now the fuses are removed */
.footer{
  padding:2.6rem 0 1rem !important;
}

.footer-grid{
  max-width:980px;
  margin:0 auto;
  padding:1.2rem !important;
  gap:1.2rem !important;
}

.footer-logo{
  width:185px !important;
}

/* Stronger consistent button sizing */
.btn{
  min-height:44px;
  line-height:1.1;
}

/* Mobile/tablet */
@media (max-width:1100px){
  .hero-stage-grid{
    grid-template-columns:1fr !important;
    min-height:auto !important;
  }
  .hero-art-stage{
    min-height:500px !important;
  }
  .hero-characters{
    left:0 !important;
    width:min(560px,86vw) !important;
  }
  .hero-room-frame{
    right:4% !important;
    width:min(330px,52vw) !important;
  }
  .expansion-note{
    right:4% !important;
  }
}

@media (max-width:900px){
  .section{
    padding:3.4rem 0 !important;
  }
  .hero-stage{
    min-height:auto !important;
  }
  .hero-art-stage{
    min-height:auto !important;
  }
  .hero-characters{
    position:relative !important;
    left:auto !important;
    bottom:auto !important;
    width:min(560px,92vw) !important;
    margin:0 auto !important;
  }
  .hero-room-frame{
    position:relative !important;
    top:auto !important;
    right:auto !important;
    width:min(430px,88vw) !important;
    margin:-1.2rem auto 0 !important;
  }
  .red-door{
    display:none !important;
  }
  .expansion-note{
    position:relative !important;
    right:auto !important;
    bottom:auto !important;
    margin:1rem auto 0 !important;
  }
  .portal-cards,
  .lore-refined,
  .join-frame.refined-join,
  .media-rail,
  .fixed-product-stage{
    grid-template-columns:1fr !important;
  }
  .portal-card{
    min-height:auto !important;
  }
  .portal-card h3,
  .portal-card p{
    min-height:0 !important;
  }
  .media-tile img{
    height:180px !important;
  }
  .join-still-life{
    order:-1;
  }
  .footer-grid > div:not(:last-child)::after{
    display:none !important;
  }
}

@media (max-width:600px){
  .hero-copy .hero-logo{
    width:min(330px,88vw) !important;
  }
  .hero-copy h1{
    font-size:3.2rem !important;
  }
  .hero-copy .lead{
    font-size:1.18rem !important;
  }
  .cta-row{
    display:grid !important;
  }
  .rules-pills{
    align-items:flex-start;
  }
}


/* ==========================================================
   v1.8 creative hero
   - smoky wallpaper at the top
   - cleaner generic wallpaper through the rest of the site
   - rotating room tiles connected like a shifting library map
   ========================================================== */

body{
  background:
    linear-gradient(180deg, rgba(1,3,1,.92), rgba(3,8,3,.94) 28%, rgba(2,4,2,.98) 100%),
    url('../images/wallpaper-generic.png') center top/cover fixed no-repeat !important;
}

body:before{
  background:
    linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.54)),
    radial-gradient(circle at 0% 22%, rgba(76,255,35,.08), transparent 16rem),
    radial-gradient(circle at 100% 24%, rgba(76,255,35,.08), transparent 16rem) !important;
}

.site-header,
.footer{
  background:
    linear-gradient(180deg,rgba(0,0,0,.88),rgba(0,0,0,.96)),
    url('../images/wallpaper-generic.png') center top/cover no-repeat;
}

.hero-stage{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(90deg, rgba(2,6,2,.90) 0%, rgba(1,3,1,.75) 35%, rgba(2,6,2,.72) 100%),
    url('../images/hero-wallpaper-smoke.jpg') center center/cover no-repeat !important;
}

.hero-stage::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 18% 52%, rgba(102,255,0,.11), transparent 18rem),
    radial-gradient(circle at 88% 40%, rgba(102,255,0,.12), transparent 16rem),
    linear-gradient(90deg, rgba(0,0,0,.22), rgba(0,0,0,.08) 38%, rgba(0,0,0,.18));
  pointer-events:none;
}

.hero-stage::after{
  content:"";
  position:absolute;
  inset:0;
  background:url('../images/hitl-logo.png') center/70% no-repeat;
  opacity:.05;
  pointer-events:none;
}

.hero-stage-grid{
  position:relative;
  z-index:2;
  grid-template-columns: .92fr 1.08fr !important;
  align-items:center;
  gap:1.5rem !important;
  min-height:680px !important;
}

.hero-copy{
  position:relative;
  z-index:5;
  max-width:560px !important;
}

.hero-copy .hero-logo{
  width:min(390px,82vw) !important;
  filter:drop-shadow(0 0 18px rgba(80,255,70,.24));
}

.hero-copy .lead{
  max-width:34rem;
}

.hero-art-stage{
  position:relative;
  min-height:590px !important;
  isolation:isolate;
}

.room-network{
  position:absolute;
  inset:0;
  z-index:1;
  filter:drop-shadow(0 10px 28px rgba(0,0,0,.55));
}

.network-tile{
  position:absolute;
  margin:0;
  width:250px;
  aspect-ratio:1 / 1;
  border:1px solid rgba(214,163,72,.30);
  box-shadow:
    0 14px 42px rgba(0,0,0,.55),
    inset 0 0 0 1px rgba(255,255,255,.04);
  background:rgba(0,0,0,.18);
  overflow:hidden;
  transform-origin:center center;
  opacity:.94;
}

.network-tile img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.network-tile::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.18));
  pointer-events:none;
}

.tile-center{
  width:290px;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%) rotate(-2deg);
  animation:tileFloatCenter 18s ease-in-out infinite;
  z-index:3;
}

.tile-top{
  left:50%;
  top:3%;
  transform:translateX(-50%) rotate(180deg);
  animation:tileSpinTop 26s linear infinite;
  z-index:2;
}

.tile-right{
  right:8%;
  top:50%;
  transform:translateY(-50%) rotate(-90deg);
  animation:tileSpinRight 28s linear infinite;
  z-index:2;
}

.tile-bottom{
  left:50%;
  bottom:2%;
  transform:translateX(-50%) rotate(0deg);
  animation:tileSpinBottom 24s linear infinite;
  z-index:2;
}

.tile-left{
  left:8%;
  top:50%;
  transform:translateY(-50%) rotate(90deg);
  animation:tileSpinLeft 30s linear infinite;
  z-index:2;
}

.hero-characters{
  position:absolute;
  right:15%;
  bottom:0;
  width:min(430px,44vw) !important;
  z-index:4;
  filter:drop-shadow(0 0 26px rgba(255,230,71,.24));
}

.hero-characters img{
  width:100%;
  display:block;
  height:auto;
}

.expansion-note{
  right:4%;
  bottom:6%;
  z-index:5 !important;
  width:220px;
  background:rgba(4,4,4,.86) !important;
  box-shadow:0 18px 40px rgba(0,0,0,.52);
}

.red-door,
.hero-room-frame{
  display:none !important;
}

@keyframes tileFloatCenter{
  0%,100%{transform:translate(-50%,-50%) rotate(-2deg) scale(1)}
  50%{transform:translate(-50%,-49%) rotate(2deg) scale(1.03)}
}
@keyframes tileSpinTop{
  0%{transform:translateX(-50%) rotate(180deg)}
  50%{transform:translateX(-50%) rotate(184deg)}
  100%{transform:translateX(-50%) rotate(180deg)}
}
@keyframes tileSpinRight{
  0%{transform:translateY(-50%) rotate(-90deg)}
  50%{transform:translateY(-50%) rotate(-86deg)}
  100%{transform:translateY(-50%) rotate(-90deg)}
}
@keyframes tileSpinBottom{
  0%{transform:translateX(-50%) rotate(0deg)}
  50%{transform:translateX(-50%) rotate(4deg)}
  100%{transform:translateX(-50%) rotate(0deg)}
}
@keyframes tileSpinLeft{
  0%{transform:translateY(-50%) rotate(90deg)}
  50%{transform:translateY(-50%) rotate(86deg)}
  100%{transform:translateY(-50%) rotate(90deg)}
}

/* Keep homepage cleaner while letting wallpaper read through subtly */
.portal-card,
.expansion-portal,
.join-frame,
.lore-refined,
.footer-grid{
  background-color:rgba(3,6,3,.86) !important;
}

@media (max-width: 1200px){
  .hero-stage-grid{
    grid-template-columns: 1fr !important;
    min-height:auto !important;
  }
  .hero-art-stage{
    min-height:600px !important;
  }
  .hero-characters{
    right:18%;
    width:min(420px,48vw) !important;
  }
}
@media (max-width: 900px){
  .hero-art-stage{
    min-height:520px !important;
    margin-top:1rem;
  }
  .network-tile{
    width:190px;
  }
  .tile-center{
    width:225px;
  }
  .tile-top{top:5%}
  .tile-right{right:4%}
  .tile-left{left:4%}
  .hero-characters{
    right:50%;
    transform:translateX(50%);
    bottom:0;
    width:min(360px,70vw) !important;
  }
  .expansion-note{
    right:50%;
    transform:translateX(50%);
    bottom:2%;
    width:min(260px,70vw);
  }
}
@media (max-width: 640px){
  .hero-stage{
    background-position:center top !important;
  }
  .hero-stage-grid{
    gap:1rem !important;
  }
  .hero-copy .hero-logo{
    width:min(320px,86vw) !important;
  }
  .hero-copy h1{
    font-size:3rem !important;
  }
  .hero-art-stage{
    min-height:460px !important;
  }
  .network-tile{
    width:140px;
  }
  .tile-center{
    width:170px;
  }
  .hero-characters{
    width:min(300px,80vw) !important;
  }
}


/* ==========================================================
   v1.9 hero refinement
   - removes soft/blurred feel from hero backdrops
   - makes the room tiles visibly rotate
   - sharpens the top section overall
   ========================================================== */

/* Sharper, cleaner overall backgrounds */
body{
  background:
    linear-gradient(180deg, rgba(1,3,1,.92), rgba(3,8,3,.94) 28%, rgba(2,4,2,.98) 100%),
    url('../images/wallpaper-generic.png') center top/cover fixed no-repeat !important;
}
body:before{
  background:
    linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.46)),
    radial-gradient(circle at 0% 22%, rgba(76,255,35,.06), transparent 16rem),
    radial-gradient(circle at 100% 24%, rgba(76,255,35,.06), transparent 16rem) !important;
}
.hero-stage{
  background:
    linear-gradient(90deg, rgba(2,6,2,.82) 0%, rgba(1,3,1,.62) 35%, rgba(2,6,2,.62) 100%),
    url('../images/hero-wallpaper-smoke.jpg') center center/cover no-repeat !important;
}
.hero-stage::before{
  background:
    radial-gradient(circle at 18% 52%, rgba(102,255,0,.08), transparent 18rem),
    radial-gradient(circle at 88% 40%, rgba(102,255,0,.09), transparent 16rem),
    linear-gradient(90deg, rgba(0,0,0,.15), rgba(0,0,0,.04) 38%, rgba(0,0,0,.12));
}
.hero-stage::after{
  opacity:.035;
  background:url('../images/hitl-logo.png') center/74% no-repeat;
}

/* Hero layout tuning */
.hero-stage-grid{
  grid-template-columns: .9fr 1.1fr !important;
  gap:1.25rem !important;
  min-height:700px !important;
}
.hero-copy{
  max-width:580px !important;
}
.hero-art-stage{
  min-height:610px !important;
}

/* Room network: crisper and more alive */
.room-network{
  filter:drop-shadow(0 8px 24px rgba(0,0,0,.45));
  animation:networkDrift 18s ease-in-out infinite;
}
.network-tile{
  width:255px;
  opacity:.98;
  border:1px solid rgba(214,163,72,.34);
  box-shadow:
    0 10px 28px rgba(0,0,0,.45),
    inset 0 0 0 1px rgba(255,255,255,.06);
  background:rgba(0,0,0,.10);
}
.network-tile::after{
  background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(0,0,0,.10));
}
.network-tile img{
  image-rendering:auto;
}

/* Add connection rails between the room tiles */
.room-network::before,
.room-network::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  pointer-events:none;
  z-index:0;
}
.room-network::before{
  width:66%;
  height:28px;
  background:linear-gradient(90deg, transparent 0%, rgba(214,163,72,.15) 10%, rgba(214,163,72,.34) 50%, rgba(214,163,72,.15) 90%, transparent 100%);
  box-shadow:0 0 16px rgba(110,255,72,.08);
}
.room-network::after{
  width:28px;
  height:70%;
  background:linear-gradient(180deg, transparent 0%, rgba(214,163,72,.15) 10%, rgba(214,163,72,.34) 50%, rgba(214,163,72,.15) 90%, transparent 100%);
  box-shadow:0 0 16px rgba(110,255,72,.08);
}

.tile-center{
  width:300px;
  transform:translate(-50%,-50%) rotate(-2deg);
  animation:tileCenterRotate 22s linear infinite;
  z-index:3;
}
.tile-top{
  left:50%;
  top:3%;
  transform:translateX(-50%) rotate(180deg);
  animation:tileTopRotate 24s linear infinite;
  z-index:2;
}
.tile-right{
  right:8%;
  top:50%;
  transform:translateY(-50%) rotate(-90deg);
  animation:tileRightRotate 26s linear infinite;
  z-index:2;
}
.tile-bottom{
  left:50%;
  bottom:2%;
  transform:translateX(-50%) rotate(0deg);
  animation:tileBottomRotate 23s linear infinite;
  z-index:2;
}
.tile-left{
  left:8%;
  top:50%;
  transform:translateY(-50%) rotate(90deg);
  animation:tileLeftRotate 25s linear infinite;
  z-index:2;
}

.hero-characters{
  right:15%;
  bottom:-2px;
  width:min(430px,43vw) !important;
  filter:drop-shadow(0 0 22px rgba(255,230,71,.20));
}
.expansion-note{
  right:4%;
  bottom:8%;
  background:rgba(5,5,5,.90) !important;
}

/* Rotational animation set */
@keyframes networkDrift{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-6px)}
}
@keyframes tileCenterRotate{
  0%{transform:translate(-50%,-50%) rotate(-2deg)}
  25%{transform:translate(-50%,-50%) rotate(6deg)}
  50%{transform:translate(-50%,-50%) rotate(14deg)}
  75%{transform:translate(-50%,-50%) rotate(7deg)}
  100%{transform:translate(-50%,-50%) rotate(-2deg)}
}
@keyframes tileTopRotate{
  0%{transform:translateX(-50%) rotate(180deg)}
  25%{transform:translateX(-50%) rotate(188deg)}
  50%{transform:translateX(-50%) rotate(198deg)}
  75%{transform:translateX(-50%) rotate(190deg)}
  100%{transform:translateX(-50%) rotate(180deg)}
}
@keyframes tileRightRotate{
  0%{transform:translateY(-50%) rotate(-90deg)}
  25%{transform:translateY(-50%) rotate(-82deg)}
  50%{transform:translateY(-50%) rotate(-72deg)}
  75%{transform:translateY(-50%) rotate(-80deg)}
  100%{transform:translateY(-50%) rotate(-90deg)}
}
@keyframes tileBottomRotate{
  0%{transform:translateX(-50%) rotate(0deg)}
  25%{transform:translateX(-50%) rotate(8deg)}
  50%{transform:translateX(-50%) rotate(18deg)}
  75%{transform:translateX(-50%) rotate(10deg)}
  100%{transform:translateX(-50%) rotate(0deg)}
}
@keyframes tileLeftRotate{
  0%{transform:translateY(-50%) rotate(90deg)}
  25%{transform:translateY(-50%) rotate(98deg)}
  50%{transform:translateY(-50%) rotate(108deg)}
  75%{transform:translateY(-50%) rotate(100deg)}
  100%{transform:translateY(-50%) rotate(90deg)}
}

@media (max-width: 1200px){
  .hero-stage-grid{
    grid-template-columns:1fr !important;
    min-height:auto !important;
  }
  .hero-art-stage{
    min-height:620px !important;
  }
  .hero-characters{
    right:16%;
    width:min(410px,48vw) !important;
  }
}
@media (max-width: 900px){
  .hero-art-stage{
    min-height:540px !important;
  }
  .room-network::before{width:74%}
  .room-network::after{height:74%}
  .network-tile{width:195px}
  .tile-center{width:230px}
  .hero-characters{
    right:50%;
    transform:translateX(50%);
    width:min(360px,70vw) !important;
  }
  .expansion-note{
    right:50%;
    transform:translateX(50%);
    bottom:2%;
  }
}
@media (max-width: 640px){
  .hero-copy h1{font-size:3rem !important}
  .hero-art-stage{min-height:470px !important}
  .network-tile{width:145px}
  .tile-center{width:175px}
  .room-network::before{height:20px}
  .room-network::after{width:20px}
  .hero-characters{width:min(300px,80vw) !important}
}


/* ==========================================================
   v2.0 expanded project pages and uploaded media galleries
   ========================================================== */
.hero-split{align-items:center;gap:2rem}.board-hero,.vr-hero,.topdown-hero{background-position:center;background-size:cover}.asset-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.asset-gallery.compact-gallery{grid-template-columns:repeat(3,1fr)}.media-card{display:block;position:relative;min-height:180px;text-decoration:none;color:#f2d58b;background:#050805;border:1px solid rgba(214,163,72,.42);box-shadow:0 16px 32px rgba(0,0,0,.35);overflow:hidden}.media-card img{width:100%;height:100%;min-height:180px;object-fit:cover;display:block;filter:saturate(.9) brightness(.86);transition:.25s ease}.media-card:hover img{transform:scale(1.035);filter:saturate(1) brightness(.98)}.media-card span{position:absolute;left:.65rem;right:.65rem;bottom:.55rem;background:rgba(0,0,0,.65);border:1px solid rgba(214,163,72,.25);padding:.35rem .45rem;text-transform:uppercase;letter-spacing:.06em;font-size:.72rem}.feature-grid .card{min-height:250px}.expansion-detail-grid{align-items:stretch}.expansion-feature img{height:150px;object-fit:contain;border:0;background:transparent;filter:drop-shadow(0 0 18px rgba(80,255,40,.16))}.expansion-feature h2{color:#f2d58b;margin:.8rem 0 .6rem}.expansion-feature ul{color:#d8c89b}.video-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem}.video-card{background:linear-gradient(180deg,rgba(8,14,8,.96),rgba(2,4,2,.99));border:1px solid rgba(214,163,72,.45);padding:1rem;box-shadow:0 18px 40px rgba(0,0,0,.38)}.video-card video{width:100%;display:block;background:#000;border:1px solid rgba(214,163,72,.22)}.video-card h3{color:#f2d58b}.download img{height:250px;object-fit:cover;object-position:top}.form-panel form{background:rgba(0,0,0,.25);border:1px solid rgba(214,163,72,.2);padding:1rem}.full{grid-column:1/-1}@media(max-width:1100px){.asset-gallery{grid-template-columns:repeat(3,1fr)}}@media(max-width:900px){.asset-gallery,.asset-gallery.compact-gallery,.video-grid{grid-template-columns:1fr 1fr}.hero-split{grid-template-columns:1fr!important}}@media(max-width:620px){.asset-gallery,.asset-gallery.compact-gallery,.video-grid{grid-template-columns:1fr}.media-card img,.media-card{min-height:210px}}

/* v2.1 expanded structure */
body[data-active-nav="home"] [data-nav="home"],body[data-active-nav="board"] [data-nav="board"],body[data-active-nav="rules"] [data-nav="rules"]>a,body[data-active-nav="expansions"] [data-nav="expansions"]>a,body[data-active-nav="digital"] [data-nav="digital"]>a,body[data-active-nav="events"] [data-nav="events"],body[data-active-nav="videos"] [data-nav="videos"],body[data-active-nav="press"] [data-nav="press"]>a,body[data-active-nav="buy"] [data-nav="buy"]{border-color:rgba(217,170,71,.45);color:#fff;background:rgba(217,170,71,.08)}
.hitl-main-nav{gap:.15rem}.nav-group{position:relative;display:flex;align-items:center}.nav-group>a{color:#f0d482;text-decoration:none;text-transform:uppercase;font-size:.75rem;letter-spacing:.08em;padding:.55rem .75rem;border:1px solid transparent}.nav-drop{display:none;position:absolute;top:100%;left:0;min-width:230px;background:rgba(2,5,2,.98);border:1px solid rgba(217,170,71,.38);box-shadow:0 18px 36px rgba(0,0,0,.55);padding:.55rem;z-index:30}.nav-group:hover .nav-drop,.nav-group:focus-within .nav-drop{display:grid}.nav-drop a{display:block;padding:.55rem .65rem;border:0;font-size:.78rem;white-space:nowrap;text-transform:none;letter-spacing:.03em;color:#f1d88d;text-decoration:none}.nav-drop a:hover{background:rgba(217,170,71,.1);color:#fff}
.structured-hero{padding:5rem 0 4rem}.structured-hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);gap:2rem;align-items:center}.page-hero-image img{width:100%;height:auto;max-height:420px;object-fit:cover;border:1px solid rgba(217,170,71,.35);box-shadow:0 18px 45px rgba(0,0,0,.45)}
.media-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1rem}.media-gallery.wide-gallery{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}.gallery-item{display:block;border:1px solid rgba(217,170,71,.35);background:#050805;box-shadow:0 14px 32px rgba(0,0,0,.35);overflow:hidden}.gallery-item img{width:100%;height:190px;object-fit:cover;display:block;transition:transform .2s ease}.wide-gallery .gallery-item img{height:220px}.gallery-item:hover img{transform:scale(1.035)}
.expansion-detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}.expansion-detail img{height:130px;object-fit:contain;border:0;background:transparent}.expansion-detail ul{color:#d8ca9f}.video-grid video{width:100%;aspect-ratio:16/9;background:#000;border:1px solid rgba(217,170,71,.35)}.video-card h3{margin-top:.8rem}.product-sales-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem}.sale-card img{height:270px;object-fit:cover}.sale-card .price{font-size:1.4rem;color:#f3d15f;font-weight:bold}.card a{text-decoration:none}
@media(max-width:1100px){.nav-links a,.nav-group>a,.buy-mini{font-size:.68rem;padding:.5rem .55rem}.structured-hero-grid,.expansion-detail-grid,.product-sales-grid{grid-template-columns:1fr}}@media(max-width:950px){.nav-group{display:block;width:100%}.nav-drop{position:static;box-shadow:none;margin:.2rem 0 .5rem;background:rgba(0,0,0,.25)}.nav-group:hover .nav-drop,.nav-group:focus-within .nav-drop{display:grid}.media-gallery,.media-gallery.wide-gallery{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.gallery-item img,.wide-gallery .gallery-item img{height:160px}}



/* v2.2 wallpaper refinement
   Global repeating wallpaper background: no blur
*/
:root{
  --hitl-wallpaper:url('../images/wallpaper-repeat.png');
}

html, body{
  background-color:#040804 !important;
  background-image:var(--hitl-wallpaper) !important;
  background-repeat:repeat !important;
  background-size:540px auto !important;
  background-attachment:scroll !important;
}

body{
  position:relative;
}

/* remove blurred / muddy full-page treatment */
body::before,
body::after,
.site-shell::before,
.site-shell::after{
  filter:none !important;
  backdrop-filter:none !important;
}

/* Let the wallpaper show through more clearly */
main,
.section,
.page-hero,
.structured-hero,
.homepage-block,
.launch-pad,
.join-stage,
.press-strip,
.content-section{
  background-color:transparent !important;
  background-image:none !important;
}

/* Main content panels keep legibility while exposing wallpaper */
.hero-stage,
.portal-card,
.card,
.parchment,
.form-panel,
.join-frame,
.sale-card,
.video-card,
.gallery-item,
.expansion-detail,
.download,
.ornate-frame,
.footer,
.site-header{
  backdrop-filter:none !important;
}

/* Shared readable section surfaces */
.section > .wrap,
.page-hero .wrap,
.structured-hero .wrap,
.join-frame,
.form-panel,
.parchment{
  position:relative;
}

/* Dark translucent backing for text-heavy modules */
.section .wrap > .section-title,
.portal-card,
.card,
.form-panel,
.join-frame,
.sale-card,
.video-card,
.download,
.expansion-detail{
  background:rgba(3, 8, 3, 0.78);
  border:1px solid rgba(217,170,71,.28);
  box-shadow:0 16px 36px rgba(0,0,0,.35);
}

/* Header/footer should sit cleanly over wallpaper */
.site-header,
.theatre-header{
  background:rgba(2, 5, 2, 0.92) !important;
  border-bottom:1px solid rgba(217,170,71,.35);
}
.footer,
.immersive-footer{
  background:rgba(2, 5, 2, 0.92) !important;
  border-top:1px solid rgba(217,170,71,.35);
}

/* Hero keeps atmosphere but no blur */
.hero-stage{
  background:
    radial-gradient(circle at 20% 30%, rgba(35,120,40,.18), transparent 25%),
    radial-gradient(circle at 80% 35%, rgba(35,120,40,.14), transparent 25%),
    radial-gradient(circle at 60% 80%, rgba(35,120,40,.10), transparent 20%),
    transparent !important;
}

.hero-stage-grid{
  background:rgba(2, 7, 2, 0.72);
  border:1px solid rgba(217,170,71,.22);
  box-shadow:0 24px 50px rgba(0,0,0,.36);
  padding:2rem;
}

/* Keep image frames crisp */
.gallery-item img,
.portal-image img,
.sale-card img,
.video-card video,
.page-hero-image img{
  filter:none !important;
}

/* Remove any stray decorative lines/fuse-like effects if still present */
.fuse,
.fuses,
.copper-fuse,
.energy-tube,
.energy-line,
.section-divider::before,
.section-divider::after{
  display:none !important;
}



/* v2.4 header stripe fix
   Removes the unintended horizontal translucent band appearing through page hero/header areas.
   Keeps the darker repeat wallpaper as the general background.
*/
.page-hero::before,
.page-hero::after,
.structured-hero::before,
.structured-hero::after,
.hero-stage::before,
.hero-stage::after{
  pointer-events:none;
}

/* The previous generic section-title panel rule was catching hero/header title areas
   and creating a long horizontal stripe. Limit panels to content sections only. */
.page-hero .section-title,
.structured-hero .section-title,
.hero-stage .section-title,
.page-hero .wrap,
.structured-hero .wrap{
  background:transparent !important;
  box-shadow:none !important;
}

/* Remove any full-width overlay rail/band inside hero sections */
.page-hero,
.structured-hero{
  background-color:transparent !important;
  overflow:hidden;
}

.page-hero .wrap::before,
.page-hero .wrap::after,
.structured-hero .wrap::before,
.structured-hero .wrap::after,
.hero-stage .wrap::before,
.hero-stage .wrap::after{
  display:none !important;
  content:none !important;
}

/* Keep the actual hero content readable without creating a full-width stripe */
.structured-hero-grid{
  background:rgba(2, 7, 2, .52) !important;
  border:1px solid rgba(217,170,71,.20);
  box-shadow:0 18px 44px rgba(0,0,0,.30);
  padding:2rem;
}

.hero-stage-grid{
  background:rgba(2, 7, 2, .58) !important;
  border:1px solid rgba(217,170,71,.18);
  box-shadow:0 18px 44px rgba(0,0,0,.32);
}

/* Prevent panels from stretching wider than the content wrapper */
.section .wrap > .section-title{
  display:block;
  width:fit-content;
  max-width:min(780px,100%);
  margin-left:auto;
  margin-right:auto;
  padding:1.1rem 1.4rem;
  border-radius:2px;
}

/* But do not apply that panel treatment when the title is already part of a hero. */
.page-hero .section-title,
.structured-hero .section-title{
  width:auto;
  padding:0;
}

/* Header itself stays clean and flat over the darker wallpaper */
.site-header,
.theatre-header{
  background:rgba(2,5,2,.94) !important;
  background-image:none !important;
  box-shadow:0 8px 26px rgba(0,0,0,.45);
}

.site-header::before,
.site-header::after,
.theatre-header::before,
.theatre-header::after{
  display:none !important;
  content:none !important;
}



/* v2.5 hero stripe removal
   Fully removes the translucent yellow/green band below page hero sections.
*/
.page-hero::before,
.page-hero::after,
.structured-hero::before,
.structured-hero::after{
  display:none !important;
  content:none !important;
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
  height:0 !important;
}

/* Also remove the decorative top rail from the first content section directly after a hero,
   so there is no lingering stripe between the hero and the next section. */
.page-hero + .section > .wrap::before,
.structured-hero + .section > .wrap::before{
  display:none !important;
  content:none !important;
  background:none !important;
  box-shadow:none !important;
  margin:0 !important;
  height:0 !important;
}

/* Keep spacing clean after removing the band */
.page-hero + .section,
.structured-hero + .section{
  padding-top:2.4rem !important;
}



/* v2.6 fine-line cleanup
   Removes the remaining thin yellow divider/border lines the user marked in review.
*/

/* Header: remove the fine gold rule and decorative rail */
.site-header,
.theatre-header{
  border-bottom:0 !important;
  box-shadow:0 12px 36px rgba(0,0,0,.42) !important;
}
.site-header::before,
.site-header::after,
.theatre-header::before,
.theatre-header::after,
.nav::before,
.nav::after{
  display:none !important;
  content:none !important;
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
}

/* Logo lockup: remove thin border around the logo panel */
.brand{
  border:0 !important;
  background:rgba(0,0,0,.18) !important;
  box-shadow:0 0 18px rgba(93,246,47,.08) !important;
}

/* Remove fine section separator rules */
.section{
  border-top:0 !important;
}
.section > .wrap::before,
.section-divider,
.section-divider::before,
.section-divider::after{
  display:none !important;
  content:none !important;
  background:none !important;
  box-shadow:none !important;
  border:0 !important;
}

/* Hero/content junction: remove panel borders that still read as fine yellow lines */
.structured-hero-grid,
.hero-stage-grid,
.page-hero-image img,
.page-hero .wrap,
.structured-hero .wrap{
  border:0 !important;
  box-shadow:none !important;
}

/* Keep readability without line-art framing */
.structured-hero-grid{
  background:rgba(2, 7, 2, .42) !important;
}
.hero-stage-grid{
  background:rgba(2, 7, 2, .55) !important;
}
.page-hero-image img{
  background:transparent !important;
}

/* Also ensure the first content section after a hero has no top rail */
.page-hero + .section,
.structured-hero + .section{
  padding-top:2.5rem !important;
  border-top:0 !important;
}
.page-hero + .section > .wrap::before,
.structured-hero + .section > .wrap::before{
  display:none !important;
}



/* v2.7 hero/section line cleanup
   Removes the remaining fine divider line under page hero sections,
   especially visible on Digital Games.
*/
.page-hero,
.structured-hero,
.page-hero.structured-hero{
  border-bottom:0 !important;
  box-shadow:none !important;
}

.page-hero + .section,
.structured-hero + .section,
.page-hero.structured-hero + .section{
  border-top:0 !important;
  box-shadow:none !important;
  background-image:none !important;
}

.page-hero + .section::before,
.structured-hero + .section::before,
.page-hero.structured-hero + .section::before,
.page-hero + .section > .wrap::before,
.structured-hero + .section > .wrap::before,
.page-hero.structured-hero + .section > .wrap::before{
  display:none !important;
  content:none !important;
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
  height:0 !important;
}

/* Give the first section after the hero clean spacing without any rule */
.page-hero + .section,
.structured-hero + .section{
  padding-top:2.6rem !important;
}



/* v2.8 wallpaper restored
   The background must use the small repeatable wallpaper tile, not a screenshot.
*/
:root{
  --hitl-wallpaper:url('../images/wallpaper-repeat.png') !important;
}

html,
body{
  background-color:#020802 !important;
  background-image:var(--hitl-wallpaper) !important;
  background-repeat:repeat !important;
  background-size:526px 227px !important;
  background-position:left top !important;
  background-attachment:scroll !important;
}

/* Prevent any old page screenshot / hero screenshot from being used as a global background */
body,
main,
.section,
.page-hero,
.structured-hero,
.homepage-block,
.launch-pad,
.content-section{
  background-blend-mode:normal !important;
}

/* Keep page sections transparent over the real repeating wallpaper */
main,
.section,
.page-hero,
.structured-hero{
  background-color:transparent !important;
}

/* Keep the previous line cleanup */
.page-hero,
.structured-hero,
.page-hero.structured-hero{
  border-bottom:0 !important;
  box-shadow:none !important;
}

.page-hero + .section,
.structured-hero + .section,
.page-hero.structured-hero + .section{
  border-top:0 !important;
  box-shadow:none !important;
}

.page-hero + .section::before,
.structured-hero + .section::before,
.page-hero.structured-hero + .section::before,
.page-hero + .section > .wrap::before,
.structured-hero + .section > .wrap::before,
.page-hero.structured-hero + .section > .wrap::before{
  display:none !important;
  content:none !important;
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
  height:0 !important;
}


/* v2.9 homepage hero impact refinement
   - restore the distressed smoke wallpaper in the homepage hero
   - remove the boxed-in centre panel
   - let the room tile ensemble and characters scale up on wide monitors
   - keep the rest of the site on the darker repeating wallpaper
*/
.hero-stage{
  min-height:820px !important;
  background:
    radial-gradient(circle at 14% 38%, rgba(82,255,44,.12), transparent 22rem),
    radial-gradient(circle at 84% 26%, rgba(82,255,44,.10), transparent 22rem),
    linear-gradient(90deg, rgba(1,4,1,.86) 0%, rgba(2,5,2,.46) 30%, rgba(2,5,2,.38) 68%, rgba(1,4,1,.84) 100%),
    url('../images/hero-wallpaper-smoke.jpg') center center/cover no-repeat !important;
}

.hero-stage::before{
  background:
    radial-gradient(circle at 12% 46%, rgba(92,255,40,.10), transparent 20rem),
    radial-gradient(circle at 88% 44%, rgba(92,255,40,.08), transparent 18rem),
    linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.05) 42%, rgba(0,0,0,.3));
}

.hero-stage::after{
  opacity:.045 !important;
  background:url('../images/hitl-logo.png') center/70% no-repeat !important;
}

.hero-stage .wrap.hero-stage-grid{
  width:min(1520px,96vw) !important;
  max-width:none !important;
  grid-template-columns:minmax(360px, 570px) 1fr !important;
  gap:0 !important;
  min-height:790px !important;
  padding:3.2rem clamp(1rem,2.2vw,2rem) 2.4rem !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

.hero-copy{
  max-width:620px !important;
  align-self:center;
  position:relative;
  z-index:3;
}

.hero-copy .hero-logo{
  width:min(420px,82vw) !important;
  margin-bottom:1rem !important;
}

.hero-copy h1{
  font-size:clamp(4.3rem, 7vw, 7rem) !important;
  line-height:.9 !important;
  margin:.45rem 0 .7rem !important;
}

.hero-copy .lead{
  font-size:clamp(1.28rem, 1.8vw, 1.7rem) !important;
  max-width:38rem !important;
}

.hero-copy p:not(.lead){
  max-width:38rem;
  font-size:1.1rem;
}

.hero-room.hero-art-stage,
.hero-art-stage{
  min-height:760px !important;
  overflow:visible !important;
}

.room-network{
  left:54% !important;
  top:49% !important;
  width:930px !important;
  height:930px !important;
  transform:translate(-50%,-50%);
  filter:drop-shadow(0 16px 38px rgba(0,0,0,.52));
  animation:networkFloatV29 22s ease-in-out infinite !important;
}

.room-network::before{
  width:70% !important;
  height:24px !important;
  background:linear-gradient(90deg, transparent 0%, rgba(214,163,72,.10) 10%, rgba(214,163,72,.30) 50%, rgba(214,163,72,.10) 90%, transparent 100%) !important;
  box-shadow:0 0 14px rgba(110,255,72,.06) !important;
}

.room-network::after{
  width:24px !important;
  height:72% !important;
  background:linear-gradient(180deg, transparent 0%, rgba(214,163,72,.10) 10%, rgba(214,163,72,.30) 50%, rgba(214,163,72,.10) 90%, transparent 100%) !important;
  box-shadow:0 0 14px rgba(110,255,72,.06) !important;
}

.network-tile{
  width:285px !important;
  border:1px solid rgba(214,163,72,.28) !important;
  box-shadow:0 16px 34px rgba(0,0,0,.48), inset 0 0 0 1px rgba(255,255,255,.05) !important;
}

.tile-center{
  width:340px !important;
}
.tile-top{ top:0% !important; }
.tile-right{ right:1% !important; }
.tile-bottom{ bottom:0% !important; }
.tile-left{ left:1% !important; }

.hero-characters{
  left:-2% !important;
  right:auto !important;
  bottom:-1% !important;
  width:min(620px, 48vw) !important;
  z-index:6 !important;
  filter:drop-shadow(0 0 30px rgba(255,230,71,.22)) !important;
  animation:ensembleSwellV29 14s ease-in-out infinite;
}

.expansion-note{
  right:3% !important;
  bottom:12% !important;
  width:236px !important;
  background:rgba(4,4,4,.88) !important;
  border:1px solid rgba(214,163,72,.42) !important;
  box-shadow:0 18px 34px rgba(0,0,0,.42) !important;
  z-index:7 !important;
}

@keyframes networkFloatV29{
  0%,100%{transform:translate(-50%,-50%) translateY(0)}
  50%{transform:translate(-50%,-50%) translateY(-10px)}
}

@keyframes ensembleSwellV29{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(14px,-8px,0) scale(1.035)}
}

/* Bigger cinematic spread on large monitors */
@media (min-width:1500px){
  .hero-stage{min-height:900px !important;}
  .hero-stage .wrap.hero-stage-grid{
    width:min(1680px,96vw) !important;
    grid-template-columns:minmax(380px, 620px) 1fr !important;
    min-height:860px !important;
  }
  .hero-room.hero-art-stage,
  .hero-art-stage{min-height:840px !important;}
  .room-network{width:1080px !important; height:1080px !important; left:57% !important;}
  .network-tile{width:320px !important;}
  .tile-center{width:390px !important;}
  .hero-characters{width:min(760px,46vw) !important; left:-5% !important;}
  .expansion-note{right:4% !important; bottom:16% !important;}
}

@media (max-width:1300px){
  .hero-stage .wrap.hero-stage-grid{width:min(1320px,95vw) !important;}
  .room-network{width:800px !important; height:800px !important; left:53% !important;}
  .network-tile{width:245px !important;}
  .tile-center{width:295px !important;}
  .hero-characters{width:min(520px,44vw) !important; left:0 !important;}
}

@media (max-width:1100px){
  .hero-stage .wrap.hero-stage-grid{
    grid-template-columns:1fr !important;
    min-height:auto !important;
    gap:1rem !important;
    width:min(1180px,94vw) !important;
    padding-top:2.4rem !important;
    padding-bottom:1.8rem !important;
  }
  .hero-copy{max-width:none !important;}
  .hero-room.hero-art-stage,
  .hero-art-stage{min-height:620px !important;}
  .room-network{width:740px !important; height:740px !important; left:50% !important;}
  .network-tile{width:215px !important;}
  .tile-center{width:255px !important;}
  .hero-characters{left:4% !important; width:min(500px,64vw) !important;}
  .expansion-note{right:5% !important; bottom:8% !important;}
}

@media (max-width:900px){
  .hero-stage{min-height:auto !important;}
  .hero-stage .wrap.hero-stage-grid{width:min(760px,94vw) !important;}
  .hero-room.hero-art-stage,
  .hero-art-stage{min-height:540px !important;}
  .room-network{width:620px !important; height:620px !important;}
  .network-tile{width:180px !important;}
  .tile-center{width:215px !important;}
  .hero-characters{left:50% !important; transform:translateX(-50%) !important; width:min(420px,76vw) !important; bottom:0 !important;}
  .expansion-note{right:50% !important; transform:translateX(50%) !important; bottom:2% !important;}
}

@media (max-width:640px){
  .hero-copy .hero-logo{width:min(320px,80vw) !important;}
  .hero-copy h1{font-size:3.2rem !important;}
  .hero-copy .lead{font-size:1.16rem !important;}
  .hero-room.hero-art-stage,
  .hero-art-stage{min-height:450px !important;}
  .room-network{width:470px !important; height:470px !important;}
  .network-tile{width:132px !important;}
  .tile-center{width:160px !important;}
  .hero-characters{width:min(300px,82vw) !important;}
}


/* ==========================================================
   v3.0 brass / polished gold heading system
   Hybrid approach:
   - semantic HTML headings remain in place
   - selected display headings render as inline SVG artwork
   ========================================================== */
.visually-hidden{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0 0 0 0) !important;
  white-space:nowrap !important;
  border:0 !important;
}
[data-brass-heading]{
  position:relative;
  color:#f5dc96;
  text-shadow:none;
}
[data-brass-heading] .brass-heading-art{
  display:block;
  width:100%;
  height:auto;
}
[data-brass-heading][data-brass-size="hero"]{
  margin:.55rem 0 .85rem;
  max-width:min(610px,96%);
}
[data-brass-heading][data-brass-size="page"]{
  margin:.35rem 0 .8rem;
  max-width:min(860px,100%);
}
.section-title [data-brass-heading][data-brass-size="section"]{
  margin-left:auto;
  margin-right:auto;
  max-width:min(900px,100%);
}
.join-still-life [data-brass-heading],
.form-panel [data-brass-heading],
.split > div > [data-brass-heading]{
  max-width:min(760px,100%);
}
[data-brass-heading] .brass-heading-fallback{
  display:none;
}
.brass-heading-disabled [data-brass-heading] .brass-heading-art{
  display:none;
}
.brass-heading-disabled [data-brass-heading] .brass-heading-fallback{
  display:inline;
}
.brass-heading-disabled [data-brass-heading]{
  background:none !important;
  -webkit-text-fill-color:initial !important;
}
.hero-copy [data-brass-heading][data-brass-size="hero"] .brass-heading-art,
.page-hero [data-brass-heading][data-brass-size="page"] .brass-heading-art,
.section-title [data-brass-heading] .brass-heading-art,
.join-still-life [data-brass-heading] .brass-heading-art,
.form-panel [data-brass-heading] .brass-heading-art,
.split > div > [data-brass-heading] .brass-heading-art{
  filter:none;
}
@media (max-width: 900px){
  [data-brass-heading][data-brass-size="hero"]{
    max-width:min(520px,100%);
  }
  [data-brass-heading][data-brass-size="page"],
  [data-brass-heading][data-brass-size="section"]{
    max-width:100%;
  }
}


/* v3.3 bolder outline refinement */
[data-brass-heading] .brass-heading-art{
  shape-rendering:geometricPrecision;
  text-rendering:geometricPrecision;
}

/* ==========================================================
   v3.4 middle homepage refinement
   - metallic portal titles
   - richer framed imagery in the main homepage middle section
   ========================================================== */
.launch-pad .portal-cards{
  align-items:stretch;
  gap:1.3rem;
}
.launch-pad .portal-card{
  padding:1rem 1rem 1.08rem;
  background:linear-gradient(180deg,rgba(10,16,10,.97),rgba(2,5,2,.995)) !important;
  border:1px solid rgba(214,163,72,.48);
  box-shadow:0 24px 42px rgba(0,0,0,.42),inset 0 0 0 1px rgba(255,250,230,.04);
}
.launch-pad .portal-card::before{
  inset:8px;
  border:1px solid rgba(214,163,72,.14);
}
.launch-pad .portal-card::after{
  width:30px;
  height:78px;
  top:-22px;
  border-radius:18px;
  opacity:.68;
}
.launch-pad .portal-image{
  position:relative;
  height:220px;
  padding:10px;
  margin:0 0 1rem;
  border-radius:4px;
  border:1px solid rgba(255,234,166,.34);
  background:
    linear-gradient(145deg,#362108 0%,#8a631d 11%,#f7dc93 21%,#bb8b35 28%,#4a2e0d 39%,#191005 50%,#7a5418 63%,#f3d789 76%,#7a5317 89%,#2c1a07 100%);
  box-shadow:
    inset 0 0 0 1px rgba(28,14,2,.62),
    inset 0 0 24px rgba(255,233,172,.08),
    0 14px 28px rgba(0,0,0,.34);
  overflow:hidden;
}
.launch-pad .portal-image::before{
  content:"";
  position:absolute;
  inset:8px;
  border:1px solid rgba(255,241,204,.25);
  pointer-events:none;
}
.launch-pad .portal-image::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 14px 14px,rgba(255,234,166,.52) 0 2px,transparent 3px),
    radial-gradient(circle at calc(100% - 14px) 14px,rgba(255,234,166,.52) 0 2px,transparent 3px),
    radial-gradient(circle at 14px calc(100% - 14px),rgba(255,234,166,.52) 0 2px,transparent 3px),
    radial-gradient(circle at calc(100% - 14px) calc(100% - 14px),rgba(255,234,166,.52) 0 2px,transparent 3px);
  pointer-events:none;
}
.launch-pad .portal-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border:1px solid rgba(17,9,2,.88);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);
}
.launch-pad .portal-card h3{
  margin:.15rem 0 .6rem;
  max-width:100%;
  min-height:3.75rem;
  color:#f2d58b;
}
.launch-pad .portal-card h3[data-brass-heading]{
  line-height:1;
}
.launch-pad .portal-card h3 .brass-heading-art{
  display:block;
  width:100%;
  height:auto;
}
.launch-pad .portal-card p{
  margin:.25rem 0 1.1rem;
  min-height:6.1em;
}
.launch-pad .portal-card .btn{
  margin-top:auto;
}

@media (max-width:900px){
  .launch-pad .portal-image{
    height:240px;
  }
  .launch-pad .portal-card h3{
    min-height:auto;
  }
  .launch-pad .portal-card p{
    min-height:auto;
  }
}

/* ==========================================================
   v3.5 homepage middle section refinement
   - more ornate image frames
   - flat coloured portal titles sized to avoid clipping
   ========================================================== */
.launch-pad .portal-card{
  padding:1.1rem 1.1rem 1.12rem;
}

.launch-pad .portal-image{
  height:228px;
  padding:14px;
  border-radius:5px;
  border:1px solid rgba(255,225,145,.34);
  background:
    linear-gradient(135deg,#1e1204 0%,#6d4a15 8%,#d9b15a 14%,#f7e5af 18%,#a26f26 24%,#3a2409 30%,#201305 37%,#7f591a 45%,#f7e9b5 54%,#9c6c24 61%,#291906 68%,#5f3f12 76%,#e0bf6c 84%,#6d4a15 92%,#241506 100%);
  box-shadow:
    0 16px 32px rgba(0,0,0,.36),
    inset 0 0 0 1px rgba(44,22,4,.86),
    inset 0 0 0 3px rgba(255,240,192,.08),
    inset 0 0 18px rgba(255,228,143,.08);
}
.launch-pad .portal-image::before{
  inset:10px;
  border:1px solid rgba(255,241,204,.26);
  box-shadow:inset 0 0 0 1px rgba(54,29,8,.78);
}
.launch-pad .portal-image::after{
  inset:0;
  background:
    radial-gradient(circle at 18px 18px,rgba(255,231,156,.96) 0 2px,transparent 3px),
    radial-gradient(circle at calc(100% - 18px) 18px,rgba(255,231,156,.96) 0 2px,transparent 3px),
    radial-gradient(circle at 18px calc(100% - 18px),rgba(255,231,156,.96) 0 2px,transparent 3px),
    radial-gradient(circle at calc(100% - 18px) calc(100% - 18px),rgba(255,231,156,.96) 0 2px,transparent 3px),
    conic-gradient(from 180deg at 18px 18px, rgba(0,0,0,0) 0 25%, rgba(255,226,148,.95) 0 28%, rgba(110,72,18,.95) 0 38%, rgba(0,0,0,0) 0 100%),
    conic-gradient(from 270deg at calc(100% - 18px) 18px, rgba(0,0,0,0) 0 25%, rgba(255,226,148,.95) 0 28%, rgba(110,72,18,.95) 0 38%, rgba(0,0,0,0) 0 100%),
    conic-gradient(from 90deg at 18px calc(100% - 18px), rgba(0,0,0,0) 0 25%, rgba(255,226,148,.95) 0 28%, rgba(110,72,18,.95) 0 38%, rgba(0,0,0,0) 0 100%),
    conic-gradient(from 0deg at calc(100% - 18px) calc(100% - 18px), rgba(0,0,0,0) 0 25%, rgba(255,226,148,.95) 0 28%, rgba(110,72,18,.95) 0 38%, rgba(0,0,0,0) 0 100());
  opacity:.92;
}
.launch-pad .portal-image img{
  position:relative;
  z-index:1;
  border:1px solid rgba(20,11,2,.94);
}
.launch-pad .portal-image .frame-crest{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:2;
}
.launch-pad .portal-image .frame-crest::before,
.launch-pad .portal-image .frame-crest::after{
  content:"";
  position:absolute;
  left:50%;
  width:56px;
  height:18px;
  transform:translateX(-50%);
  background:
    radial-gradient(circle at 50% 50%, rgba(255,232,168,.95) 0 2px, transparent 3px),
    linear-gradient(90deg, transparent 0, rgba(255,228,145,.9) 22%, rgba(94,63,18,.95) 50%, rgba(255,228,145,.9) 78%, transparent 100%);
  filter:drop-shadow(0 1px 0 rgba(20,10,1,.8));
}
.launch-pad .portal-image .frame-crest::before{
  top:6px;
  clip-path:path('M 2 13 C 10 2, 18 2, 28 10 C 38 2, 46 2, 54 13 L 47 13 C 43 9, 38 8, 33 11 C 31 12, 30 13, 28 13 C 26 13, 25 12, 23 11 C 18 8, 13 9, 9 13 Z');
}
.launch-pad .portal-image .frame-crest::after{
  bottom:6px;
  transform:translateX(-50%) rotate(180deg);
  clip-path:path('M 2 13 C 10 2, 18 2, 28 10 C 38 2, 46 2, 54 13 L 47 13 C 43 9, 38 8, 33 11 C 31 12, 30 13, 28 13 C 26 13, 25 12, 23 11 C 18 8, 13 9, 9 13 Z');
}

.launch-pad .portal-card h3,
.launch-pad .portal-card h3[data-brass-heading],
.launch-pad .portal-card .portal-title{
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(1.8rem,1.1rem + 1vw,2.55rem);
  line-height:.94;
  letter-spacing:.01em;
  margin:.12rem 0 .72rem;
  max-width:100%;
  min-height:4.2rem;
  text-shadow:none !important;
  filter:none !important;
}
.launch-pad .portal-card .portal-title span{
  display:inline;
}
.launch-pad .portal-card .portal-title.flat-emerald{ color:#4df264; }
.launch-pad .portal-card .portal-title.flat-amethyst{ color:#ce8cff; }
.launch-pad .portal-card .portal-title.flat-ruby{ color:#ff5966; }

.launch-pad .portal-card p{
  min-height:5.6em;
}

@media (max-width:1180px){
  .launch-pad .portal-card .portal-title{
    font-size:clamp(1.55rem,1.15rem + 1vw,2.1rem);
    min-height:3.7rem;
  }
}
@media (max-width:900px){
  .launch-pad .portal-image{
    height:240px;
  }
  .launch-pad .portal-image .frame-crest::before,
  .launch-pad .portal-image .frame-crest::after{
    width:48px;
  }
  .launch-pad .portal-card .portal-title,
  .launch-pad .portal-card h3{
    min-height:auto;
    font-size:2rem;
  }
  .launch-pad .portal-card p{
    min-height:auto;
  }
}

/* ==========================================================
   v3.6 homepage middle section refinement
   - gold portal titles that fit the cards cleanly
   ========================================================== */
.launch-pad .portal-card h3[data-brass-heading]{
  margin:.22rem 0 .78rem;
  min-height:5rem;
  max-width:100%;
  overflow:visible;
}
.launch-pad .portal-card h3[data-brass-heading] .brass-heading-art{
  display:block;
  width:100%;
  height:auto;
}
.launch-pad .portal-card p{
  min-height:5.7em;
}
@media (max-width:900px){
  .launch-pad .portal-card h3[data-brass-heading]{
    min-height:auto;
  }
  .launch-pad .portal-card p{
    min-height:auto;
  }
}


/* v3.7 card title fit
   Keeps the homepage middle-card gold title point size consistent,
   prevents SVG title clipping, and renames VR Game to VR Escape Game.
*/
.launch-pad .portal-card h3[data-brass-heading]{
  width:100%;
  max-width:100%;
  overflow:visible !important;
  min-height:5.45rem;
  margin:.2rem 0 .65rem;
}
.launch-pad .portal-card h3[data-brass-heading] .brass-heading-art{
  width:100%;
  max-width:100%;
  overflow:visible !important;
  display:block;
}
.launch-pad .portal-card{
  overflow:visible;
}
.launch-pad .portal-card p{
  margin-top:.25rem;
}
@media (max-width:900px){
  .launch-pad .portal-card h3[data-brass-heading]{
    min-height:auto;
  }
}


/* v3.8 homepage card image/copy update */
.launch-pad .portal-card p{
  min-height:6.6em;
}
.launch-pad .portal-card:nth-child(1) .portal-image img{object-position:center center;}
.launch-pad .portal-card:nth-child(2) .portal-image img{object-position:center 32%;}
.launch-pad .portal-card:nth-child(3) .portal-image img{object-position:center center;}
.launch-pad .portal-card:nth-child(4) .portal-image img{object-position:center center;}
@media (max-width: 1200px){
  .launch-pad .portal-card p{min-height:7.2em;}
}
@media (max-width: 900px){
  .launch-pad .portal-card p{min-height:auto;}
}


/* ==========================================================
   v3.9 homepage public proof section
   Replaces the flat PR/event gallery with a credibility-led section.
   ========================================================== */
.public-proof{
  position:relative;
  overflow:hidden;
}
.public-proof::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 18% 18%,rgba(92,255,48,.08),transparent 22rem),
    radial-gradient(circle at 82% 60%,rgba(217,170,71,.10),transparent 26rem);
  pointer-events:none;
}
.public-proof .wrap{
  position:relative;
  z-index:1;
}
.proof-stage{
  display:grid;
  grid-template-columns:.92fr 1.08fr;
  gap:1.25rem;
  align-items:stretch;
  margin-top:1.6rem;
}
.proof-lead{
  position:relative;
  background:
    linear-gradient(180deg,rgba(12,18,10,.94),rgba(3,6,3,.98));
  border:1px solid rgba(214,163,72,.45);
  box-shadow:0 22px 48px rgba(0,0,0,.42), inset 0 0 0 1px rgba(255,250,230,.04);
  padding:1.5rem;
  min-height:100%;
}
.proof-lead::before,
.proof-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.16);
  pointer-events:none;
}
.proof-lead h3,
.proof-card h3{
  color:#f3d47a;
  font-size:1.55rem;
  line-height:1.05;
  margin:.1rem 0 .65rem;
}
.proof-lead p,
.proof-card p{
  color:#d9c89a;
}
.proof-badges{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  margin-top:1.25rem;
}
.proof-badges span{
  border:1px solid rgba(214,163,72,.42);
  color:#f2d58b;
  background:rgba(217,170,71,.08);
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.68rem;
  padding:.42rem .55rem;
}
.proof-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:1rem;
}
.proof-card{
  position:relative;
  background:
    linear-gradient(180deg,rgba(8,14,8,.94),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.34);
  box-shadow:0 16px 34px rgba(0,0,0,.32);
  padding:1.15rem;
}
.proof-gallery{
  display:grid;
  grid-template-columns:1.25fr 1fr 1fr;
  grid-auto-rows:210px;
  gap:1rem;
  margin-top:1.25rem;
}
.proof-photo{
  position:relative;
  display:block;
  overflow:hidden;
  border:1px solid rgba(214,163,72,.45);
  background:#050705;
  box-shadow:0 18px 36px rgba(0,0,0,.38);
}
.proof-photo::before{
  content:"";
  position:absolute;
  inset:8px;
  border:1px solid rgba(255,236,174,.18);
  z-index:2;
  pointer-events:none;
}
.proof-photo.large{
  grid-row:span 2;
}
.proof-photo.wide{
  grid-column:span 2;
}
.proof-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:saturate(.95) brightness(.86);
  transition:.3s ease;
}
.proof-photo:hover img{
  transform:scale(1.035);
  filter:saturate(1.05) brightness(.98);
}
.proof-photo span{
  position:absolute;
  left:.75rem;
  right:.75rem;
  bottom:.7rem;
  z-index:3;
  display:block;
  padding:.48rem .55rem;
  color:#f5dc96;
  background:rgba(0,0,0,.66);
  border:1px solid rgba(214,163,72,.28);
  text-transform:uppercase;
  letter-spacing:.07em;
  font-size:.72rem;
}
.proof-actions{
  margin-top:1.4rem;
}
@media (max-width:1100px){
  .proof-stage{
    grid-template-columns:1fr;
  }
  .proof-gallery{
    grid-template-columns:repeat(2,1fr);
  }
  .proof-photo.large{
    grid-row:span 1;
  }
}
@media (max-width:720px){
  .proof-grid,
  .proof-gallery{
    grid-template-columns:1fr;
  }
  .proof-gallery{
    grid-auto-rows:230px;
  }
  .proof-photo.wide{
    grid-column:span 1;
  }
}


/* ==========================================================
   v4.0 event logos and flags
   - ornate framed convention/expo logo wall
   - open SVG territory flags
   ========================================================== */
.proof-territory{margin-top:1.5rem}
.proof-country-ribbon{
  display:flex;flex-wrap:wrap;justify-content:center;gap:.7rem;
  margin:0 0 1.35rem;padding:0;
}
.country-pill{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.48rem .72rem;
  background:linear-gradient(180deg,rgba(7,12,7,.92),rgba(2,5,2,.98));
  border:1px solid rgba(214,163,72,.45);
  box-shadow:0 12px 28px rgba(0,0,0,.26), inset 0 0 0 1px rgba(255,244,200,.05);
  color:#f1d78f;text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;
}
.country-pill img{width:24px;height:16px;display:block;border:1px solid rgba(255,244,200,.18)}
.proof-logo-wall{
  position:relative;
  margin-top:.4rem;
  padding:1.35rem;
  border:1px solid rgba(214,163,72,.32);
  background:linear-gradient(180deg,rgba(5,10,5,.5),rgba(2,5,2,.15));
  box-shadow:inset 0 0 0 1px rgba(255,241,192,.03),0 18px 40px rgba(0,0,0,.22);
}
.proof-wall-title{margin-bottom:1.2rem}
.proof-wall-title h3{color:#f3d47a;font-size:1.55rem;line-height:1.05;margin:.2rem 0 .45rem}
.proof-logo-grid{
  display:grid;gap:1rem;
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.event-logo-card{
  position:relative;
  display:flex;flex-direction:column;gap:.55rem;
}
.event-logo-card strong{
  display:block;text-align:center;color:#e9d9ab;
  text-transform:uppercase;letter-spacing:.08em;font-size:.78rem;
}
.event-logo-frame{
  position:relative;height:138px;padding:12px;overflow:hidden;
  border-radius:5px;border:1px solid rgba(255,225,145,.34);
  background:
    linear-gradient(135deg,#1e1204 0%,#6d4a15 8%,#d9b15a 14%,#f7e5af 18%,#a26f26 24%,#3a2409 30%,#201305 37%,#7f591a 45%,#f7e9b5 54%,#9c6c24 61%,#291906 68%,#5f3f12 76%,#e0bf6c 84%,#6d4a15 92%,#241506 100%);
  box-shadow:
    0 16px 32px rgba(0,0,0,.36),
    inset 0 0 0 1px rgba(44,22,4,.86),
    inset 0 0 0 3px rgba(255,240,192,.08),
    inset 0 0 18px rgba(255,228,143,.08);
}
.event-logo-frame::before{
  content:"";position:absolute;inset:10px;
  border:1px solid rgba(255,241,204,.26);
  box-shadow:inset 0 0 0 1px rgba(54,29,8,.78);
}
.event-logo-frame::after{
  content:"";position:absolute;inset:0;opacity:.92;pointer-events:none;
  background:
    radial-gradient(circle at 18px 18px,rgba(255,231,156,.96) 0 2px,transparent 3px),
    radial-gradient(circle at calc(100% - 18px) 18px,rgba(255,231,156,.96) 0 2px,transparent 3px),
    radial-gradient(circle at 18px calc(100% - 18px),rgba(255,231,156,.96) 0 2px,transparent 3px),
    radial-gradient(circle at calc(100% - 18px) calc(100% - 18px),rgba(255,231,156,.96) 0 2px,transparent 3px),
    conic-gradient(from 180deg at 18px 18px, rgba(0,0,0,0) 0 25%, rgba(255,226,148,.95) 0 28%, rgba(110,72,18,.95) 0 38%, rgba(0,0,0,0) 0 100%),
    conic-gradient(from 270deg at calc(100% - 18px) 18px, rgba(0,0,0,0) 0 25%, rgba(255,226,148,.95) 0 28%, rgba(110,72,18,.95) 0 38%, rgba(0,0,0,0) 0 100%),
    conic-gradient(from 90deg at 18px calc(100% - 18px), rgba(0,0,0,0) 0 25%, rgba(255,226,148,.95) 0 28%, rgba(110,72,18,.95) 0 38%, rgba(0,0,0,0) 0 100%),
    conic-gradient(from 0deg at calc(100% - 18px) calc(100% - 18px), rgba(0,0,0,0) 0 25%, rgba(255,226,148,.95) 0 28%, rgba(110,72,18,.95) 0 38%, rgba(0,0,0,0) 0 100());
}
.event-logo-frame .frame-crest{position:absolute;inset:0;pointer-events:none;z-index:2}
.event-logo-frame .frame-crest::before,
.event-logo-frame .frame-crest::after{
  content:"";position:absolute;left:50%;width:56px;height:18px;transform:translateX(-50%);
  background:
    radial-gradient(circle at 50% 50%, rgba(255,232,168,.95) 0 2px, transparent 3px),
    linear-gradient(90deg, transparent 0, rgba(255,228,145,.9) 22%, rgba(94,63,18,.95) 50%, rgba(255,228,145,.9) 78%, transparent 100%);
  filter:drop-shadow(0 1px 0 rgba(20,10,1,.8));
}
.event-logo-frame .frame-crest::before{
  top:6px;
  clip-path:path('M 2 13 C 10 2, 18 2, 28 10 C 38 2, 46 2, 54 13 L 47 13 C 43 9, 38 8, 33 11 C 31 12, 30 13, 28 13 C 26 13, 25 12, 23 11 C 18 8, 13 9, 9 13 Z');
}
.event-logo-frame .frame-crest::after{
  bottom:6px;transform:translateX(-50%) rotate(180deg);
  clip-path:path('M 2 13 C 10 2, 18 2, 28 10 C 38 2, 46 2, 54 13 L 47 13 C 43 9, 38 8, 33 11 C 31 12, 30 13, 28 13 C 26 13, 25 12, 23 11 C 18 8, 13 9, 9 13 Z');
}
.event-logo-frame img{
  position:relative;z-index:1;width:100%;height:100%;display:block;object-fit:contain;
  background:rgba(9,14,9,.9);padding:10px;border:1px solid rgba(20,11,2,.94)
}
@media (max-width:1000px){
  .proof-logo-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media (max-width:760px){
  .proof-logo-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .proof-logo-wall{padding:1rem;}
}
@media (max-width:520px){
  .proof-country-ribbon{justify-content:flex-start}
  .proof-logo-grid{grid-template-columns:1fr;}
}


/* ==========================================================
   v4.2 What Makes the Game Special section
   Adds replayability/stat proof without using the AI-style source image.
   ========================================================== */
.game-special{
  position:relative;
  overflow:hidden;
}
.game-special::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 16% 22%,rgba(92,255,48,.10),transparent 22rem),
    radial-gradient(circle at 82% 34%,rgba(133,46,201,.10),transparent 26rem),
    linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.24));
  pointer-events:none;
}
.game-special .wrap{
  position:relative;
  z-index:1;
}
.special-stage{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:1.35rem;
  align-items:stretch;
  margin-top:1.65rem;
}
.special-manifesto{
  position:relative;
  padding:1.45rem;
  background:
    radial-gradient(circle at 50% 0%,rgba(132,44,201,.16),transparent 16rem),
    linear-gradient(180deg,rgba(16,8,16,.92),rgba(5,4,5,.98));
  border:1px solid rgba(214,163,72,.48);
  box-shadow:0 22px 52px rgba(0,0,0,.44), inset 0 0 0 1px rgba(255,241,192,.04);
}
.special-manifesto::before,
.special-stat-card::before,
.replayability-callout::before{
  content:"";
  position:absolute;
  inset:8px;
  border:1px solid rgba(214,163,72,.18);
  pointer-events:none;
}
.special-manifesto h3,
.replayability-callout h3{
  margin:.15rem 0 .75rem;
  color:#f3d47a;
  font-size:1.65rem;
  line-height:1.05;
}
.special-manifesto h3[data-brass-heading]{
  max-width:100%;
  margin:.05rem 0 1rem;
}
.special-manifesto h3[data-brass-heading] .brass-heading-art{
  display:block;
  width:100%;
  height:auto;
}
.special-manifesto p{
  color:#dfd0a7;
}
.special-tags{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  margin-top:1.2rem;
}
.special-tags span{
  display:inline-flex;
  align-items:center;
  padding:.42rem .58rem;
  color:#f4d182;
  border:1px solid rgba(214,163,72,.38);
  background:rgba(217,170,71,.08);
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.68rem;
}
.special-stat-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
}
.special-stat-card{
  position:relative;
  padding:1rem .92rem 1.08rem;
  text-align:center;
  background:
    linear-gradient(180deg,rgba(9,15,9,.96),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.45);
  box-shadow:0 20px 42px rgba(0,0,0,.38), inset 0 0 0 1px rgba(255,241,192,.04);
  overflow:hidden;
}
.special-stat-card::after{
  content:"";
  position:absolute;
  left:50%;
  top:-36px;
  width:40px;
  height:120px;
  transform:translateX(-50%);
  border:1px solid rgba(214,163,72,.45);
  border-radius:22px;
  background:radial-gradient(circle at 50% 50%,rgba(72,255,38,.65),rgba(72,255,38,.08) 34%,transparent 66%);
  opacity:.65;
}
.stat-icon{
  position:relative;
  z-index:1;
  height:132px;
  margin:0 auto .8rem;
  padding:12px;
  border-radius:5px;
  border:1px solid rgba(255,225,145,.34);
  background:
    linear-gradient(135deg,#1e1204 0%,#6d4a15 8%,#d9b15a 14%,#f7e5af 18%,#a26f26 24%,#3a2409 30%,#201305 37%,#7f591a 45%,#f7e9b5 54%,#9c6c24 61%,#291906 68%,#5f3f12 76%,#e0bf6c 84%,#6d4a15 92%,#241506 100%);
  box-shadow:0 16px 32px rgba(0,0,0,.32), inset 0 0 0 1px rgba(44,22,4,.86), inset 0 0 18px rgba(255,228,143,.08);
}
.stat-icon::before{
  content:"";
  position:absolute;
  inset:9px;
  border:1px solid rgba(255,241,204,.22);
  pointer-events:none;
  z-index:2;
}
.stat-icon img{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  background:rgba(7,11,7,.9);
  border:1px solid rgba(20,11,2,.94);
}
.special-stat-card:nth-child(1) .stat-icon img{
  object-fit:contain;
  padding:.2rem;
}
.special-stat-card strong{
  display:block;
  position:relative;
  z-index:1;
  margin:.25rem 0 .2rem;
  color:#f7d98e;
  font-family:var(--font-display);
  font-size:clamp(2.45rem,3.4vw,3.45rem);
  line-height:.9;
  text-shadow:0 2px 0 #160800, 0 0 18px rgba(217,170,71,.18);
}
.special-stat-card h3{
  position:relative;
  z-index:1;
  margin:.2rem auto .5rem;
  color:#f2d58b;
  font-size:1.08rem;
  line-height:1.04;
  text-transform:uppercase;
  letter-spacing:.03em;
  min-height:2.25em;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.special-stat-card p{
  position:relative;
  z-index:1;
  color:#d8c89b;
  font-size:.94rem;
  margin-bottom:0;
}
.replayability-callout{
  position:relative;
  margin:1.2rem auto 0;
  max-width:860px;
  text-align:center;
  padding:1.2rem 1.6rem;
  background:
    radial-gradient(circle at 50% 0%,rgba(217,170,71,.10),transparent 18rem),
    linear-gradient(180deg,rgba(16,8,16,.86),rgba(4,4,4,.94));
  border:1px solid rgba(214,163,72,.45);
  box-shadow:0 20px 48px rgba(0,0,0,.36);
}
.replayability-callout h3{
  font-size:1.85rem;
  margin-bottom:.35rem;
}
.replayability-callout p{
  color:#f1ddb3;
  max-width:720px;
  margin:.3rem auto 0;
}
@media (max-width:1100px){
  .special-stage{
    grid-template-columns:1fr;
  }
}
@media (max-width:860px){
  .special-stat-grid{
    grid-template-columns:1fr;
  }
  .stat-icon{
    height:200px;
  }
}


/* ==========================================================
   v4.3 Framed board game photography in Public Proof
   ========================================================== */
.framed-proof-gallery{
  margin-top:1.5rem;
}
.tabletop-wall-title{
  margin-bottom:1rem;
}
.framed-proof-grid{
  display:grid;
  grid-template-columns:1.3fr 1fr 1fr;
  gap:1rem;
  align-items:stretch;
}
.framed-proof-card{
  display:flex;
  flex-direction:column;
  gap:.75rem;
  padding:0;
}
.framed-proof-card strong{
  color:#f0d48a;
  font-size:1.15rem;
  letter-spacing:.02em;
}
.framed-proof-card p{
  margin:0;
  color:#d8c89b;
}
.proof-photo-frame{
  aspect-ratio:4/3;
}
.proof-photo-frame img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border:1px solid rgba(20,11,2,.94);
  background:#111;
}
.framed-proof-card--large .proof-photo-frame{
  aspect-ratio:16/10;
}
@media (max-width:980px){
  .framed-proof-grid{
    grid-template-columns:1fr;
  }
  .framed-proof-card--large .proof-photo-frame,
  .proof-photo-frame{
    aspect-ratio:4/3;
  }
}


/* ==========================================================
   v4.4 special-section image fix
   Uses the supplied real board-game photos in the three statistic frames.
   ========================================================== */
.game-special .stat-icon{
  height:150px;
}
.game-special .stat-icon img{
  object-fit:cover !important;
  padding:0 !important;
}
.special-stat-card:nth-child(1) .stat-icon img{
  object-position:center 42%;
}
.special-stat-card:nth-child(2) .stat-icon img{
  object-position:center 54%;
}
.special-stat-card:nth-child(3) .stat-icon img{
  object-position:center 46%;
}
@media (max-width:860px){
  .game-special .stat-icon{
    height:220px;
  }
}


/* ==========================================================
   v4.5 Public Proof layout fix
   Prevents the At The Table gallery from collapsing into the
   country flags / show-circuit section.
   ========================================================== */
.public-proof .proof-gallery.framed-proof-gallery{
  display:block !important;
  grid-template-columns:none !important;
  grid-auto-rows:auto !important;
  margin-top:2rem;
  clear:both;
}
.framed-proof-gallery .tabletop-wall-title{
  display:block;
  max-width:860px;
  margin:0 auto 1.25rem;
  text-align:center;
}
.framed-proof-gallery .tabletop-wall-title h3{
  color:#f3d47a;
  font-size:clamp(1.8rem,3vw,2.65rem);
  line-height:1.02;
  margin:.25rem 0 .55rem;
}
.framed-proof-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.15rem;
  align-items:stretch;
  width:100%;
  margin:0 auto;
}
.framed-proof-card,
.framed-proof-card.framed-proof-card--large{
  position:relative;
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:100%;
  padding:1rem;
  background:linear-gradient(180deg,rgba(9,15,9,.94),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.35);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}
.framed-proof-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.14);
  pointer-events:none;
}
.framed-proof-card .proof-photo-frame,
.framed-proof-card--large .proof-photo-frame{
  aspect-ratio:16/10;
  width:100%;
  height:auto;
  flex:0 0 auto;
}
.framed-proof-card strong{
  position:relative;
  z-index:2;
  display:block;
  margin:.9rem 0 .35rem;
  color:#f0d48a;
  font-size:1.25rem;
  line-height:1.05;
}
.framed-proof-card p{
  position:relative;
  z-index:2;
  margin:0;
  color:#d8c89b;
}
.proof-territory{
  clear:both;
  margin-top:2.2rem !important;
  padding-top:.4rem;
}
.proof-country-ribbon{
  position:relative;
  z-index:3;
  margin-bottom:1.5rem !important;
}
@media (max-width:1000px){
  .framed-proof-grid{
    grid-template-columns:1fr;
    max-width:760px;
  }
  .framed-proof-card .proof-photo-frame,
  .framed-proof-card--large .proof-photo-frame{
    aspect-ratio:16/9;
  }
}

/* ==========================================================
   v4.6 public proof event photos
   Adds framed convention photos into the public-proof cards.
   ========================================================== */
.proof-grid--with-photos{
  align-items:stretch;
}
.proof-card--photo{
  display:flex;
  flex-direction:column;
  padding:1rem;
}
.proof-card-media{
  margin:0 0 .95rem;
  width:100%;
  aspect-ratio:16/10;
  flex:0 0 auto;
}
.proof-card-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.proof-card--photo h3{
  margin:.1rem 0 .55rem;
}
.proof-card--photo p{
  margin:0;
}
@media (max-width:720px){
  .proof-card-media{ aspect-ratio:16/9; }
}


/* ==========================================================
   v4.7 Seen / Played / Demonstrated photo block
   Pulls the text block tighter into the section and adds a real event photo.
   ========================================================== */
.proof-lead.proof-lead-with-photo{
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
  padding:1.1rem;
}
.proof-lead-copy{
  position:relative;
  z-index:2;
}
.proof-lead-photo{
  position:relative;
  z-index:2;
  height:auto;
  aspect-ratio:16/10;
  padding:12px;
}
.proof-lead-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  display:block;
  background:#050705;
  border:1px solid rgba(20,11,2,.94);
}
.proof-stage{
  align-items:start;
}
@media (max-width:1100px){
  .proof-lead.proof-lead-with-photo{
    grid-template-columns:1fr 1fr;
    align-items:center;
  }
}
@media (max-width:720px){
  .proof-lead.proof-lead-with-photo{
    grid-template-columns:1fr;
  }
}


/* ==========================================================
   v4.9 Special stats no-crop fix
   The previous fix improved the headline, but the real visible
   issue was the 56 Million / 200 Billion stat values overflowing
   narrow cards. These are now stacked and constrained.
   ========================================================== */
.special-stage{
  grid-template-columns:minmax(360px,.86fr) minmax(620px,1.14fr);
  gap:1.25rem;
}
.special-stat-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
}
.special-stat-card{
  overflow:visible !important;
  padding:1rem .8rem 1.15rem;
}
.special-stat-card strong,
.special-stat-card .stat-value{
  display:flex !important;
  position:relative;
  z-index:3;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:100%;
  max-width:100%;
  margin:.28rem auto .28rem;
  color:#f7d98e;
  font-family:var(--font-display);
  line-height:.88;
  text-align:center;
  white-space:normal;
  overflow:visible;
  text-shadow:0 2px 0 #160800, 0 0 18px rgba(217,170,71,.18);
}
.special-stat-card .stat-value span{
  display:block;
  font-size:clamp(2.6rem,3.35vw,3.55rem);
  line-height:.82;
}
.special-stat-card .stat-value em{
  display:block;
  margin-top:.05rem;
  font-style:normal;
  font-size:clamp(1.85rem,2.35vw,2.55rem);
  line-height:.86;
}
.special-stat-card .stat-value--stack span{
  font-size:clamp(2.35rem,3vw,3.15rem);
}
.special-stat-card h3{
  min-height:2.4em;
  margin:.25rem auto .55rem;
  font-size:clamp(.86rem,.95vw,1.02rem);
  line-height:1;
  padding:0 .1rem;
}
.special-stat-card p{
  font-size:.93rem;
  line-height:1.42;
}
.special-manifesto h3[data-brass-heading]{
  max-width:94%;
}
.special-manifesto h3[data-brass-heading] .brass-heading-art{
  max-width:100%;
  overflow:visible;
}
@media (max-width:1180px){
  .special-stage{
    grid-template-columns:1fr;
  }
  .special-stat-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
@media (max-width:860px){
  .special-stat-grid{
    grid-template-columns:1fr;
  }
  .special-stat-card .stat-value span,
  .special-stat-card .stat-value--stack span{
    font-size:3.3rem;
  }
  .special-stat-card .stat-value em{
    font-size:2.45rem;
  }
  .special-stat-card h3{
    min-height:auto;
  }
}


/* ==========================================================
   v5.0 Board Game page foundation
   ========================================================== */
.board-page-hero{position:relative;overflow:hidden;padding:5.5rem 0 3rem;background:radial-gradient(circle at 14% 36%,rgba(92,255,48,.12),transparent 22rem),radial-gradient(circle at 88% 22%,rgba(217,170,71,.10),transparent 22rem),linear-gradient(90deg,rgba(1,4,1,.90),rgba(2,5,2,.54),rgba(1,4,1,.92)),url('../images/hero-wallpaper-smoke.jpg') center/cover no-repeat}
.board-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,.88fr);gap:2rem;align-items:center}
.board-hero-copy .lead{font-size:clamp(1.25rem,1.9vw,1.65rem);color:#f1ddb3}
.board-hero-art,.board-feature-image,.mode-image,.board-proof-grid .event-logo-frame{padding:14px;aspect-ratio:4/3}
.board-hero-art img,.board-feature-image img,.mode-image img,.component-gallery img,.board-proof-grid img{width:100%;height:100%;object-fit:cover;display:block;border:1px solid rgba(20,11,2,.94)}
.quick-facts{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1.2rem}.quick-facts span,.proof-badges span{border:1px solid rgba(214,163,72,.42);color:#f2d58b;background:rgba(217,170,71,.08);text-transform:uppercase;letter-spacing:.08em;font-size:.68rem;padding:.42rem .55rem}
.board-anchor-bar{position:sticky;top:76px;z-index:10;background:rgba(2,5,2,.95);border-block:1px solid rgba(214,163,72,.24)}
.board-anchor-bar .wrap{display:flex;flex-wrap:wrap;justify-content:center;gap:.35rem;padding:.55rem 0}.board-anchor-bar a{color:#f2d58b;text-decoration:none;text-transform:uppercase;letter-spacing:.07em;font-size:.72rem;padding:.42rem .58rem;border:1px solid transparent}.board-anchor-bar a:hover{border-color:rgba(214,163,72,.35);background:rgba(217,170,71,.08)}
.board-split,.board-proof-grid,.closing-world-frame{display:grid;grid-template-columns:1fr .88fr;gap:1.5rem;align-items:center}
.board-feature-grid,.mechanics-cabinet,.support-grid,.buy-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.board-feature-grid article,.mechanics-cabinet article,.support-grid article,.buy-product-grid article,.mode-card,.play-flow article,.expansion-showcase article{position:relative;padding:1.15rem;background:linear-gradient(180deg,rgba(9,15,9,.94),rgba(2,4,2,.99));border:1px solid rgba(214,163,72,.36);box-shadow:0 18px 38px rgba(0,0,0,.34)}
.board-feature-grid article::before,.mechanics-cabinet article::before,.support-grid article::before,.buy-product-grid article::before,.mode-card::before,.play-flow article::before,.expansion-showcase article::before{content:"";position:absolute;inset:7px;border:1px solid rgba(214,163,72,.13);pointer-events:none}
.board-feature-grid h3,.mechanics-cabinet h3,.support-grid h3,.buy-product-grid h3,.mode-card h3,.board-proof-grid h3,.play-flow h3,.expansion-showcase h3{color:#f0d48a;line-height:1.05}
.mode-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem}.mode-image{aspect-ratio:16/10;margin-bottom:1rem}.mode-card ul{color:#d8c89b}
.play-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}.play-flow span{display:grid;place-items:center;width:42px;height:42px;color:#0c0600;background:linear-gradient(180deg,#fff1b8,#d29b24,#7a4b05);border-radius:50%;font-weight:bold;margin-bottom:.8rem}
.expansion-showcase{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem}.expansion-showcase article{display:flex;flex-direction:column;gap:.6rem}.expansion-showcase img{width:100%;height:130px;object-fit:contain;background:rgba(0,0,0,.32);border:1px solid rgba(214,163,72,.18)}.expansion-showcase p{flex:1}
.component-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}.component-gallery figure{margin:0;padding:12px;aspect-ratio:4/3}.component-gallery figcaption{position:absolute;left:1rem;right:1rem;bottom:1rem;background:rgba(0,0,0,.66);color:#f5dc96;border:1px solid rgba(214,163,72,.28);padding:.45rem .5rem;text-transform:uppercase;letter-spacing:.06em;font-size:.72rem}
.board-proof-grid{background:linear-gradient(180deg,rgba(9,15,9,.9),rgba(2,4,2,.98));border:1px solid rgba(214,163,72,.34);padding:1rem}.board-proof-grid .event-logo-frame{aspect-ratio:16/10}
.buy-product-grid .price{font-size:3rem;color:#f3d15f;margin:.2rem 0}.center-note{text-align:center;margin-top:1rem}
.closing-world-frame{border:1px solid rgba(214,163,72,.45);background:linear-gradient(90deg,rgba(2,4,2,.96),rgba(9,14,8,.92));box-shadow:0 25px 70px rgba(0,0,0,.55);padding:1.5rem}.closing-world-frame img{width:100%;max-height:360px;object-fit:contain;filter:drop-shadow(0 0 22px rgba(255,230,71,.20))}
@media (max-width:1180px){.board-hero-grid,.board-split,.board-proof-grid,.closing-world-frame{grid-template-columns:1fr}.expansion-showcase{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){.board-anchor-bar{position:relative;top:auto}.board-feature-grid,.mechanics-cabinet,.support-grid,.buy-product-grid,.mode-grid,.play-flow,.component-gallery,.expansion-showcase{grid-template-columns:1fr}.board-page-hero{padding-top:3rem}}


/* ==========================================================
   v5.1 Board Game page image upgrade
   ========================================================== */

.board-page-hero--impact{background:
  linear-gradient(90deg,rgba(1,4,1,.95) 0%,rgba(1,4,1,.88) 28%,rgba(1,4,1,.64) 60%,rgba(1,4,1,.90) 100%),
  radial-gradient(circle at 18% 30%,rgba(93,255,67,.15),transparent 26rem),
  radial-gradient(circle at 84% 22%,rgba(232,190,96,.12),transparent 22rem),
  url('../images/hero-wallpaper-smoke.jpg') center/cover no-repeat,
  url('../uploads/board-page/hero-impact-bg.jpg') center 34%/cover no-repeat;
  border-bottom:1px solid rgba(214,163,72,.20);
}
.board-page-hero--impact .board-hero-copy{max-width:46rem}
.board-page-hero--impact .board-hero-art{align-self:end;aspect-ratio:5/4;box-shadow:0 20px 40px rgba(0,0,0,.42)}
.board-page-hero--impact .board-hero-art img{object-position:center 24%}
.board-feature-grid{align-items:start}
.board-feature-grid article,.board-feature-card{display:flex;flex-direction:column;gap:.85rem}
.board-feature-media{padding:12px;aspect-ratio:16/10;margin-bottom:.15rem}
.board-feature-grid .board-feature-media img{width:100%;height:100%;display:block;object-fit:cover;border:1px solid rgba(20,11,2,.94);background:#000}
.board-feature-grid h3{margin:0;font-size:1.3rem}
.board-feature-grid p{margin:0;flex:1}
@media (max-width:1180px){
  .board-page-hero--impact{background-position:center,center,center,center,62% 28%}
}
@media (max-width:900px){
  .board-page-hero--impact{background:
    linear-gradient(180deg,rgba(1,4,1,.94) 0%,rgba(1,4,1,.78) 38%,rgba(1,4,1,.94) 100%),
    radial-gradient(circle at 28% 18%,rgba(93,255,67,.14),transparent 18rem),
    url('../images/hero-wallpaper-smoke.jpg') center/cover no-repeat,
    url('../uploads/board-page/hero-impact-bg.jpg') center/cover no-repeat;
  }
}


/* ==========================================================
   v5.2 Board page hero and image scale fix
   Fixes the missing hero background, increases hero impact,
   and makes feature media / GIF panels much larger.
   ========================================================== */

.board-page-hero.board-page-hero--impact{
  min-height:clamp(760px,82vh,980px);
  display:flex;
  align-items:center;
  padding:7rem 0 4.5rem;
  background:
    linear-gradient(90deg,rgba(1,4,1,.96) 0%,rgba(1,4,1,.86) 27%,rgba(1,4,1,.42) 58%,rgba(1,4,1,.78) 100%),
    radial-gradient(circle at 16% 30%,rgba(93,255,67,.22),transparent 30rem),
    radial-gradient(circle at 72% 22%,rgba(232,190,96,.13),transparent 28rem),
    url('../uploads/board-page/hero-impact-bg.jpg') center 42%/cover no-repeat !important;
}
.board-page-hero.board-page-hero--impact::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(0,0,0,.18),transparent 22%,rgba(0,0,0,.46)),
    radial-gradient(circle at 75% 38%,rgba(0,0,0,.08),rgba(0,0,0,.42) 58%,rgba(0,0,0,.74) 100%);
}
.board-page-hero.board-page-hero--impact .wrap{
  position:relative;
  z-index:2;
}
.board-page-hero--impact .board-hero-grid{
  grid-template-columns:minmax(440px,.82fr) minmax(560px,1.18fr);
  gap:2.4rem;
  max-width:1480px;
}
.board-page-hero--impact .board-hero-copy{
  max-width:680px;
  background:linear-gradient(180deg,rgba(4,7,4,.68),rgba(4,4,4,.50));
  border:1px solid rgba(214,163,72,.22);
  box-shadow:0 30px 80px rgba(0,0,0,.34);
  padding:1.1rem 1.25rem 1.2rem;
}
.board-page-hero--impact .board-hero-art--large{
  aspect-ratio:16/10;
  width:100%;
  max-width:780px;
  justify-self:end;
  transform:rotate(-1.5deg);
  padding:16px;
  box-shadow:0 30px 90px rgba(0,0,0,.62), 0 0 44px rgba(79,255,48,.16);
}
.board-page-hero--impact .board-hero-art--large img{
  object-fit:cover;
  object-position:center center;
}

.board-intro .board-split{
  grid-template-columns:.86fr 1.14fr;
  gap:2rem;
}
.board-intro .board-feature-image{
  aspect-ratio:16/10;
  padding:16px;
}
.board-intro .board-feature-image img{
  object-position:center 46%;
}

.board-feature-grid.board-feature-grid--media-led,
.board-feature-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.25rem;
}
.board-feature-grid.board-feature-grid--media-led article,
.board-feature-grid .board-feature-card{
  padding:1rem;
  min-height:100%;
}
.board-feature-grid.board-feature-grid--media-led .board-feature-media,
.board-feature-media{
  aspect-ratio:16/9 !important;
  width:100%;
  margin:0 0 .95rem;
  padding:13px;
}
.board-feature-grid.board-feature-grid--media-led .board-feature-media img,
.board-feature-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.board-feature-grid.board-feature-grid--media-led h3{
  font-size:1.45rem;
  margin:.05rem 0 .2rem;
}
.board-feature-grid.board-feature-grid--media-led p{
  font-size:1rem;
  line-height:1.5;
}

.classic-advanced .mode-grid{
  gap:1.5rem;
}
.classic-advanced .mode-image{
  aspect-ratio:16/9;
  padding:14px;
}
.classic-advanced .mode-card{
  padding:1.25rem;
}

@media (max-width:1260px){
  .board-page-hero--impact .board-hero-grid{
    grid-template-columns:1fr;
  }
  .board-page-hero--impact .board-hero-art--large{
    justify-self:start;
    max-width:960px;
  }
  .board-intro .board-split{
    grid-template-columns:1fr;
  }
}
@media (max-width:980px){
  .board-page-hero.board-page-hero--impact{
    min-height:auto;
    padding:4rem 0 3rem;
    background:
      linear-gradient(180deg,rgba(1,4,1,.96) 0%,rgba(1,4,1,.72) 42%,rgba(1,4,1,.96) 100%),
      radial-gradient(circle at 18% 26%,rgba(93,255,67,.18),transparent 22rem),
      url('../uploads/board-page/hero-impact-bg.jpg') center 38%/cover no-repeat !important;
  }
  .board-page-hero--impact .board-hero-copy{
    background:linear-gradient(180deg,rgba(4,7,4,.86),rgba(4,4,4,.70));
  }
  .board-feature-grid.board-feature-grid--media-led,
  .board-feature-grid{
    grid-template-columns:1fr;
  }
  .board-feature-grid.board-feature-grid--media-led .board-feature-media,
  .board-feature-media{
    aspect-ratio:16/9 !important;
  }
}


/* ==========================================================
   v5.3 Board hero clean fix
   Removes the broken foreground duplicate image and uses the
   event/product photo properly as the knocked-back hero background.
   ========================================================== */

.board-page-hero.board-page-hero--impact{
  min-height:clamp(720px,82vh,960px);
  padding:7rem 0 4.75rem;
  background:
    linear-gradient(90deg,
      rgba(1,4,1,.98) 0%,
      rgba(1,4,1,.92) 22%,
      rgba(1,4,1,.62) 46%,
      rgba(1,4,1,.38) 70%,
      rgba(1,4,1,.82) 100%
    ),
    radial-gradient(circle at 18% 30%,rgba(74,255,55,.18),transparent 30rem),
    radial-gradient(circle at 72% 36%,rgba(236,196,90,.10),transparent 34rem),
    url('../uploads/board-page/hero-impact-bg.jpg') center 43%/cover no-repeat !important;
}
.board-page-hero.board-page-hero--impact::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(0,0,0,.10),transparent 20%,rgba(0,0,0,.50)),
    radial-gradient(circle at 78% 40%,transparent 0%,rgba(0,0,0,.10) 38%,rgba(0,0,0,.72) 100%);
}
.board-page-hero--impact .board-hero-grid{
  display:block !important;
  max-width:1480px;
}
.board-page-hero--impact .board-hero-copy{
  width:min(100%, 620px);
  max-width:620px;
  margin-left:0;
  background:linear-gradient(180deg,rgba(2,6,2,.80),rgba(2,3,2,.62));
  border:1px solid rgba(214,163,72,.34);
  box-shadow:0 34px 90px rgba(0,0,0,.52);
  padding:1.35rem 1.45rem 1.4rem;
}
.board-page-hero--impact .board-hero-art,
.board-page-hero--impact .board-hero-art--large{
  display:none !important;
}
.board-page-hero--impact .quick-facts{
  max-width:540px;
}

@media (max-width:980px){
  .board-page-hero.board-page-hero--impact{
    min-height:auto;
    padding:4rem 0 3rem;
    background:
      linear-gradient(180deg,rgba(1,4,1,.98) 0%,rgba(1,4,1,.82) 48%,rgba(1,4,1,.98) 100%),
      radial-gradient(circle at 18% 26%,rgba(93,255,67,.18),transparent 22rem),
      url('../uploads/board-page/hero-impact-bg.jpg') center 38%/cover no-repeat !important;
  }
  .board-page-hero--impact .board-hero-copy{
    width:100%;
    background:linear-gradient(180deg,rgba(4,7,4,.90),rgba(4,4,4,.76));
  }
}


/* ==========================================================
   v5.4 Board overview image scale fix
   Makes the “A Library That Never Plays the Same Way Twice”
   image panel match the height and weight of the text column.
   ========================================================== */

.board-intro .board-split{
  grid-template-columns:minmax(460px,.92fr) minmax(520px,1.08fr);
  gap:2.2rem;
  align-items:stretch;
}

.board-intro .board-feature-image{
  width:100%;
  height:100%;
  min-height:clamp(430px,34vw,620px);
  aspect-ratio:auto !important;
  padding:18px;
  align-self:stretch;
  box-shadow:0 28px 70px rgba(0,0,0,.55), 0 0 38px rgba(78,255,53,.10);
}

.board-intro .board-feature-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 48%;
}

.board-intro .board-feature-image .frame-crest{
  transform:scale(1.08);
}

@media (max-width:1260px){
  .board-intro .board-split{
    grid-template-columns:1fr;
  }
  .board-intro .board-feature-image{
    min-height:clamp(360px,52vw,620px);
  }
}

@media (max-width:720px){
  .board-intro .board-feature-image{
    min-height:280px;
    padding:12px;
  }
}


/* ==========================================================
   v5.5 Board feature GIF fix
   Uses the actual uploaded animated GIFs and makes the feature
   frames substantially taller so the gameplay movement is visible.
   ========================================================== */

.board-feature-grid.board-feature-grid--media-led{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.35rem;
}

.board-feature-grid.board-feature-grid--media-led article,
.board-feature-grid .board-feature-card{
  padding:1rem 1rem 1.15rem;
}

.board-feature-grid.board-feature-grid--media-led .board-feature-media,
.board-feature-media{
  aspect-ratio:4/3 !important;
  min-height:260px;
  width:100%;
  padding:14px;
  margin:0 0 1rem;
}

.board-feature-grid.board-feature-grid--media-led .board-feature-media img,
.board-feature-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  display:block;
}

.board-feature-grid.board-feature-grid--media-led h3{
  font-size:1.5rem;
  line-height:1.05;
  margin:.05rem 0 .25rem;
}

.board-feature-grid.board-feature-grid--media-led p{
  font-size:1.02rem;
  line-height:1.52;
}

@media (min-width:1400px){
  .board-feature-grid.board-feature-grid--media-led .board-feature-media,
  .board-feature-media{
    min-height:300px;
  }
}

@media (max-width:980px){
  .board-feature-grid.board-feature-grid--media-led .board-feature-media,
  .board-feature-media{
    aspect-ratio:4/3 !important;
    min-height:320px;
  }
}

@media (max-width:620px){
  .board-feature-grid.board-feature-grid--media-led .board-feature-media,
  .board-feature-media{
    min-height:230px;
    padding:11px;
  }
}


/* ==========================================================
   v5.6 Classic / Advanced mode image fix
   Uses the supplied UK Games Expo photos and makes these images
   much taller so the mode cards feel premium and visual.
   ========================================================== */

.classic-advanced .mode-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1.6rem;
  align-items:stretch;
}

.classic-advanced .mode-card{
  display:flex;
  flex-direction:column;
  padding:1.25rem 1.25rem 1.35rem;
}

.classic-advanced .mode-image{
  width:100%;
  aspect-ratio:4/3 !important;
  min-height:390px;
  padding:16px;
  margin-bottom:1.1rem;
}

.classic-advanced .mode-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.classic-advanced .mode-card:first-child .mode-image img{
  object-position:center 42%;
}

.classic-advanced .mode-card:nth-child(2) .mode-image img{
  object-position:center 48%;
}

.classic-advanced .mode-card h3{
  font-size:1.55rem;
  margin:.1rem 0 .45rem;
}

.classic-advanced .mode-card p{
  font-size:1.02rem;
  line-height:1.52;
}

@media (max-width:1180px){
  .classic-advanced .mode-image{
    min-height:340px;
  }
}

@media (max-width:900px){
  .classic-advanced .mode-grid{
    grid-template-columns:1fr;
  }
  .classic-advanced .mode-image{
    min-height:420px;
  }
}

@media (max-width:620px){
  .classic-advanced .mode-image{
    min-height:300px;
    padding:12px;
  }
}


/* ==========================================================
   v5.7 Classic / Advanced correct image targeting
   Corrects the section-specific image replacement that previously
   affected earlier images instead of the two mode cards.
   ========================================================== */

.classic-advanced .mode-card:first-child .mode-image img{
  object-position:center center !important;
}

.classic-advanced .mode-card:nth-child(2) .mode-image img{
  object-position:center center !important;
}

.classic-advanced .mode-image{
  aspect-ratio:4/3 !important;
  min-height:390px;
}


/* ==========================================================
   v5.9 How It Plays visual section
   Replaces the simple four small text boxes with large illustrated
   gameplay panels using existing uploaded assets.
   ========================================================== */

.how-it-plays-board--visual .play-flow{
  display:none !important;
}

.play-visual-board{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1.4rem;
  margin-top:1.25rem;
}

.play-visual-card{
  position:relative;
  display:grid;
  grid-template-columns:minmax(230px,.9fr) minmax(0,1fr);
  gap:1.05rem;
  align-items:center;
  padding:1rem;
  background:linear-gradient(180deg,rgba(8,15,8,.94),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 20px 46px rgba(0,0,0,.38);
  overflow:visible;
}

.play-visual-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.play-step-number{
  position:absolute;
  z-index:5;
  top:-16px;
  left:18px;
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  border-radius:50%;
  color:#120800;
  font-family:var(--font-display);
  font-size:2rem;
  font-weight:900;
  line-height:1;
  background:linear-gradient(180deg,#fff3b5 0%,#e0b94d 42%,#8b560d 100%);
  border:2px solid rgba(40,18,0,.92);
  box-shadow:0 8px 18px rgba(0,0,0,.45),0 0 20px rgba(232,190,96,.18);
}

.play-step-media{
  position:relative;
  z-index:2;
  aspect-ratio:4/3;
  min-height:260px;
  padding:14px;
}

.play-step-media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
  background:#020302;
}

.play-step-copy{
  position:relative;
  z-index:2;
}

.play-step-copy h3{
  color:#f0d48a;
  font-size:1.55rem;
  line-height:1.05;
  margin:0 0 .55rem;
}

.play-step-copy p{
  font-size:1.02rem;
  line-height:1.52;
  margin:0;
}

.play-summary-panel{
  max-width:960px;
  margin:1.6rem auto 0;
  text-align:center;
  padding:1.25rem 1.5rem;
  background:linear-gradient(180deg,rgba(18,8,18,.90),rgba(2,4,2,.98));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 20px 48px rgba(0,0,0,.38);
}

.play-summary-panel h3{
  color:#f0d48a;
  font-size:1.8rem;
  margin:.1rem 0 .55rem;
}

.play-summary-panel p{
  max-width:780px;
  margin:0 auto 1rem;
  color:#f2e2b8;
}

.play-summary-panel .proof-badges{
  justify-content:center;
}

@media (max-width:1180px){
  .play-visual-board{
    grid-template-columns:1fr;
  }
  .play-visual-card{
    grid-template-columns:minmax(280px,.8fr) 1fr;
  }
  .play-step-media{
    min-height:300px;
  }
}

@media (max-width:760px){
  .play-visual-card{
    grid-template-columns:1fr;
    padding:1rem;
  }
  .play-step-media{
    min-height:260px;
  }
}


/* ==========================================================
   v5.10 How It Plays text layout fix
   Prevents the image frames from intruding into the copy area.
   ========================================================== */

.how-it-plays-board--visual .play-visual-board{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1.45rem;
}

.how-it-plays-board--visual .play-visual-card{
  grid-template-columns:minmax(0,46%) minmax(0,54%);
  gap:1.25rem;
  align-items:center;
  overflow:hidden;
  padding:1.05rem 1.2rem;
}

.how-it-plays-board--visual .play-step-media{
  width:100%;
  max-width:100%;
  min-width:0;
  min-height:0;
  aspect-ratio:4/3 !important;
  padding:12px;
  margin:0;
  justify-self:stretch;
  align-self:center;
  overflow:visible;
}

.how-it-plays-board--visual .play-step-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
}

.how-it-plays-board--visual .play-step-copy{
  min-width:0;
  width:100%;
  padding:.25rem .25rem .25rem .2rem;
  align-self:center;
}

.how-it-plays-board--visual .play-step-copy h3{
  font-size:clamp(1.25rem,1.55vw,1.65rem);
  line-height:1.05;
  margin:0 0 .55rem;
  max-width:100%;
}

.how-it-plays-board--visual .play-step-copy p{
  font-size:clamp(.92rem,1vw,1.02rem);
  line-height:1.45;
  max-width:32rem;
}

.how-it-plays-board--visual .play-step-number{
  top:-14px;
  left:16px;
  z-index:6;
}

@media (max-width:1180px){
  .how-it-plays-board--visual .play-visual-board{
    grid-template-columns:1fr;
  }
  .how-it-plays-board--visual .play-visual-card{
    grid-template-columns:minmax(280px,.75fr) minmax(0,1fr);
  }
}

@media (max-width:760px){
  .how-it-plays-board--visual .play-visual-card{
    grid-template-columns:1fr;
    gap:1rem;
  }
  .how-it-plays-board--visual .play-step-media{
    aspect-ratio:16/10 !important;
  }
}


/* ==========================================================
   v5.11 How It Plays image shape + step badge fix
   Makes the images taller / less squashed and stops the
   numbered circles being clipped.
   ========================================================== */

.how-it-plays-board--visual .play-visual-card{
  overflow: visible !important;
  padding: 1.5rem 1.2rem 1.15rem !important;
  align-items: center;
}

.how-it-plays-board--visual .play-step-number{
  top: -18px !important;
  left: 14px !important;
  z-index: 8;
}

.how-it-plays-board--visual .play-step-media{
  aspect-ratio: 1 / 1 !important;
  min-height: 0;
  align-self: stretch;
}

.how-it-plays-board--visual .play-step-media img{
  object-fit: cover;
  object-position: center center;
}

@media (max-width: 1180px){
  .how-it-plays-board--visual .play-step-media{
    aspect-ratio: 6 / 5 !important;
  }
}

@media (max-width: 760px){
  .how-it-plays-board--visual .play-step-number{
    top: -14px !important;
    left: 12px !important;
  }
  .how-it-plays-board--visual .play-step-media{
    aspect-ratio: 4 / 3 !important;
  }
}


/* ==========================================================
   v5.12 Unique mechanics visual showcase
   Replaces the plain text mechanic cards with illustrated
   board-game feature cards.
   ========================================================== */

.unique-gameplay--visual .mechanics-cabinet{
  display:none !important;
}

.mechanics-showcase-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.25rem;
  margin-top:1.35rem;
}

.mechanic-showcase-card{
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:100%;
  padding:1rem 1rem 1.15rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 22px 52px rgba(0,0,0,.40);
}

.mechanic-showcase-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.mechanic-media{
  position:relative;
  z-index:2;
  width:100%;
  aspect-ratio:4/3;
  min-height:240px;
  padding:13px;
  margin:0 0 .95rem;
}

.mechanic-media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
  background:#020302;
}

.mechanic-copy{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  flex:1;
}

.mechanic-copy h3{
  color:#f0d48a;
  font-size:1.45rem;
  line-height:1.05;
  margin:.05rem 0 .5rem;
}

.mechanic-copy p{
  font-size:1rem;
  line-height:1.5;
  margin:0;
  color:#f4e7c4;
}

.mechanics-summary-panel{
  max-width:980px;
  margin:1.55rem auto 0;
  text-align:center;
  padding:1.25rem 1.5rem;
  background:linear-gradient(180deg,rgba(18,8,18,.90),rgba(2,4,2,.98));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 20px 48px rgba(0,0,0,.38);
}

.mechanics-summary-panel h3{
  color:#f0d48a;
  font-size:1.8rem;
  margin:.1rem 0 .55rem;
}

.mechanics-summary-panel p{
  max-width:780px;
  margin:0 auto;
  color:#f2e2b8;
}

@media (max-width:1180px){
  .mechanics-showcase-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .mechanic-media{
    min-height:260px;
  }
}

@media (max-width:760px){
  .mechanics-showcase-grid{
    grid-template-columns:1fr;
  }
  .mechanic-media{
    min-height:250px;
  }
}


/* ==========================================================
   v5.13 Replayability showcase
   Turns the replayability stats into a richer visual proof section.
   ========================================================== */

.replayability-board--showcase .board-stats{
  display:none !important;
}

.replayability-showcase-grid{
  display:grid;
  grid-template-columns:1.05fr repeat(3,minmax(0,.9fr));
  gap:1.15rem;
  align-items:stretch;
  margin-top:1.35rem;
}

.replayability-intro-card,
.replayability-stat-card{
  position:relative;
  background:linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 22px 52px rgba(0,0,0,.40);
}

.replayability-intro-card::before,
.replayability-stat-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.replayability-intro-card{
  padding:1.35rem 1.3rem 1.4rem;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.replayability-intro-card h3{
  color:#f0d48a;
  font-size:1.8rem;
  line-height:1.06;
  margin:.1rem 0 .8rem;
}

.replayability-intro-card p{
  color:#f4e7c4;
  line-height:1.52;
  margin:0 0 1rem;
}

.replayability-intro-card .proof-badges{
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
}

.replayability-stat-card{
  display:flex;
  flex-direction:column;
  padding:1rem;
}

.replayability-stat-media{
  position:relative;
  z-index:2;
  width:100%;
  aspect-ratio:4/3;
  padding:12px;
  margin-bottom:.85rem;
}

.replayability-stat-media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
  background:#020302;
}

.replayability-stat-copy{
  position:relative;
  z-index:2;
  text-align:center;
  display:flex;
  flex-direction:column;
  flex:1;
}

.replayability-stat-copy strong{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  color:#f7d98e;
  font-family:var(--font-display);
  line-height:.86;
  text-shadow:0 2px 0 #160800,0 0 18px rgba(217,170,71,.18);
  margin:.15rem 0 .35rem;
}

.replayability-stat-copy strong span{
  display:block;
  font-size:clamp(3.1rem,4vw,4.1rem);
  line-height:.82;
}

.replayability-stat-copy strong em{
  display:block;
  font-style:normal;
  font-size:clamp(2.1rem,2.55vw,2.8rem);
  line-height:.84;
}

.replayability-stat-copy h3{
  color:#f0d48a;
  font-size:1.05rem;
  line-height:1.05;
  margin:.15rem 0 .55rem;
  text-transform:uppercase;
  letter-spacing:.03em;
}

.replayability-stat-copy p{
  color:#f4e7c4;
  line-height:1.42;
  margin:0;
}

@media (max-width:1260px){
  .replayability-showcase-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .replayability-intro-card{
    grid-column:1 / -1;
  }
}

@media (max-width:760px){
  .replayability-showcase-grid{
    grid-template-columns:1fr;
  }
}


/* ==========================================================
   v5.14 Expansions showcase
   Turns “The Library Opens Further” into a richer visual
   expansion ladder for customers and partners.
   ========================================================== */

.board-expansions--showcase .expansion-showcase{
  display:none !important;
}

.expansion-hero-panel{
  display:grid;
  grid-template-columns:1fr .9fr;
  gap:1.35rem;
  align-items:center;
  margin-top:1.35rem;
  padding:1.2rem;
  background:
    radial-gradient(circle at 78% 24%,rgba(84,255,50,.10),transparent 22rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 22px 52px rgba(0,0,0,.40);
}

.expansion-hero-copy h3{
  color:#f0d48a;
  font-size:2rem;
  line-height:1.05;
  margin:.1rem 0 .7rem;
}

.expansion-hero-copy p{
  color:#f4e7c4;
  line-height:1.55;
  max-width:58rem;
}

.expansion-hero-media{
  aspect-ratio:16/10;
  padding:14px;
}

.expansion-hero-media img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
  display:block;
  background:rgba(2,4,2,.70);
  border:1px solid rgba(20,11,2,.94);
}

.expansion-showcase-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1.15rem;
  margin-top:1.25rem;
}

.expansion-feature-card{
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:100%;
  padding:1rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 22px 52px rgba(0,0,0,.40);
}

.expansion-feature-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.expansion-feature-card--wide{
  grid-column:span 2;
}

.expansion-feature-card--garden{
  grid-column:span 2;
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:1rem;
  align-items:center;
}

.expansion-feature-media{
  position:relative;
  z-index:2;
  aspect-ratio:4/3;
  padding:12px;
  margin-bottom:.9rem;
}

.expansion-feature-card--garden .expansion-feature-media{
  margin-bottom:0;
  min-height:260px;
}

.expansion-feature-media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  object-position:center center;
  background:rgba(2,4,2,.68);
  border:1px solid rgba(20,11,2,.94);
}

.expansion-feature-copy{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  flex:1;
}

.expansion-feature-copy h3{
  color:#f0d48a;
  font-size:1.45rem;
  line-height:1.05;
  margin:.05rem 0 .55rem;
}

.expansion-feature-copy p{
  color:#f4e7c4;
  line-height:1.5;
  margin:0 0 .95rem;
  flex:1;
}

.expansion-feature-copy .btn{
  align-self:flex-start;
  margin-top:auto;
}

@media (max-width:1260px){
  .expansion-hero-panel{
    grid-template-columns:1fr;
  }
  .expansion-showcase-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .expansion-feature-card--wide,
  .expansion-feature-card--garden{
    grid-column:span 2;
  }
}

@media (max-width:760px){
  .expansion-showcase-grid{
    grid-template-columns:1fr;
  }
  .expansion-feature-card--wide,
  .expansion-feature-card--garden{
    grid-column:span 1;
  }
  .expansion-feature-card--garden{
    display:flex;
  }
  .expansion-feature-card--garden .expansion-feature-media{
    margin-bottom:.9rem;
  }
}


/* v5.16 expansion image scale refresh */
.expansion-hero-panel{
  align-items:stretch;
}

.expansion-hero-media{
  aspect-ratio:5/4;
  min-height:320px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px;
}

.expansion-hero-media img{
  object-fit:cover;
  object-position:center center;
}

.expansion-feature-media{
  aspect-ratio:1/1;
  min-height:250px;
  padding:12px;
}

.expansion-feature-media img{
  object-fit:cover;
  object-position:center center;
}

.expansion-feature-card--wide .expansion-feature-media{
  aspect-ratio:3/2;
  min-height:300px;
}

.expansion-feature-card--garden .expansion-feature-media{
  min-height:300px;
  aspect-ratio:1/1;
}

@media (max-width:1260px){
  .expansion-hero-media{
    min-height:280px;
  }
  .expansion-feature-card--wide .expansion-feature-media{
    min-height:260px;
  }
}

@media (max-width:760px){
  .expansion-hero-media,
  .expansion-feature-media,
  .expansion-feature-card--wide .expansion-feature-media,
  .expansion-feature-card--garden .expansion-feature-media{
    min-height:220px;
  }
}


/* v5.17 garden expansion layout fix */
.expansion-feature-card--garden{
  grid-column:span 3;
  grid-template-columns:minmax(320px,.95fr) minmax(420px,1.2fr);
  align-items:stretch;
}

.expansion-feature-card--garden .expansion-feature-media{
  min-height:340px;
  align-self:stretch;
}

.expansion-feature-card--garden .expansion-feature-copy{
  justify-content:center;
  padding-right:.75rem;
}

.expansion-feature-card--garden .expansion-feature-copy h3{
  font-size:2rem;
}

.expansion-feature-card--garden .expansion-feature-copy p{
  max-width:42ch;
}

@media (max-width:1260px){
  .expansion-feature-card--garden{
    grid-column:span 2;
    grid-template-columns:1fr 1.15fr;
  }
}

@media (max-width:760px){
  .expansion-feature-card--garden{
    grid-column:span 1;
    grid-template-columns:1fr;
  }
  .expansion-feature-card--garden .expansion-feature-copy{
    padding-right:0;
  }
  .expansion-feature-card--garden .expansion-feature-copy h3{
    font-size:1.7rem;
  }
}


/* ==========================================================
   v5.18 Horror in the Garden super-expansion copy + CTA
   Adds punchier Super Expansion copy and a GameCrowd CTA block.
   ========================================================== */

.expansion-feature-card--super-garden{
  grid-column: span 3;
  grid-template-columns:minmax(340px,.86fr) minmax(520px,1.3fr);
  gap:1.35rem;
}

.expansion-feature-card--super-garden .expansion-feature-copy{
  justify-content:center;
}

.expansion-feature-card--super-garden .expansion-feature-copy h3{
  font-size:2.15rem;
}

.expansion-feature-card--super-garden .expansion-feature-copy p{
  max-width:58ch;
  margin-bottom:.75rem;
}

.garden-feature-tags{
  position:relative;
  z-index:2;
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
  margin:.35rem 0 1rem;
}

.garden-feature-tags span{
  border:1px solid rgba(214,163,72,.42);
  color:#f2d58b;
  background:rgba(217,170,71,.08);
  text-transform:uppercase;
  letter-spacing:.07em;
  font-size:.66rem;
  padding:.42rem .55rem;
}

.garden-cta-panel{
  display:grid;
  grid-template-columns:1fr auto;
  gap:1.35rem;
  align-items:center;
  margin:1.35rem auto 0;
  padding:1.35rem 1.5rem;
  background:
    radial-gradient(circle at 80% 28%,rgba(84,255,50,.10),transparent 24rem),
    linear-gradient(180deg,rgba(18,8,18,.92),rgba(2,4,2,.98));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.garden-cta-panel h3{
  color:#f0d48a;
  font-size:2rem;
  line-height:1.05;
  margin:.1rem 0 .55rem;
}

.garden-cta-panel p{
  color:#f4e7c4;
  max-width:78ch;
  margin:.35rem 0 0;
  line-height:1.52;
}

.garden-cta-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.65rem;
  justify-content:flex-end;
}

@media (max-width:1260px){
  .expansion-feature-card--super-garden{
    grid-column:span 2;
    grid-template-columns:1fr;
  }
  .garden-cta-panel{
    grid-template-columns:1fr;
  }
  .garden-cta-actions{
    justify-content:flex-start;
  }
}

@media (max-width:760px){
  .expansion-feature-card--super-garden{
    grid-column:span 1;
  }
  .expansion-feature-card--super-garden .expansion-feature-copy h3,
  .garden-cta-panel h3{
    font-size:1.65rem;
  }
}


/* ==========================================================
   v5.19 Horror in the Garden copy flow fix
   Prevents the right-hand Garden copy from running too close
   to the card edge and improves the line length.
   ========================================================== */

.expansion-feature-card--super-garden{
  grid-template-columns:minmax(340px,.82fr) minmax(460px,1.08fr);
}

.expansion-feature-card--super-garden .expansion-feature-copy{
  max-width:650px;
  padding-right:2.15rem;
  justify-self:start;
}

.expansion-feature-card--super-garden .expansion-feature-copy p{
  max-width:56ch;
}

.expansion-feature-card--super-garden .garden-feature-tags{
  max-width:58ch;
}

.expansion-feature-card--super-garden .btn{
  margin-top:.25rem;
}

@media (max-width:1260px){
  .expansion-feature-card--super-garden{
    grid-template-columns:1fr;
  }
  .expansion-feature-card--super-garden .expansion-feature-copy{
    max-width:none;
    padding-right:.5rem;
  }
}

@media (max-width:760px){
  .expansion-feature-card--super-garden .expansion-feature-copy{
    padding-right:0;
  }
}


/* ==========================================================
   v5.20 Artwork, Components and Table Presence creative refresh
   ========================================================== */
.artwork-stage{display:grid;grid-template-columns:minmax(0,1.24fr) minmax(320px,.96fr);gap:1rem;align-items:stretch}
.artwork-spotlight,.artwork-detail-frame,.artwork-rail-frame{margin:0}
.artwork-spotlight{padding:16px;aspect-ratio:5/4}
.artwork-spotlight img{width:100%;height:100%;object-fit:cover;display:block;border:1px solid rgba(20,11,2,.94)}
.artwork-side{display:grid;grid-template-rows:auto 1fr;gap:1rem}
.artwork-copy-card{position:relative;padding:1.15rem;background:linear-gradient(180deg,rgba(9,15,9,.94),rgba(2,4,2,.99));border:1px solid rgba(214,163,72,.36);box-shadow:0 18px 38px rgba(0,0,0,.34)}
.artwork-copy-card::before{content:"";position:absolute;inset:7px;border:1px solid rgba(214,163,72,.13);pointer-events:none}
.artwork-copy-card h3{color:#f0d48a;line-height:1.05;margin-bottom:.7rem}
.artwork-copy-card p{max-width:64ch}
.artwork-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.artwork-detail-frame{padding:12px;aspect-ratio:4/3}
.artwork-detail-frame img,.artwork-rail-frame img{width:100%;height:100%;object-fit:cover;display:block;border:1px solid rgba(20,11,2,.94)}
.artwork-show-rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1rem}
.artwork-rail-frame{padding:14px;aspect-ratio:16/11}
.artwork-components figcaption{position:absolute;left:1rem;right:1rem;bottom:1rem;background:rgba(0,0,0,.68);color:#f5dc96;border:1px solid rgba(214,163,72,.28);padding:.55rem .6rem;text-transform:uppercase;letter-spacing:.06em;font-size:.72rem}
@media (max-width:1180px){.artwork-stage{grid-template-columns:1fr}.artwork-show-rail{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){.artwork-detail-grid,.artwork-show-rail{grid-template-columns:1fr}.artwork-spotlight,.artwork-rail-frame{aspect-ratio:4/3}}


/* ==========================================================
   v5.21 Artwork gallery + lightbox fix
   Replaces the experimental scattered layout with a clean image
   gallery and built-in lightbox enlargement.
   ========================================================== */

.artwork-gallery-section .gallery-intro-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:1.2rem;
  align-items:center;
  margin:1.15rem auto 1.25rem;
  padding:1.15rem 1.25rem;
  max-width:1120px;
  background:linear-gradient(180deg,rgba(9,15,9,.94),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.artwork-gallery-section .gallery-intro-panel h3{
  color:#f0d48a;
  font-size:1.55rem;
  line-height:1.05;
  margin:.05rem 0 .45rem;
}

.artwork-gallery-section .gallery-intro-panel p{
  color:#f4e7c4;
  max-width:72ch;
  margin:0;
}

.artwork-lightbox-gallery{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
}

.artwork-lightbox-gallery .gallery-item{
  position:relative;
  display:block;
  margin:0;
  padding:13px;
  aspect-ratio:4/3;
  overflow:hidden;
  text-decoration:none;
  cursor:zoom-in;
  transition:transform .18s ease, box-shadow .18s ease;
}

.artwork-lightbox-gallery .gallery-item--large{
  grid-column:span 2;
  grid-row:span 2;
  aspect-ratio:auto;
  min-height:520px;
}

.artwork-lightbox-gallery .gallery-item:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 42px rgba(0,0,0,.45),0 0 20px rgba(217,170,71,.12);
}

.artwork-lightbox-gallery .gallery-item img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
  background:#020302;
}

.artwork-lightbox-gallery .gallery-item span{
  position:absolute;
  z-index:4;
  left:1.05rem;
  right:1.05rem;
  bottom:1.05rem;
  display:block;
  color:#f5dc96;
  background:rgba(0,0,0,.70);
  border:1px solid rgba(214,163,72,.28);
  padding:.55rem .65rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:.72rem;
}

.artwork-lightbox{
  position:fixed;
  inset:0;
  z-index:9999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:2rem;
  background:rgba(0,0,0,.88);
}

.artwork-lightbox.is-open{
  display:flex;
}

.artwork-lightbox__panel{
  position:relative;
  max-width:min(94vw,1400px);
  max-height:92vh;
  display:grid;
  gap:.75rem;
}

.artwork-lightbox__image-wrap{
  display:grid;
  place-items:center;
  padding:16px;
  background:linear-gradient(135deg,#1b1104,#d6a348 22%,#fff2b5 34%,#7b4f11 55%,#211203 100%);
  box-shadow:0 24px 80px rgba(0,0,0,.75);
}

.artwork-lightbox__panel img{
  max-width:calc(94vw - 4rem);
  max-height:calc(88vh - 7rem);
  object-fit:contain;
  background:#050505;
  border:1px solid rgba(20,11,2,.94);
}

.artwork-lightbox__caption{
  color:#f5dc96;
  text-align:center;
  font-size:1rem;
  background:rgba(0,0,0,.64);
  border:1px solid rgba(214,163,72,.28);
  padding:.65rem .9rem;
}

.artwork-lightbox__close,
.artwork-lightbox__nav{
  position:absolute;
  border:1px solid rgba(214,163,72,.55);
  background:rgba(5,3,1,.86);
  color:#f5dc96;
  font-family:inherit;
  cursor:pointer;
}

.artwork-lightbox__close{
  top:-.6rem;
  right:-.6rem;
  width:42px;
  height:42px;
  font-size:1.6rem;
  line-height:1;
}

.artwork-lightbox__nav{
  top:50%;
  transform:translateY(-50%);
  width:44px;
  height:58px;
  font-size:2rem;
}

.artwork-lightbox__prev{left:-3.4rem}
.artwork-lightbox__next{right:-3.4rem}

@media (max-width:1180px){
  .artwork-lightbox-gallery{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .artwork-lightbox-gallery .gallery-item--large{
    min-height:420px;
  }
  .artwork-gallery-section .gallery-intro-panel{
    grid-template-columns:1fr;
  }
}

@media (max-width:760px){
  .artwork-lightbox-gallery{
    grid-template-columns:1fr;
  }
  .artwork-lightbox-gallery .gallery-item--large{
    grid-column:span 1;
    grid-row:span 1;
    min-height:300px;
  }
  .artwork-lightbox__nav{
    display:none;
  }
}





/* ==========================================================
   v5.23 Public Proof main image upgrade
   Larger hero image and richer show-photo gallery
   ========================================================== */

.board-proof--showcase .board-proof-grid{
  display:none !important;
}

.board-proof--showcase .section-title.compact{
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}

.proof-hero-stage{
  display:grid;
  grid-template-columns:minmax(0,1.28fr) minmax(350px,.72fr);
  gap:1.25rem;
  align-items:stretch;
  margin-top:1.35rem;
  padding:1.1rem;
  background:
    radial-gradient(circle at 15% 20%,rgba(82,255,53,.10),transparent 20rem),
    linear-gradient(180deg,rgba(9,15,9,.94),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 22px 52px rgba(0,0,0,.40);
}

.proof-main-photo--large{
  padding:16px;
  min-height: 560px;
}

.proof-main-photo--large img{
  width:100%;
  height:100%;
  min-height: 528px;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
}

.proof-hero-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:.55rem .45rem;
}

.proof-hero-copy h3{
  color:#f0d48a;
  font-size:2rem;
  line-height:1.02;
  margin:.05rem 0 .7rem;
}

.proof-hero-copy p{
  color:#f4e7c4;
  line-height:1.58;
  margin:0 0 1rem;
}

.proof-stats-row{
  display:grid;
  gap:.65rem;
}

.proof-stats-row div{
  border:1px solid rgba(214,163,72,.26);
  background:rgba(217,170,71,.06);
  padding:.75rem .8rem;
}

.proof-stats-row strong{
  display:block;
  color:#f0d48a;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:.78rem;
  margin-bottom:.25rem;
}

.proof-stats-row span{
  color:#f4e7c4;
  font-size:.95rem;
}

.proof-event-grid--expanded{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
  margin-top:1.15rem;
}

.proof-event-card{
  position:relative;
  padding:1rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.proof-event-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.proof-event-photo{
  position:relative;
  z-index:2;
  padding:12px;
  aspect-ratio: 4 / 3;
  margin-bottom:.8rem;
}

.proof-event-photo img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
}

.proof-event-card h3,
.proof-event-card p{
  position:relative;
  z-index:2;
}

.proof-event-card h3{
  color:#f0d48a;
  font-size:1.25rem;
  line-height:1.05;
  margin:.05rem 0 .45rem;
}

.proof-event-card p{
  color:#f4e7c4;
  margin:0;
  line-height:1.45;
}

.proof-badges--center{
  justify-content:center;
  margin-top:1.1rem;
}

@media (max-width:1180px){
  .proof-hero-stage{
    grid-template-columns:1fr;
  }
  .proof-main-photo--large{
    min-height: 440px;
  }
  .proof-main-photo--large img{
    min-height: 408px;
  }
  .proof-event-grid--expanded{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:760px){
  .proof-event-grid--expanded{
    grid-template-columns:1fr;
  }
  .proof-main-photo--large{
    min-height: 320px;
  }
  .proof-main-photo--large img{
    min-height: 288px;
  }
}


/* ==========================================================
   v5.25 Public proof frame fix
   Keeps lightbox links but restores clean, contained image frames.
   ========================================================== */

.board-proof--showcase .proof-event-card{
  display:flex;
  flex-direction:column;
  min-height:100%;
  overflow:hidden;
}

.board-proof--showcase .proof-lightbox-link{
  display:block;
  text-decoration:none;
  color:inherit;
  cursor:zoom-in;
}

.board-proof--showcase .proof-main-photo--large{
  overflow:hidden;
}

.board-proof--showcase .proof-event-photo{
  position:relative;
  z-index:2;
  display:block;
  box-sizing:border-box;
  width:100%;
  aspect-ratio:4 / 3 !important;
  min-height:0 !important;
  height:auto !important;
  margin:0 0 .9rem;
  padding:12px;
  overflow:hidden;
}

.board-proof--showcase .proof-event-photo img{
  width:100%;
  height:100%;
  min-height:0 !important;
  display:block;
  object-fit:cover;
  object-position:center center;
}

.board-proof--showcase .proof-event-card h3{
  margin-top:0;
}

.board-proof--showcase .proof-event-card h3,
.board-proof--showcase .proof-event-card p{
  position:relative;
  z-index:3;
}

.board-proof--showcase .proof-badges--center{
  position:relative;
  z-index:3;
  margin-top:1.25rem;
}

@media (max-width:1180px){
  .board-proof--showcase .proof-event-photo{
    aspect-ratio:16 / 10 !important;
  }
}

@media (max-width:760px){
  .board-proof--showcase .proof-event-photo{
    aspect-ratio:4 / 3 !important;
  }
}


/* ==========================================================
   v5.26 Buy Direct commerce section
   Stripe-ready basket and direct checkout presentation.
   ========================================================== */

.buy-direct--commerce .commerce-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,.34fr);
  gap:1.25rem;
  align-items:start;
  margin-top:1.3rem;
}

.commerce-feature-card{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(340px,.55fr);
  gap:1.25rem;
  align-items:center;
  padding:1.2rem;
  background:radial-gradient(circle at 78% 24%,rgba(84,255,50,.10),transparent 22rem),linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 22px 52px rgba(0,0,0,.40);
}

.commerce-feature-copy h3{
  color:#f0d48a;
  font-size:2rem;
  line-height:1.05;
  margin:.1rem 0 .7rem;
}

.commerce-feature-copy p{
  color:#f4e7c4;
  line-height:1.55;
  max-width:68ch;
}

.commerce-trust-row{
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
  margin-top:.9rem;
}

.commerce-trust-row span{
  border:1px solid rgba(214,163,72,.42);
  color:#f2d58b;
  background:rgba(217,170,71,.08);
  text-transform:uppercase;
  letter-spacing:.07em;
  font-size:.68rem;
  padding:.42rem .55rem;
}

.commerce-feature-image{
  aspect-ratio:16/10;
  padding:14px;
}

.commerce-feature-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
}

.commerce-product-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
}

.commerce-product-card,
.commerce-cart-panel{
  position:relative;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.commerce-product-card::before,
.commerce-cart-panel::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.commerce-product-card{
  display:flex;
  flex-direction:column;
  padding:1rem;
}

.commerce-product-top{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(130px,.44fr) minmax(0,1fr);
  gap:.85rem;
}

.commerce-product-image{
  aspect-ratio:1/1;
  padding:11px;
}

.commerce-product-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  display:block;
  border:1px solid rgba(20,11,2,.94);
}

.commerce-product-copy h3{
  color:#f0d48a;
  font-size:1.35rem;
  line-height:1.05;
  margin:.05rem 0 .45rem;
}

.commerce-product-copy p{
  color:#f4e7c4;
  margin:0;
  line-height:1.43;
}

.commerce-product-meta{
  position:relative;
  z-index:2;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:1rem;
  margin:1rem 0;
  border-top:1px solid rgba(214,163,72,.20);
  padding-top:.8rem;
}

.commerce-price{
  color:#f0d48a;
  font-family:var(--font-display);
  font-size:2rem;
  line-height:.9;
}

.commerce-product-meta span{
  color:#f4e7c4;
  text-align:right;
  font-size:.86rem;
}

.commerce-product-card .btn{
  position:relative;
  z-index:2;
  align-self:flex-start;
  margin-top:auto;
}

.commerce-cart-panel{
  padding:1.15rem;
}

.commerce-cart-sticky{
  position:sticky;
  top:96px;
  z-index:2;
}

.commerce-cart-panel h3{
  color:#f0d48a;
  font-size:1.6rem;
  line-height:1.05;
  margin:.05rem 0 .75rem;
}

.commerce-cart-empty{
  border:1px dashed rgba(214,163,72,.34);
  background:rgba(217,170,71,.06);
  color:#f4e7c4;
  padding:.8rem;
  line-height:1.45;
  margin-bottom:.8rem;
}

.commerce-cart-items{
  display:grid;
  gap:.55rem;
  margin-bottom:.85rem;
}

.commerce-cart-item{
  display:grid;
  grid-template-columns:1fr auto;
  gap:.5rem;
  align-items:center;
  border:1px solid rgba(214,163,72,.24);
  padding:.65rem;
  background:rgba(0,0,0,.24);
}

.commerce-cart-item strong{
  color:#f0d48a;
  display:block;
  font-size:.93rem;
}

.commerce-cart-item span{
  color:#f4e7c4;
  font-size:.86rem;
}

.commerce-cart-item button{
  border:1px solid rgba(214,163,72,.42);
  background:rgba(0,0,0,.35);
  color:#f0d48a;
  cursor:pointer;
  padding:.25rem .45rem;
}

.commerce-cart-summary{
  border-top:1px solid rgba(214,163,72,.25);
  border-bottom:1px solid rgba(214,163,72,.25);
  padding:.75rem 0;
  margin:.85rem 0;
  display:grid;
  gap:.45rem;
}

.commerce-cart-summary div{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  color:#f4e7c4;
}

.commerce-cart-summary strong{
  color:#f0d48a;
}

.commerce-checkout{
  width:100%;
  justify-content:center;
}

.commerce-checkout:disabled{
  opacity:.55;
  cursor:not-allowed;
}

.commerce-checkout-note,
.commerce-small-print p{
  color:#d8c89f;
  font-size:.78rem;
  line-height:1.42;
  margin:.75rem 0 0;
}

@media (max-width:1180px){
  .buy-direct--commerce .commerce-layout{
    grid-template-columns:1fr;
  }
  .commerce-cart-sticky{
    position:relative;
    top:auto;
  }
}

@media (max-width:900px){
  .commerce-feature-card,
  .commerce-product-grid{
    grid-template-columns:1fr;
  }
  .commerce-product-top{
    grid-template-columns:1fr;
  }
}


/* ==========================================================
   v5.27 VAT/taxes and shipping included copy
   Adds clearer reassurance for UK, EU and USA direct customers.
   ========================================================== */

.commerce-included-note{
  border:1px solid rgba(84,255,50,.28);
  background:rgba(32,120,42,.12);
  padding:.75rem .8rem;
  margin:.75rem 0 .85rem;
}

.commerce-included-note strong{
  display:block;
  color:#f0d48a;
  font-size:.95rem;
  line-height:1.25;
  margin-bottom:.25rem;
}

.commerce-included-note span{
  display:block;
  color:#f4e7c4;
  font-size:.85rem;
  line-height:1.35;
}

.commerce-trust-row span:first-child,
.commerce-trust-row span:nth-child(2),
.commerce-trust-row span:nth-child(3){
  background:rgba(32,120,42,.14);
  border-color:rgba(84,255,50,.28);
}


/* ==========================================================
   v5.28 Rules, Videos and Support finale
   Rebuilds the final support section with clear customer routes
   back to learning and buying.
   ========================================================== */

.rules-support--finale .support-grid{
  display:none !important;
}

.support-hero-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(340px,.58fr);
  gap:1.25rem;
  align-items:center;
  margin-top:1.3rem;
  padding:1.2rem;
  background:
    radial-gradient(circle at 78% 24%,rgba(84,255,50,.10),transparent 22rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 22px 52px rgba(0,0,0,.40);
}

.support-hero-copy h3{
  color:#f0d48a;
  font-size:2rem;
  line-height:1.05;
  margin:.1rem 0 .7rem;
}

.support-hero-copy p{
  color:#f4e7c4;
  line-height:1.55;
  max-width:70ch;
}

.support-hero-image{
  aspect-ratio:16/10;
  padding:14px;
}

.support-hero-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
}

.support-action-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
  margin-top:1.2rem;
}

.support-action-card{
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:.9rem;
  padding:1rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.support-action-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.support-action-card > *{
  position:relative;
  z-index:2;
}

.support-action-card--primary{
  grid-column:span 2;
}

.support-action-icon{
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  border-radius:50%;
  color:#120800;
  background:linear-gradient(180deg,#fff3b5 0%,#e0b94d 42%,#8b560d 100%);
  border:2px solid rgba(40,18,0,.92);
  box-shadow:0 8px 18px rgba(0,0,0,.45),0 0 20px rgba(232,190,96,.18);
  font-size:1.35rem;
}

.support-action-card h3{
  color:#f0d48a;
  font-size:1.4rem;
  line-height:1.05;
  margin:.05rem 0 .45rem;
}

.support-action-card p{
  color:#f4e7c4;
  margin:0 0 .85rem;
  line-height:1.45;
}

.support-button-row{
  display:flex;
  flex-wrap:wrap;
  gap:.65rem;
}

.support-final-cta{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:1.3rem;
  align-items:center;
  margin-top:1.25rem;
  padding:1.25rem 1.4rem;
  background:
    radial-gradient(circle at 82% 28%,rgba(84,255,50,.10),transparent 24rem),
    linear-gradient(180deg,rgba(18,8,18,.92),rgba(2,4,2,.98));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.support-final-cta h3{
  color:#f0d48a;
  font-size:1.9rem;
  line-height:1.05;
  margin:.1rem 0 .55rem;
}

.support-final-cta p{
  color:#f4e7c4;
  max-width:78ch;
  margin:0;
  line-height:1.52;
}

.support-final-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.65rem;
  justify-content:flex-end;
}

@media (max-width:1180px){
  .support-hero-panel,
  .support-final-cta{
    grid-template-columns:1fr;
  }
  .support-action-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .support-final-actions{
    justify-content:flex-start;
  }
}

@media (max-width:760px){
  .support-action-grid{
    grid-template-columns:1fr;
  }
  .support-action-card--primary{
    grid-column:span 1;
  }
  .support-action-card{
    grid-template-columns:1fr;
  }
}


/* ==========================================================
   v5.29 Support icon refinement
   Bigger icons with a cleaner look and no heavy gold ring.
   ========================================================== */

.support-action-icon{
  width:62px !important;
  height:62px !important;
  font-size:1.65rem !important;
  border-radius:50% !important;
  color:#3a2200 !important;
  background:
    radial-gradient(circle at 30% 28%, rgba(255,255,255,.95), rgba(255,255,255,.45) 22%, transparent 23%),
    linear-gradient(180deg,#fff2b8 0%, #edc866 48%, #b8781b 100%) !important;
  border:none !important;
  box-shadow:
    0 10px 22px rgba(0,0,0,.32),
    inset 0 1px 0 rgba(255,255,255,.72),
    0 0 0 1px rgba(122,78,12,.35) !important;
}

.support-action-card{
  gap:1rem !important;
}

@media (max-width:760px){
  .support-action-icon{
    width:58px !important;
    height:58px !important;
    font-size:1.55rem !important;
  }
}


/* ==========================================================
   v5.30 Support icons: icon only
   Removes the gold ball / thick border treatment entirely.
   ========================================================== */

.support-action-icon{
  width:56px !important;
  height:56px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:transparent !important;
  background-image:none !important;
  border:none !important;
  border-radius:0 !important;
  box-shadow:none !important;
  color:inherit !important;
  font-size:2.25rem !important;
  line-height:1 !important;
}

.support-action-card{
  gap:1rem !important;
  align-items:start !important;
}

@media (max-width:760px){
  .support-action-icon{
    width:50px !important;
    height:50px !important;
    font-size:2rem !important;
  }
}


/* ==========================================================
   v5.31 Rules page foundation
   Player support hub with downloads, stages, quick guide,
   mobile Curse references and translation support.
   ========================================================== */

.rules-page-hero{
  min-height:72vh;
  display:flex;
  align-items:center;
  background:
    linear-gradient(90deg,rgba(0,0,0,.86),rgba(0,0,0,.48)),
    radial-gradient(circle at 75% 24%,rgba(84,255,50,.10),transparent 24rem);
}

.rules-hero-frame{
  aspect-ratio:4/3;
  padding:16px;
}

.rules-hero-frame img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
}

.rules-download-grid{
  display:grid;
  grid-template-columns:1.2fr repeat(3,minmax(0,.72fr));
  gap:1rem;
  margin-top:1.25rem;
}

.rules-download-card,
.rules-stage-card,
.quick-guide-card,
.mobile-aid-card,
.rules-faq-grid article{
  position:relative;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.rules-download-card::before,
.rules-stage-card::before,
.quick-guide-card::before,
.mobile-aid-card::before,
.rules-faq-grid article::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.rules-download-card{
  padding:1rem;
  display:flex;
  flex-direction:column;
  gap:.8rem;
}

.rules-download-card > *,
.rules-stage-card > *,
.quick-guide-card > *,
.mobile-aid-card > *,
.rules-faq-grid article > *{
  position:relative;
  z-index:2;
}

.rules-download-card--primary{
  display:grid;
  grid-template-columns:minmax(220px,.7fr) 1fr;
  gap:1rem;
}

.rules-download-image{
  aspect-ratio:4/3;
  padding:12px;
}

.rules-download-image img,
.mobile-aid-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
}

.rules-download-card h3,
.rules-stage-card h3,
.quick-guide-card h3,
.mobile-aid-card h3,
.rules-faq-grid article h3{
  color:#f0d48a;
  font-size:1.35rem;
  line-height:1.05;
  margin:.05rem 0 .45rem;
}

.rules-download-card p,
.rules-stage-card p,
.quick-guide-card p,
.mobile-aid-card p,
.rules-faq-grid article p{
  color:#f4e7c4;
  line-height:1.45;
  margin:0 0 .8rem;
}

.rules-download-icon,
.quick-guide-icon{
  font-size:2.05rem;
  line-height:1;
  margin-bottom:.4rem;
}

.rules-stage-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.rules-stage-card{
  padding:1rem;
}

.rules-stage-number{
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  margin-bottom:.75rem;
  border-radius:50%;
  color:#140800;
  font-family:var(--font-display);
  font-size:1.55rem;
  background:linear-gradient(180deg,#fff3b5 0%,#e0b94d 42%,#8b560d 100%);
}

.quick-guide-board{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.quick-guide-card{
  padding:1.05rem;
}

.mobile-aid-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1.25rem;
  margin-top:1.25rem;
}

.mobile-aid-card{
  display:grid;
  grid-template-columns:minmax(240px,.75fr) minmax(0,1fr);
  gap:1rem;
  padding:1rem;
  align-items:center;
}

.mobile-aid-image{
  aspect-ratio:4/3;
  padding:12px;
}

.rules-faq-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.rules-faq-grid article{
  padding:1rem;
}

.rules-translation-panel{
  gap:1.5rem;
}

@media (max-width:1180px){
  .rules-download-grid,
  .rules-stage-grid,
  .quick-guide-board,
  .rules-faq-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .rules-download-card--primary{
    grid-column:1 / -1;
  }
  .mobile-aid-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width:760px){
  .rules-download-grid,
  .rules-stage-grid,
  .quick-guide-board,
  .rules-faq-grid{
    grid-template-columns:1fr;
  }
  .rules-download-card--primary,
  .mobile-aid-card{
    grid-template-columns:1fr;
  }
  .rules-page-hero{
    min-height:auto;
  }
}


/* ==========================================================
   v5.32 Rules page layout fix
   Fixes overly compressed cards and inconsistent grid sizing.
   Background image review will follow separately.
   ========================================================== */

.rules-downloads .wrap,
.rules-stages .wrap,
.quick-turn-guide .wrap,
.mobile-player-aids .wrap,
.rules-faq .wrap,
.rules-translation .wrap,
.rules-final-cta .wrap{
  width:min(1280px,92vw);
}

.rules-page-hero .hero-grid{
  display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(420px,1.12fr);
  gap:2rem;
  align-items:center;
  width:min(1280px,92vw);
  margin:auto;
  position:relative;
  z-index:2;
}

.rules-page-hero .hero-copy{
  max-width:640px;
}

.rules-page-hero .hero-visual{
  justify-self:stretch;
}

.rules-page-hero .rules-hero-frame{
  width:100%;
  min-height:420px;
}

.rules-page-hero .rules-hero-frame img{
  object-fit:cover;
}

/* Download rules: make the main rulebook card properly important */
.rules-download-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  align-items:stretch;
}

.rules-download-card--primary{
  grid-column:1 / -1;
  grid-template-columns:minmax(360px,.82fr) minmax(0,1.18fr) !important;
  align-items:center;
  min-height:320px;
}

.rules-download-card--primary .rules-download-image{
  min-height:280px;
}

.rules-download-card--primary .rules-download-copy h3{
  font-size:2rem;
}

.rules-download-card:not(.rules-download-card--primary){
  min-height:260px;
}

/* Learning stages: use readable card sizes, not tiny columns */
.rules-stage-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}

.rules-stage-card{
  min-height:190px;
}

/* Quick turn guide: cleaner 3x2 layout with readable cards */
.quick-guide-board{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}

.quick-guide-card{
  min-height:170px;
}

/* Mobile aids: larger images and stronger two-card layout */
.mobile-aid-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}

.mobile-aid-card{
  grid-template-columns:1fr !important;
  align-items:start;
}

.mobile-aid-image{
  min-height:280px;
}

.mobile-aid-copy h3{
  font-size:1.75rem;
}

/* FAQ: 2x2 instead of four cramped columns */
.rules-faq-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}

.rules-faq-grid article{
  min-height:150px;
}

/* Translation form: give the form a bit more space */
.rules-translation-panel{
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(460px,1.2fr);
  align-items:center;
}

@media (max-width:1180px){
  .rules-page-hero .hero-grid,
  .rules-translation-panel{
    grid-template-columns:1fr;
  }

  .rules-page-hero .hero-copy{
    max-width:760px;
  }

  .rules-download-grid,
  .rules-stage-grid,
  .quick-guide-board,
  .rules-faq-grid,
  .mobile-aid-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .rules-download-card--primary{
    grid-column:1 / -1;
    grid-template-columns:1fr !important;
  }
}

@media (max-width:760px){
  .rules-download-grid,
  .rules-stage-grid,
  .quick-guide-board,
  .rules-faq-grid,
  .mobile-aid-grid{
    grid-template-columns:1fr !important;
  }

  .rules-page-hero .rules-hero-frame,
  .rules-download-card--primary .rules-download-image,
  .mobile-aid-image{
    min-height:240px;
  }
}


/* ==========================================================
   v5.34 Rules hero no side characters
   Uses the supplied event photo as the top hero background.
   ========================================================== */

.rules-page-hero{
  background-image:
    linear-gradient(90deg, rgba(3,8,6,.92) 0%, rgba(3,8,6,.88) 24%, rgba(3,8,6,.72) 48%, rgba(3,8,6,.82) 72%, rgba(3,8,6,.9) 100%),
    radial-gradient(circle at 78% 18%, rgba(46,120,255,.20), transparent 28%),
    url('../uploads/rules-page/rules-hero-background-photo.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

.rules-page-hero:before{
  background:
    linear-gradient(180deg, rgba(1,3,2,.55) 0%, rgba(1,3,2,.08) 18%, rgba(1,3,2,.22) 55%, rgba(1,3,2,.62) 100%),
    linear-gradient(90deg, rgba(0,0,0,.22) 0%, rgba(0,0,0,0) 28%, rgba(0,0,0,.15) 100%);
}

.rules-page-hero .hero-copy{
  background: linear-gradient(180deg, rgba(2,6,4,.74), rgba(2,6,4,.58));
  padding: 1.4rem 1.3rem;
  border: 1px solid rgba(214,163,72,.28);
  box-shadow: 0 16px 40px rgba(0,0,0,.22);
}

.rules-page-hero .proof-badges span{
  background: rgba(0,0,0,.36);
}

@media (max-width: 900px){
  .rules-page-hero{
    background-position: 58% center;
  }
  .rules-page-hero .hero-copy{
    background: linear-gradient(180deg, rgba(2,6,4,.82), rgba(2,6,4,.72));
  }
}


/* v5.34 Rules hero: remove side character artwork */
.rules-page-hero::after{
  content:none !important;
  display:none !important;
  background:none !important;
}


/* ==========================================================
   v5.35 Rules hero top spacing fix
   Gives the eyebrow/wording more breathing room from the top
   border of the hero copy panel.
   ========================================================== */

.rules-page-hero .hero-copy{
  padding-top:2.25rem !important;
}

.rules-page-hero .hero-copy .eyebrow{
  display:block;
  margin-bottom:.65rem;
}

@media (max-width:760px){
  .rules-page-hero .hero-copy{
    padding-top:1.75rem !important;
  }
}


/* ==========================================================
   v5.36 Rules downloads upgrade
   Makes the rulebook section feel like a premium support area.
   ========================================================== */

.rules-downloads--premium .rules-download-grid{
  display:none !important;
}

.rulebook-showcase{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(420px,.78fr);
  gap:1.25rem;
  align-items:center;
  margin-top:1.3rem;
  padding:1.25rem;
  background:
    radial-gradient(circle at 82% 28%,rgba(84,255,50,.10),transparent 24rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.rulebook-showcase-copy h3{
  color:#f0d48a;
  font-size:2.05rem;
  line-height:1.05;
  margin:.1rem 0 .7rem;
}

.rulebook-showcase-copy p{
  color:#f4e7c4;
  line-height:1.55;
  max-width:72ch;
}

.rulebook-download-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.65rem;
  margin-top:1rem;
}

.rulebook-trust{
  margin-top:1rem;
}

.rulebook-showcase-image{
  aspect-ratio:16/10;
  padding:14px;
}

.rulebook-showcase-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
}

.rulebook-path-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
  margin-top:1.15rem;
}

.rulebook-path-card{
  position:relative;
  padding:1.05rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
  min-height:230px;
}

.rulebook-path-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.rulebook-path-card > *{
  position:relative;
  z-index:2;
}

.rulebook-path-icon{
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  margin-bottom:.75rem;
  border-radius:50%;
  color:#140800;
  font-family:var(--font-display);
  font-size:1.55rem;
  background:linear-gradient(180deg,#fff3b5 0%,#e0b94d 42%,#8b560d 100%);
}

.rulebook-path-card h3{
  color:#f0d48a;
  font-size:1.42rem;
  line-height:1.05;
  margin:.05rem 0 .5rem;
}

.rulebook-path-card p{
  color:#f4e7c4;
  line-height:1.45;
  margin:0 0 .9rem;
}

@media (max-width:1180px){
  .rulebook-showcase{
    grid-template-columns:1fr;
  }
}

@media (max-width:760px){
  .rulebook-path-grid{
    grid-template-columns:1fr;
  }
}


/* ==========================================================
   v5.37 Translation panel padding fix
   Gives the left-hand Request a Translation copy proper internal
   padding so it no longer sits too close to the border.
   ========================================================== */

.rules-translation-panel{
  padding-left:2.25rem !important;
  padding-right:1.25rem !important;
}

.rules-translation-panel > div:first-child{
  padding:1.25rem 1.75rem 1.25rem 0 !important;
  max-width:520px;
}

.rules-translation-panel .kicker{
  display:block;
  margin-bottom:.85rem;
}

.rules-translation-panel h2{
  margin-top:.15rem;
  margin-bottom:1rem;
}

.rules-translation-panel p{
  max-width:48ch;
}

@media (max-width:900px){
  .rules-translation-panel{
    padding-left:1.25rem !important;
    padding-right:1.25rem !important;
  }

  .rules-translation-panel > div:first-child{
    padding:1rem 0 !important;
    max-width:none;
  }
}


/* ==========================================================
   v5.38 Expansions page foundation
   Rebuilds expansions.html into a strong expansion pathway page.
   ========================================================== */

.expansions-page-hero{
  min-height:72vh;
  display:flex;
  align-items:center;
  background:
    linear-gradient(90deg,rgba(0,0,0,.72) 0%, rgba(0,0,0,.58) 28%, rgba(0,0,0,.42) 56%, rgba(0,0,0,.58) 100%),
    radial-gradient(circle at 74% 24%,rgba(255,214,92,.14),transparent 22rem),
    url('../uploads/expansions-showcase/expansions-hero-background.png');
  background-size:cover, auto, cover;
  background-position:center center, 74% 24%, center center;
  background-repeat:no-repeat;
}

.expansions-page-hero::before,
.expansions-page-hero::after{
  content:none !important;
  display:none !important;
}

.expansions-page-hero .hero-grid{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr);
  gap:2rem;
  align-items:center;
  width:min(1280px,92vw);
  margin:auto;
  position:relative;
  z-index:2;
}

.expansions-page-hero .hero-copy{
  max-width:680px;
  background:linear-gradient(180deg,rgba(2,6,4,.78),rgba(2,6,4,.62));
  padding:2.55rem 1.35rem 1.35rem;
  border:1px solid rgba(214,163,72,.28);
  box-shadow:0 16px 40px rgba(0,0,0,.22);
}

.expansions-page-hero .hero-copy .eyebrow{
  margin-bottom:.6rem;
}

.expansions-hero-frame{
  aspect-ratio:16/10;
  padding:16px;
}

.expansions-hero-frame img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
}

.expansion-overview .wrap,
.collectors-expansion .wrap,
.expansion-modules .wrap,
.garden-super-expansion .wrap,
.expansion-compatibility .wrap,
.expansions-final-cta .wrap{
  width:min(1280px,92vw);
}

.expansion-path-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.expansion-path-card,
.expansion-module-card,
.compatibility-grid article{
  position:relative;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.expansion-path-card::before,
.expansion-module-card::before,
.compatibility-grid article::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.expansion-path-card > *,
.expansion-module-card > *,
.compatibility-grid article > *{
  position:relative;
  z-index:2;
}

.expansion-path-card{
  padding:1rem;
  min-height:245px;
}

.expansion-path-card--garden{
  background:
    radial-gradient(circle at 80% 20%,rgba(84,255,50,.12),transparent 16rem),
    linear-gradient(180deg,rgba(12,20,10,.98),rgba(2,4,2,.99));
}

.expansion-path-number{
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  margin-bottom:.75rem;
  border-radius:50%;
  color:#140800;
  font-family:var(--font-display);
  font-size:1.55rem;
  background:linear-gradient(180deg,#fff3b5 0%,#e0b94d 42%,#8b560d 100%);
}

.expansion-path-card h3,
.expansion-module-card h3,
.compatibility-grid article h3{
  color:#f0d48a;
  font-size:1.35rem;
  line-height:1.05;
  margin:.05rem 0 .5rem;
}

.expansion-path-card p,
.expansion-module-card p,
.compatibility-grid article p{
  color:#f4e7c4;
  line-height:1.45;
  margin:0 0 .9rem;
}

.expansion-feature-panel,
.garden-feature-panel{
  display:grid;
  grid-template-columns:minmax(420px,.78fr) minmax(0,1fr);
  gap:1.25rem;
  align-items:center;
  padding:1.25rem;
  background:
    radial-gradient(circle at 78% 24%,rgba(84,255,50,.10),transparent 22rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.garden-feature-panel{
  display:block;
}

.garden-feature-copy--flow{
  position:relative;
}

.garden-promo-float{
  float:right;
  width:min(46%,520px);
  max-width:100%;
  height:auto;
  display:block;
  margin:0 0 1rem 1.5rem;
  shape-outside:margin-box;
}

.garden-feature-copy--flow::after{
  content:"";
  display:block;
  clear:both;
}

.expansion-feature-image,
.garden-feature-image{
  aspect-ratio:4/3;
  padding:14px;
}

.expansion-feature-image img,
.garden-feature-image img,
.expansion-module-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
}

.expansion-feature-copy h2,
.garden-feature-copy h2{
  color:#f0d48a;
  line-height:.98;
  margin:.1rem 0 .8rem;
}

.expansion-feature-copy p,
.garden-feature-copy p{
  color:#f4e7c4;
  line-height:1.55;
  max-width:76ch;
}

.garden-feature-copy .commerce-trust-row,
.garden-feature-copy .garden-actions{
  clear:both;
}

.expansion-module-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.expansion-module-card{
  padding:1rem;
}

.expansion-module-image{
  aspect-ratio:4/3;
  padding:12px;
  margin-bottom:.9rem;
}

.expansion-module-card ul{
  position:relative;
  z-index:2;
  margin:.8rem 0 0 1.1rem;
  color:#f4e7c4;
  line-height:1.55;
}

.garden-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.7rem;
  margin-top:1rem;
}

.garden-support-note{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:1.3rem;
  align-items:center;
  margin-top:1.25rem;
  padding:1.25rem 1.4rem;
  background:
    radial-gradient(circle at 82% 28%,rgba(84,255,50,.10),transparent 24rem),
    linear-gradient(180deg,rgba(18,8,18,.92),rgba(2,4,2,.98));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.garden-support-note h3{
  color:#f0d48a;
  font-size:1.9rem;
  line-height:1.05;
  margin:.1rem 0 .55rem;
}

.garden-support-note p{
  color:#f4e7c4;
  max-width:78ch;
  margin:0;
  line-height:1.52;
}

.compatibility-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.compatibility-grid article{
  padding:1rem;
  min-height:160px;
}

@media (max-width:1180px){
  .expansions-page-hero .hero-grid,
  .expansion-feature-panel,
  .garden-feature-panel,
  .garden-support-note{
    grid-template-columns:1fr;
  }
  .expansion-path-grid,
  .expansion-module-grid,
  .compatibility-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:760px){
  .expansion-path-grid,
  .expansion-module-grid,
  .compatibility-grid{
    grid-template-columns:1fr;
  }
  .expansions-page-hero{
    min-height:auto;
  }
}


/* ==========================================================
   v5.41 Expansions hero cleanup
   Removes the gold-framed hero thumbnail and gives the eyebrow
   more breathing room from the top border.
   ========================================================== */

.expansions-page-hero .hero-grid{
  grid-template-columns:minmax(440px,680px) minmax(0,1fr) !important;
}

.expansions-page-hero .hero-copy{
  padding-top:3rem !important;
}

.expansions-page-hero .hero-copy .eyebrow{
  display:block;
  margin-top:.05rem;
  margin-bottom:.85rem;
}

.expansions-page-hero .hero-visual,
.expansions-page-hero .expansions-hero-frame{
  display:none !important;
}

@media (max-width:1180px){
  .expansions-page-hero .hero-grid{
    grid-template-columns:1fr !important;
  }
}

@media (max-width:760px){
  .expansions-page-hero .hero-copy{
    padding-top:2.25rem !important;
  }
}


/* ==========================================================
   v5.42 Expansion pathway upgrade
   Improves the second Expansions page section with a clear
   feature panel and visual pathway cards.
   ========================================================== */

.expansion-overview--upgraded .expansion-path-grid{
  margin-top:1.15rem;
}

.expansion-pathway-feature{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(420px,.72fr);
  gap:1.25rem;
  align-items:center;
  margin-top:1.25rem;
  padding:1.25rem;
  background:
    radial-gradient(circle at 82% 28%,rgba(84,255,50,.10),transparent 24rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.expansion-pathway-copy h3{
  color:#f0d48a;
  font-size:2rem;
  line-height:1.05;
  margin:.1rem 0 .7rem;
}

.expansion-pathway-copy p{
  color:#f4e7c4;
  line-height:1.55;
  max-width:76ch;
}

.expansion-pathway-image{
  aspect-ratio:16/10;
  padding:14px;
}

.expansion-pathway-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
}

.expansion-path-grid--wide{
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
}

.expansion-path-grid--wide .expansion-path-card{
  display:flex;
  flex-direction:column;
  min-height:390px;
}

.expansion-path-thumb{
  aspect-ratio:4/3;
  padding:9px;
  margin:-.1rem 0 .8rem;
}

.expansion-path-thumb img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
}

.expansion-path-grid--wide .expansion-path-card .btn{
  margin-top:auto;
  align-self:flex-start;
}

@media (max-width:1280px){
  .expansion-path-grid--wide{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

@media (max-width:1180px){
  .expansion-pathway-feature{
    grid-template-columns:1fr;
  }
}

@media (max-width:900px){
  .expansion-path-grid--wide{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (max-width:760px){
  .expansion-path-grid--wide{
    grid-template-columns:1fr !important;
  }
}


/* ==========================================================
   v5.44 Expansion pathway image size fix
   Enlarges the “How the world grows” image so it reads as a
   proper feature visual rather than a small thumbnail.
   ========================================================== */

.expansion-pathway-feature{
  grid-template-columns:minmax(0,1.18fr) minmax(520px,.98fr);
  gap:1.5rem;
}

.expansion-pathway-image{
  width:100%;
  max-width:560px;
  height:250px;
  aspect-ratio:auto;
  justify-self:end;
  align-self:center;
  padding:14px;
}

.expansion-pathway-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
}

@media (max-width:1180px){
  .expansion-pathway-image{
    max-width:none;
    width:100%;
    height:240px;
    justify-self:stretch;
  }
}

@media (max-width:700px){
  .expansion-pathway-image{
    height:200px;
  }
}


/* ==========================================================
   v5.45 Expansion pathway thumbnail update
   Uses the new custom 1–5 thumbnail set and improves crop
   consistency for the pathway cards.
   ========================================================== */

.expansion-path-thumb{
  height:150px !important;
  aspect-ratio:auto !important;
}

.expansion-path-thumb img{
  object-fit:cover !important;
  object-position:center center !important;
}

.expansion-path-grid--wide .expansion-path-card{
  min-height:405px !important;
}

@media (max-width:900px){
  .expansion-path-thumb{
    height:170px !important;
  }
}

@media (max-width:760px){
  .expansion-path-thumb{
    height:190px !important;
  }
}


/* ==========================================================
   v5.46 Collector's Expansion feature image refresh
   - swaps in new detailed photo
   - enlarges the framed image so it aligns with the full
     height of the content block beside it
   ========================================================== */

.expansion-feature-panel{
  align-items:stretch !important;
}

.expansion-feature-image{
  aspect-ratio:auto !important;
  height:100% !important;
  min-height:100% !important;
  display:flex !important;
  align-self:stretch !important;
}

.expansion-feature-image img{
  width:100%;
  height:100%;
  object-fit:cover !important;
  object-position:center center !important;
}

@media (min-width:1181px){
  #collectors .expansion-feature-panel{
    grid-template-columns:minmax(500px,.95fr) minmax(0,1fr) !important;
  }

  #collectors .expansion-feature-image{
    min-height:420px !important;
  }
}

@media (max-width:1180px){
  #collectors .expansion-feature-image{
    min-height:320px !important;
  }
}


/* ==========================================================
   v5.47 Expansion module flow images
   Replaces framed module thumbnails with transparent PNG art.
   Text wraps around each image for a more illustrated layout.
   ========================================================== */

.expansion-modules--flow .expansion-module-grid{
  align-items:stretch;
}

.expansion-modules--flow .expansion-module-card{
  overflow:hidden;
  min-height:450px;
  padding:1.2rem 1.2rem 1.15rem;
}

.expansion-modules--flow .expansion-module-image{
  display:none !important;
}

.expansion-module-illustration{
  position:relative;
  z-index:2;
  float:right;
  display:block;
  width:58%;
  max-width:300px;
  height:auto;
  margin:-.55rem -.55rem .55rem .95rem;
  filter:
    drop-shadow(0 12px 18px rgba(0,0,0,.48))
    drop-shadow(0 0 12px rgba(58,255,57,.16));
  shape-outside: inset(0 round 18px);
}

.expansion-module-illustration--secret{
  width:62%;
  max-width:330px;
  margin-top:-.65rem;
  margin-right:-.8rem;
}

.expansion-module-illustration--cabinet{
  width:56%;
  max-width:300px;
  margin-top:-.7rem;
  margin-right:-.75rem;
}

.expansion-module-illustration--apparatus{
  width:60%;
  max-width:330px;
  margin-top:-.7rem;
  margin-right:-.9rem;
}

.expansion-modules--flow .expansion-module-card h3{
  clear:none;
  font-size:1.75rem;
}

.expansion-modules--flow .expansion-module-card p{
  font-size:1.02rem;
}

.expansion-modules--flow .expansion-module-card ul{
  clear:both;
  margin-top:1rem;
}

@media (max-width:1180px){
  .expansion-module-illustration{
    max-width:260px;
  }
  .expansion-modules--flow .expansion-module-card{
    min-height:410px;
  }
}

@media (max-width:760px){
  .expansion-module-illustration{
    float:none;
    width:100%;
    max-width:360px;
    margin:0 auto 1rem;
  }
  .expansion-modules--flow .expansion-module-card{
    min-height:auto;
  }
  .expansion-modules--flow .expansion-module-card ul{
    clear:none;
  }
}


/* ==========================================================
   v5.49 Horror in the Garden layout refine
   Makes the Garden panel closer to the supplied reference:
   large right-side art, smaller title, and text/buttons flowing
   naturally around the PNG.
   ========================================================== */

#garden .garden-feature-panel{
  display:block !important;
  padding:1.35rem 1.45rem !important;
}

#garden .garden-feature-copy--flow{
  display:block;
  min-height:460px;
}

#garden .garden-promo-float{
  float:right;
  width:min(52vw,620px) !important;
  max-width:54% !important;
  margin:.15rem 0 1rem 1.75rem !important;
  shape-outside:margin-box;
  filter:
    drop-shadow(0 24px 34px rgba(0,0,0,.55))
    drop-shadow(0 0 18px rgba(79,255,52,.10));
}

#garden .garden-feature-copy h2,
#garden .garden-feature-copy h2.brass-title,
#garden .garden-feature-copy [data-brass-heading]{
  font-size:clamp(3.2rem,5.6vw,5.85rem) !important;
  line-height:.9 !important;
  max-width:48%;
  margin:.55rem 0 1.35rem !important;
}

#garden .garden-feature-copy p{
  max-width:none !important;
  line-height:1.55;
}

#garden .garden-feature-copy .commerce-trust-row,
#garden .garden-feature-copy .garden-actions{
  clear:none !important;
  max-width:52%;
}

#garden .garden-feature-copy .commerce-trust-row{
  margin-top:1rem;
}

#garden .garden-feature-copy::after{
  content:"";
  display:block;
  clear:both;
}

@media (max-width:1080px){
  #garden .garden-promo-float{
    width:100% !important;
    max-width:720px !important;
    float:none !important;
    margin:.75rem auto 1.1rem !important;
  }

  #garden .garden-feature-copy h2,
  #garden .garden-feature-copy h2.brass-title,
  #garden .garden-feature-copy [data-brass-heading]{
    max-width:none;
    font-size:clamp(3rem,9vw,5.2rem) !important;
  }

  #garden .garden-feature-copy .commerce-trust-row,
  #garden .garden-feature-copy .garden-actions{
    max-width:none;
  }

  #garden .garden-feature-copy--flow{
    min-height:auto;
  }
}


/* ==========================================================
   v5.50 Garden split layout fix
   Corrects the Garden panel to match the reference direction:
   strong left copy block, large right artwork, no float overlap.
   ========================================================== */

#garden .garden-feature-panel--split{
  display:grid !important;
  grid-template-columns:minmax(0,0.92fr) minmax(520px,1.08fr) !important;
  gap:1.45rem !important;
  align-items:center !important;
  padding:1.35rem 1.45rem !important;
  overflow:hidden;
}

#garden .garden-feature-copy{
  min-width:0;
}

#garden .garden-feature-copy h2,
#garden .garden-feature-copy h2.brass-title,
#garden .garden-feature-copy [data-brass-heading]{
  font-size:clamp(3.1rem,5.05vw,5.55rem) !important;
  line-height:.9 !important;
  max-width:100% !important;
  margin:.65rem 0 1.25rem !important;
}

#garden .garden-feature-copy p{
  max-width:62ch !important;
  line-height:1.55 !important;
}

#garden .garden-feature-copy .commerce-trust-row,
#garden .garden-feature-copy .garden-actions{
  clear:none !important;
  max-width:100% !important;
}

#garden .garden-promo-float{
  display:none !important;
}

#garden .garden-promo-side{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  min-height:420px;
}

#garden .garden-promo-side img{
  display:block;
  width:100%;
  max-width:690px;
  height:auto;
  object-fit:contain;
  filter:
    drop-shadow(0 26px 36px rgba(0,0,0,.55))
    drop-shadow(0 0 16px rgba(79,255,52,.12));
}

@media (max-width:1180px){
  #garden .garden-feature-panel--split{
    grid-template-columns:1fr !important;
  }

  #garden .garden-promo-side{
    min-height:auto;
    justify-content:center;
  }

  #garden .garden-promo-side img{
    max-width:760px;
  }

  #garden .garden-feature-copy h2,
  #garden .garden-feature-copy h2.brass-title,
  #garden .garden-feature-copy [data-brass-heading]{
    font-size:clamp(3rem,9vw,5.2rem) !important;
  }
}


/* ==========================================================
   v5.51 Digital Games foundation
   Rebuilds digital-games.html as a proper digital IP hub.
   ========================================================== */

.digital-games-hero{
  min-height:72vh;
  display:flex;
  align-items:center;
  background:
    linear-gradient(90deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.72) 38%,rgba(0,0,0,.48) 70%,rgba(0,0,0,.68) 100%),
    radial-gradient(circle at 78% 28%,rgba(84,255,50,.16),transparent 26rem),
    url('../uploads/vr/vr-screenshot-01.jpg');
  background-size:cover, auto, cover;
  background-position:center center, 78% 28%, center center;
  background-repeat:no-repeat;
}

.digital-games-hero::before,
.digital-games-hero::after{
  content:none !important;
  display:none !important;
}

.digital-hero-grid{
  width:min(1280px,92vw);
  margin:auto;
  display:grid;
  grid-template-columns:minmax(440px,700px) minmax(0,1fr);
  align-items:center;
}

.digital-hero-copy{
  background:linear-gradient(180deg,rgba(2,6,4,.78),rgba(2,6,4,.62));
  padding:2.55rem 1.35rem 1.35rem;
  border:1px solid rgba(214,163,72,.28);
  box-shadow:0 16px 40px rgba(0,0,0,.22);
}

.digital-games-intro .wrap,
.vr-feature-section .wrap,
.digital-gallery-section .wrap,
.digital-strategy-section .wrap,
.digital-video-section .wrap,
.digital-final-cta .wrap{
  width:min(1280px,92vw);
}

.digital-path-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.digital-path-card{
  position:relative;
  padding:1rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
  min-height:430px;
  display:flex;
  flex-direction:column;
}

.digital-path-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.digital-path-card > *{
  position:relative;
  z-index:2;
}

.digital-path-image{
  aspect-ratio:16/10;
  padding:10px;
  margin-bottom:.9rem;
}

.digital-path-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
}

.digital-path-card h3{
  color:#f0d48a;
  font-size:1.6rem;
  line-height:1.05;
  margin:.05rem 0 .55rem;
}

.digital-path-card p{
  color:#f4e7c4;
  line-height:1.45;
  margin:0 0 1rem;
}

.digital-path-card .btn{
  margin-top:auto;
  align-self:flex-start;
}

.digital-feature-panel,
.digital-video-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(420px,.78fr);
  gap:1.25rem;
  align-items:center;
  padding:1.25rem;
  background:
    radial-gradient(circle at 78% 24%,rgba(84,255,50,.10),transparent 22rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.digital-feature-copy h2{
  color:#f0d48a;
  line-height:.98;
  margin:.1rem 0 .8rem;
}

.digital-feature-copy p,
.digital-video-panel p{
  color:#f4e7c4;
  line-height:1.55;
  max-width:76ch;
}

.digital-feature-image,
.digital-video-image{
  aspect-ratio:16/10;
  padding:14px;
}

.digital-feature-image img,
.digital-video-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
}

.digital-media-gallery{
  grid-template-columns:repeat(4,minmax(0,1fr));
}

.digital-roadmap-grid article{
  min-height:180px;
}

.digital-video-panel{
  grid-template-columns:minmax(0,.78fr) minmax(460px,1fr);
}

@media (max-width:1180px){
  .digital-hero-grid,
  .digital-feature-panel,
  .digital-video-panel{
    grid-template-columns:1fr;
  }

  .digital-path-grid,
  .digital-media-gallery{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:760px){
  .digital-games-hero{
    min-height:auto;
  }

  .digital-path-grid,
  .digital-media-gallery{
    grid-template-columns:1fr;
  }
}


/* ==========================================================
   v5.52 Digital Games VR press kit resources
   Adds press-kit imagery, GIF motion previews and video cards.
   ========================================================== */

.digital-games-hero{
  background:
    linear-gradient(90deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.72) 38%,rgba(0,0,0,.48) 70%,rgba(0,0,0,.68) 100%),
    radial-gradient(circle at 78% 28%,rgba(84,255,50,.16),transparent 26rem),
    url('../uploads/digital-games/vr-press/HITL-VR-background.jpg') !important;
  background-size:cover, auto, cover !important;
  background-position:center center, 78% 28%, center center !important;
  background-repeat:no-repeat !important;
}

.digital-hero-copy .hero-small-note{
  margin-top:.65rem;
  color:#f0d48a;
  font-size:.98rem;
}

.vr-motion-section .wrap,
.digital-video-section .wrap{
  width:min(1280px,92vw);
}

.vr-gif-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.vr-gif-card,
.vr-video-card{
  position:relative;
  padding:1rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.vr-gif-card::before,
.vr-video-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.vr-gif-card > *,
.vr-video-card > *{
  position:relative;
  z-index:2;
}

.vr-gif-frame{
  aspect-ratio:16/10;
  padding:10px;
  margin-bottom:.9rem;
}

.vr-gif-frame img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
}

.vr-gif-card h3,
.vr-video-card h3{
  color:#f0d48a;
  font-size:1.35rem;
  line-height:1.05;
  margin:.1rem 0 .5rem;
}

.vr-gif-card p,
.vr-video-card p{
  color:#f4e7c4;
  line-height:1.45;
  margin:0 0 .9rem;
}

.vr-video-card-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.vr-video-thumb{
  display:block;
  aspect-ratio:16/9;
  padding:10px;
  margin-bottom:1rem;
}

.vr-video-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  border:1px solid rgba(20,11,2,.94);
}

@media (max-width:1180px){
  .vr-gif-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:760px){
  .vr-gif-grid,
  .vr-video-card-grid{
    grid-template-columns:1fr;
  }
}


/* ==========================================================
   v5.53 Digital hub and VR detail page
   Lightens the Digital Games hub hero and moves deeper VR
   material into /vr-game.html.
   ========================================================== */

.digital-games-hero--hub{
  background:
    linear-gradient(90deg,rgba(0,0,0,.70) 0%,rgba(0,0,0,.52) 38%,rgba(0,0,0,.28) 70%,rgba(0,0,0,.44) 100%),
    radial-gradient(circle at 78% 28%,rgba(84,255,50,.12),transparent 26rem),
    url('../uploads/digital-games/vr-press/HITL-VR-background.jpg') !important;
  background-size:cover, auto, cover !important;
  background-position:center center, 78% 28%, center center !important;
}

.digital-path-grid--hub .digital-path-card{
  min-height:420px;
}

.digital-flavour-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
}

.digital-flavour-card{
  position:relative;
  display:grid;
  grid-template-columns:minmax(260px,.42fr) minmax(0,1fr);
  gap:1.25rem;
  align-items:center;
  padding:1rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.digital-flavour-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.digital-flavour-card > *{
  position:relative;
  z-index:2;
}

.digital-flavour-card img{
  width:100%;
  height:230px;
  object-fit:cover;
  border:1px solid rgba(214,163,72,.28);
}

.digital-flavour-card h3{
  color:#f0d48a;
  font-size:1.7rem;
  line-height:1.05;
  margin:.1rem 0 .55rem;
}

.digital-flavour-card p{
  color:#f4e7c4;
  line-height:1.5;
}

.vr-page-hero{
  min-height:72vh;
  display:flex;
  align-items:center;
  background:
    linear-gradient(90deg,rgba(0,0,0,.82) 0%,rgba(0,0,0,.66) 38%,rgba(0,0,0,.34) 70%,rgba(0,0,0,.58) 100%),
    radial-gradient(circle at 78% 28%,rgba(84,255,50,.16),transparent 26rem),
    url('../uploads/digital-games/vr-press/HITL-VR-background.jpg');
  background-size:cover, auto, cover;
  background-position:center center, 78% 28%, center center;
  background-repeat:no-repeat;
}

.vr-page-hero::before,
.vr-page-hero::after{
  content:none !important;
  display:none !important;
}

.vr-about-section .wrap,
.vr-wes-section .wrap,
.vr-motion-section .wrap,
.vr-screens-section .wrap{
  width:min(1280px,92vw);
}

.vr-wes-panel{
  display:grid;
  grid-template-columns:minmax(420px,.78fr) minmax(0,1fr);
  gap:1.25rem;
  align-items:center;
  padding:1.25rem;
  background:
    radial-gradient(circle at 78% 24%,rgba(84,255,50,.10),transparent 22rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.vr-wes-image{
  aspect-ratio:16/9;
  padding:14px;
}

.vr-wes-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  border:1px solid rgba(20,11,2,.94);
}

.vr-wes-copy h2{
  color:#f0d48a;
  line-height:.95;
  margin:.1rem 0 .8rem;
}

.vr-wes-copy p{
  color:#f4e7c4;
  line-height:1.55;
  max-width:72ch;
}

@media (max-width:1180px){
  .digital-flavour-card,
  .vr-wes-panel{
    grid-template-columns:1fr;
  }
}

@media (max-width:760px){
  .digital-flavour-card img{
    height:190px;
  }
  .vr-page-hero{
    min-height:auto;
  }
}


/* ==========================================================
   v5.54 Digital hub image height and copy refinement
   - Makes the three hub intro images taller and easier to read
   - Updates flavour kicker copy on the Digital Games page
   ========================================================== */

.digital-path-grid--hub .digital-path-card{
  min-height:470px;
}

.digital-path-grid--hub .digital-path-image{
  aspect-ratio:auto !important;
  height:280px;
  padding:10px;
}

.digital-path-grid--hub .digital-path-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
}

.digital-flavour-card .kicker{
  max-width:100%;
}

@media (max-width:1180px){
  .digital-path-grid--hub .digital-path-image{
    height:250px;
  }
}

@media (max-width:760px){
  .digital-path-grid--hub .digital-path-image{
    height:220px;
  }
}


/* ==========================================================
   v5.55 VR page restructure
   Front-loads the trailer, adds company/Imersar context,
   expands features and adds demo/Kickstarter/newsletter CTAs.
   ========================================================== */

.vr-origin-section .wrap,
.vr-trailer-spotlight .wrap,
.vr-video-gallery-section .wrap,
.vr-features-section .wrap,
.vr-demo-section .wrap,
.vr-kickstarter-section .wrap,
.newsletter-section .wrap{
  width:min(1280px,92vw);
}

.vr-origin-grid,
.vr-trailer-panel,
.vr-demo-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(420px,.82fr);
  gap:1.25rem;
  align-items:center;
  padding:1.25rem;
  background:
    radial-gradient(circle at 78% 24%,rgba(84,255,50,.10),transparent 22rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.vr-origin-copy p,
.vr-trailer-copy p,
.vr-demo-copy p{
  color:#f4e7c4;
  line-height:1.55;
  max-width:76ch;
}

.vr-origin-image,
.vr-trailer-feature{
  aspect-ratio:16/10;
  padding:14px;
}

.vr-origin-image img,
.vr-trailer-feature img{
  width:100%;
  height:100%;
  object-fit:cover;
  border:1px solid rgba(20,11,2,.94);
}

.vr-video-card-grid--four{
  grid-template-columns:repeat(4,minmax(0,1fr));
}

.vr-gif-grid--features{
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.vr-demo-panel{
  grid-template-columns:minmax(0,1fr) minmax(400px,.88fr);
}

.quest-support-grid{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  margin:1rem 0 .75rem;
}

.quest-support-grid span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:36px;
  padding:.45rem .85rem;
  border-radius:999px;
  border:1px solid rgba(214,163,72,.32);
  background:rgba(255,255,255,.05);
  color:#f4e7c4;
  font-weight:700;
  letter-spacing:.03em;
}

.quest-support-grid .quest-badge{
  background:linear-gradient(180deg,#1f79ff,#0d4fb9);
  color:#fff;
  border-color:rgba(255,255,255,.18);
}

.vr-demo-note{
  color:#d8c387 !important;
  font-size:.98rem;
}

.vr-demo-form-panel{
  position:relative;
  padding:1.05rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.vr-demo-form-panel::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.vr-demo-form-panel > *{
  position:relative;
  z-index:2;
}

.vr-demo-form-panel h3{
  color:#f0d48a;
  margin:0 0 .85rem;
  font-size:1.45rem;
}

.consent-check{
  display:flex;
  align-items:flex-start;
  gap:.6rem;
  color:#f4e7c4;
  font-size:.98rem;
}

.newsletter-inline-form{
  min-width:min(100%,420px);
}

.newsletter-signup-form{
  display:flex;
  gap:.75rem;
  flex-wrap:wrap;
  align-items:center;
}

.newsletter-signup-form input{
  flex:1 1 240px;
  min-height:52px;
  padding:.85rem 1rem;
  border:1px solid rgba(214,163,72,.28);
  background:rgba(10,15,9,.82);
  color:#f8f0dd;
}

.newsletter-signup-form .btn{
  min-height:52px;
}

@media (max-width:1180px){
  .vr-origin-grid,
  .vr-trailer-panel,
  .vr-demo-panel{
    grid-template-columns:1fr;
  }

  .vr-video-card-grid--four{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .vr-gif-grid--features{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:760px){
  .vr-video-card-grid--four,
  .vr-gif-grid--features{
    grid-template-columns:1fr;
  }

  .newsletter-signup-form{
    flex-direction:column;
    align-items:stretch;
  }
}


/* ==========================================================
   v5.57 VR behind-the-scenes GIF lightbox section
   Adds a development GIF gallery with click-to-enlarge support.
   ========================================================== */

.vr-behind-scenes-section .wrap{
  width:min(1280px,92vw);
}

.behind-scenes-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.behind-scenes-card{
  position:relative;
  padding:1rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
  min-height:350px;
}

.behind-scenes-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.behind-scenes-card > *{
  position:relative;
  z-index:2;
}

.behind-scenes-frame{
  aspect-ratio:16/10;
  padding:10px;
  margin-bottom:.9rem;
}

.behind-scenes-frame img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
  cursor:zoom-in;
}

.behind-scenes-card h3{
  color:#f0d48a;
  font-size:1.25rem;
  line-height:1.05;
  margin:.1rem 0 .5rem;
}

.behind-scenes-card p{
  color:#f4e7c4;
  line-height:1.45;
  margin:0;
}

@media (max-width:1180px){
  .behind-scenes-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:760px){
  .behind-scenes-grid{
    grid-template-columns:1fr;
  }
}


/* ==========================================================
   v5.60 VR page image scale, Meta Quest logo and hero pitchdeck
   ========================================================== */

/* Make the behind-the-scenes animated image cards larger and more cinematic. */
.behind-scenes-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:1.15rem !important;
}

.behind-scenes-card{
  min-height:430px !important;
  padding:1.05rem !important;
}

.behind-scenes-frame{
  aspect-ratio:auto !important;
  height:255px !important;
  padding:11px !important;
}

.behind-scenes-frame img{
  object-fit:cover !important;
  object-position:center center !important;
}

/* Make feature GIFs breathe better too. */
.vr-gif-grid--features .vr-gif-frame{
  aspect-ratio:auto !important;
  height:235px !important;
}

/* Meta Quest badge in demo access section. */
.meta-quest-demo-logo{
  margin:1rem 0 .85rem;
  max-width:360px;
}

.meta-quest-demo-logo img{
  display:block;
  width:100%;
  height:auto;
  border-radius:18px;
  box-shadow:0 14px 30px rgba(0,0,0,.32);
}

@media (max-width:1180px){
  .behind-scenes-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .behind-scenes-frame{
    height:245px !important;
  }

  .vr-gif-grid--features .vr-gif-frame{
    height:225px !important;
  }
}

@media (max-width:760px){
  .behind-scenes-grid{
    grid-template-columns:1fr !important;
  }

  .behind-scenes-frame,
  .vr-gif-grid--features .vr-gif-frame{
    height:220px !important;
  }

  .meta-quest-demo-logo{
    max-width:100%;
  }
}


/* ==========================================================
   v5.60 VR demo logo and pitchdeck request form refinement
   ========================================================== */

.meta-quest-demo-logo{
  margin: 1rem 0 .9rem;
  max-width: 390px;
}

.meta-quest-demo-logo img{
  display:block;
  width:100%;
  height:auto;
  border-radius: 30px;
  box-shadow: 0 14px 30px rgba(0,0,0,.30);
}

.pitchdeck-panel{
  align-items:start !important;
  grid-template-columns: minmax(280px,.82fr) minmax(0,1.18fr);
}

.pitchdeck-intro{
  align-self:start;
  padding: .35rem 0 0 .55rem;
}

.pitchdeck-intro h2{
  margin-top: 0;
}

.pitchdeck-intro p{
  margin-top: .55rem;
  padding-left: .2rem;
}

.pitchdeck-request-form{
  align-self:start;
}

@media (max-width: 900px){
  .pitchdeck-panel{
    grid-template-columns:1fr;
  }

  .pitchdeck-intro{
    padding:0;
  }
}


/* ==========================================================
   v5.60 VR YouTube modal video gallery
   ========================================================== */

.vr-trailer-panel--youtube{
  grid-template-columns:minmax(0,.72fr) minmax(560px,1.28fr) !important;
}

.vr-trailer-feature--large{
  position:relative;
  aspect-ratio:16/9 !important;
  padding:16px !important;
  cursor:pointer;
  border:0;
  background:transparent;
  text-align:left;
}

.vr-trailer-feature--large img{
  width:100%;
  height:100%;
  object-fit:cover;
  border:1px solid rgba(20,11,2,.94);
}

.youtube-video-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.youtube-video-card{
  position:relative;
  padding:1rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
  min-height:430px;
  display:flex;
  flex-direction:column;
}

.youtube-video-card--featured{
  grid-column:span 2;
  grid-row:span 2;
  min-height:650px;
}

.youtube-video-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.youtube-video-card > *{
  position:relative;
  z-index:2;
}

.youtube-video-thumb{
  width:100%;
  aspect-ratio:16/9;
  padding:10px;
  margin:0 0 1rem;
  cursor:pointer;
  border:0;
  background:transparent;
  text-align:left;
}

.youtube-video-card--featured .youtube-video-thumb{
  min-height:360px;
}

.youtube-video-thumb img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  border:1px solid rgba(20,11,2,.94);
}

.youtube-play-badge{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:74px;
  height:74px;
  border-radius:999px;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:2rem;
  padding-left:.2rem;
  background:rgba(128,0,0,.86);
  border:2px solid rgba(255,232,170,.82);
  box-shadow:0 16px 34px rgba(0,0,0,.52);
  transition:transform .18s ease, background .18s ease;
}

.video-modal-trigger:hover .youtube-play-badge,
.video-modal-trigger:focus .youtube-play-badge{
  transform:translate(-50%,-50%) scale(1.08);
  background:rgba(165,13,13,.94);
}

.youtube-video-card h3{
  color:#f0d48a;
  font-size:1.35rem;
  line-height:1.08;
  margin:.15rem 0 .55rem;
}

.youtube-video-card--featured h3{
  font-size:1.8rem;
}

.youtube-video-card p{
  color:#f4e7c4;
  line-height:1.45;
  margin:0 0 1rem;
}

.youtube-video-card .btn{
  margin-top:auto;
  align-self:flex-start;
}

.youtube-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  background:rgba(0,0,0,.92);
  display:grid;
  place-items:center;
  padding:2rem;
}

.youtube-modal-inner{
  width:min(1100px,94vw);
}

.youtube-modal-frame{
  position:relative;
  aspect-ratio:16/9;
  background:#000;
  border:1px solid rgba(214,163,72,.75);
  box-shadow:0 0 70px rgba(0,0,0,.86);
}

.youtube-modal-frame iframe{
  width:100%;
  height:100%;
  border:0;
}

.youtube-modal-close{
  display:block;
  margin:0 0 .75rem auto;
  min-width:44px;
  min-height:44px;
  border:1px solid rgba(214,163,72,.75);
  background:#090d08;
  color:#f8e8bd;
  font-size:1.8rem;
  line-height:1;
  cursor:pointer;
}

@media (max-width:1180px){
  .vr-trailer-panel--youtube{
    grid-template-columns:1fr !important;
  }

  .youtube-video-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .youtube-video-card--featured{
    grid-column:span 2;
  }
}

@media (max-width:760px){
  .youtube-video-grid{
    grid-template-columns:1fr;
  }

  .youtube-video-card--featured{
    grid-column:span 1;
    min-height:auto;
  }

  .youtube-video-card--featured .youtube-video-thumb{
    min-height:0;
  }

  .youtube-modal{
    padding:.75rem;
  }
}


/* ==========================================================
   v5.62 VR mansion image + larger main trailer
   ========================================================== */

.vr-origin-grid{
  grid-template-columns:minmax(0,.95fr) minmax(560px,1.05fr);
  align-items:center;
}

.vr-origin-image{
  aspect-ratio: 16 / 10;
  min-height: 420px;
  padding: 18px;
}

.vr-origin-image img{
  object-fit: contain;
  background:#020302;
}

.vr-trailer-panel--youtube{
  grid-template-columns:minmax(0,.58fr) minmax(780px,1.42fr) !important;
  align-items:center;
}

.vr-trailer-feature--large{
  min-height: 520px;
  padding: 18px !important;
}

.vr-trailer-feature--large img{
  object-fit: cover;
}

@media (max-width: 1280px){
  .vr-origin-grid{
    grid-template-columns:minmax(0,1fr) minmax(460px,.96fr);
  }
  .vr-trailer-panel--youtube{
    grid-template-columns:minmax(0,.75fr) minmax(560px,1.25fr) !important;
  }
}

@media (max-width: 1180px){
  .vr-origin-grid{
    grid-template-columns:1fr;
  }
  .vr-origin-image{
    min-height: 340px;
  }
  .vr-trailer-feature--large{
    min-height: 360px;
  }
}


/* ==========================================================
   v5.63 VR origin mansion image - remove gold frame and maximise artwork
   ========================================================== */

.vr-origin-grid{
  align-items:stretch;
}

.vr-origin-image--plain{
  aspect-ratio:auto;
  min-height:480px;
  padding:0 !important;
  border:none !important;
  box-shadow:none !important;
  background:transparent !important;
  overflow:visible;
  display:flex;
  align-items:center;
  justify-content:center;
}

.vr-origin-image--plain::before,
.vr-origin-image--plain::after{
  display:none !important;
}

.vr-origin-image--plain img{
  width:100%;
  height:100%;
  object-fit:contain !important;
  border:none !important;
  background:transparent !important;
  display:block;
}

@media (max-width: 1180px){
  .vr-origin-image--plain{
    min-height:360px;
  }
}


/* ==========================================================
   v5.94 VR page polish tweaks
   - contain oversized trailer artwork within the framed panel
   - add breathing room so "Development Work in Motion" does not clip
   - fix checkbox alignment and spacing in the demo access form
   ========================================================== */

.vr-trailer-panel--youtube{
  grid-template-columns:minmax(0,.64fr) minmax(0,1.36fr) !important;
  overflow:hidden;
}

.vr-trailer-panel--youtube > *{
  min-width:0;
}

.vr-trailer-feature--large{
  width:100%;
  max-width:100%;
  min-width:0;
  justify-self:stretch;
  overflow:hidden;
  box-sizing:border-box;
}

.vr-trailer-feature--large img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.vr-behind-scenes-section .section-title.compact{
  max-width:min(980px, calc(100% - 3rem));
  padding-inline:1.5rem;
}

.vr-behind-scenes-section .section-title.compact [data-brass-heading][data-brass-size="section"]{
  max-width:100%;
}

.vr-demo-form-panel .form-grid{
  align-items:start;
}

.consent-check{
  justify-content:flex-start;
  align-items:flex-start;
  gap:.5rem;
  width:100%;
  line-height:1.4;
}

.consent-check input[type="checkbox"]{
  width:18px !important;
  min-width:18px;
  max-width:18px;
  height:18px;
  padding:0;
  margin:.16rem 0 0;
  flex:0 0 18px;
  accent-color:#1a742d;
}

@media (max-width: 1280px){
  .vr-trailer-panel--youtube{
    grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr) !important;
  }
}

@media (max-width: 900px){
  .vr-behind-scenes-section .section-title.compact{
    max-width:100%;
    padding-inline:1rem;
  }
}


/* ==========================================================
   v5.94 Book of Souls foundation page
   Rebuilds /book-of-souls.html as a focused PC game page.
   ========================================================== */

.book-souls-hero{
  min-height:76vh;
  display:flex;
  align-items:center;
  background:
    linear-gradient(90deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.74) 40%,rgba(0,0,0,.42) 74%,rgba(0,0,0,.58) 100%),
    radial-gradient(circle at 80% 30%,rgba(132,44,201,.22),transparent 28rem),
    url('../images/desk-purple-books.png');
  background-size:cover, auto, cover;
  background-position:center center, 80% 30%, center center;
  background-repeat:no-repeat;
}

.book-souls-hero::before,
.book-souls-hero::after{
  content:none !important;
  display:none !important;
}

.book-souls-hero-grid{
  width:min(1280px,92vw);
  display:grid;
  grid-template-columns:minmax(460px,.92fr) minmax(420px,.86fr);
  gap:1.5rem;
  align-items:center;
}

.book-souls-hero-copy{
  background:linear-gradient(180deg,rgba(2,6,4,.80),rgba(2,6,4,.62));
  padding:2.55rem 1.35rem 1.35rem;
  border:1px solid rgba(214,163,72,.28);
  box-shadow:0 16px 40px rgba(0,0,0,.22);
}

.book-souls-hero-art{
  display:flex;
  align-items:center;
  justify-content:center;
}

.book-souls-hero-art img{
  width:min(100%,560px);
  height:auto;
  display:block;
  filter:drop-shadow(0 28px 44px rgba(0,0,0,.65)) drop-shadow(0 0 24px rgba(132,44,201,.26));
  border:1px solid rgba(214,163,72,.28);
  background:#020302;
}

.book-souls-positioning .wrap,
.book-souls-loop-section .wrap,
.book-souls-pillars-section .wrap,
.book-souls-social-section .wrap,
.book-souls-gallery-section .wrap,
.book-souls-plan-section .wrap,
.book-souls-publisher-section .wrap,
.book-souls-support-section .wrap{
  width:min(1280px,92vw);
}

.book-souls-feature-panel,
.book-social-panel,
.book-pitch-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(420px,.78fr);
  gap:1.25rem;
  align-items:center;
  padding:1.25rem;
  background:
    radial-gradient(circle at 78% 24%,rgba(132,44,201,.12),transparent 22rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.book-souls-feature-copy p,
.book-social-copy p,
.book-pitch-copy p,
.book-pillar-intro p{
  color:#f4e7c4;
  line-height:1.55;
  max-width:76ch;
}

.book-souls-feature-image,
.book-social-image{
  aspect-ratio:16/10;
  padding:14px;
}

.book-souls-feature-image img,
.book-social-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
}

.book-loop-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.book-loop-card{
  position:relative;
  padding:1.15rem 1rem 1rem;
  min-height:245px;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.book-loop-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.book-loop-card > *{
  position:relative;
  z-index:2;
}

.loop-number{
  width:44px;
  height:44px;
  border-radius:999px;
  display:grid;
  place-items:center;
  margin-bottom:.75rem;
  font-weight:900;
  color:#100a02;
  background:linear-gradient(180deg,#ffe59a,#a86e1e);
  box-shadow:0 12px 28px rgba(0,0,0,.38);
}

.book-loop-card h3,
.book-pillar-grid h3,
.book-plan-grid h3{
  color:#f0d48a;
  font-size:1.35rem;
  line-height:1.08;
  margin:.15rem 0 .55rem;
}

.book-loop-card p,
.book-pillar-grid p,
.book-plan-grid p{
  color:#f4e7c4;
  line-height:1.45;
  margin:0;
}

.book-pillar-layout{
  display:grid;
  grid-template-columns:minmax(300px,.52fr) minmax(0,1fr);
  gap:1.25rem;
  align-items:start;
}

.book-pillar-intro{
  position:sticky;
  top:105px;
  padding:1.25rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
}

.book-pillar-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
}

.book-pillar-grid article{
  position:relative;
  padding:1rem;
  min-height:360px;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.book-pillar-grid article::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.book-pillar-grid article > *{
  position:relative;
  z-index:2;
}

.book-pillar-grid img{
  width:100%;
  height:190px;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(214,163,72,.25);
  margin-bottom:.8rem;
}

.book-social-panel{
  grid-template-columns:minmax(460px,.8fr) minmax(0,1fr);
}

.book-souls-gallery{
  grid-template-columns:repeat(4,minmax(0,1fr));
}

.book-souls-gallery .gallery-item img{
  height:220px;
  object-fit:cover;
}

.book-plan-grid article{
  min-height:185px;
}

.book-pitch-panel{
  grid-template-columns:minmax(300px,.76fr) minmax(0,1.24fr);
  align-items:start;
}

.book-pitch-copy{
  padding:.25rem 0 0 .55rem;
}

.book-pitch-form{
  align-self:start;
}

@media (max-width:1180px){
  .book-souls-hero-grid,
  .book-souls-feature-panel,
  .book-social-panel,
  .book-pitch-panel,
  .book-pillar-layout{
    grid-template-columns:1fr;
  }

  .book-loop-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .book-souls-gallery{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .book-pillar-intro{
    position:relative;
    top:auto;
  }
}

@media (max-width:760px){
  .book-loop-grid,
  .book-pillar-grid,
  .book-souls-gallery{
    grid-template-columns:1fr;
  }

  .book-souls-hero{
    min-height:auto;
  }

  .book-souls-hero-grid{
    grid-template-columns:1fr;
  }
}


/* ==========================================================
   v5.94 Book of Souls pitchdeck copy + new assets
   ========================================================== */

.book-souls-hero--pitchdeck{
  min-height:82vh;
  background:
    linear-gradient(90deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.72) 38%,rgba(0,0,0,.34) 72%,rgba(0,0,0,.55) 100%),
    url('../uploads/book-of-souls/book-of-souls-main-background.png') !important;
  background-size:cover !important;
  background-position:center center !important;
}

.book-souls-hero-art--character img{
  width:min(100%,520px);
  border:0 !important;
  background:transparent !important;
  filter:drop-shadow(0 30px 44px rgba(0,0,0,.72)) drop-shadow(0 0 22px rgba(226,255,97,.24));
}

.book-souls-strap-section .wrap,
.book-souls-social-hook .wrap,
.book-souls-gameplay-section .wrap,
.book-souls-core-loop-section .wrap,
.book-proof-section .wrap,
.book-player-repeat-section .wrap,
.book-souls-commercial-section .wrap,
.book-interest-section .wrap,
.book-souls-publisher-section .wrap,
.book-final-cta-section .wrap{
  width:min(1280px,92vw);
}

.book-souls-strap-panel,
.book-gameplay-panel,
.book-commercial-panel{
  position:relative;
  padding:1.35rem 1.55rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.book-souls-strap-panel::before,
.book-gameplay-panel::before,
.book-commercial-panel::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.book-souls-strap-panel > *,
.book-gameplay-panel > *,
.book-commercial-panel > *{
  position:relative;
  z-index:2;
}

.book-souls-strap-panel p,
.book-souls-copy-block p,
.book-gameplay-panel p,
.book-commercial-panel p,
.book-interest-copy p,
.book-pitch-copy p{
  color:#f4e7c4;
  line-height:1.55;
}

.book-souls-split-panel,
.book-interest-panel{
  display:grid;
  grid-template-columns:minmax(0,.96fr) minmax(460px,1.04fr);
  gap:1.25rem;
  align-items:center;
  padding:1.25rem;
  background:
    radial-gradient(circle at 78% 24%,rgba(132,44,201,.12),transparent 22rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.book-souls-image-card--plain{
  background:transparent;
  border:0;
  box-shadow:none;
}

.book-souls-image-card--plain img{
  width:100%;
  height:auto;
  display:block;
  border:1px solid rgba(214,163,72,.32);
  box-shadow:0 18px 46px rgba(0,0,0,.55);
}

.book-gameplay-visual{
  margin:1.2rem 0;
  border:1px solid rgba(214,163,72,.30);
  box-shadow:0 20px 50px rgba(0,0,0,.46);
  background:#020302;
}

.book-gameplay-visual img{
  width:100%;
  height:auto;
  display:block;
}

.book-gameplay-copy-grid,
.book-loop-label-grid,
.book-proof-copy-grid,
.book-return-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.book-loop-label-grid,
.book-proof-copy-grid{
  grid-template-columns:repeat(5,minmax(0,1fr));
}

.book-proof-copy-grid,
.book-return-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
}

.book-gameplay-copy-grid article,
.book-loop-label-grid article,
.book-proof-copy-grid article,
.book-return-grid article{
  position:relative;
  padding:1rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  min-height:150px;
}

.book-gameplay-copy-grid article::before,
.book-loop-label-grid article::before,
.book-proof-copy-grid article::before,
.book-return-grid article::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.book-gameplay-copy-grid article > *,
.book-loop-label-grid article > *,
.book-proof-copy-grid article > *,
.book-return-grid article > *{
  position:relative;
  z-index:2;
}

.book-gameplay-copy-grid h3,
.book-loop-label-grid h3,
.book-proof-copy-grid h3,
.book-return-grid h3{
  color:#f0d48a;
  font-size:1.25rem;
  line-height:1.08;
  margin:0 0 .5rem;
}

.book-gameplay-copy-grid p,
.book-loop-label-grid p,
.book-proof-copy-grid p,
.book-return-grid p{
  color:#f4e7c4;
  line-height:1.45;
  margin:0;
}

.book-loop-graphic-wrap{
  margin:1.4rem auto 1rem;
  max-width:1180px;
}

.book-loop-graphic-wrap img{
  width:100%;
  height:auto;
  display:block;
  filter:drop-shadow(0 24px 42px rgba(0,0,0,.55));
}

.book-proof-composite{
  position:relative;
  width:min(100%,1180px);
  margin:1.35rem auto 1.25rem;
  aspect-ratio:1841/587;
}

.book-proof-composite .proof-frame{
  position:absolute;
  inset:0;
  z-index:3;
  width:100%;
  height:100%;
  object-fit:contain;
  pointer-events:none;
  filter:drop-shadow(0 22px 34px rgba(0,0,0,.50));
}

.proof-gif{
  position:absolute;
  z-index:2;
  top:20.8%;
  width:17.65%;
  height:38.8%;
  object-fit:cover;
  background:#000;
}

.proof-gif--one{ left:4.7%; }
.proof-gif--two{ left:28.4%; }
.proof-gif--three{ left:53.35%; }
.proof-gif--four{ left:77.25%; }

.book-commercial-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(360px,.7fr);
  gap:1.25rem;
  align-items:center;
}

.book-commercial-tags{
  display:flex;
  flex-wrap:wrap;
  gap:.6rem;
}

.book-commercial-tags span{
  border:1px solid rgba(214,163,72,.34);
  color:#f0d48a;
  padding:.65rem .8rem;
  font-size:.86rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
  background:rgba(0,0,0,.22);
}

.book-interest-panel{
  grid-template-columns:minmax(300px,.82fr) minmax(0,1.18fr);
  align-items:start;
}

.book-interest-copy,
.book-pitch-copy{
  padding:.35rem 0 0 .55rem;
}

.small-note{
  color:#d8c387 !important;
  font-size:.95rem;
}

@media (max-width:1180px){
  .book-souls-split-panel,
  .book-interest-panel,
  .book-commercial-panel{
    grid-template-columns:1fr;
  }

  .book-gameplay-copy-grid,
  .book-loop-label-grid,
  .book-proof-copy-grid,
  .book-return-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:760px){
  .book-gameplay-copy-grid,
  .book-loop-label-grid,
  .book-proof-copy-grid,
  .book-return-grid{
    grid-template-columns:1fr;
  }

  .book-proof-composite{
    width:100%;
    overflow-x:auto;
    aspect-ratio:1841/587;
  }
}


/* ==========================================================
   v5.94 Book of Souls hero image dropped
   Removes the separate hero foreground image and lets the
   atmospheric background carry the page header.
   ========================================================== */

.book-souls-hero-grid{
  grid-template-columns:minmax(460px,760px) minmax(0,1fr) !important;
}

.book-souls-hero-copy{
  max-width:760px;
}

.book-souls-hero-art{
  display:none !important;
}

@media (max-width:760px){
  .book-souls-hero-grid{
    grid-template-columns:1fr !important;
  }
}


/* ==========================================================
   v5.94 Tabletopia foundation page
   Rebuilds /tabletopia.html as an online tabletop support page.
   ========================================================== */

.tabletopia-hero{
  min-height:74vh;
  display:flex;
  align-items:center;
  background:
    linear-gradient(90deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.68) 44%,rgba(0,0,0,.38) 76%,rgba(0,0,0,.58) 100%),
    radial-gradient(circle at 78% 34%,rgba(84,255,50,.16),transparent 28rem),
    url('../uploads/tabletopia/tabletopia-01.jpg');
  background-size:cover, auto, cover;
  background-position:center center, 78% 34%, center center;
  background-repeat:no-repeat;
}

.tabletopia-hero::before,
.tabletopia-hero::after{
  content:none !important;
  display:none !important;
}

.tabletopia-hero-grid{
  width:min(1280px,92vw);
  display:grid;
  grid-template-columns:minmax(460px,760px) minmax(0,1fr);
  align-items:center;
}

.tabletopia-hero-copy{
  background:linear-gradient(180deg,rgba(2,6,4,.82),rgba(2,6,4,.64));
  padding:2.55rem 1.35rem 1.35rem;
  border:1px solid rgba(214,163,72,.28);
  box-shadow:0 16px 40px rgba(0,0,0,.22);
}

.tabletopia-intro-section .wrap,
.tabletopia-quickstart-section .wrap,
.tabletopia-play-section .wrap,
.tabletopia-gallery-section .wrap,
.tabletopia-who-section .wrap,
.tabletopia-demo-section .wrap,
.tabletopia-final-section .wrap{
  width:min(1280px,92vw);
}

.tabletopia-feature-panel,
.tabletopia-split-panel,
.tabletopia-demo-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(430px,.82fr);
  gap:1.25rem;
  align-items:center;
  padding:1.25rem;
  background:
    radial-gradient(circle at 78% 24%,rgba(84,255,50,.10),transparent 22rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.tabletopia-feature-copy p,
.tabletopia-split-copy p,
.tabletopia-demo-copy p{
  color:#f4e7c4;
  line-height:1.55;
  max-width:76ch;
}

.tabletopia-feature-image,
.tabletopia-split-image{
  aspect-ratio:16/10;
  padding:14px;
}

.tabletopia-feature-image img,
.tabletopia-split-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  border:1px solid rgba(20,11,2,.94);
}

.tabletopia-step-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.tabletopia-step-grid article{
  position:relative;
  padding:1.15rem;
  min-height:270px;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
  display:flex;
  flex-direction:column;
}

.tabletopia-step-grid article::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.tabletopia-step-grid article > *{
  position:relative;
  z-index:2;
}

.tabletopia-step-grid h3,
.tabletopia-audience-grid h3{
  color:#f0d48a;
  font-size:1.45rem;
  line-height:1.08;
  margin:.15rem 0 .55rem;
}

.tabletopia-step-grid p,
.tabletopia-audience-grid p{
  color:#f4e7c4;
  line-height:1.45;
  margin:0 0 1rem;
}

.tabletopia-step-grid .btn{
  margin-top:auto;
  align-self:flex-start;
}

.tabletopia-split-panel{
  grid-template-columns:minmax(460px,.82fr) minmax(0,1fr);
}

.tabletopia-feature-list{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  margin-top:1rem;
}

.tabletopia-feature-list span{
  padding:.55rem .75rem;
  border:1px solid rgba(214,163,72,.35);
  background:rgba(255,255,255,.04);
  color:#f2d98e;
  font-weight:800;
  font-size:.84rem;
  text-transform:uppercase;
  letter-spacing:.03em;
}

.tabletopia-gallery{
  grid-template-columns:repeat(4,minmax(0,1fr));
}

.tabletopia-gallery .gallery-item img{
  height:230px;
  object-fit:cover;
}

.tabletopia-audience-grid article{
  min-height:190px;
}

.tabletopia-demo-panel{
  grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr);
  align-items:start;
}

.tabletopia-demo-copy{
  padding:.25rem 0 0 .55rem;
}

.tabletopia-support-form{
  align-self:start;
}

@media (max-width:1180px){
  .tabletopia-feature-panel,
  .tabletopia-split-panel,
  .tabletopia-demo-panel{
    grid-template-columns:1fr;
  }

  .tabletopia-step-grid,
  .tabletopia-gallery{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:760px){
  .tabletopia-hero{
    min-height:auto;
  }

  .tabletopia-hero-grid,
  .tabletopia-step-grid,
  .tabletopia-gallery{
    grid-template-columns:1fr;
  }
}


/* ==========================================================
   v5.94 Tabletopia Vimeo how-to-play videos
   Adds two-part Vimeo modal video section.
   ========================================================== */

.tabletopia-video-section .wrap{
  width:min(1280px,92vw);
}

.tabletopia-vimeo-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.tabletopia-vimeo-card{
  position:relative;
  padding:1rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
  display:flex;
  flex-direction:column;
  min-height:520px;
}

.tabletopia-vimeo-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.tabletopia-vimeo-card > *{
  position:relative;
  z-index:2;
}

.tabletopia-vimeo-thumb{
  width:100%;
  aspect-ratio:16/9;
  padding:12px;
  margin:0 0 1rem;
  cursor:pointer;
  border:0;
  background:transparent;
  text-align:left;
}

.tabletopia-vimeo-thumb img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  border:1px solid rgba(20,11,2,.94);
}

.tabletopia-vimeo-card h3{
  color:#f0d48a;
  font-size:1.65rem;
  line-height:1.08;
  margin:.15rem 0 .55rem;
}

.tabletopia-vimeo-card p{
  color:#f4e7c4;
  line-height:1.45;
  margin:0 0 1rem;
}

.tabletopia-vimeo-card .btn{
  margin-top:auto;
  align-self:flex-start;
}

.vimeo-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  background:rgba(0,0,0,.92);
  display:grid;
  place-items:center;
  padding:2rem;
}

.vimeo-modal-inner{
  width:min(1100px,94vw);
}

.vimeo-modal-frame{
  position:relative;
  aspect-ratio:16/9;
  background:#000;
  border:1px solid rgba(214,163,72,.75);
  box-shadow:0 0 70px rgba(0,0,0,.86);
}

.vimeo-modal-frame iframe{
  width:100%;
  height:100%;
  border:0;
}

.vimeo-modal-close{
  display:block;
  margin:0 0 .75rem auto;
  min-width:44px;
  min-height:44px;
  border:1px solid rgba(214,163,72,.75);
  background:#090d08;
  color:#f8e8bd;
  font-size:1.8rem;
  line-height:1;
  cursor:pointer;
}

@media (max-width:900px){
  .tabletopia-vimeo-grid{
    grid-template-columns:1fr;
  }

  .tabletopia-vimeo-card{
    min-height:auto;
  }

  .vimeo-modal{
    padding:.75rem;
  }
}


/* ==========================================================
   v5.94 Tabletopia aspect ratio and screenshot lightbox fix
   - makes feature images and Vimeo thumbnails larger
   - preserves screenshot aspect ratios
   - enables lightbox for Tabletopia screenshot gallery
   ========================================================== */

.tabletopia-feature-panel,
.tabletopia-split-panel{
  align-items:stretch !important;
}

.tabletopia-feature-panel{
  grid-template-columns:minmax(0,.92fr) minmax(560px,1.08fr) !important;
}

.tabletopia-split-panel{
  grid-template-columns:minmax(560px,1.08fr) minmax(0,.92fr) !important;
}

.tabletopia-feature-image,
.tabletopia-split-image{
  aspect-ratio:auto !important;
  height:100%;
  min-height:420px;
  padding:14px !important;
  box-sizing:border-box;
}

.tabletopia-feature-image img,
.tabletopia-split-image img{
  width:100%;
  height:100%;
  object-fit:cover !important;
  object-position:center center;
}

/* The Vimeo thumbnails should display at a proper 16:9 ratio and feel substantial. */
.tabletopia-vimeo-card{
  min-height:620px !important;
}

.tabletopia-vimeo-thumb{
  aspect-ratio:16 / 9 !important;
  min-height:330px;
  padding:12px !important;
  box-sizing:border-box;
}

.tabletopia-vimeo-thumb img{
  object-fit:contain !important;
  background:#020302;
}

/* Give the screenshot gallery clean, lightbox-ready frames without squashing the images. */
.tabletopia-gallery{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  align-items:start;
}

.tabletopia-gallery .gallery-item{
  padding:9px;
  cursor:zoom-in;
  background:linear-gradient(180deg,rgba(8,15,8,.96),rgba(2,4,2,.99));
}

.tabletopia-gallery .gallery-item img{
  width:100%;
  height:260px !important;
  object-fit:contain !important;
  object-position:center center;
  background:#020302;
}

.tabletopia-gallery .gallery-item:hover img{
  transform:none;
}

@media (max-width:1180px){
  .tabletopia-feature-panel,
  .tabletopia-split-panel{
    grid-template-columns:1fr !important;
  }

  .tabletopia-feature-image,
  .tabletopia-split-image{
    min-height:360px;
  }

  .tabletopia-vimeo-thumb{
    min-height:280px;
  }

  .tabletopia-gallery{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (max-width:760px){
  .tabletopia-feature-image,
  .tabletopia-split-image{
    min-height:260px;
  }

  .tabletopia-vimeo-thumb{
    min-height:200px;
  }

  .tabletopia-gallery{
    grid-template-columns:1fr !important;
  }

  .tabletopia-gallery .gallery-item img{
    height:230px !important;
  }
}


/* ==========================================================
   v5.94 Events professional roadshow page
   Rebuilds /events.html around UKGE, SPIEL, SXSW London
   and the five-year public event journey.
   ========================================================== */

.events-hero{
  min-height:74vh;
  display:flex;
  align-items:center;
  background:
    linear-gradient(90deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.70) 42%,rgba(0,0,0,.38) 76%,rgba(0,0,0,.60) 100%),
    radial-gradient(circle at 78% 34%,rgba(84,255,50,.16),transparent 28rem),
    url('../uploads/public-proof-events/event-family-demo.jpg');
  background-size:cover, auto, cover;
  background-position:center center, 78% 34%, center center;
  background-repeat:no-repeat;
}

.events-hero::before,
.events-hero::after{
  content:none !important;
  display:none !important;
}

.events-hero-grid{
  width:min(1280px,92vw);
  display:grid;
  grid-template-columns:minmax(460px,790px) minmax(0,1fr);
  align-items:center;
}

.events-hero-copy{
  background:linear-gradient(180deg,rgba(2,6,4,.84),rgba(2,6,4,.66));
  padding:2.55rem 1.35rem 1.35rem;
  border:1px solid rgba(214,163,72,.28);
  box-shadow:0 16px 40px rgba(0,0,0,.22);
}

.events-roadshow-section .wrap,
.ukge-update-section .wrap,
.spiel-feature-section .wrap,
.sxsw-feature-section .wrap,
.events-gallery-section .wrap,
.events-professional-section .wrap,
.events-final-section .wrap{
  width:min(1280px,92vw);
}

.event-logo-wall{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.event-logo-tile{
  position:relative;
  min-height:190px;
  padding:1rem;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.75rem;
  text-align:center;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.event-logo-tile::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.event-logo-tile img{
  max-width:78%;
  max-height:105px;
  object-fit:contain;
  background:rgba(0,0,0,.22);
}

.event-logo-tile span{
  position:relative;
  z-index:2;
  color:#f0d48a;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
  font-size:.86rem;
}

.event-announcement-panel,
.event-feature-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(390px,.58fr);
  gap:1.25rem;
  align-items:center;
  padding:1.25rem;
  background:
    radial-gradient(circle at 78% 24%,rgba(84,255,50,.10),transparent 22rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.event-announcement-copy p,
.event-feature-copy p{
  color:#f4e7c4;
  line-height:1.55;
  max-width:78ch;
}

.event-logo-stack{
  display:grid;
  gap:1rem;
}

.event-logo-card{
  padding:1.25rem;
  min-height:190px;
  display:grid;
  place-items:center;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
}

.event-logo-card img{
  max-width:100%;
  max-height:160px;
  object-fit:contain;
}

.gamecrowd-card img{
  max-height:130px;
}

.event-feature-panel{
  grid-template-columns:minmax(280px,.34fr) minmax(0,1fr);
}

.event-feature-logo{
  min-height:330px;
  display:grid;
  place-items:center;
  padding:1.5rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
}

.event-feature-logo img{
  max-width:100%;
  max-height:260px;
  object-fit:contain;
}

.sxsw-logo-card img{
  max-height:150px;
}

.event-date-strip{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  margin:1rem 0 1.15rem;
}

.event-date-strip span{
  padding:.55rem .75rem;
  border:1px solid rgba(214,163,72,.35);
  background:rgba(255,255,255,.04);
  color:#f2d98e;
  font-weight:800;
  font-size:.84rem;
  text-transform:uppercase;
  letter-spacing:.03em;
}

.events-lightbox-gallery{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  align-items:start;
}

.events-lightbox-gallery .gallery-item{
  padding:9px;
  cursor:zoom-in;
  background:linear-gradient(180deg,rgba(8,15,8,.96),rgba(2,4,2,.99));
}

.events-lightbox-gallery .gallery-item img{
  width:100%;
  height:240px !important;
  object-fit:cover;
  object-position:center center;
  background:#020302;
}

.events-professional-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
}

.events-professional-grid article{
  position:relative;
  min-height:210px;
  padding:1.15rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.events-professional-grid article::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.events-professional-grid h3{
  position:relative;
  z-index:2;
  color:#f0d48a;
  font-size:1.45rem;
  line-height:1.08;
  margin:.1rem 0 .55rem;
}

.events-professional-grid p{
  position:relative;
  z-index:2;
  color:#f4e7c4;
  line-height:1.45;
  margin:0;
}

@media (max-width:1180px){
  .event-logo-wall,
  .events-professional-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .event-announcement-panel,
  .event-feature-panel{
    grid-template-columns:1fr;
  }

  .events-lightbox-gallery{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (max-width:760px){
  .events-hero{
    min-height:auto;
  }

  .events-hero-grid,
  .event-logo-wall,
  .events-professional-grid,
  .events-lightbox-gallery{
    grid-template-columns:1fr !important;
  }

  .events-lightbox-gallery .gallery-item img{
    height:230px !important;
  }
}


/* ==========================================================
   v5.94 Video cinema hub
   Rebuilds /videos.html as a rich multi-source video player.
   ========================================================== */

.videos-hero{
  min-height:74vh;
  display:flex;
  align-items:center;
  background:
    linear-gradient(90deg,rgba(0,0,0,.90) 0%,rgba(0,0,0,.72) 42%,rgba(0,0,0,.34) 76%,rgba(0,0,0,.58) 100%),
    radial-gradient(circle at 76% 34%,rgba(132,44,201,.20),transparent 28rem),
    url('../uploads/digital-games/vr-press/HITL-VR-background.jpg');
  background-size:cover, auto, cover;
  background-position:center center, 76% 34%, center center;
  background-repeat:no-repeat;
}

.videos-hero::before,
.videos-hero::after{
  content:none !important;
  display:none !important;
}

.videos-hero-grid,
.video-cinema-section .wrap,
.video-collections-section .wrap,
.creator-call-section .wrap,
.videos-final-section .wrap{
  width:min(1280px,92vw);
}

.videos-hero-grid{
  display:grid;
  grid-template-columns:minmax(460px,800px) minmax(0,1fr);
  align-items:center;
}

.videos-hero-copy{
  background:linear-gradient(180deg,rgba(2,6,4,.84),rgba(2,6,4,.66));
  padding:2.55rem 1.35rem 1.35rem;
  border:1px solid rgba(214,163,72,.28);
  box-shadow:0 16px 40px rgba(0,0,0,.22);
}

.video-cinema-layout{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(340px,.65fr);
  gap:1rem;
  align-items:start;
}

.video-cinema-stage{
  position:sticky;
  top:92px;
  background:linear-gradient(180deg,rgba(8,15,8,.96),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.40);
  padding:1rem;
  box-shadow:0 22px 54px rgba(0,0,0,.48);
}

.cinema-screen{
  aspect-ratio:16/9;
  background:#000;
  border:1px solid rgba(214,163,72,.55);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.75);
}

.cinema-screen iframe,
.cinema-screen video{
  width:100%;
  height:100%;
  display:block;
  border:0;
  background:#000;
}

.cinema-meta{
  padding:1rem .25rem .2rem;
}

.cinema-meta h3{
  color:#f0d48a;
  font-size:2rem;
  line-height:1.05;
  margin:.2rem 0 .55rem;
}

.cinema-meta p{
  color:#f4e7c4;
  line-height:1.5;
  max-width:78ch;
}

.video-cinema-playlist{
  max-height:780px;
  overflow:auto;
  padding-right:.35rem;
  display:grid;
  gap:.65rem;
}

.cinema-playlist-card{
  cursor:pointer;
  border:1px solid rgba(214,163,72,.26);
  background:linear-gradient(180deg,rgba(8,15,8,.96),rgba(2,4,2,.99));
  padding:.65rem;
  display:grid;
  grid-template-columns:112px minmax(0,1fr);
  gap:.75rem;
  align-items:center;
  text-align:left;
  transition:border-color .18s ease, transform .18s ease, background .18s ease;
}

.cinema-playlist-card:hover,
.cinema-playlist-card:focus,
.cinema-playlist-card.is-active{
  border-color:rgba(255,221,134,.8);
  background:linear-gradient(180deg,rgba(24,31,16,.98),rgba(5,8,4,.99));
  transform:translateY(-1px);
}

.cinema-playlist-card img{
  width:112px;
  height:70px;
  object-fit:cover;
  background:#000;
  border:1px solid rgba(214,163,72,.25);
}

.cinema-playlist-card span{
  color:#d8a947;
  font-weight:900;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.cinema-playlist-card h3{
  color:#f0d48a;
  font-size:1rem;
  line-height:1.05;
  margin:.15rem 0 .25rem;
}

.cinema-playlist-card p{
  color:#f4e7c4;
  font-size:.86rem;
  line-height:1.28;
  margin:0;
}

.video-collection-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
  margin-top:1.25rem;
}

.video-collection-panel{
  padding:1rem;
  background:linear-gradient(180deg,rgba(8,15,8,.96),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.video-collection-panel h3{
  color:#f0d48a;
  font-size:1.55rem;
  line-height:1.08;
  margin:.1rem 0 .9rem;
}

.mini-video-list{
  display:grid;
  gap:.65rem;
  max-height:460px;
  overflow:auto;
  padding-right:.35rem;
}

.creator-call-panel{
  display:grid;
  grid-template-columns:minmax(300px,.74fr) minmax(0,1.26fr);
  gap:1.25rem;
  align-items:start;
  padding:1.25rem;
  background:
    radial-gradient(circle at 78% 24%,rgba(84,255,50,.10),transparent 22rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.creator-call-copy p{
  color:#f4e7c4;
  line-height:1.55;
  max-width:76ch;
}

.creator-video-form{
  align-self:start;
}

@media (max-width:1180px){
  .video-cinema-layout,
  .creator-call-panel{
    grid-template-columns:1fr;
  }

  .video-cinema-stage{
    position:relative;
    top:auto;
  }
}

@media (max-width:900px){
  .video-collection-grid{
    grid-template-columns:1fr;
  }

  .videos-hero-grid{
    grid-template-columns:1fr;
  }

  .cinema-playlist-card{
    grid-template-columns:96px minmax(0,1fr);
  }

  .cinema-playlist-card img{
    width:96px;
    height:60px;
  }
}


/* ==========================================================
   v5.94 Press kit news browser
   Rebuilds /press-kit.html as a coverage browser and media hub.
   ========================================================== */

.press-kit-hero{
  min-height:74vh;
  display:flex;
  align-items:center;
  background:
    linear-gradient(90deg,rgba(0,0,0,.90) 0%,rgba(0,0,0,.70) 42%,rgba(0,0,0,.34) 76%,rgba(0,0,0,.58) 100%),
    radial-gradient(circle at 76% 34%,rgba(84,255,50,.18),transparent 28rem),
    url('../uploads/digital-games/vr-press/HITL-VR-background.jpg');
  background-size:cover, auto, cover;
  background-position:center center, 76% 34%, center center;
  background-repeat:no-repeat;
}

.press-kit-hero::before,
.press-kit-hero::after{
  content:none !important;
  display:none !important;
}

.press-kit-hero-grid,
.press-news-section .wrap,
.press-highlights-section .wrap,
.press-gallery-section .wrap,
.press-download-section .wrap,
.press-contact-section .wrap{
  width:min(1280px,92vw);
}

.press-kit-hero-grid{
  display:grid;
  grid-template-columns:minmax(460px,820px) minmax(0,1fr);
  align-items:center;
}

.press-kit-hero-copy{
  background:linear-gradient(180deg,rgba(2,6,4,.84),rgba(2,6,4,.66));
  padding:2.55rem 1.35rem 1.35rem;
  border:1px solid rgba(214,163,72,.28);
  box-shadow:0 16px 40px rgba(0,0,0,.22);
}

.press-browser{
  display:grid;
  grid-template-columns:minmax(360px,.68fr) minmax(0,1.32fr);
  gap:1rem;
  align-items:start;
}

.press-browser-sidebar,
.press-story-reader{
  background:linear-gradient(180deg,rgba(8,15,8,.96),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 54px rgba(0,0,0,.44);
}

.press-browser-sidebar{
  padding:1rem;
  position:sticky;
  top:92px;
}

.press-browser-search input{
  width:100%;
  min-height:46px;
  border:1px solid rgba(214,163,72,.5);
  background:#020602;
  color:#f4e7c4;
  padding:.75rem .9rem;
  font-weight:800;
}

.press-filter-row{
  display:flex;
  flex-wrap:wrap;
  gap:.4rem;
  margin:.8rem 0 1rem;
}

.press-filter-row button{
  border:1px solid rgba(214,163,72,.42);
  background:rgba(255,255,255,.04);
  color:#f2d98e;
  padding:.45rem .6rem;
  font-size:.76rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
  cursor:pointer;
}

.press-filter-row button.is-active{
  background:#7d1115;
  color:#fff;
  border-color:#d6a348;
}

.press-story-list{
  display:grid;
  gap:.65rem;
  max-height:840px;
  overflow:auto;
  padding-right:.25rem;
}

.press-story-card{
  display:grid;
  grid-template-columns:86px minmax(0,1fr);
  gap:.75rem;
  align-items:center;
  padding:.65rem;
  border:1px solid rgba(214,163,72,.24);
  background:rgba(0,0,0,.18);
  cursor:pointer;
  text-align:left;
}

.press-story-card:hover,
.press-story-card:focus,
.press-story-card.is-active{
  border-color:rgba(255,221,134,.82);
  background:rgba(255,255,255,.055);
}

.press-story-card img{
  width:86px;
  height:62px;
  object-fit:cover;
  background:#000;
  border:1px solid rgba(214,163,72,.25);
}

.press-story-card span{
  color:#d8a947;
  font-weight:900;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.press-story-card h3{
  color:#f0d48a;
  font-size:1rem;
  line-height:1.05;
  margin:.12rem 0 .2rem;
}

.press-story-card p{
  color:#f4e7c4;
  font-size:.84rem;
  line-height:1.25;
  margin:0;
}

.press-story-reader{
  padding:1.15rem;
}

.press-reader-top{
  display:grid;
  grid-template-columns:150px minmax(0,1fr);
  gap:1rem;
  align-items:center;
  margin-bottom:1rem;
}

.press-reader-top > img{
  width:150px;
  height:72px;
  object-fit:contain;
  background:#020302;
  border:1px solid rgba(214,163,72,.28);
  padding:.35rem;
}

.press-reader-top h3{
  color:#f0d48a;
  font-size:2rem;
  line-height:1.08;
  margin:.2rem 0 .3rem;
}

.press-reader-top p{
  color:#f4e7c4;
  margin:0;
  font-weight:800;
}

.press-reader-thumb{
  width:100%;
  max-height:430px;
  object-fit:cover;
  background:#020302;
  border:1px solid rgba(214,163,72,.35);
  margin-bottom:1rem;
}

.press-reader-summary{
  color:#f4e7c4;
  font-size:1.08rem;
  line-height:1.55;
  font-weight:800;
}

.press-reader-body{
  color:#f4e7c4;
  line-height:1.58;
  column-count:1;
}

.press-reader-body p{
  margin:0 0 .85rem;
}

.press-highlight-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
}

.press-highlight-grid article{
  position:relative;
  min-height:230px;
  padding:1.15rem;
  background:linear-gradient(180deg,rgba(8,15,8,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.press-highlight-grid article::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.press-highlight-grid h3{
  position:relative;
  z-index:2;
  color:#f0d48a;
  font-size:1.34rem;
  line-height:1.08;
  margin:.1rem 0 .6rem;
}

.press-highlight-grid p{
  position:relative;
  z-index:2;
  color:#f4e7c4;
  line-height:1.45;
  margin:0;
}

.press-kit-gallery{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  align-items:start;
}

.press-kit-gallery .gallery-item{
  padding:9px;
  cursor:zoom-in;
  background:linear-gradient(180deg,rgba(8,15,8,.96),rgba(2,4,2,.99));
}

.press-kit-gallery .gallery-item img{
  width:100%;
  height:240px !important;
  object-fit:cover;
  object-position:center center;
  background:#020302;
}

.press-download-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(340px,.45fr);
  gap:1rem;
  align-items:center;
  padding:1.25rem;
  background:
    radial-gradient(circle at 78% 24%,rgba(84,255,50,.10),transparent 22rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.press-download-panel p{
  color:#f4e7c4;
  line-height:1.55;
  max-width:78ch;
}

.press-download-actions{
  display:flex;
  flex-direction:column;
  gap:.75rem;
  align-items:stretch;
}

.press-download-actions .btn{
  justify-content:center;
}

@media (max-width:1180px){
  .press-browser,
  .press-download-panel,
  .creator-call-panel.press-contact-panel{
    grid-template-columns:1fr;
  }

  .press-browser-sidebar{
    position:relative;
    top:auto;
  }

  .press-highlight-grid,
  .press-kit-gallery{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (max-width:760px){
  .press-kit-hero{
    min-height:auto;
  }

  .press-kit-hero-grid,
  .press-highlight-grid,
  .press-kit-gallery{
    grid-template-columns:1fr !important;
  }

  .press-reader-top{
    grid-template-columns:1fr;
  }

  .press-story-card{
    grid-template-columns:74px minmax(0,1fr);
  }

  .press-story-card img{
    width:74px;
    height:58px;
  }
}


/* ==========================================================
   v5.94 Buy page - Stripe-ready direct shop
   ========================================================== */

.buy-hero{
  min-height:76vh;
  display:flex;
  align-items:center;
  background:
    linear-gradient(90deg,rgba(0,0,0,.91) 0%,rgba(0,0,0,.72) 42%,rgba(0,0,0,.36) 76%,rgba(0,0,0,.58) 100%),
    radial-gradient(circle at 75% 36%,rgba(84,255,50,.18),transparent 28rem),
    url('../uploads/board/board-game-product-spread.jpg');
  background-size:cover, auto, cover;
  background-position:center center, 75% 36%, center center;
  background-repeat:no-repeat;
}

.buy-hero::before,
.buy-hero::after{
  content:none !important;
  display:none !important;
}

.buy-hero-grid,
.shop-trust-section .wrap,
.shop-main-section .wrap,
.shop-value-section .wrap,
.shop-experience-section .wrap,
.shop-gallery-section .wrap,
.shop-faq-section .wrap,
.shop-help-section .wrap{
  width:min(1280px,92vw);
}

.buy-hero-grid{
  display:grid;
  grid-template-columns:minmax(460px,760px) minmax(420px,.8fr);
  gap:1.25rem;
  align-items:center;
}

.buy-hero-copy{
  background:linear-gradient(180deg,rgba(2,6,4,.86),rgba(2,6,4,.66));
  padding:2.55rem 1.35rem 1.35rem;
  border:1px solid rgba(214,163,72,.28);
  box-shadow:0 16px 40px rgba(0,0,0,.22);
}

.buy-hero-product{
  display:grid;
  place-items:center;
  padding:1rem;
  background:linear-gradient(180deg,rgba(8,15,8,.82),rgba(2,4,2,.64));
  border:1px solid rgba(214,163,72,.28);
}

.buy-hero-product img{
  width:100%;
  max-height:430px;
  object-fit:cover;
  border:1px solid rgba(214,163,72,.34);
  box-shadow:0 22px 54px rgba(0,0,0,.54);
}

.shop-trust-strip{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
}

.shop-trust-strip div{
  padding:1rem;
  background:linear-gradient(180deg,rgba(8,15,8,.96),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.28);
}

.shop-trust-strip strong{
  display:block;
  color:#f0d48a;
  font-size:1.08rem;
  margin-bottom:.25rem;
}

.shop-trust-strip span{
  color:#f4e7c4;
  line-height:1.35;
}

.shop-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(340px,390px);
  gap:1rem;
  align-items:start;
}

.left-title{
  text-align:left;
  margin-left:0;
  margin-right:auto;
  max-width:880px;
}

.shop-product-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
}

.shop-product-card{
  position:relative;
  display:grid;
  grid-template-columns:minmax(170px,.42fr) minmax(0,1fr);
  min-height:360px;
  background:linear-gradient(180deg,rgba(8,15,8,.96),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
  overflow:hidden;
}

.shop-product-card--featured{
  border-color:rgba(255,221,134,.76);
  box-shadow:0 18px 44px rgba(0,0,0,.42), 0 0 34px rgba(125,17,21,.22);
}

.shop-product-badge{
  position:absolute;
  top:.75rem;
  left:.75rem;
  z-index:4;
  padding:.45rem .65rem;
  background:#7d1115;
  border:1px solid rgba(214,163,72,.8);
  color:#fff;
  font-weight:900;
  text-transform:uppercase;
  font-size:.72rem;
  letter-spacing:.05em;
}

.shop-product-image{
  min-height:100%;
  background:#020302;
}

.shop-product-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.shop-product-body{
  padding:1.15rem;
  display:flex;
  flex-direction:column;
}

.shop-product-strap{
  color:#d8a947 !important;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
  font-size:.78rem;
  margin:.1rem 0 .35rem !important;
}

.shop-product-body h3{
  color:#f0d48a;
  font-size:1.55rem;
  line-height:1.06;
  margin:0 0 .55rem;
}

.shop-product-body p,
.shop-product-body li{
  color:#f4e7c4;
  line-height:1.42;
}

.shop-product-body ul{
  margin:.3rem 0 1rem;
  padding-left:1.1rem;
}

.shop-product-footer{
  margin-top:auto;
  display:grid;
  gap:.75rem;
}

.shop-price{
  display:block;
  color:#fff2b8;
  font-size:2rem;
  font-weight:900;
}

.shop-price-note{
  display:block;
  color:#f4e7c4;
  font-size:.82rem;
  line-height:1.25;
}

.shop-checkout-sticky{
  position:sticky;
  top:94px;
  padding:1rem;
  background:
    radial-gradient(circle at 82% 20%,rgba(84,255,50,.12),transparent 20rem),
    linear-gradient(180deg,rgba(8,15,8,.98),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.48);
  box-shadow:0 22px 54px rgba(0,0,0,.46);
}

.shop-checkout-sticky h2{
  color:#f0d48a;
  font-size:1.7rem;
  line-height:1.08;
  margin:.2rem 0 .5rem;
}

.shop-checkout-sticky p{
  color:#f4e7c4;
  line-height:1.42;
}

.shop-summary-price{
  color:#fff2b8;
  font-size:2.8rem;
  font-weight:900;
  margin:.3rem 0 .75rem;
}

.shop-region-box,
.shop-quantity-row{
  margin:.75rem 0;
}

.shop-region-box label,
.shop-quantity-row label{
  color:#f0d48a;
  font-weight:900;
  display:block;
  margin-bottom:.25rem;
}

.shop-region-box select,
.shop-quantity-row input{
  width:100%;
  min-height:46px;
  background:#020602;
  color:#f4e7c4;
  border:1px solid rgba(214,163,72,.5);
  padding:.65rem;
  font-weight:800;
}

.shop-total-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
  margin:1rem 0;
  padding-top:1rem;
  border-top:1px solid rgba(214,163,72,.28);
  color:#f4e7c4;
  font-weight:900;
}

.shop-total-row strong{
  color:#fff2b8;
  font-size:1.5rem;
}

.shop-smallprint{
  font-size:.78rem;
  opacity:.84;
}

.shop-value-grid article,
.shop-faq-grid article{
  min-height:190px;
}

.shop-experience-panel{
  display:grid;
  grid-template-columns:minmax(460px,.9fr) minmax(0,1fr);
  gap:1.25rem;
  align-items:center;
  padding:1.25rem;
  background:
    radial-gradient(circle at 78% 24%,rgba(84,255,50,.10),transparent 22rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.shop-experience-image{
  aspect-ratio:16/10;
  padding:14px;
}

.shop-experience-image img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.shop-experience-copy p{
  color:#f4e7c4;
  line-height:1.55;
  max-width:76ch;
}

.buy-gallery{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
}

.buy-gallery .gallery-item{
  cursor:zoom-in;
  padding:9px;
  background:linear-gradient(180deg,rgba(8,15,8,.96),rgba(2,4,2,.99));
}

.buy-gallery .gallery-item img{
  width:100%;
  height:240px !important;
  object-fit:cover;
  object-position:center center;
}

.shop-faq-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
}

.shop-faq-grid article{
  position:relative;
  padding:1.15rem;
  background:linear-gradient(180deg,rgba(8,15,8,.96),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
}

.shop-faq-grid article::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(214,163,72,.13);
  pointer-events:none;
}

.shop-faq-grid h3{
  position:relative;
  z-index:2;
  color:#f0d48a;
  font-size:1.35rem;
  line-height:1.08;
  margin:.1rem 0 .55rem;
}

.shop-faq-grid p{
  position:relative;
  z-index:2;
  color:#f4e7c4;
  line-height:1.45;
  margin:0;
}

.shop-toast{
  position:fixed;
  z-index:9999;
  left:50%;
  bottom:1rem;
  transform:translateX(-50%) translateY(120%);
  max-width:min(620px,92vw);
  padding:1rem 1.2rem;
  background:#080e08;
  border:1px solid rgba(214,163,72,.8);
  color:#f4e7c4;
  box-shadow:0 20px 60px rgba(0,0,0,.58);
  transition:transform .22s ease;
}

.shop-toast.is-visible{
  transform:translateX(-50%) translateY(0);
}

@media (max-width:1180px){
  .buy-hero-grid,
  .shop-layout,
  .shop-experience-panel{
    grid-template-columns:1fr;
  }

  .shop-checkout-sticky{
    position:relative;
    top:auto;
  }

  .shop-trust-strip,
  .shop-faq-grid,
  .buy-gallery{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (max-width:820px){
  .buy-hero{
    min-height:auto;
  }

  .shop-product-grid,
  .shop-product-card,
  .shop-trust-strip,
  .shop-faq-grid,
  .buy-gallery{
    grid-template-columns:1fr !important;
  }

  .shop-product-image{
    height:260px;
  }
}


/* ==========================================================
   v5.94 Legal pages - UK terms, privacy and cookie policy
   ========================================================== */

.legal-hero{
  min-height:54vh;
  display:flex;
  align-items:center;
  background:
    linear-gradient(90deg,rgba(0,0,0,.91) 0%,rgba(0,0,0,.72) 48%,rgba(0,0,0,.42) 82%,rgba(0,0,0,.60) 100%),
    radial-gradient(circle at 76% 34%,rgba(84,255,50,.16),transparent 28rem),
    url('../uploads/board/board-game-product-spread.jpg');
  background-size:cover, auto, cover;
  background-position:center center, 76% 34%, center center;
  background-repeat:no-repeat;
}

.legal-hero::before,
.legal-hero::after{
  content:none !important;
  display:none !important;
}

.legal-hero-grid,
.legal-content-section .wrap{
  width:min(1280px,92vw);
}

.legal-hero-grid{
  display:grid;
  grid-template-columns:minmax(460px,820px) minmax(0,1fr);
  align-items:center;
}

.legal-hero-copy{
  background:linear-gradient(180deg,rgba(2,6,4,.86),rgba(2,6,4,.66));
  padding:2.55rem 1.35rem 1.35rem;
  border:1px solid rgba(214,163,72,.28);
  box-shadow:0 16px 40px rgba(0,0,0,.22);
}

.legal-layout{
  display:grid;
  grid-template-columns:minmax(240px,300px) minmax(0,1fr);
  gap:1rem;
  align-items:start;
}

.legal-toc{
  position:sticky;
  top:92px;
  padding:1rem;
  background:linear-gradient(180deg,rgba(8,15,8,.96),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.legal-toc h2{
  color:#f0d48a;
  font-size:1.15rem;
  margin:.1rem 0 .75rem;
}

.legal-toc nav{
  display:grid;
  gap:.35rem;
}

.legal-toc a{
  color:#f4e7c4;
  border-bottom:1px solid rgba(214,163,72,.16);
  padding:.42rem 0;
  text-decoration:none;
  line-height:1.25;
}

.legal-toc a:hover{
  color:#fff2b8;
}

.legal-document{
  padding:1.35rem;
  background:
    radial-gradient(circle at 82% 20%,rgba(84,255,50,.08),transparent 22rem),
    linear-gradient(180deg,rgba(8,15,8,.97),rgba(2,4,2,.995));
  border:1px solid rgba(214,163,72,.40);
  box-shadow:0 22px 54px rgba(0,0,0,.44);
}

.legal-update{
  color:#f4e7c4;
  border:1px solid rgba(214,163,72,.28);
  background:rgba(255,255,255,.035);
  padding:.75rem .9rem;
  margin:0 0 1rem;
}

.legal-document h2{
  color:#f0d48a;
  font-size:1.72rem;
  line-height:1.12;
  margin:1.45rem 0 .65rem;
  padding-top:.2rem;
}

.legal-document h2:first-of-type{
  margin-top:.2rem;
}

.legal-document p,
.legal-document li,
.legal-document td,
.legal-document th{
  color:#f4e7c4;
  line-height:1.55;
}

.legal-document ul{
  padding-left:1.2rem;
}

.legal-company-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.8rem;
  margin:1rem 0;
}

.legal-company-grid div{
  padding:.9rem;
  border:1px solid rgba(214,163,72,.30);
  background:rgba(255,255,255,.035);
  color:#f4e7c4;
  line-height:1.45;
}

.legal-table{
  width:100%;
  border-collapse:collapse;
  margin:1rem 0;
  font-size:.94rem;
}

.legal-table th,
.legal-table td{
  border:1px solid rgba(214,163,72,.28);
  padding:.75rem;
  vertical-align:top;
}

.legal-table th{
  color:#f0d48a;
  background:rgba(255,255,255,.055);
  text-align:left;
}

.legal-cookie-actions{
  margin-top:1rem;
}

.cookie-banner{
  position:fixed;
  z-index:9998;
  left:1rem;
  right:1rem;
  bottom:1rem;
  max-width:980px;
  margin:0 auto;
  padding:1rem;
  background:linear-gradient(180deg,rgba(8,15,8,.98),rgba(2,4,2,.995));
  border:1px solid rgba(214,163,72,.70);
  box-shadow:0 22px 70px rgba(0,0,0,.70);
  display:none;
}

.cookie-banner.is-visible{
  display:block;
}

.cookie-banner h2{
  color:#f0d48a;
  margin:.1rem 0 .35rem;
  font-size:1.35rem;
}

.cookie-banner p{
  color:#f4e7c4;
  line-height:1.45;
  margin:.2rem 0 .85rem;
}

.cookie-banner-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
}

@media (max-width:960px){
  .legal-layout,
  .legal-company-grid{
    grid-template-columns:1fr;
  }

  .legal-toc{
    position:relative;
    top:auto;
  }
}

@media (max-width:760px){
  .legal-hero{
    min-height:auto;
  }

  .legal-hero-grid{
    grid-template-columns:1fr;
  }
}


/* ==========================================================
   v5.94 Footer company legal information
   Adds statutory company, VAT and ICO details to the footer.
   ========================================================== */

.footer-company-legal{
  line-height:1.45;
  font-size:.76rem;
}

.footer-company-legal strong{
  color:#f0d48a;
}

@media (max-width:760px){
  .footer-company-legal{
    font-size:.72rem;
  }
}


/* ==========================================================
   v5.94 Expansions actual product content
   Adds Expand the Library, What's in the Box and product photo gallery.
   ========================================================== */

.expand-library-system .wrap,
.collectors-box-section .wrap,
.expansion-product-gallery-section .wrap{
  width:min(1280px,92vw);
}

.expand-library-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(440px,.78fr);
  gap:1.25rem;
  align-items:center;
  padding:1.25rem;
  background:
    radial-gradient(circle at 78% 24%,rgba(84,255,50,.10),transparent 22rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.expand-library-copy p{
  color:#f4e7c4;
  line-height:1.55;
  max-width:78ch;
}

.expand-library-photo-stack{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.75rem;
}

.product-lightbox-card{
  display:block;
  padding:9px;
  background:linear-gradient(180deg,rgba(8,15,8,.96),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.36);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
  cursor:zoom-in;
}

.product-lightbox-card img{
  width:100%;
  height:330px;
  object-fit:cover;
  object-position:center center;
  display:block;
}

.collectors-box-layout{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(420px,1.08fr);
  gap:1.25rem;
  align-items:start;
}

.collectors-box-gallery{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.75rem;
}

.product-lightbox-card--large{
  grid-column:1 / -1;
}

.collectors-box-gallery .product-lightbox-card--large img{
  height:380px;
}

.collectors-box-gallery .product-lightbox-card:not(.product-lightbox-card--large) img{
  height:255px;
}

.collectors-box-list{
  padding:1.15rem;
  background:
    radial-gradient(circle at 82% 20%,rgba(84,255,50,.10),transparent 20rem),
    linear-gradient(180deg,rgba(8,15,8,.98),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.42);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.collectors-box-list h3{
  color:#f0d48a;
  font-size:1.85rem;
  line-height:1.08;
  margin:.1rem 0 .75rem;
}

.box-contents-list{
  columns:2;
  column-gap:1.4rem;
  padding-left:1.1rem;
  margin:0 0 1rem;
}

.box-contents-list li{
  color:#f4e7c4;
  break-inside:avoid;
  line-height:1.35;
  margin:0 0 .48rem;
}

.box-contents-list strong{
  color:#fff2b8;
  font-size:1.05em;
}

.module-product-photo{
  display:block;
  margin:.85rem 0 1rem;
  padding:6px;
  border:1px solid rgba(214,163,72,.30);
  background:#020302;
  cursor:zoom-in;
}

.module-product-photo img{
  width:100%;
  height:160px;
  object-fit:cover;
  object-position:center center;
  display:block;
}

.expansion-product-gallery{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  align-items:start;
}

.expansion-product-gallery .gallery-item{
  padding:9px;
  cursor:zoom-in;
  background:linear-gradient(180deg,rgba(8,15,8,.96),rgba(2,4,2,.99));
}

.expansion-product-gallery .gallery-item img{
  width:100%;
  height:250px !important;
  object-fit:cover;
  object-position:center center;
  background:#020302;
}

@media (max-width:1180px){
  .expand-library-panel,
  .collectors-box-layout{
    grid-template-columns:1fr;
  }

  .expansion-product-gallery{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (max-width:760px){
  .expand-library-photo-stack,
  .collectors-box-gallery,
  .expansion-product-gallery{
    grid-template-columns:1fr !important;
  }

  .product-lightbox-card img,
  .collectors-box-gallery .product-lightbox-card--large img,
  .collectors-box-gallery .product-lightbox-card:not(.product-lightbox-card--large) img,
  .expansion-product-gallery .gallery-item img{
    height:260px !important;
  }

  .box-contents-list{
    columns:1;
  }
}


/* ==========================================================
   v5.94 Expansions lightbox and image position tweaks
   ========================================================== */
.expansion-image-lightbox{cursor:zoom-in;text-decoration:none;}
.expansion-image-lightbox img{display:block;}
.collectors-expansion .expansion-feature-image{margin-top:2cm;}
@media (max-width:960px){.collectors-expansion .expansion-feature-image{margin-top:1rem;}}


/* ==========================================================
   v5.94 Expansion room tiles layout rules
   ========================================================== */

.room-tiles-section .wrap{
  width:min(1280px,92vw);
}

.room-tiles-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(420px,.75fr);
  gap:1.25rem;
  align-items:start;
  padding:1.25rem;
  background:
    radial-gradient(circle at 78% 24%,rgba(84,255,50,.10),transparent 22rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.room-tiles-copy p,
.room-tiles-rules li,
.room-tiles-rules p{
  color:#f4e7c4;
  line-height:1.55;
}

.room-tiles-copy strong,
.room-tiles-rules strong{
  color:#fff2b8;
}

.room-tiles-rules{
  margin-top:1rem;
  padding:1rem;
  background:rgba(0,0,0,.22);
  border:1px solid rgba(214,163,72,.28);
}

.room-tiles-rules h3{
  color:#f0d48a;
  font-size:1.65rem;
  line-height:1.08;
  margin:.1rem 0 .75rem;
}

.room-tiles-rules ul{
  padding-left:1.15rem;
  margin:0 0 .9rem;
}

.room-tiles-rules li{
  margin:0 0 .48rem;
}

.room-tiles-note{
  margin:.85rem 0 0;
  font-weight:800;
}

.room-tiles-visual{
  display:grid;
  gap:.85rem;
}

.room-tiles-visual .product-lightbox-card--large img{
  height:420px;
}

.room-tiles-visual .product-lightbox-card:not(.product-lightbox-card--large) img{
  height:230px;
}

@media (max-width:1180px){
  .room-tiles-panel{
    grid-template-columns:1fr;
  }
}

@media (max-width:760px){
  .room-tiles-visual .product-lightbox-card--large img,
  .room-tiles-visual .product-lightbox-card:not(.product-lightbox-card--large) img{
    height:260px;
  }
}


/* ==========================================================
   v5.94 Rules page house rule: The Desperate Search
   ========================================================== */

.house-rules-section .wrap{
  width:min(1180px,92vw);
}

.house-rules-panel{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(420px,1.08fr);
  gap:1.25rem;
  align-items:start;
  padding:1.25rem;
  background:
    radial-gradient(circle at 78% 24%,rgba(125,17,21,.18),transparent 22rem),
    radial-gradient(circle at 12% 78%,rgba(84,255,50,.08),transparent 20rem),
    linear-gradient(180deg,rgba(10,15,9,.95),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.house-rule-copy p,
.house-rule-steps li,
.house-rule-steps p{
  color:#f4e7c4;
  line-height:1.55;
}

.house-rule-copy strong,
.house-rule-steps strong{
  color:#fff2b8;
}

.house-rule-steps{
  padding:1rem;
  background:rgba(0,0,0,.24);
  border:1px solid rgba(214,163,72,.28);
}

.house-rule-steps h3{
  color:#f0d48a;
  font-size:1.65rem;
  line-height:1.08;
  margin:.1rem 0 .75rem;
}

.house-rule-steps ol{
  padding-left:1.35rem;
  margin:0 0 1rem;
}

.house-rule-steps li{
  margin:0 0 .55rem;
}

.house-rule-note{
  margin:.85rem 0 0;
  padding:.85rem;
  border:1px solid rgba(214,163,72,.22);
  background:rgba(255,255,255,.035);
  font-weight:800;
}

@media (max-width:960px){
  .house-rules-panel{
    grid-template-columns:1fr;
  }
}


/* ==========================================================
   v5.94 Buy page Stripe Payment Links without site quantity
   ========================================================== */
.shop-stripe-quantity-note{
  margin:1rem 0;
  padding:.85rem;
  border:1px solid rgba(214,163,72,.30);
  background:rgba(255,255,255,.035);
  color:#f4e7c4;
  display:grid;
  gap:.3rem;
}
.shop-stripe-quantity-note strong{
  color:#f0d48a;
  font-size:1.05rem;
}
.shop-stripe-quantity-note span{
  line-height:1.35;
}
.shop-total-row--single{
  border-top:1px solid rgba(214,163,72,.25);
  padding-top:.9rem;
}


/* ==========================================================
   v5.94 Board page direct-shop fix
   Replaces the old multi-item basket with Stripe Payment Link safe routing.
   ========================================================== */
.direct-shop-panel p{
  color:#f4e7c4;
  line-height:1.5;
}
.direct-checkout-summary{
  margin-top:1rem;
}
.direct-shop-panel .btn.ghost{
  margin-top:.65rem;
  width:100%;
  justify-content:center;
}


/* ==========================================================
   v5.94 Board page direct Stripe buttons
   Removes obsolete side cart panel and spaces direct checkout links.
   ========================================================== */

.buy-direct-board-game .commerce-layout{display:block;}
.buy-direct-board-game .commerce-product-grid{margin-top:1.25rem;gap:1.35rem;}
.buy-direct-board-game .commerce-product-card{padding-bottom:1.1rem;}
.direct-stripe-link{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;margin-top:.85rem;width:100%;min-height:50px;text-align:center;}
.direct-stripe-link span{font-size:1.08em;line-height:1;}
.direct-stripe-note{margin-top:1.25rem;padding:1rem;display:flex;flex-wrap:wrap;gap:.75rem 1rem;align-items:center;justify-content:space-between;background:radial-gradient(circle at 82% 20%,rgba(84,255,50,.10),transparent 20rem),linear-gradient(180deg,rgba(8,15,8,.98),rgba(2,4,2,.99));border:1px solid rgba(214,163,72,.42);box-shadow:0 18px 38px rgba(0,0,0,.34);}
.direct-stripe-note strong{color:#f0d48a;font-size:1.15rem;}
.direct-stripe-note span{color:#f4e7c4;line-height:1.35;flex:1 1 420px;}
.direct-stripe-note .btn{white-space:nowrap;}
@media (max-width:760px){.direct-stripe-note{display:grid;justify-items:start;}.direct-stripe-note .btn{width:100%;justify-content:center;}}


/* ==========================================================
   v5.94 Thoughtfish partnership feature
   Adds partnership section to Book of Souls page.
   ========================================================== */

.thoughtfish-partnership-section .wrap{
  width:min(1280px,92vw);
}

.thoughtfish-partnership-panel{
  display:grid;
  grid-template-columns:minmax(360px,.72fr) minmax(0,1.28fr);
  gap:1.25rem;
  align-items:stretch;
  padding:1.25rem;
  background:
    radial-gradient(circle at 82% 18%,rgba(255,122,26,.18),transparent 20rem),
    radial-gradient(circle at 12% 80%,rgba(84,255,50,.08),transparent 20rem),
    linear-gradient(180deg,rgba(8,15,8,.96),rgba(2,4,2,.99));
  border:1px solid rgba(214,163,72,.38);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.thoughtfish-brand-card{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:.85rem;
  padding:1rem;
  background:rgba(0,0,0,.22);
  border:1px solid rgba(214,163,72,.28);
}

.thoughtfish-logo-link{
  display:block;
  padding:.85rem;
  background:#081018;
  border:1px solid rgba(255,122,26,.55);
  box-shadow:0 18px 38px rgba(0,0,0,.34);
}

.thoughtfish-logo-link img{
  width:100%;
  height:auto;
  display:block;
}

.partner-kicker{
  color:#ffb15a;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.78rem;
}

.thoughtfish-brand-card p,
.thoughtfish-copy p,
.thoughtfish-proof-grid p{
  color:#f4e7c4;
  line-height:1.55;
}

.thoughtfish-brand-card strong,
.thoughtfish-copy strong{
  color:#fff2b8;
}

.thoughtfish-copy{
  padding:.5rem .25rem;
}

.thoughtfish-copy h3{
  color:#f0d48a;
  font-size:2rem;
  line-height:1.08;
  margin:.2rem 0 .75rem;
}

.thoughtfish-proof-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.85rem;
  margin-top:1rem;
}

.thoughtfish-proof-grid article{
  padding:.9rem;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(214,163,72,.24);
}

.thoughtfish-proof-grid h4{
  color:#f0d48a;
  font-size:1.1rem;
  line-height:1.1;
  margin:.1rem 0 .45rem;
}

.thoughtfish-proof-grid p{
  margin:0;
  font-size:.94rem;
}

@media (max-width:980px){
  .thoughtfish-partnership-panel,
  .thoughtfish-proof-grid{
    grid-template-columns:1fr;
  }
}
