/* The Storm Era. Uploaded artwork stays fully visible at every screen size. */
:root{--storm-blue:#86c8ff;--storm-bright:#5e98f3;--storm-gold:#f9cc62;--storm-ink:#080f1d;--storm-border:#72a8ec55}
body{background:#080e1b!important}
#appBg{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
#appBg img{width:100%;height:100%;object-fit:cover;opacity:.22}
#appBg .fade{position:absolute;inset:0;z-index:1;background:linear-gradient(#080e1b30,#080e1bb8 75%,#080e1b)}
.storm-banner{background:linear-gradient(100deg,#122441,#172f53 50%,#101b30);border-bottom:1px solid var(--storm-border);box-shadow:0 5px 24px #0005;color:#e8f3ff!important;flex-wrap:wrap;gap:.55rem 1rem;line-height:1.5}
.storm-banner .store-promo-label{color:#10233e;background:var(--storm-blue);font-weight:900}
.storm-banner .store-promo-cta{color:var(--storm-gold);font-size:.8rem;font-weight:850}
.storm-banner .store-promo-text{font-size:.8rem}
.floating-cart-button{background:var(--storm-blue);border-color:#b0d9ff;color:#0d203a;box-shadow:0 6px 26px #285c9544;animation:none}
.floating-cart-button:hover{box-shadow:0 8px 30px #5e98f355}
.floating-cart-count{background:#10223c;color:#c8e7ff}
.storm-hero{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);align-items:center;min-height:430px;overflow:hidden;border:1px solid var(--storm-border);border-radius:1rem;background:linear-gradient(110deg,#111e34,#13233b 54%,#162843);box-shadow:0 18px 45px #0005}
.storm-hero:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 18% 45%,#4875ba35,transparent 60%)}
.storm-hero-art{position:relative;min-width:0;display:grid;place-items:center;padding:1.4rem 0 1.4rem 1.3rem;align-self:stretch;background:linear-gradient(90deg,#0e1b2d,transparent)}
.storm-hero-art:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 78%,#13233b)}
.storm-hero-art img{display:block;width:100%;max-width:450px;height:auto;max-height:450px;object-fit:contain;filter:drop-shadow(0 14px 28px #0007)}
.storm-hero-copy{min-width:0;padding:2rem 2.1rem 2rem .6rem}
.storm-kicker{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem .65rem;border:1px solid #92bdf265;border-radius:999px;background:#4167a12b;color:#b0d9ff;font-size:.62rem;letter-spacing:.11em;font-weight:900;line-height:1.5}
.storm-kicker i{color:var(--storm-gold)}
.storm-hero h1{margin:.95rem 0 .85rem;font-size:clamp(2.15rem,3.4vw,3.7rem);line-height:1.02;letter-spacing:-.045em;font-weight:950;color:#f1f7ff;text-shadow:0 2px 20px #0003}
.storm-hero h1 em{font-style:normal;background:linear-gradient(105deg,#b8e9ff,#7eb0ff);background-clip:text;-webkit-background-clip:text;color:transparent}
.storm-description{margin:0;max-width:34rem;font-size:.94rem;line-height:1.7;color:#c2cee0}
.storm-guarantees{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.25rem 0}
.storm-guarantees span{display:flex;align-items:center;gap:.35rem;border:1px solid #86b5ed3d;border-radius:.5rem;background:#0b1729a8;color:#c6d9ee;padding:.45rem .55rem;font-size:.68rem;font-weight:650}
.storm-guarantees b{color:var(--storm-gold);font-size:.9rem}
.storm-actions{display:flex;align-items:center;flex-wrap:wrap;gap:.8rem 1.15rem;margin-top:1.2rem}
.storm-button{display:inline-flex;align-items:center;justify-content:center;gap:.7rem;min-height:3.1rem;padding:.75rem 1rem;border:1px solid #c1e6ff;border-radius:.65rem;background:linear-gradient(110deg,#a4daff,#72a9f2);box-shadow:0 5px 22px #3877b432;color:#10223e!important;font-size:.85rem;font-weight:900;text-decoration:none;transition:transform .2s,box-shadow .2s}
.storm-button:hover{transform:translateY(-2px);box-shadow:0 7px 28px #5e98f344}
.storm-text-link{color:#c7dcf8!important;font-size:.76rem;font-weight:750;text-decoration:underline;text-underline-offset:4px}
.storm-keys{scroll-margin-top:6rem;padding:1.5rem;border:1px solid #86b5ed38;border-radius:1rem;background:linear-gradient(130deg,#121d2f,#101a2b);box-shadow:0 12px 32px #0003}
.storm-section-heading{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:.5rem;margin-bottom:1.25rem}
.storm-section-heading p{margin:0 0 .3rem;color:var(--storm-blue);font-size:.61rem;letter-spacing:.13em;font-weight:900}
.storm-section-heading h2{margin:0;color:#f0f6ff;font-size:clamp(1.35rem,2.2vw,1.9rem);font-weight:900;line-height:1.25}
.storm-section-heading>span{font-size:.72rem;color:#aabbd0}
.storm-key-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem}
.storm-key-card{display:flex;flex-direction:column;align-items:center;min-width:0;overflow:hidden;padding:1rem;border:1px solid #7aa9e350;border-radius:.8rem;background:radial-gradient(circle at 50% 20%,#345e9140,transparent 65%),#0b1526;color:#f3f8ff;text-align:center;text-decoration:none;transition:transform .2s,border-color .2s}
.storm-key-card:hover{transform:translateY(-4px);border-color:#a2d3ff}
.storm-key-art{display:grid;place-items:center;flex:none;width:100%;height:170px;margin:0 0 .75rem}
.storm-key-art img{display:block;width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 8px 16px #0004)}
.storm-key-label{color:#d3e9ff;font-size:.86rem;letter-spacing:.03em;font-weight:900}
.storm-key-copy{margin:.45rem 0 1rem;color:#9fb3ca;font-size:.7rem;line-height:1.6}
.storm-key-cta{margin-top:auto;color:var(--storm-gold);font-size:.74rem;font-weight:850}
.storm-key-cta i{margin-left:.35rem}
.storm-bundle-card{display:flex;flex-direction:column;position:relative;min-width:0;overflow:hidden;border:1px solid #75a5e08a;border-radius:1rem;background:radial-gradient(ellipse at 50% 24%,#305b8b4d,transparent 65%),#111d30;color:#fff;text-decoration:none;box-shadow:0 15px 32px #0004;transition:transform .25s,border-color .25s}
.storm-bundle-card:hover{transform:translateY(-6px);border-color:#b0d9ff}
.storm-bundle-top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem;padding:1rem 1rem 0}
.storm-edition{color:#a9c0db;font-size:.6rem;letter-spacing:.05em;font-weight:800;text-transform:uppercase}
.storm-bundle-art{display:grid;place-items:center;aspect-ratio:1437/1094;padding:.6rem 1rem}
.storm-bundle-art img{display:block;width:88%;height:100%;max-height:350px;object-fit:contain;filter:drop-shadow(0 12px 20px #0005)}
.storm-bundle-copy{display:flex;flex:1;flex-direction:column;align-items:center;text-align:center;padding:0 1.5rem 1.5rem}
.storm-eyebrow{margin:0 0 .55rem;color:var(--storm-blue);font-size:.6rem;letter-spacing:.13em;text-transform:uppercase;font-weight:850}
.storm-bundle-copy h3{margin:0 0 .8rem;color:#e6f3ff;font-size:clamp(1.4rem,2vw,1.9rem);font-weight:900;line-height:1.2}
.storm-bundle-rewards{list-style:none;margin:0;padding:0;color:#b8cbe0;font-size:.8rem;line-height:1.9}
.storm-bundle-rewards b{color:#e4f3ff}
.storm-bundle-tag{display:inline-block;margin:.9rem 0 1.15rem;padding:.4rem .7rem;border:1px solid #e7bd5a50;border-radius:999px;background:#c29c3413;color:#c9bba0;font-size:.63rem}
.storm-bundle-tag strong{color:var(--storm-gold);letter-spacing:.08em;margin-left:.25rem}
.storm-bundle-cta{display:flex;align-items:center;justify-content:center;gap:.65rem;width:100%;margin-top:auto;padding:.85rem 1rem;border-radius:.65rem;background:linear-gradient(110deg,#a4daff,#72a9f2);color:#10223e;font-size:.9rem;font-weight:900;line-height:1.5}
.storm-product{border:1px solid #6ba6ed7a;background:linear-gradient(145deg,#14243c,#171e2b)!important}
.storm-product:hover{box-shadow:0 12px 32px #4e8cd52b}
.storm-product .product-image img{object-fit:contain}
.storm-hero a:focus-visible,.storm-key-card:focus-visible,.storm-bundle-card:focus-visible,.storm-banner:focus-visible{outline:3px solid var(--storm-gold);outline-offset:4px}
/* The existing starter offer keeps its own green identity. */
.starter-card{display:flex;flex-direction:column;min-width:0;overflow:hidden;border:1px solid #9af07a88;border-radius:1rem;background:radial-gradient(ellipse at 50% 28%,#37502e55,transparent 60%),#22272a;color:#fff;text-decoration:none;transition:transform .25s,border-color .25s}
.starter-card:hover{transform:translateY(-6px);border-color:#b8ff9e}
.starter-card-topline{display:flex;justify-content:flex-end;min-height:51px;padding:1rem 1rem 0}
.starter-card-badge{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .65rem;border-radius:999px;background:#9af07a;color:#162111;font-size:.6rem;font-weight:900;text-transform:uppercase;line-height:1.4}
.starter-artwork{display:grid;place-items:center;aspect-ratio:1437/1094}
.starter-artwork img{width:82%;height:92%;object-fit:contain}
.starter-card-copy{display:flex;flex:1;flex-direction:column;align-items:center;padding:0 1.5rem 1.5rem;text-align:center}
.starter-eyebrow{color:#b0df94;font-size:.6rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;margin:0 0 .55rem}
.starter-card h3{font-size:clamp(1.4rem,2vw,1.9rem);font-weight:900;line-height:1.15;margin:0 0 .85rem;color:#f3ffed}
.starter-rewards{font-size:.8rem;line-height:1.75;color:#ced8c9;margin:0 0 .8rem}
.starter-price{margin:.3rem 0 1.25rem}
.starter-price .text-primary{color:#b0df94}
.starter-card-cta{display:flex;width:100%;align-items:center;justify-content:center;gap:.65rem;background:linear-gradient(110deg,#b8f797,#87d55f);color:#162111;border-radius:.65rem;padding:.85rem 1rem;font-size:.9rem;font-weight:900;margin-top:auto;line-height:1.5}
@media(max-width:1050px){.storm-hero{grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr)}.storm-hero-copy{padding:1.6rem 1.5rem 1.6rem .4rem}.storm-hero h1{font-size:2.5rem}.storm-key-art{height:135px}}
@media(max-width:800px){.storm-hero{grid-template-columns:1fr;min-height:0}.storm-hero-art{padding:1rem 1rem 0}.storm-hero-art img{max-height:310px;width:82%}.storm-hero-art:after{background:linear-gradient(transparent 78%,#13233b)}.storm-hero-copy{padding:.7rem 1.5rem 1.7rem}.storm-hero h1{font-size:2.75rem}.storm-key-art{height:160px}}
@media(max-width:560px){.storm-banner{justify-content:center;padding:.6rem 4.4rem .6rem .8rem;gap:.35rem}.storm-banner .store-promo-text{font-size:.67rem}.storm-hero-art img{max-height:270px}.storm-hero-copy{padding:.6rem 1.15rem 1.4rem}.storm-hero h1{font-size:2.45rem}.storm-description{font-size:.87rem}.storm-guarantees{gap:.35rem}.storm-guarantees span{font-size:.63rem;padding:.35rem .4rem}.storm-actions{align-items:stretch;flex-direction:column;text-align:center}.storm-keys{padding:1rem}.storm-key-grid{grid-template-columns:1fr}.storm-key-card{padding:1.3rem}.storm-key-art{height:180px}.storm-bundle-copy{padding:0 1.15rem 1.25rem}}
@media(prefers-reduced-motion:reduce){.storm-button,.storm-key-card,.storm-bundle-card,.starter-card{transition:none}.storm-button:hover,.storm-key-card:hover,.storm-bundle-card:hover,.starter-card:hover{transform:none}}
