/* Phase W · W3 — หมวด "เริ่มใช้งาน" (จับคู่เกจ / ดูไลฟ์ไม่ต้องสมัคร / APK) · ใช้ token จาก tokens.css */
.start-section { padding-top: 90px; padding-bottom: 40px; }
.start-title { font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: clamp(30px, 4vw, 46px); line-height: 1.25; margin: 12px 0 28px; }
.start-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.start-card { background: var(--surface, #15161a); border: 1px solid var(--line, #26272d); border-radius: var(--radius, 12px); padding: 22px 20px; }
.start-card[hidden] { display: none; }
.start-card h3 { margin: 0 0 12px; font-family: var(--font-th); font-size: 20px; font-weight: 600; }
.start-card p, .start-card li { color: #c9cacf; line-height: 1.75; font-size: 15px; }
.start-card ol { margin: 0 0 8px; padding-left: 22px; }
.start-card .button { margin-top: 8px; }
.apk-hash { font-size: 12px !important; color: var(--muted, #9a9ca3) !important; word-break: break-all; }
.apk-hash code { font-family: 'IBM Plex Mono', monospace; color: #e6e7ea; }
.footer-legal a { color: inherit; }

/* Phase Order: footer section links (same order as header nav) */
.footer-nav{display:flex;flex-wrap:wrap;gap:6px 16px;flex-basis:100%;order:5;font-size:12.5px}.footer-nav a{color:#9a9a9a;text-decoration:none}.footer-nav a:hover{color:#fff}
.nav{gap:18px}.nav a{font-size:13px}
@media(max-width:1500px){.nav{gap:12px}.nav a{font-size:12px}}
@media(max-width:620px){.nav{gap:0}.nav a{font-size:14px}}
@media(min-width:1241px){.nav{gap:11px;flex-wrap:nowrap}.nav a{white-space:nowrap;font-size:12px}.nav .nav-cta{padding:9px 14px!important;font-size:13px!important}}@media(min-width:1500px){.nav{gap:16px}.nav a{font-size:13px}}

/* Phase Navfix: hamburger layout for 621-1240px (full 12-link nav only fits above 1240px). <=620 handled by site.css */
@media(min-width:621px) and (max-width:1240px){html{scroll-padding-top:90px}.menu-toggle{display:flex;flex-direction:column;gap:6px;padding:10px;cursor:pointer}.menu-toggle span{width:23px;height:2px;background:#eee;display:block}.nav{display:none;position:absolute;top:100%;left:0;right:0;padding:14px 5% 20px;background:#0a0a0a;border-bottom:1px solid #292929;flex-direction:column;align-items:stretch;gap:0;max-height:calc(100vh - 84px);max-height:calc(100dvh - 84px);overflow-y:auto;overscroll-behavior:contain}.nav.open{display:flex}.nav a{padding:13px 0;border-bottom:1px solid #202020;font-size:15px;white-space:normal}.nav .nav-cta{margin-top:12px;text-align:center;padding:13px!important;font-size:15px!important}}
/* anchors land below sticky header (<=620: 70px from site.css kept; taller header above) */
@media(min-width:621px){html{scroll-padding-top:96px}}
@media(max-width:620px){.nav{max-height:calc(100vh - 68px);max-height:calc(100dvh - 68px);overflow-y:auto}}
