@charset "UTF-8";
  :root {
  color-scheme:light;
  --bg:#fafcfb;
  --surface:#fff;
  --soft:#f0f5f4;
  --ink:#172c36;
  --muted:#526772;
  --line:#dce6e5;
  --brand:#17617a;
  --brand-hover:#104c62;
  --tint:#e7f2f4;
  --green:#237359;
  --amber:#76521c;
  --amber-bg:#fbf3e3;
  --nav:rgba(250,252,251,.95);
  --shadow:0 22px 65px rgba(21,46,58,.08);
  --radius:18px
}

:root[data-theme=dark] {
  color-scheme:dark;
  --bg:#0d1721;
  --surface:#14222e;
  --soft:#111f2a;
  --ink:#f0f6f6;
  --muted:#a5b7bf;
  --line:#2b3b46;
  --brand:#80d3df;
  --brand-hover:#a2e3ea;
  --tint:#1a3541;
  --green:#96d5b7;
  --amber:#ecd099;
  --amber-bg:#2d281f;
  --nav:rgba(13,23,33,.95);
  --shadow:0 22px 65px rgba(0,0,0,.16)
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:105px
}

body {
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-sans);
  line-height:1.65;
  -webkit-font-smoothing:antialiased
}

a {
  color:var(--brand);
  text-decoration:none;
  text-underline-offset:4px
}

a:hover {
  text-decoration:underline
}

button,input,textarea {
  font:inherit
}

button,a,input,textarea,summary {
  touch-action:manipulation
}

button {
  cursor:pointer
}

button:disabled {
  cursor:wait;
  opacity:.65
}

button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible,video:focus-visible {
  outline:3px solid var(--brand);
  outline-offset:4px
}

img,video {
  max-width:100%;
  display:block
}

h1,h2,h3,p {
  margin-top:0
}

h1,h2,h3 {
  line-height:1.15;
  letter-spacing:-.035em
}

h1 {
  font-size:clamp(2.6rem,5vw,4.5rem);
  font-weight:720;
  line-height:1.06
}

h2 {
  font-size:clamp(1.85rem,3.3vw,2.7rem);
  font-weight:700
}

h3 {
  font-size:1.2rem;
  letter-spacing:-.02em
}

p {
  margin-bottom:1.15rem
}

svg {
  flex-shrink:0
}

[hidden] {
  display:none!important
}

.container {
  width:min(1180px,calc(100% - 64px));
  margin-inline:auto
}

.section {
  padding-block:88px
}

.section-soft {
  background:var(--soft);
  border-block:1px solid var(--line)
}

.section-intro {
  max-width:650px;
  margin-bottom:38px
}

.section-intro h2 {
  margin-bottom:16px
}

.lede {
  font-size:1.13rem;
  color:var(--muted);
  line-height:1.7
}

.eyebrow {
  font-size:.73rem;
  letter-spacing:.13em;
  text-transform:uppercase;
  font-weight:750;
  color:var(--brand);
  margin-bottom:18px
}

.muted {
  color:var(--muted)
}

.small {
  font-size:.85rem
}

.text-link {
  font-weight:650;
  font-size:.9rem
}

.skip-link {
  position:fixed;
  top:-100px;
  left:16px;
  z-index:100;
  background:var(--surface);
  padding:10px 20px;
  border:2px solid var(--brand)
}

.skip-link:focus {
  top:10px
}

.site-header {
  position:sticky;
  top:0;
  z-index:30;
  background:var(--nav);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line)
}

.header-inner {
  min-height:80px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px
}

.brand {
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:1.3rem;
  font-weight:750;
  color:var(--ink);
  letter-spacing:-.04em;
  white-space:nowrap
}

.brand:hover {
  text-decoration:none
}

.brand img {
  width:36px;
  height:36px
}

.nav-links {
  display:flex;
  align-items:center;
  gap:28px;
  font-size:.88rem;
  font-weight:550
}

.nav-links>a {
  color:var(--muted)
}

