/* "Medicare in your state": tile map + animated state panel (states.js, states-data.js) */
.st-sub{color:#C9D8E3;font-weight:500;font-size:1.08rem;margin:10px auto 0;max-width:52ch}
.st-stage{display:grid;grid-template-columns:1fr 1.02fr;gap:48px;align-items:start;margin:34px auto 34px;max-width:1120px}
.st-mapbox{position:relative;padding-top:26px}
.st-map{display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:repeat(8,auto);gap:6px;width:100%;max-width:560px;margin:0 auto}
.st-tile{aspect-ratio:1;display:flex;align-items:center;justify-content:center;border-radius:10px;font:700 .72rem/1 var(--ff);letter-spacing:.02em;color:rgba(255,255,255,.34);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);padding:0}
.js .states:not(.st-in) .st-tile{opacity:0;transform:scale(.4)}
.st-tile.on{font-size:.82rem;font-weight:800;color:var(--navy);background:var(--sun);border:0;cursor:pointer;box-shadow:0 0 0 0 rgba(255,197,58,.55),0 6px 16px -8px rgba(0,0,0,.6);transition:transform .25s cubic-bezier(.3,1.5,.5,1),background .2s,box-shadow .3s}
.st-tile.on:hover{transform:scale(1.14);box-shadow:0 0 0 6px rgba(255,197,58,.22),0 10px 22px -8px rgba(0,0,0,.6)}
.st-tile.on:focus-visible,.st-btn:focus-visible,.stp-chip:focus-visible,.stp-close:focus-visible,.stp-src:focus-visible{outline:3px solid #fff;outline-offset:3px}
.st-tile.on.is-active{background:#fff;color:var(--deep);transform:scale(1.18);z-index:2;box-shadow:0 0 0 5px var(--sun),0 12px 28px -8px rgba(0,0,0,.7)}
.st-tile.on.is-active::after{content:"";position:absolute;inset:-5px;border-radius:14px;border:2px solid var(--sun);animation:stRing 1.6s ease-out infinite}
.st-tile{position:relative}
.states.st-in .st-tile{animation:stPop .55s cubic-bezier(.3,1.5,.5,1) var(--o) backwards}
.states.st-in .st-tile.on{animation:stPop .55s cubic-bezier(.3,1.5,.5,1) var(--o) backwards,stGlow 3.2s ease-in-out calc(var(--o) + .8s) infinite}
@keyframes stPop{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}
@keyframes stGlow{0%,100%{box-shadow:0 0 0 0 rgba(255,197,58,0),0 6px 16px -8px rgba(0,0,0,.6)}50%{box-shadow:0 0 0 7px rgba(255,197,58,.18),0 6px 16px -8px rgba(0,0,0,.6)}}
@keyframes stRing{from{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(1.45)}}
.states.st-in .st-tile.on.is-active{animation:none;opacity:1}
.st-legend{display:flex;align-items:center;justify-content:center;gap:9px;margin:16px 0 0;font-weight:600;font-size:.92rem;color:#C9D8E3}
.st-legend i{width:14px;height:14px;border-radius:4px;background:var(--sun);display:inline-block}

/* panel (desktop: card beside the map; phone: bottom sheet) */
.st-panel-slot{perspective:1400px;min-height:560px;display:flex;align-items:flex-start}
.st-panel{width:100%;outline:none}
.stp-card{background:var(--cream);color:var(--ink);border-radius:26px;padding:26px 26px 22px;box-shadow:0 30px 60px -28px rgba(0,0,0,.65);position:relative;overflow:hidden;transform-origin:50% 0}
.stp-card::before{content:"";position:absolute;right:-70px;top:-70px;width:220px;height:220px;border-radius:50%;border:16px solid rgba(11,133,133,.10);pointer-events:none}
.stp-card.stp-enter{animation:stIn .6s cubic-bezier(.2,.8,.2,1) both}
.stp-card.stp-leave{animation:stOut .2s ease-in both}
@keyframes stIn{from{opacity:0;transform:rotateX(-14deg) translateY(22px) scale(.97)}to{opacity:1;transform:none}}
@keyframes stOut{to{opacity:0;transform:translateY(-10px) scale(.985)}}
.stp-intro{text-align:center;padding:36px 32px}
.stp-intro h3{font-size:1.45rem;margin:6px 0 10px;color:var(--navy)}
.stp-intro p{color:var(--muted);margin:0 auto;max-width:38ch;line-height:1.55}
.stp-intro-art svg{width:130px;height:auto;display:block;margin:0 auto}
.js .stp-intro-art .ia1,.js .stp-intro-art .ia2{stroke-dasharray:170;stroke-dashoffset:170}
.states.st-in .stp-intro-art .ia1{animation:stDraw 1.4s cubic-bezier(.6,.1,.2,1) .3s forwards}
.states.st-in .stp-intro-art .ia2{animation:stDraw 1.2s cubic-bezier(.6,.1,.2,1) .6s forwards}
.stp-intro-art .ia3{transform-origin:60px 58px}
.js .stp-intro-art .ia3{transform:scale(0)}
.states.st-in .stp-intro-art .ia3{animation:stSun 2.6s ease-in-out 1.2s infinite}
@keyframes stDraw{to{stroke-dashoffset:0}}
@keyframes stSun{0%{transform:scale(0) translateY(0)}20%{transform:scale(1) translateY(0)}60%{transform:scale(1) translateY(-6px)}100%{transform:scale(1) translateY(0)}}
.stp-try{margin-top:18px!important;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;font-weight:600;color:var(--navy)!important}
.stp-chip{font:700 .95rem var(--ff);color:var(--deep);background:#fff;border:2px solid #CFE7E4;border-radius:999px;padding:10px 16px;min-height:44px;cursor:pointer;transition:background .2s,border-color .2s,transform .2s}
.stp-chip:hover{background:#EEF8F6;border-color:var(--teal);transform:translateY(-2px)}
.stp-head{display:flex;align-items:center;gap:14px;margin-bottom:14px;position:relative}
.stp-badge{position:relative;width:72px;height:72px;flex:none;display:grid;place-items:center}
.stp-badge svg{position:absolute;inset:0;width:100%;height:100%}
.stp-badge .b1{stroke-dasharray:200;stroke-dashoffset:200;animation:stDraw .9s cubic-bezier(.6,.1,.2,1) .1s forwards}
.stp-badge .b2{transform-origin:36px 40px;animation:stPop .5s cubic-bezier(.3,1.6,.5,1) .35s both}
.stp-badge span{position:relative;top:3px;font:800 1.1rem var(--ff);color:var(--navy);letter-spacing:.02em}
.stp-kicker{margin:0;font-size:.82rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--teal)}
.stp-head h3{margin:2px 0 0;font-size:1.6rem;line-height:1.15;color:var(--navy)}
.stp-close{margin-left:auto;align-self:flex-start;width:44px;height:44px;border-radius:50%;border:0;background:#fff;color:var(--navy);display:none;place-items:center;cursor:pointer;box-shadow:0 4px 12px -6px rgba(14,42,71,.4)}
.stp-close svg{width:20px;height:20px}
.stp-points{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.stp-points li{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:16px;padding:11px 14px;animation:stPoint .5s cubic-bezier(.2,.8,.2,1) calc(.18s + var(--i) * .09s) both}
@keyframes stPoint{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}
.stp-ico{width:38px;height:38px;flex:none;border-radius:12px;display:grid;place-items:center;background:#E3F3F1;color:var(--deep)}
.stp-ico svg{width:21px;height:21px}
.stp-points li:nth-child(2) .stp-ico{background:#FFF1CC;color:#8A5B00}
.stp-points li:nth-child(3) .stp-ico{background:#E2EAF3;color:var(--navy)}
.stp-points b{display:block;font-size:.98rem;color:var(--navy);margin-bottom:2px}
.stp-points p{margin:0;font-size:.97rem;line-height:1.45;color:var(--ink)}
.stp-src{font-size:.78rem;font-weight:700;color:var(--teal);text-decoration:none;white-space:nowrap;margin-left:4px;border-bottom:1px dotted currentColor}
.stp-src:hover{color:var(--deep)}
.stp-cta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;margin-top:16px;animation:stPoint .5s cubic-bezier(.2,.8,.2,1) .6s both}
.stp-cta .cc-btn{margin:0}
.stp-call{font-weight:700;color:var(--navy);text-decoration:none;padding:10px 4px;min-height:44px;display:inline-flex;align-items:center}
.stp-call:hover{color:var(--deep);text-decoration:underline}
.stp-note{margin:14px 0 0;font-size:.8rem;line-height:1.45;color:var(--muted)}

/* state buttons */
.state-grid .st-btn{all:unset;box-sizing:border-box;width:100%;height:100%;display:flex;flex-direction:column;gap:2px;padding:16px 16px 14px;border-radius:18px;cursor:pointer;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);transition:background .3s,transform .3s,border-color .3s}
.state-grid li{background:none;border:0;padding:0}
.state-grid li:hover{background:none;transform:none}
.state-grid .st-btn:hover{background:rgba(255,197,58,.14);border-color:var(--sun);transform:translateY(-3px)}
.state-grid .st-btn.is-active{background:var(--sun);border-color:var(--sun)}
.state-grid .st-btn.is-active b,.state-grid .st-btn.is-active span{color:var(--navy)}
.st-backdrop{display:none}

@media (max-width:960px){
  .st-stage{grid-template-columns:1fr;gap:26px}
  .st-panel-slot{min-height:0}
  .st-map{max-width:520px}
  .st-mapbox{padding-top:0}
  .st-stage{margin-top:18px}
}
@media (max-width:760px){
  .st-map{gap:4px}
  .st-tile{border-radius:7px;font-size:.56rem}
  .st-tile.on{font-size:.62rem}
  .st-stage{margin-bottom:22px}
  .st-panel-slot{display:none}
  .state-grid .st-btn{padding:12px 10px;min-height:64px}
  /* bottom sheet (moved to <body> by states.js) */
  .st-panel.is-sheet{position:fixed;left:0;right:0;bottom:0;z-index:120;max-height:88vh;max-height:88dvh;overflow-y:auto;overscroll-behavior:contain;transform:translateY(105%);transition:transform .5s cubic-bezier(.2,.85,.2,1);visibility:hidden}
  .st-panel.is-sheet.is-open{transform:none;visibility:visible}
  .st-panel.is-sheet .stp-card{border-radius:26px 26px 0 0;padding:26px 20px calc(22px + env(safe-area-inset-bottom));box-shadow:0 -20px 50px -20px rgba(0,0,0,.6)}
  .st-panel.is-sheet .stp-card::after{content:"";position:absolute;top:9px;left:50%;width:44px;height:5px;margin-left:-22px;border-radius:9px;background:#D9CFBD}
  .st-panel.is-sheet .stp-close{display:grid}
  .st-panel.is-sheet .stp-card{overflow:visible}
  .st-panel.is-sheet .stp-cta{position:sticky;bottom:0;z-index:2;margin:12px -20px 0;padding:12px 20px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(rgba(251,246,236,0),var(--cream) 22%)}
  .st-panel.is-sheet .stp-card{padding-bottom:16px}
  .stp-head h3{font-size:1.35rem}
  .stp-badge{width:60px;height:60px}
  .stp-points{gap:6px}
  .stp-points li{padding:10px 12px;gap:11px}
  .stp-ico{width:32px;height:32px;border-radius:10px}
  .stp-ico svg{width:18px;height:18px}
  .stp-head{margin-bottom:12px}
  .st-panel.is-sheet .stp-card::before{display:none}
  .stp-points p{font-size:.97rem}
  .stp-cta .cc-btn{width:100%}
  .stp-cta{justify-content:center;gap:0 16px}
  .stp-call{padding:6px 4px;min-height:44px}
  .st-backdrop{display:block;position:fixed;inset:0;z-index:110;background:rgba(9,29,51,.55);opacity:0;pointer-events:none;transition:opacity .35s}
  .st-backdrop.is-open{opacity:1;pointer-events:auto}
  html.st-lock,html.st-lock body{overflow:hidden}
}
@media (prefers-reduced-motion:reduce){
  .st-tile,.states.st-in .st-tile,.states.st-in .st-tile.on{animation:none!important;opacity:1;transform:none}
  .st-tile.on.is-active{transform:none}
  .st-tile.on.is-active::after{animation:none;opacity:0}
  .stp-card.stp-enter,.stp-card.stp-leave,.stp-points li,.stp-cta,.stp-badge .b1,.stp-badge .b2,.states.st-in .stp-intro-art .ia1,.states.st-in .stp-intro-art .ia2,.states.st-in .stp-intro-art .ia3{animation:none!important}
  .stp-badge .b1,.js .stp-intro-art .ia1,.js .stp-intro-art .ia2{stroke-dashoffset:0}
  .js .stp-intro-art .ia3{transform:none}
  .st-panel.is-sheet,.st-backdrop,.st-tile.on,.state-grid .st-btn{transition:none}
}
