/* Dawnwell homepage styles — pulled out of index.html so markup stays readable. */

html{scroll-behavior:smooth}
html,body{margin:0;padding:0;background:var(--dw-sheet)}
a{color:var(--dw-accent);text-decoration:none}
a:hover{color:var(--dw-accent-soft)}
/* inline colours on the links win over the rule above, so the footer needs its own */
footer a{transition:color 160ms var(--ease-standard)}
footer a:hover{color:var(--dw-accent)!important}

@keyframes dwGlow{0%{opacity:.55;transform:scale(1)}100%{opacity:.9;transform:scale(1.12)}}
@keyframes dwDrift{0%{transform:translateY(0)}100%{transform:translateY(-14px)}}
@keyframes dwDriftB{0%{transform:translateY(-10px)}100%{transform:translateY(6px)}}
@media (prefers-reduced-motion: reduce){*{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important}html{scroll-behavior:auto}}

/* Scroll-reveal: JS (index.html's Component._attach) toggles data-shown and sets
   opacity/transform/transitionDelay inline once an element enters the viewport.
   --ty/--sc/--dur let individual elements override distance, scale and speed. */
[data-reveal]{opacity:0;transform:translateY(var(--ty,24px)) scale(var(--sc,1));transition:opacity var(--dur,800ms) var(--ease-out),transform var(--dur,800ms) var(--ease-out)}
[data-reveal].dw-fade-only{transform:none;transition:opacity var(--dur,800ms) var(--ease-out)}

.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}

/* Layout */
.dw-page{font-family:var(--font-body);color:var(--dw-ink);background:var(--dw-sheet);overflow:clip}
.dw-section{padding:clamp(64px,8vw,104px) 24px}
.dw-container{max-width:1200px;margin:0 auto}
.dw-container--pricing{max-width:920px;text-align:center}
#pricing{padding:clamp(74px,9.2vw,120px) 24px}
#nights,#privacy,#faq,#pricing{background:var(--dw-sheet)}

/* Shared text/card patterns */
.dw-eyebrow{font-weight:700;font-size:11.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--dw-accent)}
.dw-eyebrow--night{color:var(--dw-night-ink-muted)}
.dw-eyebrow-sm{font-weight:700;font-size:12px;letter-spacing:1.1px;text-transform:uppercase;color:var(--dw-accent)}
.dw-muted-sm{font-weight:600;font-size:14px;color:var(--dw-ink-muted)}
.dw-muted-md{font-weight:600;font-size:15px;color:var(--dw-ink-muted)}
.dw-card{background:var(--dw-card-fill);border-radius:var(--radius-hero);padding:26px}
.dw-pill{padding:5px 13px;border-radius:999px;background:var(--accent-tint);font-weight:700;font-size:11.5px;letter-spacing:1.3px;text-transform:uppercase;color:var(--dw-accent)}
.dw-bar{flex:1;height:0;border-radius:8px;background:var(--dw-track);transition:height 900ms var(--ease-out)}
.dw-bar--full{background:var(--dw-accent)}