.nav-links>a:hover {
  color:var(--ink)
}

.header-actions {
  display:flex;
  gap:12px;
  align-items:center
}

.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:46px;
  padding:11px 21px;
  border:1px solid transparent;
  border-radius:8px;
  background:var(--brand);
  color:var(--bg);
  font-weight:650;
  font-size:.9rem;
  line-height:1.4;
  text-decoration:none;
  transition:background .15s,transform .15s
}

.button:hover {
  background:var(--brand-hover);
  text-decoration:none;
  transform:translateY(-1px)
}

.button.secondary {
  background:transparent;
  color:var(--ink);
  border-color:var(--line)
}

.button.secondary:hover {
  background:var(--soft)
}

.button.compact {
  min-height:40px;
  padding:9px 16px;
  font-size:.83rem
}

.icon-button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border:1px solid var(--line);
  background:transparent;
  border-radius:8px;
  color:var(--muted)
}

.icon-button:hover {
  color:var(--ink);
  background:var(--soft)
}

.icon-button svg {
  width:18px;
  height:18px
}

.theme-sun {
  display:none
}

:root[data-theme=dark] .theme-sun {
  display:block
}

:root[data-theme=dark] .theme-moon {
  display:none
}

.menu-toggle {
  display:none
}

.hero {
  padding-top:76px;
  padding-bottom:64px
}

.hero-layout {
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:48px;
  align-items:center
}

.hero h1 {
  margin-bottom:24px;
  max-width:630px
}

.hero h1 span {
  color:var(--brand)
}

.hero .lede {
  max-width:540px;
  font-size:1.05rem
}

.hero-actions {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:18px;
  margin-block:28px 12px
}

.hero-note {
  font-size:.77rem;
  color:var(--muted);
  max-width:380px
}

.hero-points {
  list-style:none;
  margin:25px 0 0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:10px 18px;
  font-size:.76rem;
  color:var(--muted)
}

.hero-points li:before {
  content:"✓";
  margin-right:7px;
  color:var(--green);
  font-weight:800
}

.video-card {
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow)
}

.video-titlebar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:13px 17px;
  font-size:.75rem;
  color:var(--muted);
  border-bottom:1px solid var(--line)
}

.status-dot {
  display:inline-block;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--green);
  margin-right:7px
}

.video-card video {
  width:100%;
  height:auto;
  aspect-ratio:16/9;
  background:#0d1721;
  object-fit:contain
}

.video-caption {
  padding:17px 20px;
  font-size:.78rem;
  color:var(--muted);
  margin:0;
  line-height:1.6
}

.video-caption strong {
  color:var(--ink);
  display:block;
  font-size:.9rem;
  margin-bottom:4px
}

.video-music-credit {
  display:block;
  margin-top:8px;
  font-size:.7rem
}

.demo-page { max-width:1040px; padding-block:32px 64px }
.demo-page h1 { font-size:clamp(1.9rem,4vw,2.8rem); margin-bottom:12px }
.demo-page .video-card { max-width:none }
.demo-intro { color:var(--muted); max-width:780px; margin-bottom:24px }
.demo-details { margin-top:36px; max-width:800px }
.demo-details li { margin-bottom:12px }
.demo-page .docs-breadcrumb { display:flex; flex-wrap:wrap; gap:10px; color:var(--muted); font-size:.8rem; margin-bottom:20px }

.context-strip {
  display:flex;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
  border-top:1px solid var(--line);
  padding-block:22px;
  font-size:.78rem;
  color:var(--muted)
}

.context-strip strong {
  font-weight:650;
  color:var(--ink)
}

.benefits-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:34px
}

.benefit {
  border-top:2px solid var(--line);
  padding-top:23px
}

.benefit-number {
  display:block;
  font-size:.75rem;
  color:var(--brand);
  font-weight:700;
  margin-bottom:20px
}

.benefit h3 {
  font-size:1.3rem;
  max-width:270px;
  margin-bottom:14px
}

