/* Approved benefit rail. Scoped to these three pages, existing brand preserved. */
.why-page .pwrap { max-width:1200px; padding:0 40px; }
.why-page .phead { padding:64px 0 42px; }
.why-page .kick { font-size:12px; letter-spacing:.18em; color:#59635c; }
.why-page .phead h1 { max-width:1000px; margin:18px 0 0; font-size:clamp(40px,5.2vw,72px); font-weight:500; letter-spacing:-.035em; line-height:1.07; hyphens:none; -webkit-hyphens:none; text-wrap:balance; }
.why-page .phead .lead { max-width:650px; margin:24px 0 0; font-size:20px; line-height:1.5; color:#626b64; text-wrap:pretty; }
.why-page .prose { margin:0; }
.why-page .prose [hidden] { display:none !important; }
.why-section { padding:20px 0 0; }
.why-page .prose .why-section h2 { margin:0 0 24px; font:500 28px/1.15 Jost,sans-serif; letter-spacing:-.02em; }
.why-page .prose .why-track { display:grid; grid-auto-flow:column; grid-auto-columns:calc((100% - 40px)/3); gap:20px; list-style:none; margin:0 -8px; padding:8px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scroll-padding-inline:8px; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.why-track::-webkit-scrollbar { display:none; }
.why-track:focus-visible { outline:2px solid var(--acc); outline-offset:2px; border-radius:24px; }
.why-page .prose .why-track > li { margin:0; min-width:0; scroll-snap-align:start; }
.why-card { position:relative; display:flex; flex-direction:column; align-items:flex-start; width:100%; min-height:320px; padding:30px 28px 68px; background:#faf9f6; color:var(--ink); border:0; border-radius:28px; text-align:left; cursor:pointer; -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; box-shadow:0 2px 3px #1d211e03; transition:transform .24s var(--ease),box-shadow .24s var(--ease); }
.why-icon { display:block; width:44px; height:44px; margin:0 0 25px; color:var(--acc); }
.why-icon svg { width:100%; height:100%; }
.why-title { display:block; max-width:100%; font:500 28px/1.12 Jost,sans-serif; letter-spacing:-.025em; text-wrap:balance; overflow-wrap:break-word; }
.why-short { display:block; font-size:15px; line-height:1.45; margin-top:12px; color:#636c65; }
.why-step { display:block; font-size:11px; font-weight:600; letter-spacing:.11em; text-transform:uppercase; color:#636c65; margin:-12px 0 12px; }
.why-plus { position:absolute; right:20px; bottom:20px; display:flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:50%; background:#e7e9e4; color:#344139; font:300 28px/1 system-ui,sans-serif; transition:background .2s,color .2s; }
.why-card:active { transform:scale(.985); transition-duration:.1s; }
.why-controls { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 0 0; }
.why-controls[hidden] { display:none; }
.why-hint { font-size:13px; color:#636c65; }
.why-arrows { display:flex; gap:10px; }
.why-arrows button, .why-close { display:grid; place-items:center; width:44px; height:44px; flex-shrink:0; border:0; border-radius:50%; background:#dfe3dc; color:#344139; cursor:pointer; -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; transition:background .15s,transform .15s,opacity .15s; }
.why-arrows svg, .why-close svg, .why-cta svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.why-arrows button:disabled { opacity:.35; cursor:default; }
.why-arrows button:not(:disabled):active,.why-close:active { transform:scale(.93); }
.why-action { display:flex; justify-content:center; padding:48px 0 64px; }
.why-page .prose .why-cta { display:inline-flex; align-items:center; gap:22px; min-height:52px; height:auto; padding:15px 26px; background:var(--acc); color:#fff; font-size:17px; border-radius:30px; text-decoration:none; }
.why-cta svg { width:20px; height:20px; }
.why-dialog { position:fixed; inset:0; margin:auto; width:min(680px,calc(100% - 48px)); max-width:none; max-height:calc(100vh - 48px); max-height:calc(100dvh - 48px); padding:0; border:0; border-radius:30px; background:#faf9f6; color:var(--ink); overflow-y:auto; overscroll-behavior:contain; box-shadow:0 32px 100px #17201a33; }
.why-dialog::backdrop { background:rgba(24,31,26,.36); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.why-close { position:sticky; top:20px; margin:20px 20px 0 auto; z-index:1; background:#e7e9e4; }
.why-dialog-inner { padding:4px 56px 56px; }
.why-dialog-icon { display:block; width:58px; height:58px; color:var(--acc); margin:0 0 26px; }
.why-dialog-icon svg { width:100%; height:100%; }
.why-dialog h2 { font:500 clamp(30px,4vw,44px)/1.1 Jost,sans-serif; letter-spacing:-.03em; margin:0 0 24px; text-wrap:balance; }
.why-dialog-copy { font-size:19px; line-height:1.6; color:#4d5850; }
.why-dialog-copy p { margin:0; }
.why-fallback { margin:24px 0; }
.why-fallback details { margin:16px 0; }
@media (hover:hover) and (pointer:fine) {
 .why-card:hover { transform:translateY(-3px); box-shadow:0 8px 24px #1d211e0a; }
 .why-card:hover .why-plus { background:var(--acc); color:white; }
 .why-arrows button:not(:disabled):hover,.why-close:hover { background:#d1d8ce; }
 .why-card:active { transform:scale(.985); }
}
@media (max-width:1000px) {
 .why-page .prose .why-track { grid-auto-columns:calc((100% - 36px)/2.3); gap:18px; }
 .why-title { font-size:26px; }
 .why-card { padding:28px 24px 66px; }
}
@media (max-width:600px) {
 .why-page .pwrap { padding:0 max(24px,env(safe-area-inset-left)) 0 max(24px,env(safe-area-inset-right)); }
 .why-page .phead { padding:28px 0 30px; }
 .why-page .phead h1 { font-size:40px; line-height:1.07; letter-spacing:-.03em; margin-top:14px; text-wrap:balance; }
 .why-page .phead .lead { font-size:17px; line-height:1.5; margin-top:18px; }
 .why-section { padding-top:12px; }
 .why-page .prose .why-section h2 { font-size:24px; margin-bottom:18px; }
 .why-page .prose .why-track { grid-auto-columns:86%; gap:14px; margin-right:-24px; padding-right:24px; }
 .why-card { min-height:300px; padding:28px 26px 68px; border-radius:24px; }
 .why-title { font-size:27px; }
 .why-icon { margin-bottom:24px; }
 .why-hint { font-size:12px; max-width:185px; }
 .why-controls { padding-top:12px; }
 .why-action { padding:32px 0 44px; }
 .why-dialog { width:calc(100% - 24px); max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); border-radius:26px; }
 .why-close { top:16px; margin:16px 16px 0 auto; }
 .why-dialog-inner { padding:0 28px 36px; }
 .why-dialog-icon { width:48px; height:48px; margin-bottom:20px; }
 .why-dialog h2 { font-size:32px; margin-bottom:20px; }
 .why-dialog-copy { font-size:17px; line-height:1.6; }
}
@media (max-width:360px) {
 .why-page .pwrap { padding-inline:20px; }
 .why-page .phead h1 { font-size:35px; }
 .why-page .prose .why-track { margin-right:-20px; padding-right:20px; grid-auto-columns:89%; }
 .why-card { padding-inline:22px; }
 .why-title { font-size:25px; }
}
@media (max-height:500px) and (orientation:landscape) {
 .why-dialog { max-height:calc(100dvh - 20px); }
 .why-dialog-inner { padding:0 40px 32px; }
 .why-dialog-icon { display:none; }
}
@media (prefers-reduced-motion:reduce) {
 .why-card,.why-plus,.why-arrows button,.why-close { transition:none; }
 .why-card:hover,.why-card:active,.why-arrows button:active,.why-close:active { transform:none; }
}
@media (prefers-reduced-transparency:reduce) {
 .why-dialog::backdrop { backdrop-filter:none; -webkit-backdrop-filter:none; background:rgba(24,31,26,.65); }
}
@media (prefers-contrast:more) {
 .why-card { outline:1px solid currentColor; }
 .why-short,.why-hint,.why-step { color:var(--ink); }
}