/* Nav */
.dw-nav{--button-height:48px;position:sticky;top:0;z-index:30;backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);background:rgba(251,235,223,.6);border-bottom:1px solid var(--hairline);box-shadow:0 8px 30px rgba(55,19,40,.05)}
.dw-nav button{padding:0 24px!important;font-size:16px!important;gap:8px!important}
.dw-nav-inner{max-width:1200px;margin:0 auto;padding:18px 32px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
.dw-nav-brand{display:flex;align-items:center;gap:10px;justify-self:start}
.dw-nav-logo{width:36px;height:36px;border-radius:9px}
.dw-nav-wordmark{font-family:var(--font-display);font-weight:700;font-size:22px;color:var(--dw-ink)}
.dw-nav-links{display:flex;gap:28px;flex-wrap:wrap;justify-content:center}
.dw-nav-cta{justify-self:end}
/* Below this, brand + links + CTA can't share one row without wrapping into a
   mess. Links are all in-page anchors, so dropping them costs a scroll, not a
   destination — simplest fix that doesn't need a hamburger + JS toggle. */
@media (max-width:880px){
  .dw-nav-inner{grid-template-columns:auto auto;padding:14px 20px}
  .dw-nav-links{display:none}
}
/* Phones: the full-size CTA wraps to two lines next to the wordmark. */
@media (max-width:520px){
  .dw-nav{--button-height:40px}
  .dw-nav-inner{padding:10px 16px;gap:12px}
  .dw-nav-logo{width:32px;height:32px;border-radius:8px}
  .dw-nav-wordmark{font-size:20px}
  .dw-nav button{padding:0 16px!important;font-size:14.5px!important;white-space:nowrap}
}

/* Hero */
.dw-hero{position:relative;padding:0 24px;overflow:hidden;display:flex;align-items:flex-start;justify-content:center;padding-top:clamp(24px,6vh,64px);padding-bottom:clamp(48px,8vh,96px)}
.dw-hero-glow{position:absolute;top:-180px;left:50%;width:min(1100px,150vw);height:900px;margin-left:calc(min(1100px,150vw) / -2);border-radius:50%;background:radial-gradient(ellipse at center,rgba(242,191,167,.95) 0%,rgba(242,191,167,.35) 45%,rgba(251,235,223,0) 72%);animation:dwGlow 6200ms var(--ease-standard) infinite alternate;pointer-events:none}
.dw-hero-inner{position:relative;max-width:1400px;width:100%;margin:0 auto;padding-left:6%;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:clamp(24px,4vw,48px);align-items:center}
.dw-hero-copy{text-align:left}
.dw-hero-title{margin:22px 0 0;font-family:var(--font-display);font-weight:700;font-size:clamp(54px,6vw,80px);line-height:1.03;letter-spacing:-.015em;text-wrap:pretty}
.dw-hero-title-accent{font-style:italic;color:var(--dw-accent)}
.dw-hero-desc{margin:24px 0 0;max-width:560px;font-weight:500;font-size:clamp(17px,1.5vw,20px);line-height:1.45;color:var(--dw-ink-muted)}
.dw-hero-ctas{margin-top:30px;display:flex;flex-wrap:wrap;gap:12px}
.dw-hero-note{margin-top:20px}
.dw-hero-art{display:flex;justify-content:center}
.dw-hero-img{width:100%;max-width:1800px;height:auto}
/* Phones: drop the desktop indent, bring the headline down to a size that
   doesn't take a whole screen, and stack the CTAs full width for easy tapping. */
@media (max-width:740px){
  .dw-hero{padding-bottom:clamp(32px,6vh,56px)}
  .dw-hero-inner{padding-left:0}
  .dw-hero-title{margin-top:8px;font-size:clamp(38px,11vw,54px);line-height:1.05}
  .dw-hero-desc{margin-top:18px;font-size:17px}
  .dw-hero-ctas{margin-top:26px;flex-direction:column;align-items:stretch}
  .dw-hero-ctas a,.dw-hero-ctas button{display:flex;width:100%}
  .dw-hero-img{max-width:420px;margin:0 auto}
}

/* Nights ("how a night runs") */
.dw-nights-title{margin:12px 0 0;max-width:760px;font-family:var(--font-display);font-weight:700;font-size:clamp(32px,4vw,50px);line-height:1.14}
.dw-states{margin-top:44px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:16px}
.dw-state-card{display:grid;gap:12px;align-content:start}
.dw-state-icon{width:52px;height:52px;border-radius:26px;background:var(--dw-sheet);display:grid;place-items:center}
.dw-state-icon ion-icon{color:var(--dw-accent);font-size:24px}
.dw-state-title{font-family:var(--font-display);font-weight:700;font-size:26px}
.dw-state-time{margin-top:3px;font-weight:700;font-size:12.5px;letter-spacing:1.2px;text-transform:uppercase;color:var(--dw-accent)}
.dw-state-body{font-weight:500;font-size:14.5px;line-height:21px;color:var(--dw-ink-muted)}
.dw-state-num{font-family:var(--font-display);font-weight:700;font-size:15px;color:var(--dw-ink-muted);opacity:.45}

/* Night (sleep screen) */
/* --dw-bleed: exact distance from a 1200px-capped centred column to the
   section edge = the 24px padding plus whatever `margin:0 auto` adds. cqw (the
   section's own content box) rather than vw, because vw counts the scrollbar
   and would overshoot by ~7px on desktop. */
#night{--dw-night-pad:clamp(72px,9vw,112px);--dw-bleed:calc(24px + max(0px,(100cqw - 1200px)/2));container-type:inline-size;background:var(--dw-night-bg);color:var(--dw-night-ink);padding:var(--dw-night-pad) 24px}
.dw-night-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr;gap:clamp(32px,5vw,64px);align-items:center}
/* Copy/art split shifted right of even so the art column gets more room. */
@media (min-width:740px){.dw-night-grid{grid-template-columns:1fr 1.6fr}}
.dw-night-copy{display:flex;flex-direction:column;justify-content:center}
.dw-night-title{margin:14px 0 0;font-family:var(--font-display);font-weight:700;font-size:clamp(32px,4.2vw,54px);line-height:1.14}
.dw-night-desc{margin:22px 0 0;max-width:480px;font-weight:500;font-size:18px;line-height:27px;color:var(--dw-night-ink-muted)}
.dw-essentials{margin-top:28px;display:flex;flex-wrap:wrap;gap:10px}
.dw-essential-pill{height:34px;padding:0 15px;border-radius:17px;background:var(--dw-night-surface);display:flex;align-items:center;font-weight:600;font-size:14px}
.dw-essentials-note{margin-top:16px;font-weight:500;font-size:13.5px;color:var(--dw-night-ink-muted)}
/* Bleeds past the centered 1200px container to sit flush with the viewport's
   right edge. */