.benefit p {
  color:var(--muted);
  font-size:.93rem;
  margin-bottom:0
}

.workflow-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px
}

.workflow-card {
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
  background:var(--surface)
}

.workflow-card img {
  width:100%;
  height:auto;
  aspect-ratio:16/9;
  object-fit:contain;
  background:var(--soft);
  border-bottom:1px solid var(--line)
}

.screenshot-trigger { display:block; position:relative; cursor:zoom-in }
.screenshot-trigger:focus-visible { outline-offset:-4px }
.screenshot-expand { position:absolute; right:10px; bottom:10px; display:inline-flex; align-items:center; gap:6px; padding:6px 9px; border:1px solid rgba(255,255,255,.3); border-radius:6px; background:rgba(6,18,28,.88); color:#fff; font-size:.65rem; font-weight:550; line-height:1.4; pointer-events:none }
.screenshot-expand svg { width:14px; height:14px }
.screenshot-trigger:hover .screenshot-expand,.screenshot-trigger:focus-visible .screenshot-expand { background:#153f52 }

.workflow-copy {
  padding:22px
}

.workflow-copy .step {
  font-size:.7rem;
  font-weight:750;
  color:var(--brand);
  letter-spacing:.07em;
  text-transform:uppercase;
  margin-bottom:9px
}

.workflow-copy h3 {
  margin-bottom:10px
}

.workflow-copy p {
  font-size:.86rem;
  color:var(--muted);
  margin:0
}

.section-tail {
  margin-top:26px;
  display:flex;
  gap:20px;
  align-items:center;
  justify-content:space-between;
  font-size:.83rem;
  color:var(--muted)
}

.control-layout {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:74px;
  align-items:start
}

.control-copy .lede {
  font-size:1rem
}

.control-list {
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:25px
}

.control-list li {
  padding-bottom:23px;
  border-bottom:1px solid var(--line)
}

.control-list li:last-child {
  padding-bottom:0;
  border-bottom:0
}

.control-list h3 {
  font-size:1.06rem;
  margin-bottom:8px
}

.control-list p {
  margin:0;
  color:var(--muted);
  font-size:.9rem
}

.control-links {
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  margin-top:25px
}

.founder-note {
  margin-top:30px;
  padding-top:24px;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-size:.8rem
}

.founder-note strong {
  color:var(--ink)
}

.pricing-intro {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:26px;
  margin-bottom:28px
}

.pricing-intro .section-intro {
  margin-bottom:0
}

.billing-toggle {
  display:inline-flex;
  flex-shrink:0;
  padding:4px;
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--soft);
  gap:4px
}

.billing-toggle button {
  border:0;
  border-radius:6px;
  background:transparent;
  color:var(--muted);
  padding:10px 15px;
  font-size:.83rem;
  font-weight:650
}

.billing-toggle button[aria-pressed=true] {
  background:var(--surface);
  color:var(--ink);
  box-shadow:0 2px 6px rgba(0,0,0,.08)
}

.billing-toggle small {
  font-size:.65rem;
  color:var(--green);
  margin-left:5px
}

.founding-strip {
  background:var(--amber-bg);
  border:1px solid color-mix(in srgb,var(--amber) 22%,var(--line));
  padding:19px 23px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:22px
}

.founding-strip p {
  margin:0;
  font-size:.8rem;
  color:var(--muted)
}

.founding-strip strong {
  display:block;
  color:var(--amber);
  font-size:.92rem;
  margin-bottom:3px
}

.founding-option {
  display:flex;
  align-items:center;
  gap:9px;
  flex-shrink:0;
  font-size:.82rem;
  font-weight:650
}

.founding-option input {
  accent-color:var(--brand);
  width:18px;
  height:18px
}

.pricing-grid {
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:22px
}

.price-card {
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:34px;
  display:flex;
  flex-direction:column
}

.price-card.featured {
  border:2px solid var(--brand);
  padding:33px
}

.price-plan {
  font-size:1.4rem;
  margin-bottom:9px
}

.plan-description {
  font-size:.9rem;
  min-height:48px;
  color:var(--muted);
  max-width:430px
}

.price-row {
  display:flex;
  align-items:baseline;
  gap:8px;
  flex-wrap:wrap;
  margin-top:14px
}

.price {
  font-size:3rem;
  letter-spacing:-.055em;
  font-weight:750;
  line-height:1.15
}

.price-unit {
  font-size:.9rem;
  color:var(--muted)
}

.price-prefix {
  font-size:.8rem;
  font-weight:600;
  color:var(--muted)
}

.price-note {
  font-size:.82rem;
  color:var(--muted);
  margin-top:12px;
  min-height:45px
}

.price-note strong {
  color:var(--green);
  font-weight:650
}

.price-founding-note {
  font-size:.8rem;
  color:var(--amber);
  margin:0 0 12px
}

.plan-features {
  list-style:none;
  padding:22px 0;
  margin:4px 0 24px;
  border-top:1px solid var(--line);
  display:grid;
  gap:11px;
  font-size:.87rem
}

.plan-features li {
  padding-left:23px;
  position:relative
}

.plan-features li:before {
  content:"✓";
  position:absolute;
  left:0;
  color:var(--green);
  font-weight:750
}

.price-card .button {
  margin-top:auto
}

.pricing-footnote {
  margin-top:17px;
  margin-bottom:0;
  font-size:.76rem;
  color:var(--muted);
  text-align:center
}

.evaluation-note {
  margin-top:23px;
  padding-top:22px;
  border-top:1px solid var(--line);
  font-size:.86rem;
  color:var(--muted);
  display:flex;
  justify-content:space-between;
  gap:20px
}

.evaluation-note p {
  margin:0;
  max-width:720px
}

.evaluation-note strong {
  color:var(--ink)
}

.evaluation-note a {
  flex-shrink:0
}

.faq-layout {
  display:grid;
  grid-template-columns:.7fr 1.3fr;
  gap:75px
}

.faq-list {
  border-top:1px solid var(--line)
}

.faq-list details {
  border-bottom:1px solid var(--line)
}

.faq-list summary {
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:22px 0;
  font-size:.98rem;
  font-weight:650
}

.faq-list summary::-webkit-details-marker {
  display:none
}

.faq-list summary:after {
  content:"+";
  font-size:1.3rem;
  font-weight:400;
  color:var(--brand)
}

.faq-list details[open] summary:after {
  content:"−"
}

.faq-answer {
  padding:0 28px 22px 0;
  font-size:.9rem;
  color:var(--muted)
}

.faq-answer p {
  margin-bottom:12px
}

.closing {
  padding-block:70px
}

.closing-panel {
  border:1px solid var(--line);
  background:var(--tint);
  border-radius:var(--radius);
  padding:44px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:40px
}

.closing-panel h2 {
  font-size:clamp(1.8rem,3vw,2.3rem);
  max-width:650px;
  margin-bottom:14px
}

.closing-panel p {
  max-width:620px;
  color:var(--muted);
  font-size:.93rem;
  margin:0
}

.closing-actions {
  flex-shrink:0;
  display:grid;
  justify-items:center;
  gap:12px
}

.site-footer {
  border-top:1px solid var(--line);
  padding-block:36px
}

.footer-top {
  display:flex;
  justify-content:space-between;
  gap:35px;
  align-items:start
}

.footer-description {
  font-size:.8rem;
  color:var(--muted);
  max-width:380px;
  margin:13px 0 0
}

.footer-links {
  display:flex;
  gap:22px;
  flex-wrap:wrap;
  font-size:.82rem
}

.footer-links a {
  color:var(--muted)
}

.footer-bottom {
  margin-top:26px;
  padding-top:22px;
  border-top:1px solid var(--line);
  display:flex;
  gap:20px;
  justify-content:space-between;
  color:var(--muted);
  font-size:.75rem
}

.footer-legal {
  display:flex;
  gap:20px
}

.footer-legal a {
  color:var(--muted)
}

dialog {
  color:var(--ink);
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:30px;
  width:min(520px,calc(100% - 32px));
  max-height:calc(100dvh - 48px);
  overflow:auto;
  box-shadow:var(--shadow)
}

dialog::backdrop {
  background:rgba(5,15,23,.7);
  backdrop-filter:blur(5px)
}

.dialog-heading {
  display:flex;
  align-items:start;
  justify-content:space-between;
  gap:20px;
  margin-bottom:12px
}

.dialog-heading h2 {
  font-size:1.65rem;
  margin:0
}

.dialog-description {
  font-size:.88rem;
  color:var(--muted)
}

.contact-form {
  display:grid;
  gap:16px
}

.field {
  display:grid;
  gap:6px
}

.field label {
  font-size:.82rem;
  font-weight:650
}

.field label span {
  color:var(--muted);
  font-weight:400
}

.field input,.field textarea {
  width:100%;
  background:var(--bg);
  color:var(--ink);
  border:1px solid var(--line);
  border-radius:7px;
  padding:11px 12px;
  font-size:.9rem
}

.field textarea {
  resize:vertical;
  min-height:95px
}

.form-privacy {
  font-size:.73rem;
  color:var(--muted);
  margin:0
}

.form-status {
  padding:13px 15px;
  border-radius:8px;
  font-size:.84rem;
  background:var(--soft);
  border:1px solid var(--line);
  margin:0
}

.form-status[data-state=error] {
  border-color:#c9786c;
  color:var(--ink)
}

.form-status[data-state=success] {
  border-color:var(--green)
}

.form-selection {
  font-size:.78rem;
  padding:10px 12px;
  background:var(--tint);
  border-radius:7px;
  margin:0
}

.honeypot {
  position:absolute;
  left:-10000px;
  top:auto;
  width:1px;
  height:1px;
  overflow:hidden
}

.preview-note {
  font-size:.74rem;
  color:var(--amber);
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:7px;
  margin:0
}

@media(min-width:1400px) {
  .hero-layout {
  gap:64px
}

.hero {
  padding-top:88px;
  padding-bottom:75px
}


}

@media(max-width:1000px) {
  .nav-links {
  gap:18px
}

.hero-layout {
  gap:30px
}

.hero h1 {
  font-size:3.2rem
}

.control-layout,.faq-layout {
  gap:40px
}

.section {
  padding-block:68px
}

.plan-description {
  min-height:70px
}

.price-card {
  padding:26px
}

.price-card.featured {
  padding:25px
}


}

@media(max-width:780px) {
  .container {
  width:calc(100% - 40px)
}

.header-inner {
  min-height:68px;
  gap:15px
}

.brand {
  font-size:1.18rem
}

.brand img {
  width:32px;
  height:32px
}

.menu-toggle {
  display:inline-flex
}

.nav-links {
  display:none;
  position:absolute;
  top:68px;
  left:0;
  right:0;
  flex-direction:column;
  align-items:stretch;
  gap:0;
  padding:12px 20px 20px;
  background:var(--bg);
  border-bottom:1px solid var(--line)
}

.nav-links.is-open {
  display:flex
}

.nav-links>a {
  padding:12px 4px
}

.header-actions {
  gap:8px
}

.header-actions .button {
  font-size:.76rem;
  padding:9px 12px;
  min-height:38px
}

.icon-button {
  width:36px;
  height:36px
}

.hero {
  padding-top:45px;
  padding-bottom:38px
}

.hero-layout {
  grid-template-columns:1fr;
  gap:34px
}

.hero h1 {
  font-size:clamp(2.5rem,7vw,3.6rem);
  max-width:650px
}

.hero .lede {
  max-width:620px
}

.hero-points {
  margin-top:20px
}

.hero-note {
  max-width:none
}

.video-card {
  max-width:660px
}

.section {
  padding-block:54px
}

.benefits-grid {
  gap:22px
}

.benefit h3 {
  font-size:1.14rem
}

.benefit p {
  font-size:.86rem
}

.workflow-grid {
  gap:13px
}

.workflow-copy {
  padding:17px
}

.workflow-copy h3 {
  font-size:1rem
}

.workflow-copy p {
  font-size:.8rem
}

.control-layout,.faq-layout {
  grid-template-columns:1fr;
  gap:26px
}

.control-copy {
  max-width:650px
}

.control-list {
  grid-template-columns:repeat(3,1fr);
  gap:22px
}

.control-list li {
  border:0;
  padding:0
}

.control-list p {
  font-size:.83rem
}

.control-list h3 {
  font-size:.98rem
}

.founder-note {
  max-width:650px
}

.pricing-intro {
  align-items:start;
  flex-direction:column;
  gap:19px
}

.founding-strip {
  padding:18px;
  align-items:start;
  flex-direction:column;
  gap:13px
}

.price-card {
  padding:24px
}

.price-card.featured {
  padding:23px
}

.price {
  font-size:2.6rem
}

.plan-description {
  font-size:.84rem;
  min-height:72px
}

.plan-features {
  font-size:.82rem
}

.price-note {
  min-height:64px
}

.evaluation-note {
  flex-direction:column;
  gap:10px
}

.closing {
  padding-block:45px
}

.closing-panel {
  padding:30px;
  align-items:start;
  flex-direction:column;
  gap:24px
}

.closing-actions {
  justify-items:start
}

.footer-top {
  flex-direction:column;
  gap:24px
}

.section-tail {
  align-items:start;
  flex-direction:column;
  gap:9px
}

.faq-layout .section-intro {
  margin-bottom:0
}


}

@media(max-width:520px) {
  .container {
  width:calc(100% - 36px)
}

.header-actions .theme-toggle {
  display:none
}

.hero h1 {
  font-size:2.65rem
}

.hero .eyebrow {
  font-size:.67rem
}

.hero .lede {
  font-size:.98rem
}

.hero-actions {
  margin-top:23px
}

.hero-actions .button {
  width:100%
}

.hero-points {
  display:grid;
  gap:6px;
  font-size:.75rem
}

.context-strip {
  gap:8px;
  font-size:.72rem
}

.benefits-grid,.workflow-grid,.control-list,.pricing-grid {
  grid-template-columns:1fr
}

.benefits-grid {
  gap:30px
}

.benefit-number {
  margin-bottom:13px
}

.benefit h3 {
  max-width:none;
  font-size:1.25rem
}

.benefit p {
  font-size:.9rem
}

.workflow-grid {
  gap:20px
}

.workflow-card img {
  aspect-ratio:16/9
}

.workflow-copy {
  padding:22px
}

.workflow-copy h3 {
  font-size:1.17rem
}

.workflow-copy p {
  font-size:.87rem
}

.control-list {
  gap:22px
}

.control-list li {
  border-bottom:1px solid var(--line);
  padding-bottom:20px
}

.control-list h3 {
  font-size:1.07rem
}

.control-list p {
  font-size:.9rem
}

.plan-description,.price-note {
  min-height:0
}

.price {
  font-size:3rem
}

.price-card {
  padding:27px
}

.price-card.featured {
  padding:26px
}

.plan-features {
  font-size:.88rem
}

.billing-toggle {
  width:100%
}

.billing-toggle button {
  flex:1
}

.closing-panel {
  padding:27px
}

.closing-actions,.closing-actions .button {
  width:100%
}

.closing-actions {
  justify-items:center
}

.footer-links {
  gap:12px 20px
}

.footer-bottom {
  flex-direction:column;
  gap:12px
}

dialog {
  padding:24px
}

.faq-list summary {
  font-size:.93rem
}


}

@media(prefers-reduced-motion:reduce) {
  html {
  scroll-behavior:auto
}

*,*:before,*:after {
  transition:none!important;
  animation:none!important
}


}