/* Striper Tracker homepage header and feature cards (approved mockup, Nov 2026). Scoped to .st-* classes only. */
.st-head{position:relative;z-index:1001;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 12px 7px 12px;min-height:62px;background:#061527 url(/home/header-surf.svg) right center/cover no-repeat;border-bottom:1px solid #1d3f57}
.st-brand{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:0}
.st-logo{width:52px;height:52px;border-radius:50%;flex:0 0 auto;box-shadow:0 0 0 2px rgba(255,255,255,.18),0 2px 8px rgba(0,0,0,.5)}
.st-brand-txt{display:flex;flex-direction:column;min-width:0;line-height:1}
.st-brand-txt b{font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:31px;letter-spacing:.01em;color:#fff;white-space:nowrap}
.st-brand-txt b span{color:#4fd6e8}
.st-brand-txt small{margin-top:4px;font-family:'DM Sans',sans-serif;font-size:10.5px;font-weight:600;letter-spacing:.16em;color:#d5e4ec;white-space:nowrap}
.st-burger{flex:0 0 auto;width:44px;height:44px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;background:transparent;border:0;cursor:pointer;padding:0}
.st-burger i{display:block;width:26px;height:3px;border-radius:2px;background:#fff}
.st-burger[aria-expanded=true] i:nth-child(1){transform:translateY(8px) rotate(45deg)}.st-burger[aria-expanded=true] i:nth-child(2){opacity:0}.st-burger[aria-expanded=true] i:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.st-menu{position:absolute;right:10px;top:calc(100% - 4px);width:min(300px,calc(100vw - 20px));max-height:calc(100dvh - 90px);overflow:auto;background:#0b2134;border:2px solid #39d6e0;border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,.6);padding:8px;z-index:1002}
.st-menu[hidden]{display:none}
.st-menu a{display:block;padding:12px 12px;border-radius:9px;color:#eef6f8;text-decoration:none;font:600 15px/1.2 'DM Sans',sans-serif}
.st-menu a:hover,.st-menu a:focus-visible{background:#14354d;outline:none}
.st-menu-status{margin:6px 4px 2px;padding-top:8px;border-top:1px solid #23485e;font:12px 'DM Sans',sans-serif;color:#98b0b5}
.st-menu-status .status{display:inline-flex;align-items:center;gap:6px}.st-menu-status .status i{width:7px;height:7px;border-radius:50%;background:#73d9aa;display:inline-block}

.st-cards{display:flex;flex-direction:column;gap:9px;padding:10px 12px 14px;background:#06152a}
.st-card{position:relative;display:flex;align-items:stretch;text-decoration:none;color:#fff;background:#0a2036;border-radius:14px;overflow:hidden;-webkit-tap-highlight-color:rgba(79,214,232,.25)}
.st-card:focus-visible{outline:3px solid #f2d34f;outline-offset:2px}
.st-card *{pointer-events:none}
.st-kicker{display:block;font:700 15px/1 'Barlow Semi Condensed','Barlow Condensed',sans-serif;letter-spacing:.04em;color:#f2d34f}
.st-arrow{flex:0 0 auto;display:flex;align-items:center;padding:0 10px 0 2px}
.st-arrow svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}

/* Fall / Spring migration cards */
.st-mig{border:2px solid #2f8de0;min-height:78px;box-shadow:0 0 10px rgba(47,141,224,.25)}
.st-spring{min-height:66px}
.st-art{flex:0 0 26%;display:flex;align-items:center;justify-content:center}
.st-art img{width:64px;height:64px;border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,.18),0 2px 8px rgba(0,0,0,.5)}
.st-spring .st-art img{width:56px;height:56px}
.st-body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:6px 0 6px 4px}
.st-title{font:700 22px/1.05 'Barlow Condensed',sans-serif;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st-sub{font:500 12px/1.25 'DM Sans',sans-serif;color:#d7e5ec}

/* East Coast Surf Fishing HQ: the largest card */
.st-hq{flex-direction:column;border:3px solid #39e0e6;box-shadow:0 0 16px rgba(57,224,230,.65),inset 0 0 10px rgba(57,224,230,.18);min-height:162px;margin:3px 0}
.st-hq-art{position:absolute;inset:0;background:url(/home/surf-sunset.svg) right center/cover no-repeat}
.st-hq-art::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0a2036 0%,rgba(10,32,54,.92) 30%,rgba(10,32,54,.45) 58%,rgba(10,32,54,0) 78%)}
.st-hq-body{position:relative;display:flex;flex-direction:column;padding:8px 40px 4px 14px}
.st-hq-title{font:700 36px/1 'Barlow Semi Condensed','Barlow Condensed',sans-serif;color:#fff;margin-top:3px;text-shadow:0 2px 6px rgba(0,0,0,.45)}
.st-hq-sub{margin-top:4px;font:600 13px/1.25 'DM Sans',sans-serif;color:#eef5f7;text-shadow:0 1px 4px rgba(0,0,0,.5)}
.st-hq-rule{display:block;height:1px;margin:5px 0 5px;width:78%;background:linear-gradient(90deg,rgba(255,255,255,.45),rgba(255,255,255,.08))}
.st-icons{display:flex;gap:4px;justify-content:space-between;max-width:290px}
.st-icons>span{display:flex;flex-direction:column;align-items:center;gap:3px;font:600 11px/1 'DM Sans',sans-serif;color:#fff;min-width:38px;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.st-icons svg{width:24px;height:24px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}
.st-icons>span:nth-child(3) svg{stroke:#4fd6e8}
.st-hq-arrow{position:absolute;right:0;top:50%;transform:translateY(-60%);padding-right:10px}
.st-hq-arrow svg{width:22px;height:22px}
.st-brush{position:relative;align-self:flex-start;margin:4px 0 7px -2px;padding:5px 26px 6px 22px;background:#5ee0e2;clip-path:polygon(0 30%,4% 8%,10% 14%,22% 2%,48% 6%,74% 0,92% 6%,100% 22%,97% 50%,100% 82%,90% 96%,66% 92%,40% 100%,16% 94%,6% 100%,2% 78%,5% 56%);transform:rotate(-1deg)}
.st-brush em{font:italic 800 14.5px/1 'DM Sans',sans-serif;color:#082033;white-space:nowrap}

/* Attack Pack card */
.st-attack{align-items:center;gap:0;border:2px solid #2aa9b8;min-height:88px;padding:6px 10px 6px 6px}
.st-attack-logo{flex:0 0 auto;width:84px;height:84px;object-fit:cover;border-radius:50%;margin:0 6px 0 2px}
.st-attack-rule{flex:0 0 1px;align-self:stretch;margin:6px 10px 6px 4px;background:rgba(160,210,220,.35)}
.st-attack-copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.st-attack-kicker{font:700 11px/1.1 'DM Sans',sans-serif;letter-spacing:.06em;color:#cfe6ef}
.st-attack-copy strong{font:700 19px/1.05 'Barlow Semi Condensed','Barlow Condensed',sans-serif;color:#fff}
.st-attack-copy>span:not(.st-attack-kicker){font:500 12px/1.3 'DM Sans',sans-serif;color:#dbe8ee}
.st-attack-copy small{font:700 13px/1.1 'Barlow Semi Condensed','Barlow Condensed',sans-serif;color:#8ff0a4;letter-spacing:.01em}
.st-attack-copy small b{font-weight:700}

/* Small phones */
@media(max-width:370px){.st-brand-txt b{font-size:26px}.st-brand-txt small{font-size:9px;letter-spacing:.12em}.st-logo{width:44px;height:44px}.st-title{font-size:20px;white-space:normal;overflow:visible}.st-hq-title{font-size:31px}.st-brush em{font-size:12.5px}.st-icons svg{width:21px;height:21px}.st-attack-copy strong{font-size:17px}.st-attack-logo{width:70px;height:70px}.st-attack-copy small{font-size:11.5px;white-space:nowrap}.st-attack-copy>span:not(.st-attack-kicker){font-size:11.5px}}
/* Larger phones and tablets: same layout, a little larger */
@media(min-width:480px){.st-art img{width:72px;height:72px}.st-spring .st-art img{width:62px;height:62px}.st-cards{padding:12px 16px 16px}.st-title{font-size:26px}.st-sub{font-size:14px}.st-kicker{font-size:16px}.st-hq-title{font-size:42px}.st-hq-sub{font-size:14.5px}.st-icons{max-width:360px}.st-icons svg{width:28px;height:28px}.st-icons>span{font-size:12px}.st-brush em{font-size:16px}.st-attack-copy strong{font-size:22px}}
/* Desktop: fall + spring stacked beside the HQ card, Attack Pack below */
@media(min-width:900px){
 .st-head{padding:10px 24px;min-height:78px}.st-logo{width:58px;height:58px}.st-brand-txt b{font-size:36px}.st-brand-txt small{font-size:11.5px}
 .st-cards{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);grid-auto-rows:auto;gap:12px;max-width:1200px;margin:0 auto;padding:14px 24px 16px}
 .st-fall{grid-column:1;grid-row:1}.st-spring{grid-column:1;grid-row:2}.st-hq{grid-column:2;grid-row:1/span 2;margin:0}.st-attack{grid-column:1/span 2;grid-row:3;min-height:80px}
 .st-attack-logo{width:68px;height:68px}
}

/* Grand-opening welcome popup (only while the server says the promotion is active; once per visitor) */
.st-promo-modal{position:fixed;inset:0;z-index:20000;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(2,10,18,.72)}
.st-promo-modal[hidden]{display:none}
.st-promo-box{position:relative;width:min(380px,100%);text-align:center;background:linear-gradient(160deg,#0f2f47,#0a2036);border:3px solid #39e0e6;border-radius:18px;box-shadow:0 0 22px rgba(57,224,230,.55);padding:30px 20px 22px;color:#fff;display:flex;flex-direction:column;gap:8px}
.st-promo-x{position:absolute;top:4px;right:6px;width:44px;height:44px;border:0;background:transparent;color:#fff;font:400 32px/1 system-ui,sans-serif;cursor:pointer}
.st-promo-kicker{font:800 15px/1 'Barlow Semi Condensed','Barlow Condensed',sans-serif;letter-spacing:.12em;color:#f2d34f}
.st-promo-main{font:700 30px/1.05 'Barlow Semi Condensed','Barlow Condensed',sans-serif}
.st-promo-sub{font:500 15px/1.35 'DM Sans',sans-serif;color:#dbe8ee}
.st-promo-go{margin-top:10px;min-height:50px;border:0;border-radius:12px;background:#5ee0e2;color:#082033;font:800 17px/1 'DM Sans',sans-serif;letter-spacing:.04em;cursor:pointer}
.st-promo-go:focus-visible,.st-promo-x:focus-visible{outline:3px solid #f2d34f;outline-offset:2px}