.dw-night-art{margin-right:calc(-1 * var(--dw-bleed))}
.dw-night-img{display:block;width:100%;height:auto}
/* Two-column only: cancel the section's vertical padding so the art spans the
   full section height. The phones in the PNG are drawn running off its top and
   bottom canvas edges, so they only read as intentional when those edges sit
   flush with the section's — otherwise the artwork looks sliced mid-section
   with dead background below it. Single column would overlap the copy above. */
/* Single column: the art sits last, so let it run into the section's bottom
   edge (same reason as below) instead of stopping short above a dead band. */
@media (max-width:739.98px){
  .dw-night-art{margin-bottom:calc(-1 * var(--dw-night-pad));margin-left:calc(-1 * var(--dw-bleed))}
}
@media (min-width:740px){
  .dw-night-art{align-self:stretch;margin-top:calc(-1 * var(--dw-night-pad));margin-bottom:calc(-1 * var(--dw-night-pad))}
  .dw-night-img{height:100%;object-fit:cover}
}

/* Privacy & permissions */
.dw-privacy-title{margin:12px 0 0;max-width:760px;font-family:var(--font-display);font-weight:700;font-size:clamp(30px,3.8vw,46px);line-height:1.16}
.dw-privacy-desc{margin:18px 0 0;max-width:600px;font-weight:500;font-size:17px;line-height:26px;color:var(--dw-ink-muted)}
.dw-permissions{margin-top:36px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:14px}
.dw-permission-card{background:var(--dw-card-fill);border-radius:var(--radius-card);padding:20px;display:flex;align-items:flex-start;gap:12px}
.dw-permission-card ion-icon{color:var(--dw-accent);font-size:18px;flex:none;margin-top:2px}
.dw-permission-title{font-weight:700;font-size:15.5px}
.dw-permission-body{margin-top:4px;font-weight:500;font-size:13.5px;line-height:20px;color:var(--dw-ink-muted)}
.dw-privacy-note{margin-top:20px}

