:root {
  --sms-navy: #0D1426;
  --sms-purple: #4B2A72;
  --sms-blue: #1E3A8A;
  --sms-sky: #3FA7E1;
  --sms-gold: #D4AF37;
  --sms-white: #FFFFFF;
  --sms-ink: #EAF0FF;
  --sms-muted: #AAB6CE;
  --sms-panel: rgba(255, 255, 255, 0.055);
  --sms-panel-strong: rgba(255, 255, 255, 0.085);
  --sms-border: rgba(255, 255, 255, 0.14);
  --sms-shadow: 0 20px 60px rgba(0, 0, 0, 0.24);
}

.sms-compliance-page {
  margin: 0;
  background:
    radial-gradient(circle at 16% 8%, rgba(75, 42, 114, 0.32), transparent 34rem),
    radial-gradient(circle at 88% 18%, rgba(63, 167, 225, 0.17), transparent 30rem),
    var(--sms-navy);
  color: var(--sms-ink);
  font-family: Montserrat, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.65;
  min-height: 100vh;
}

.sms-compliance-page *,
.sms-compliance-page *::before,
.sms-compliance-page *::after { box-sizing: border-box; }

.sms-compliance-page a { color: #8ED7FF; }
.sms-compliance-page a:hover { color: var(--sms-white); }
.sms-compliance-page a:focus-visible { outline: 3px solid var(--sms-gold); outline-offset: 4px; border-radius: 4px; }

.sms-shell { width: min(1120px, calc(100% - 40px)); margin: 0 auto; }

.sms-header {
  position: relative;
  z-index: 2;
  border-bottom: 1px solid var(--sms-border);
  background: rgba(13, 20, 38, 0.84);
  backdrop-filter: blur(16px);
}

.sms-header-inner { min-height: 80px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.sms-brand { display: inline-flex; align-items: center; text-decoration: none; }
.sms-brand img { display: block; width: 142px; height: auto; }
.sms-nav { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.sms-nav a { color: var(--sms-ink); text-decoration: none; font-size: 0.92rem; font-weight: 650; }

.sms-main { padding: 72px 0 90px; }
.sms-hero { padding-bottom: 60px; }
.sms-eyebrow, .sms-kicker { color: var(--sms-gold); font-weight: 760; letter-spacing: 0.12em; text-transform: uppercase; font-size: 0.75rem; }
.sms-hero h1, .sms-legal-article > h1 { margin: 10px 0 18px; max-width: 920px; font-size: clamp(2.35rem, 6vw, 5rem); line-height: 0.98; letter-spacing: -0.045em; color: var(--sms-white); }
.sms-lede { max-width: 860px; margin: 0; color: #CFD9EE; font-size: clamp(1.05rem, 2vw, 1.28rem); }
.sms-updated { margin: 20px 0 0; color: var(--sms-muted); font-size: 0.88rem; }
.sms-meta-line { margin: 22px 0 0; padding: 14px 18px; border: 1px solid var(--sms-border); border-radius: 14px; color: var(--sms-muted); background: var(--sms-panel); }

.sms-facts { margin-top: 34px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.sms-facts > div { min-height: 108px; padding: 18px; border: 1px solid var(--sms-border); border-radius: 18px; background: var(--sms-panel); box-shadow: var(--sms-shadow); }
.sms-facts span { display: block; color: var(--sms-muted); font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.08em; font-weight: 700; }
.sms-facts strong { display: block; margin-top: 8px; color: var(--sms-white); font-size: 1rem; line-height: 1.3; }
.sms-facts small { color: var(--sms-muted); font-size: 0.8rem; font-weight: 600; }

.sms-section { padding: 58px 0; border-top: 1px solid var(--sms-border); }
.sms-section-heading { max-width: 840px; margin-bottom: 28px; }
.sms-section h2, .sms-legal-article h2 { margin: 8px 0 12px; color: var(--sms-white); font-size: clamp(1.65rem, 3.2vw, 2.6rem); line-height: 1.08; letter-spacing: -0.025em; }
.sms-section h3 { color: var(--sms-white); margin: 0 0 7px; line-height: 1.2; font-size: 1.08rem; }
.sms-section p, .sms-legal-article p { color: #C5D0E6; }

.sms-callout { margin-top: 24px; padding: 22px 24px; border: 1px solid rgba(63, 167, 225, 0.35); border-radius: 18px; background: rgba(63, 167, 225, 0.08); }
.sms-callout strong { color: var(--sms-white); }
.sms-callout p { margin: 7px 0 0; }
.sms-callout-gold { border-color: rgba(212, 175, 55, 0.44); background: rgba(212, 175, 55, 0.08); }
.sms-callout-privacy { border-color: rgba(63, 167, 225, 0.42); background: linear-gradient(135deg, rgba(30, 58, 138, 0.22), rgba(75, 42, 114, 0.17)); }

.sms-steps { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; counter-reset: none; }
.sms-steps li { display: grid; grid-template-columns: 48px 1fr; gap: 16px; align-items: start; padding: 19px 20px; border: 1px solid var(--sms-border); border-radius: 18px; background: var(--sms-panel); }
.sms-step-number { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(135deg, var(--sms-purple), var(--sms-blue)); color: var(--sms-white); font-weight: 800; border: 1px solid rgba(255,255,255,.16); }
.sms-steps p { margin: 0; }

.sms-screen-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: stretch; }
.sms-ui-card { position: relative; padding: 25px; border: 1px solid var(--sms-border); border-radius: 24px; background: linear-gradient(160deg, rgba(255,255,255,.09), rgba(255,255,255,.045)); box-shadow: var(--sms-shadow); overflow: hidden; }
.sms-ui-card-highlight { border-color: rgba(212, 175, 55, .42); }
.sms-ui-card-highlight::before { content: ""; position: absolute; inset: -80px auto auto -100px; width: 280px; height: 280px; background: radial-gradient(circle, rgba(75,42,114,.45), transparent 68%); pointer-events: none; }
.sms-ui-topline { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 22px; }
.sms-ui-wordmark { display: block; width: 105px; height: auto; }
.sms-ui-badge { padding: 5px 10px; border: 1px solid var(--sms-border); border-radius: 999px; color: var(--sms-muted); font-size: .73rem; }
.sms-ui-path { position: relative; margin: 0 0 6px; color: var(--sms-sky) !important; font-size: .78rem; font-weight: 700; }
.sms-ui-card h3 { position: relative; font-size: 1.35rem; }
.sms-field-label { display: block; margin: 20px 0 6px; color: var(--sms-muted); font-size: .8rem; font-weight: 700; }
.sms-field { padding: 13px 14px; border: 1px solid rgba(255,255,255,.2); border-radius: 12px; background: rgba(13,20,38,.72); color: #8E9AB2; }
.sms-disclosure { position: relative; margin-top: 18px; padding: 15px 16px; border: 1px solid var(--sms-border); border-radius: 14px; background: rgba(13,20,38,.62); color: #CED7E8; font-size: .84rem; line-height: 1.55; }
.sms-disclosure-primary { border-color: rgba(63,167,225,.34); }
.sms-example-button { margin-top: 16px; padding: 12px 15px; text-align: center; border-radius: 12px; background: linear-gradient(135deg, var(--sms-blue), var(--sms-sky)); color: var(--sms-white); font-weight: 800; }
.sms-ui-note { margin: 12px 0 0 !important; font-size: .76rem; color: var(--sms-muted) !important; }
.sms-toggle-row { position: relative; display: flex; gap: 13px; align-items: center; margin-top: 20px; padding: 15px; border-radius: 14px; background: rgba(13,20,38,.55); border: 1px solid var(--sms-border); }
.sms-toggle-row div { display: grid; }
.sms-toggle-row span { color: var(--sms-muted); font-size: .78rem; }
.sms-toggle-off { flex: 0 0 auto; width: 48px; height: 27px; border-radius: 999px; background: #31394A; border: 1px solid rgba(255,255,255,.18); padding: 3px; }
.sms-toggle-off > span { display: block; width: 19px; height: 19px; border-radius: 50%; background: #E6EAF2; box-shadow: 0 2px 6px rgba(0,0,0,.3); }

.sms-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.sms-info-card { padding: 20px; border: 1px solid var(--sms-border); border-radius: 17px; background: var(--sms-panel); }
.sms-info-card p { margin: 0; }
.sms-info-card-wide { grid-column: 1 / -1; }
.sms-control-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 24px; }
.sms-command { padding: 20px; border: 1px solid var(--sms-border); border-radius: 17px; background: var(--sms-panel); }
.sms-command code { display: inline-block; padding: 5px 9px; border-radius: 8px; background: rgba(212,175,55,.12); color: #F5D976; border: 1px solid rgba(212,175,55,.28); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .83rem; }
.sms-command p { margin: 10px 0 0; }

.sms-related { padding-bottom: 10px; }
.sms-related-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.sms-related-links a { display: grid; gap: 3px; padding: 18px; text-decoration: none; border: 1px solid var(--sms-border); border-radius: 15px; background: var(--sms-panel); }
.sms-related-links strong { color: var(--sms-white); }
.sms-related-links span { color: var(--sms-muted); font-size: .86rem; }

.sms-legal-main { padding-top: 62px; }
.sms-legal-article { max-width: 900px; }
.sms-legal-article > section { padding: 34px 0 10px; border-top: 1px solid var(--sms-border); margin-top: 28px; }
.sms-legal-article h2 { font-size: clamp(1.35rem, 2.7vw, 2rem); }

.sms-footer { border-top: 1px solid var(--sms-border); background: rgba(7, 12, 25, .55); }
.sms-footer-inner { min-height: 120px; display: flex; justify-content: space-between; gap: 28px; align-items: center; }
.sms-footer-inner > div { display: grid; gap: 3px; }
.sms-footer-inner > div strong { color: var(--sms-white); font-size: 1.05rem; }
.sms-footer-inner > div span { color: var(--sms-muted); font-size: .82rem; }
.sms-footer nav { display: flex; gap: 18px; flex-wrap: wrap; }
.sms-footer a { text-decoration: none; color: var(--sms-muted); font-size: .83rem; }

@media (max-width: 820px) {
  .sms-header-inner { padding: 16px 0; align-items: flex-start; flex-direction: column; }
  .sms-nav { gap: 14px 18px; }
  .sms-main { padding-top: 50px; }
  .sms-facts, .sms-screen-grid, .sms-card-grid, .sms-control-grid, .sms-related-links { grid-template-columns: 1fr; }
  .sms-info-card-wide { grid-column: auto; }
  .sms-footer-inner { padding: 30px 0; align-items: flex-start; flex-direction: column; min-height: 0; }
}

@media (max-width: 480px) {
  .sms-shell { width: min(100% - 28px, 1120px); }
  .sms-brand img { width: 124px; }
  .sms-nav a { font-size: .84rem; }
  .sms-main { padding-bottom: 64px; }
  .sms-hero { padding-bottom: 42px; }
  .sms-section { padding: 42px 0; }
  .sms-ui-card, .sms-callout { padding: 18px; }
  .sms-steps li { grid-template-columns: 38px 1fr; padding: 16px; }
  .sms-step-number { width: 34px; height: 34px; }
}

@media (prefers-reduced-motion: reduce) {
  .sms-compliance-page * { scroll-behavior: auto !important; transition: none !important; }
}