/* FAQ — hairline-ruled question list beside a heading that stays put while you read */
.dw-faq-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:clamp(28px,5vw,72px);align-items:start}
@media (min-width:860px){.dw-faq-head{position:sticky;top:112px}}
.dw-faq-title{margin:12px 0 0;text-wrap:balance;font-family:var(--font-display);font-weight:700;font-size:clamp(30px,3.8vw,46px);line-height:1.16}
.dw-faq-lead{margin:20px 0 0;max-width:34ch;font-weight:500;font-size:16px;line-height:25px;color:var(--dw-ink-muted)}
.dw-faq-list{border-top:1px solid var(--hairline)}
.dw-faq-item{border-bottom:1px solid var(--hairline)}
.dw-faq-toggle{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:20px;width:100%;padding:20px 2px;cursor:pointer;font-family:var(--font-display);font-weight:700;font-size:clamp(18px,1.6vw,21px);line-height:1.3;color:var(--dw-ink);text-align:left;transition:color var(--duration-color) var(--ease-standard)}
.dw-faq-toggle:hover,.dw-faq-toggle[aria-expanded="true"]{color:var(--dw-accent)}
.dw-faq-toggle:focus-visible{outline:2px solid var(--dw-accent);outline-offset:3px;border-radius:3px}
.dw-faq-question{flex:1}
/* Plus drawn in CSS so it can turn into a minus instead of swapping icon glyphs. */
.dw-faq-icon{position:relative;flex:none;width:15px;height:15px;color:var(--dw-accent);transition:transform 420ms var(--ease-out)}
.dw-faq-icon::before,.dw-faq-icon::after{content:'';position:absolute;inset:50% 0;border-top:2px solid currentColor;transition:transform 420ms var(--ease-out)}
.dw-faq-icon::after{transform:rotate(90deg)}
.dw-faq-toggle[aria-expanded="true"] .dw-faq-icon{transform:rotate(180deg)}
.dw-faq-toggle[aria-expanded="true"] .dw-faq-icon::after{transform:rotate(90deg) scaleX(0)}
/* 0fr→1fr animates to the answer's own height — no max-height guess to clip long
   answers. The inner div does the clipping so the answer keeps its padding. */
.dw-faq-panel{display:grid;grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows 420ms var(--ease-out),visibility 0s linear 420ms}
.dw-faq-panel>div{overflow:hidden;min-height:0}
.dw-faq-toggle[aria-expanded="true"]+.dw-faq-panel{grid-template-rows:1fr;visibility:visible;transition:grid-template-rows 420ms var(--ease-out),visibility 0s}
.dw-faq-answer{padding:0 44px 22px 0;font-weight:500;font-size:15px;line-height:24px;color:var(--dw-ink-muted);opacity:0;transform:translateY(-6px);transition:opacity 220ms var(--ease-out),transform 220ms var(--ease-out)}
.dw-faq-toggle[aria-expanded="true"]+.dw-faq-panel .dw-faq-answer{opacity:1;transform:none;transition-delay:110ms}
@media (max-width:520px){.dw-faq-answer{padding-right:12px}.dw-faq-toggle{padding:18px 2px}}

/* Progress */
#progress{--dw-progress-pad:clamp(64px,8vw,104px);--dw-bleed:calc(24px + max(0px,(100cqw - 1200px)/2));container-type:inline-size;background:var(--dw-peach);padding:var(--dw-progress-pad) 24px}
.dw-progress-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:clamp(32px,5vw,64px);align-items:center}
/* Bleeds toward the viewport's left edge, held back a bit short of flush so
   the picture sits further right. */
.dw-progress-cards{margin-left:calc(-1 * var(--dw-bleed) + 56px)}
.dw-progress-img{display:block;width:100%;height:auto}
/* Single column: the art sits first, so run it up into the section's top edge
   and centre it rather than nudging it right. */
@media (max-width:739.98px){
  .dw-progress-cards{margin:calc(-1 * var(--dw-progress-pad)) calc(-1 * var(--dw-bleed)) 0}
  .dw-progress-img{max-width:480px;margin:0 auto}
}
/* Same full-height treatment as .dw-night-art — this PNG's phones also run off
   its top and bottom canvas edges. */
@media (min-width:740px){
  .dw-progress-cards{align-self:stretch;margin-top:calc(-1 * var(--dw-progress-pad));margin-bottom:calc(-1 * var(--dw-progress-pad))}
  .dw-progress-img{height:100%;object-fit:cover}
}
.dw-streak-count{font-family:var(--font-display);font-weight:700;font-size:clamp(40px,5vw,56px);line-height:1.1;font-variant-numeric:tabular-nums}
.dw-streak-label{font-weight:500;font-size:13.5px;color:var(--dw-ink-muted)}
.dw-streak-note{margin-top:16px;font-weight:600;font-size:15px}
.dw-hours-title{font-family:var(--font-display);font-weight:700;font-size:26px}
.dw-bars{margin-top:18px;display:flex;gap:10px;height:92px;align-items:flex-end}
.dw-hours-note{margin-top:12px;font-weight:500;font-size:13.5px;color:var(--dw-ink-muted)}
.dw-progress-title{margin:14px 0 0;font-family:var(--font-display);font-weight:700;font-size:clamp(32px,4vw,50px);line-height:1.14}
.dw-progress-desc{margin:20px 0 0;max-width:470px;font-weight:500;font-size:18px;line-height:27px;color:var(--dw-ink-muted)}
.dw-progress-note{margin-top:24px;font-weight:600;font-size:15px;color:var(--dw-ink)}

/* Pricing */
.dw-pricing-title{margin:14px 0 0;font-family:var(--font-display);font-weight:700;font-size:clamp(37px,4.6vw,58px);line-height:1.14}
.dw-pricing-desc{margin:12px 0 0;font-weight:500;font-size:18px;line-height:26px;color:var(--dw-ink-muted)}
.dw-plans{margin-top:40px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:20px;text-align:left;max-width:640px;margin-left:auto;margin-right:auto}
.dw-plan{border-radius:var(--radius-hero);padding:28px 24px;display:flex;flex-direction:column;gap:6px}
.dw-plan--annual{background:var(--dw-accent);color:var(--dw-on-accent)}
.dw-plan--weekly{background:var(--dw-card-fill)}
.dw-plan-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.dw-plan-name{font-weight:700;font-size:15px;opacity:.85}
.dw-plan-name--muted{color:var(--dw-ink-muted);opacity:1}
.dw-plan-badge{flex:none;background:rgba(255,255,255,.22);border-radius:999px;padding:5px 12px;font-weight:700;font-size:12px;white-space:nowrap}
.dw-plan-price{margin-top:10px;font-family:var(--font-display);font-weight:700;font-size:44px;line-height:1}
.dw-plan-price--muted{color:var(--dw-ink)}
.dw-plan-sub{font-weight:500;font-size:13.5px;opacity:.85}
.dw-plan-sub--muted{color:var(--dw-ink-muted);opacity:1}
.dw-pricing-cta{margin-top:28px;display:flex;justify-content:center}
.dw-pricing-note{margin-top:14px}
.dw-store-badges{margin-top:26px;display:flex;justify-content:center;flex-wrap:wrap;gap:12px}
.dw-store-badge{display:flex;align-items:center;gap:9px;height:48px;border-radius:10px}
.dw-store-badge--apple{padding:0 16px;background:#0B0507}
.dw-store-badge--apple ion-icon{color:#fff;font-size:22px}
.dw-store-badge--android{padding:0 18px;background:transparent;border:1.5px solid var(--dw-ink);color:var(--dw-ink)}
.dw-store-badge--android ion-icon{font-size:19px}
.dw-store-badge-text{text-align:left;color:#fff}
.dw-store-badge-line1{display:block;font-family:var(--font-body);font-weight:500;font-size:9.5px;line-height:11px;opacity:.8}
.dw-store-badge-line2{display:block;font-family:var(--font-body);font-weight:700;font-size:15px;line-height:17px}
.dw-store-badge-android-text{font-family:var(--font-body);font-weight:700;font-size:14px}

/* Early access / waitlist */
#early-access{background:var(--dw-sheet);padding:clamp(72px,9vw,112px) 24px}
.dw-waitlist-card{max-width:660px;margin:0 auto;padding:clamp(28px,4vw,40px) clamp(22px,4vw,40px);background:var(--dw-sheet);border:1px solid var(--hairline);border-radius:28px;box-shadow:0 18px 44px -30px rgba(55,19,40,.5);text-align:center}
.dw-waitlist-tags{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}
.dw-waitlist-title{margin-top:16px;font-family:var(--font-display);font-weight:700;font-size:clamp(22px,2.6vw,28px);line-height:1.2;color:var(--dw-ink)}
.dw-waitlist-desc{margin-top:8px;font-weight:500;font-size:15px;line-height:1.5;color:var(--dw-ink-muted)}
.dw-waitlist-form{margin-top:26px;display:flex;align-items:center;gap:6px;max-width:540px;margin-left:auto;margin-right:auto;background:var(--dw-card-fill);border:1px solid var(--hairline);border-radius:999px;padding:10px 10px 10px 26px;box-shadow:none;transition:border-color 200ms ease}
.dw-waitlist-form:focus-within{border-color:var(--dw-accent);box-shadow:none}
.dw-waitlist-input{flex:1;min-width:0;height:46px;line-height:46px;border:none;padding:0;font-family:var(--font-body),sans-serif;font-weight:500;font-size:17px;background:transparent;outline:none;color:var(--dw-ink)}
.dw-waitlist-input::placeholder{color:var(--dw-ink-muted);opacity:.75}
.dw-waitlist-form button{flex:none;margin-left:auto;box-shadow:none}
.dw-waitlist-form .sc-host-x{display:flex!important;align-items:center;flex:none;margin-left:auto}
.dw-waitlist-status{margin-top:12px;min-height:20px;font-weight:600;font-size:13.5px}
@media (max-width:520px){
  .dw-waitlist-form{flex-direction:column;align-items:stretch;border-radius:26px;padding:12px;gap:10px}
  .dw-waitlist-input{width:100%;text-align:center;font-size:16px}
  .dw-waitlist-form .sc-host-x{width:100%;margin-left:0}
  .dw-waitlist-form button{width:100%}
  .dw-pricing-desc{font-size:16.5px;line-height:24px}
}

/* Footer */
footer{background:var(--dw-card-fill);border-top:1px solid var(--hairline);overflow:hidden}
.dw-footer-grid{max-width:1200px;margin:0 auto;padding:77px 29px 48px;display:grid;grid-template-columns:repeat(auto-fit,minmax(204px,1fr));gap:48px 38px;text-align:center}
.dw-footer-brand-row{display:flex;align-items:center;justify-content:center;gap:12px}
.dw-footer-logo{width:36px;height:36px;border-radius:10px}
.dw-footer-wordmark{font-family:var(--font-display);font-weight:700;font-size:19px}
.dw-footer-tagline{margin:17px auto 0;max-width:312px;font-weight:500;font-size:14px;line-height:22px;color:var(--dw-ink-muted)}
.dw-footer-col{display:flex;flex-direction:column;align-items:center;gap:14px}
footer .dw-eyebrow-sm{font-size:13px}
footer .dw-muted-sm{font-size:14px}
.dw-footer-bottom{max-width:1200px;margin:0 auto;padding:24px 29px 29px;display:flex;flex-wrap:wrap;gap:10px 29px;justify-content:center;align-items:center;border-top:1px solid var(--hairline);font-weight:600;font-size:13px;color:var(--dw-ink-muted)}
.dw-footer-wordmark-clip{overflow:hidden;aspect-ratio:1000/127}
.dw-footer-wordmark-svg{display:block;width:100%;height:150%;user-select:none}
/* Phones: brand on top, Product + Support side by side, Legal below, so the
   footer isn't one long centred column. */
@media (max-width:520px){
  .dw-footer-grid{grid-template-columns:1fr 1fr;padding:56px 24px 40px;gap:40px 16px}
  .dw-footer-grid>:first-child,.dw-footer-grid>:last-child{grid-column:1 / -1}
  .dw-footer-bottom{padding:20px 24px 24px}
}
.dw-footer-wordmark-svg text{font-family:var(--font-display);font-weight:700;font-size:252px;fill:var(--dw-accent)}