/* =====================================================================
   Ralfiz · Aurora design system
   Dark, glowing aurora, glass surfaces. Every class is prefixed `au-`
   so it never collides with Bootstrap or the legacy theme while pages
   are migrated. Usage notes: templates/aurora/README.md
   ===================================================================== */
@property --ang { syntax: "<angle>"; inherits: false; initial-value: 0deg; }

:root {
  color-scheme: dark;
  --night: #050B0F;
  --night-2: #08141A;
  --night-3: #0C1C22;
  --ink: #EAF4F2;
  --ink-2: #C2D2CF;
  --muted: #A4B7B4;
  --line: rgba(234, 244, 242, .12);
  --line-2: rgba(234, 244, 242, .22);
  --glass: rgba(255, 255, 255, .055);
  --glass-2: rgba(255, 255, 255, .09);
  --teal: #017B6E;
  --teal-2: #2BC3B0;
  --teal-3: #5FE0CF;
  --coral: #F26F55;
  --sun: #FDDC7A;
  --danger: #FF7A6B;
  --success: #3BD47A;
  --display: "Sora", "Outfit", Arial, sans-serif;
  --body: "Inter", "Helvetica Neue", Arial, sans-serif;
  --gut: clamp(16px, 4vw, 56px);
  --max: 1320px;
  --max-prose: 760px;
  --spring: cubic-bezier(.34, 1.56, .64, 1);
  --ease: cubic-bezier(.2, .8, .2, 1);
  /* spacing (4px base) */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px; --sp-9: 96px;
  --sec-y: clamp(80px, 10vw, 150px);
  --head-gap: clamp(36px, 5vw, 60px);
  /* type scale */
  --fs-display: clamp(44px, 7.4vw, 116px);
  --fs-h1: clamp(40px, 6vw, 88px);
  --fs-h2: clamp(34px, 5vw, 72px);
  --fs-h2-sm: clamp(30px, 4vw, 56px);
  --fs-h3: clamp(19px, 1.5vw, 23px);
  --fs-h4: 19px;
  --fs-lede: clamp(16px, 1.35vw, 18px);
  --fs-body: 15.5px;
  --fs-small: 13.5px;
  --fs-label: 12px;
  /* glass */
  --glass-bg: linear-gradient(160deg, rgba(255, 255, 255, .085), rgba(255, 255, 255, .045));
  --glass-border: 1px solid rgba(234, 244, 242, .13);
  --glass-blur: blur(18px) saturate(140%);
  --r-lg: 28px; --r-md: 18px; --r-sm: 12px; --r-pill: 999px;
  --shadow: 0 30px 80px -30px rgba(0, 0, 0, .8);
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; background: var(--night); scroll-behavior: auto; }
body.au { margin: 0; background: transparent; color: var(--ink); font: 400 16px/1.6 var(--body); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
.au a { color: inherit; text-decoration: none; }
.au button { font: inherit; color: inherit; }
.au img { max-width: 100%; height: auto; }
.au img.is-broken { visibility: hidden; }
.au-card__media img, .au-prod__stage img, .au-media img { color: transparent; font-size: 0; }
.au h1, .au h2, .au h3, .au h4, .au h5, .au h6 { font-family: var(--display); font-weight: 600; letter-spacing: -.03em; line-height: 1.1; color: var(--ink); margin: 0; }
.au p { margin: 0; }
.au :focus-visible { outline: 2px solid var(--sun); outline-offset: 3px; border-radius: 6px; }
.au ::selection { background: var(--teal-2); color: var(--night); }
.au [hidden] { display: none !important; }
/* pages that do not open with a hero get room for the fixed nav */
.au-main:not(:has(> .au-page-hero:first-child, > .au-hero:first-child, > [data-flush-top]:first-child)) { padding-top: 84px; }
@media (max-width: 560px) { .au-main:not(:has(> .au-page-hero:first-child, > .au-hero:first-child, > [data-flush-top]:first-child)) { padding-top: 72px; } }
.au-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.au-skip { position: fixed; left: 16px; top: -60px; z-index: 300; padding: 10px 16px; border-radius: var(--r-pill); background: var(--sun); color: var(--night) !important; font-weight: 700; }
.au-skip:focus { top: 12px; }

/* ---------- layout ---------- */
.au-wrap { max-width: var(--max); margin: 0 auto; position: relative; }
.au-wrap--prose { max-width: var(--max-prose); }
.au-sec { position: relative; padding: var(--sec-y) var(--gut); }
.au-sec--tight { padding-top: 0; }
.au-sec--flush { padding-bottom: 0; }
.au-sec--alt { background: linear-gradient(180deg, transparent, rgba(43, 195, 176, .04) 30%, rgba(43, 195, 176, .04) 70%, transparent); }
.au-grid { display: grid; gap: var(--sp-5); }
.au-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.au-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.au-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.au-grid--auto { grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
@media (max-width: 1080px) { .au-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .au-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) { .au-grid--2, .au-grid--3, .au-grid--4 { grid-template-columns: 1fr; } }
.au-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.au-split--top { align-items: start; }
.au-split--wide { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
@media (max-width: 900px) { .au-split, .au-split--wide { grid-template-columns: 1fr; } }
.au-split > * { min-width: 0; } /* long <pre>/tables must not widen the page on phones */
.au-aside-sticky { position: sticky; top: 110px; }
@media (max-width: 900px) { .au-aside-sticky { position: static; } }
.au-stack > * + * { margin-top: var(--sp-4); }
.au-stack--lg > * + * { margin-top: var(--sp-6); }
.au-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3); }
.au-row--between { justify-content: space-between; }
.au-row--center { justify-content: center; }
.au-center { text-align: center; }
.au-center .au-lede { margin-left: auto; margin-right: auto; }
.au-muted { color: var(--muted); }
.au-small { font-size: var(--fs-small); }
.au-mt-0 { margin-top: 0 !important; } .au-mt-2 { margin-top: var(--sp-2); } .au-mt-4 { margin-top: var(--sp-4); } .au-mt-6 { margin-top: var(--sp-6); } .au-mt-8 { margin-top: var(--sp-8); }
.au-mb-0 { margin-bottom: 0 !important; } .au-mb-4 { margin-bottom: var(--sp-4); } .au-mb-6 { margin-bottom: var(--sp-6); }
@media (max-width: 680px) { .au-hide-sm { display: none !important; } }
@media (min-width: 681px) { .au-show-sm { display: none !important; } }

/* ---------- type ---------- */
.au-eyebrow { display: inline-flex; align-items: center; gap: 10px; font: 600 var(--fs-label)/1.3 var(--body); letter-spacing: .2em; text-transform: uppercase; color: var(--teal-2); }
.au-eyebrow::before { content: ""; width: 26px; height: 1px; flex: none; background: linear-gradient(90deg, transparent, var(--teal-2)); }
.au-eyebrow--plain::before { display: none; }
.au-display { font: 600 var(--fs-display)/1 var(--display) !important; letter-spacing: -.05em !important; text-wrap: balance; }
.au-h1 { font: 600 var(--fs-h1)/1.02 var(--display) !important; letter-spacing: -.045em !important; text-wrap: balance; }
.au-h2 { margin-top: var(--sp-4) !important; font: 600 var(--fs-h2)/1.02 var(--display) !important; letter-spacing: -.04em !important; text-wrap: balance; }
.au-h2--sm { font-size: var(--fs-h2-sm) !important; }
.au-h3 { font: 600 var(--fs-h3)/1.15 var(--display) !important; letter-spacing: -.03em !important; }
.au-h4 { font: 600 var(--fs-h4)/1.25 var(--display) !important; letter-spacing: -.02em !important; }
.au-grad { background: linear-gradient(100deg, var(--teal-2) 0%, var(--sun) 45%, var(--coral) 90%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.au-lede { margin-top: var(--sp-5); max-width: 56ch; color: var(--muted); font-size: var(--fs-lede); line-height: 1.65; }
.au-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--sp-6); margin-bottom: var(--head-gap); }
.au-head > :first-child { max-width: 780px; }
.au-head .au-lede { margin-top: 0; }
.au-head--center { flex-direction: column; align-items: center; text-align: center; }
.au-head--center > :first-child { max-width: 900px; }
.au-head--center .au-lede { margin: var(--sp-5) auto 0; }
@media (max-width: 820px) { .au-head { flex-direction: column; align-items: flex-start; gap: var(--sp-4); } .au-head--center { align-items: center; } }

/* ---------- glass + cards ---------- */
.au-glass { position: relative; background: var(--glass-bg); border: var(--glass-border); }
.au-blur { -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
.au-card { position: relative; display: flex; flex-direction: column; border-radius: var(--r-lg); padding: var(--sp-6); background: var(--glass-bg); border: var(--glass-border); overflow: hidden; isolation: isolate; transition: border-color .4s, transform .5s var(--spring); color: var(--ink); }
.au-card--sm { padding: var(--sp-5); border-radius: var(--r-md); }
.au-card--flush { padding: 0; }
.au-card--tall { min-height: 280px; }
a.au-card:hover, .au-card--hover:hover { border-color: rgba(43, 195, 176, .45); }
/* glowing border that spins on hover */
.au-card--glow::before { content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; z-index: -1; pointer-events: none;
  background: conic-gradient(from var(--ang), transparent 0 60%, var(--teal-2) 72%, var(--sun) 80%, var(--coral) 88%, transparent 96%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  animation: au-spin-ang 6s linear infinite paused; opacity: .5; transition: opacity .4s; }
.au-card--glow:hover::before { opacity: 1; animation-play-state: running; }
.au-card--glow::after { content: ""; position: absolute; z-index: -2; width: 340px; height: 340px; left: var(--gx, 50%); top: var(--gy, 0%); transform: translate(-50%, -50%); border-radius: 50%;
  background: radial-gradient(circle, rgba(43, 195, 176, .26), transparent 65%); opacity: 0; transition: opacity .4s; pointer-events: none; }
.au-card--glow:hover::after { opacity: 1; }
@keyframes au-spin-ang { to { --ang: 360deg; } }
.au-card__icon { width: 48px; height: 48px; flex: none; border-radius: var(--r-md); display: grid; place-items: center; font-size: 26px; background: rgba(255, 255, 255, .06); border: 1px solid var(--line); color: var(--c, var(--teal-2)); box-shadow: 0 0 30px -6px var(--c, var(--teal-2)); }
.au-card__icon--sm { width: 44px; height: 44px; font-size: 20px; border-radius: var(--r-sm); }
.au-card__n { position: absolute; right: var(--sp-6); top: var(--sp-6); font: 500 12px/1 var(--body); letter-spacing: .16em; color: var(--muted); }
.au-card__title { margin-top: var(--sp-5) !important; font: 600 var(--fs-h3)/1.15 var(--display) !important; letter-spacing: -.03em; }
.au-card__title--push { margin-top: auto !important; padding-top: var(--sp-7); }
.au-card__sub { margin-top: var(--sp-2); font: 600 var(--fs-label)/1.4 var(--body); letter-spacing: .14em; text-transform: uppercase; color: var(--sun); }
.au-card__body { margin-top: var(--sp-3) !important; color: var(--muted); font-size: var(--fs-body); line-height: 1.6; }
.au-card__foot { margin-top: auto; padding-top: var(--sp-5); display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); }
.au-card__media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: radial-gradient(80% 70% at 50% 40%, rgba(43, 195, 176, .2), transparent 70%), var(--night-2); }
.au-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1s var(--ease); }
a.au-card:hover .au-card__media img { transform: scale(1.05); }
.au-card__content { padding: var(--sp-5) var(--sp-6) var(--sp-6); display: flex; flex-direction: column; flex: 1; }
.au-go { flex: none; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--line); font-size: 19px; transition: transform .5s var(--spring), background .3s, color .3s; }
a:hover > .au-go, a:hover .au-go { transform: rotate(-45deg); background: var(--ink); color: var(--night); }
.au-tags { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-5); }
.au-tags span, .au-tag { display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border-radius: var(--r-pill); border: 1px solid var(--line); font-size: 12px; color: var(--muted); }

/* ---------- buttons ---------- */
.au-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 54px; padding: 0 26px; border-radius: var(--r-pill); border: 0;
  font: 600 15px/1 var(--body); white-space: nowrap; cursor: pointer; isolation: isolate; text-decoration: none; transition: transform .5s var(--spring), box-shadow .4s, background .3s, border-color .3s, color .3s; }
.au-btn i { font-size: 18px; transition: transform .5s var(--spring); }
.au-btn:hover i.ri-arrow-right-line, .au-btn:hover i.ri-arrow-right-up-line { transform: translateX(4px) rotate(-45deg); }
.au-btn--glow { color: var(--night) !important; background: linear-gradient(100deg, var(--teal-2), var(--sun)); box-shadow: 0 0 0 1px rgba(255, 255, 255, .2) inset, 0 12px 40px -10px rgba(43, 195, 176, .7); }
.au-btn--glow:hover { box-shadow: 0 0 0 1px rgba(255, 255, 255, .3) inset, 0 18px 60px -8px rgba(253, 220, 122, .7); }
.au-btn--ghost { color: var(--ink) !important; background: var(--glass); border: 1px solid var(--line); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.au-btn--ghost:hover { background: var(--glass-2); border-color: rgba(234, 244, 242, .3); }
.au-btn--wa { color: #04220F !important; background: #25D366; box-shadow: 0 12px 40px -12px rgba(37, 211, 102, .7); }
.au-btn--danger { color: var(--night) !important; background: var(--coral); }
.au-btn--sm { min-height: 42px; padding: 0 18px; font-size: 14px; }
.au-btn--block { width: 100%; }
.au-btn[disabled], .au-btn.is-loading { opacity: .6; pointer-events: none; }
.au-link { color: var(--teal-2) !important; font-weight: 600; display: inline-flex; align-items: center; gap: 6px; }
.au-link:hover { color: var(--sun) !important; }
.au-link i { transition: transform .4s var(--spring); }
.au-link:hover i { transform: translateX(3px); }

/* ---------- chips + badges ---------- */
.au-chip { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: var(--r-pill); border: 1px solid var(--line); background: rgba(255, 255, 255, .05); font-size: 14px; color: var(--ink); white-space: nowrap; transition: background .3s, border-color .3s, color .3s; }
.au-chip i { color: var(--teal-2); }
a.au-chip:hover { border-color: rgba(43, 195, 176, .5); }
.au-chip.is-active, .au-chip[aria-current="true"], .au-chip[aria-pressed="true"] { background: var(--teal-2); border-color: var(--teal-2); color: var(--night) !important; }
.au-chip.is-active i { color: var(--night); }
.au-chips { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.au-badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: var(--r-pill); font: 600 11px/1.2 var(--body); letter-spacing: .1em; text-transform: uppercase;
  background: rgba(43, 195, 176, .14); border: 1px solid rgba(43, 195, 176, .4); color: var(--teal-3); }
.au-badge--sun { background: rgba(253, 220, 122, .14); border-color: rgba(253, 220, 122, .4); color: var(--sun); }
.au-badge--coral { background: rgba(242, 111, 85, .14); border-color: rgba(242, 111, 85, .45); color: #FF9A85; }
.au-badge--muted { background: rgba(255, 255, 255, .06); border-color: var(--line); color: var(--muted); }

/* ---------- nav ---------- */
.au-nav { position: fixed; z-index: 100; top: 0; left: 0; right: 0; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: calc(16px + env(safe-area-inset-top, 0px)) var(--gut) 16px; transition: padding .4s, background .4s, transform .5s var(--ease); font-family: var(--body); }
.au-nav.solid { padding-top: calc(10px + env(safe-area-inset-top, 0px)); padding-bottom: 10px; background: rgba(5, 11, 15, .72); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: 0 1px 0 var(--line); }
.au-nav.away { transform: translateY(-110%); }
.au-logo { display: inline-flex; align-items: center; min-height: 44px; flex: none; }
.au-logo img { height: 32px; width: auto; display: block; }
.au-links { display: flex; gap: 2px; margin: 0; padding: 5px; list-style: none; border-radius: var(--r-pill); border: 1px solid var(--line); background: rgba(255, 255, 255, .04); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.au-links a { position: relative; display: block; padding: 9px 13px; border-radius: var(--r-pill); font-size: 14px; font-weight: 500; color: var(--muted); transition: color .3s, background .3s; white-space: nowrap; }
.au-links a:hover { color: var(--ink); background: rgba(255, 255, 255, .07); }
.au-links a[aria-current="page"] { color: var(--night); background: linear-gradient(100deg, var(--teal-2), var(--sun)); }
.au-nav-r { display: flex; align-items: center; gap: 10px; }
.au-nav-cta { min-height: 46px; padding: 0 20px; font-size: 14px; }
.au-menu-btn { display: none; width: 46px; height: 46px; border-radius: 50%; place-items: center; border: 1px solid var(--line); background: var(--glass); color: var(--ink); cursor: pointer; -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.au-menu-btn svg { width: 20px; height: 20px; }
@media (max-width: 1240px) { .au-links { display: none; } .au-menu-btn { display: grid; } }
@media (max-width: 560px) { .au-nav-cta { display: none; } .au-logo img { height: 28px; } }
.au-nav-space { height: 84px; }
@media (max-width: 560px) { .au-nav-space { height: 72px; } }

.au-sheet { position: fixed; inset: 0; z-index: 150; display: flex; flex-direction: column; padding: calc(16px + env(safe-area-inset-top, 0px)) var(--gut) calc(24px + env(safe-area-inset-bottom, 0px));
  background: radial-gradient(120% 70% at 80% 0%, rgba(43, 195, 176, .25), transparent 60%), radial-gradient(90% 60% at 0% 100%, rgba(242, 111, 85, .2), transparent 60%), rgba(5, 11, 15, .97);
  -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); visibility: hidden; opacity: 0; transition: opacity .4s, visibility 0s .4s; overflow-y: auto; }
.au-sheet.open { visibility: visible; opacity: 1; transition: opacity .4s; }
.au-sheet-top { display: flex; align-items: center; justify-content: space-between; }
.au-sheet-top .au-menu-btn { display: grid; }
.au-sheet nav { display: grid; margin: 24px 0 auto; }
.au-sheet nav a { display: flex; justify-content: space-between; align-items: baseline; padding: 10px 0; border-bottom: 1px solid var(--line); font: 600 clamp(28px, 7.5vw, 44px)/1.08 var(--display); letter-spacing: -.035em; overflow: hidden; color: var(--ink); }
.au-sheet nav a span { display: inline-block; }
.au-sheet nav a small { font: 500 12px/1 var(--body); letter-spacing: .14em; color: var(--muted); }
.au-sheet nav a[aria-current="page"] span { background: linear-gradient(100deg, var(--teal-2), var(--sun)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.au-sheet .au-btn { margin-top: 24px; }

.au-progress { position: fixed; z-index: 110; top: 0; left: 0; right: 0; height: 2px; transform-origin: 0 50%; transform: scaleX(0); background: linear-gradient(90deg, var(--teal-2), var(--sun), var(--coral)); box-shadow: 0 0 12px var(--teal-2); pointer-events: none; }

/* ---------- aurora backdrop (CSS, used by page headers and as hero fallback) ---------- */
.au-aurora { position: absolute; inset: 0; overflow: hidden; pointer-events: none; background: radial-gradient(120% 80% at 50% 0%, #0A2A2A 0%, var(--night) 60%); }
.au-aurora i { position: absolute; border-radius: 50%; filter: blur(70px); opacity: .55; will-change: transform; }
.au-aurora i:nth-child(1) { width: 70vw; height: 32vw; min-width: 520px; min-height: 200px; left: -10vw; top: 8%; background: var(--teal); transform: rotate(-12deg); animation: au-drift1 18s ease-in-out infinite alternate; }
.au-aurora i:nth-child(2) { width: 60vw; height: 26vw; min-width: 420px; min-height: 170px; right: -14vw; top: 26%; background: var(--teal-2); opacity: .35; transform: rotate(10deg); animation: au-drift2 22s ease-in-out infinite alternate; }
.au-aurora i:nth-child(3) { width: 46vw; height: 20vw; min-width: 340px; min-height: 150px; left: 18%; bottom: 0; background: var(--coral); opacity: .3; animation: au-drift1 26s ease-in-out infinite alternate-reverse; }
.au-aurora i:nth-child(4) { width: 26vw; height: 16vw; min-width: 200px; min-height: 110px; right: 12%; bottom: 16%; background: var(--sun); opacity: .18; animation: au-drift2 20s ease-in-out infinite alternate-reverse; }
.au-aurora::after { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(255, 255, 255, .5) 1px, transparent 1.4px); background-size: 120px 120px; opacity: .22;
  -webkit-mask-image: linear-gradient(#000, transparent 75%); mask-image: linear-gradient(#000, transparent 75%); }
.au-aurora--soft i { opacity: .35; }
.au-aurora--soft i:nth-child(2) { opacity: .22; } .au-aurora--soft i:nth-child(3) { opacity: .18; } .au-aurora--soft i:nth-child(4) { opacity: .1; }
@media (max-width: 760px) { .au-aurora i { filter: blur(50px); } }
@keyframes au-drift1 { to { transform: translate(8vw, 4vh) rotate(-4deg) scale(1.1); } }
@keyframes au-drift2 { to { transform: translate(-10vw, -3vh) rotate(16deg) scale(.95); } }

/* ---------- page header (inner pages) ---------- */
.au-page-hero { position: relative; padding: calc(130px + env(safe-area-inset-top, 0px)) var(--gut) clamp(56px, 7vw, 96px); overflow: hidden; isolation: isolate; }
.au-page-hero .au-aurora { z-index: -1; }
.au-page-hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 40%; z-index: -1; background: linear-gradient(transparent, var(--night)); pointer-events: none; }
.au-page-hero .au-h1 { margin-top: var(--sp-5); max-width: 18ch; }
.au-page-hero--center { text-align: center; }
.au-page-hero--center .au-h1 { margin-left: auto; margin-right: auto; }
.au-page-hero--center .au-lede { margin-left: auto; margin-right: auto; }
.au-page-hero .au-lede { color: var(--ink-2); }
.au-page-hero__meta { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); margin-top: var(--sp-6); color: var(--muted); font-size: var(--fs-small); }
.au-page-hero__meta span { display: inline-flex; align-items: center; gap: 6px; }
.au-page-hero__meta i { color: var(--teal-2); }
.au-page-hero--center .au-page-hero__meta, .au-page-hero--center .au-row { justify-content: center; }
.au-crumbs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 var(--sp-4); padding: 0; list-style: none; font-size: 13px; color: var(--muted); }
.au-crumbs li + li::before { content: "/"; margin-right: 8px; opacity: .5; }
.au-crumbs a:hover { color: var(--teal-2); }
.au-page-hero--center .au-crumbs { justify-content: center; }

/* ---------- home hero (WebGL; CSS aurora fallback) ---------- */
.au-hero { position: relative; height: 100svh; min-height: 640px; }
.gl-on .au-hero { height: 320vh; min-height: 0; }
@media (max-width: 760px) { .gl-on .au-hero { height: 240vh; } }
.au-hero-sticky { position: sticky; top: 0; height: 100svh; min-height: 640px; overflow: hidden; }
.gl-on .au-hero .au-aurora { display: none; }
.au-hero #gl { position: absolute; inset: 0; width: 100%; height: 100%; display: none; }
.gl-on .au-hero #gl { display: block; }
.au-hero-shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(5, 11, 15, .35) 0%, transparent 30%, transparent 70%, var(--night) 100%); }
.au-stage { position: absolute; inset: 0; display: grid; align-content: center; padding: 90px var(--gut) 60px; pointer-events: none; }
.au-stage > * { pointer-events: auto; }
.au-stage-1 { justify-items: start; }
.gl-on .au-stage-1 { justify-items: center; text-align: center; }
.au-hero-tag { display: inline-flex; align-items: center; gap: 10px; padding: 7px 14px 7px 7px; border-radius: var(--r-pill); font-size: 13px; color: var(--muted); }
.au-hero-tag b { padding: 5px 10px; border-radius: var(--r-pill); background: linear-gradient(100deg, var(--teal-2), var(--sun)); color: var(--night); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
@media (max-width: 480px) { .au-hero-tag .au-tag-long { display: none; } }
.au-glow-h { margin-top: var(--sp-5) !important; max-width: 15ch; font: 600 var(--fs-display)/1 var(--display) !important; letter-spacing: -.05em !important; text-wrap: balance; text-shadow: 0 2px 30px rgba(5, 11, 15, .55); }
.au-glow-h .ch { display: inline-block; will-change: transform, opacity, filter; }
.au-glow-h .w { display: inline-block; white-space: nowrap; }
.au-glow-h .lit, .au-glow-h .lit .w, .au-glow-h .lit .ch { background: linear-gradient(100deg, var(--teal-2), var(--sun) 50%, var(--coral)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.au-glow-h .lit { filter: drop-shadow(0 0 28px rgba(43, 195, 176, .45)); display: inline-block; }
.au-glow-h .lit.swap-ready { transition: opacity .35s, transform .35s var(--ease); }
.au-glow-h .lit.swap { opacity: 0; transform: translateY(.18em); }
.js-anim .au-glow-h { visibility: hidden; }
.au-hero-sub { margin-top: var(--sp-5) !important; max-width: 52ch; color: var(--ink-2); font-size: var(--fs-lede); text-shadow: 0 1px 14px rgba(5, 11, 15, .95), 0 0 2px rgba(5, 11, 15, .8); }
.au-hero-ctas { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-top: var(--sp-6); }
.gl-on .au-hero-ctas { justify-content: center; }
.au-cap { justify-items: center; text-align: center; align-content: end; padding-bottom: clamp(70px, 12vh, 140px); opacity: 0; visibility: hidden; }
.au-cap p { font: 500 13px/1.6 var(--body); letter-spacing: .24em; text-transform: uppercase; color: var(--muted); }
.au-cap h2 { margin-top: 10px !important; max-width: 22ch; font: 600 clamp(26px, 3.4vw, 48px)/1.05 var(--display) !important; letter-spacing: -.035em; text-wrap: balance; text-shadow: 0 2px 30px rgba(5, 11, 15, .55); }
.no-gl .au-cap, .no-gl .au-scroll-hint, .no-gl .au-morph-dots { display: none; }
.au-scroll-hint { position: absolute; left: 50%; bottom: 26px; transform: translateX(-50%); display: grid; justify-items: center; gap: 10px; font: 500 11px/1 var(--body); letter-spacing: .24em; text-transform: uppercase; color: var(--muted); }
.au-scroll-hint i { width: 1px; height: 46px; background: linear-gradient(var(--teal-2), transparent); transform-origin: top; animation: au-hint 2s var(--ease) infinite; }
@keyframes au-hint { 0% { transform: scaleY(0); } 60% { transform: scaleY(1); opacity: 1; } 100% { transform: scaleY(1); opacity: 0; } }
.au-morph-dots { position: absolute; right: var(--gut); top: 50%; transform: translateY(-50%); display: grid; gap: 14px; }
.au-morph-dots span { width: 8px; height: 8px; border-radius: 50%; border: 1px solid rgba(234, 244, 242, .35); transition: background .4s, box-shadow .4s, border-color .4s; }
.au-morph-dots span.on { background: var(--teal-2); border-color: var(--teal-2); box-shadow: 0 0 14px var(--teal-2); }
@media (max-width: 760px) { .au-morph-dots { display: none; } }

/* ---------- marquee strip ---------- */
.au-strip { position: relative; overflow: hidden; padding: 26px 0; border-block: 1px solid var(--line);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.au-strip-track { display: flex; width: max-content; gap: 46px; animation: au-run 36s linear infinite; }
.au-strip:hover .au-strip-track { animation-play-state: paused; }
.au-strip span { display: inline-flex; align-items: center; gap: 14px; font: 600 clamp(22px, 2.6vw, 34px)/1 var(--display); letter-spacing: -.03em; color: rgba(234, 244, 242, .55); white-space: nowrap; }
.au-strip span::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--c, var(--teal-2)); box-shadow: 0 0 16px var(--c, var(--teal-2)); }
@keyframes au-run { to { transform: translateX(-50%); } }

/* ---------- bento service grid (5-up) ---------- */
.au-svc-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px; }
.au-svc-grid > * { grid-column: span 2; min-height: 300px; }
.au-svc-grid > :nth-child(4):nth-last-child(2), .au-svc-grid > :nth-child(5):nth-last-child(1) { grid-column: span 3; }
.au-svc-grid > :nth-child(4):last-child { grid-column: span 6; }
.au-svc-grid > :nth-child(1):nth-last-child(2), .au-svc-grid > :nth-child(2):nth-last-child(1) { grid-column: span 3; }
.au-svc-grid > :only-child { grid-column: span 6; }
@media (max-width: 980px) { .au-svc-grid > *, .au-svc-grid > :nth-child(n) { grid-column: span 3 !important; } .au-svc-grid > :last-child:nth-child(odd) { grid-column: span 6 !important; } }
@media (max-width: 620px) { .au-svc-grid { grid-template-columns: minmax(0, 1fr); } .au-svc-grid > *, .au-svc-grid > :nth-child(n), .au-svc-grid > :last-child:nth-child(odd) { grid-column: 1 / -1 !important; min-height: 0; } }

/* ---------- numbered steps + fly-through ---------- */
.au-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 18px; counter-reset: au-step; }
.au-step { position: relative; border-radius: var(--r-lg); padding: var(--sp-6); background: var(--glass-bg); border: var(--glass-border); }
.au-step__n { font: 600 64px/1 var(--display); letter-spacing: -.05em; background: linear-gradient(180deg, var(--ink), rgba(234, 244, 242, .15)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.au-step__title { margin-top: var(--sp-3) !important; font: 600 var(--fs-h3)/1.15 var(--display) !important; letter-spacing: -.03em; }
.au-step__body { margin-top: 10px !important; color: var(--muted); }
.au-fly { position: relative; }
.au-fly-intro { padding: var(--sec-y) var(--gut) 0; }
.au-fly .au-steps { margin: 0 auto; padding: var(--head-gap) var(--gut) var(--sec-y); max-width: var(--max); }
.au-ring-halo { display: none; }
.fly-on .au-fly-stage { height: calc(var(--n, 4) * 115vh); }
.fly-on .au-fly-sticky { position: sticky; top: 0; height: 100svh; overflow: hidden; perspective: 900px; perspective-origin: 50% 50%; }
.fly-on .au-fly .au-steps { position: absolute; inset: 0; display: block; padding: 0; margin: 0; max-width: none; transform-style: preserve-3d; }
.fly-on .au-fly .au-step { position: absolute; left: 50%; top: 50%; width: min(78vmin, 640px); aspect-ratio: 1; margin: 0; padding: 0; border-radius: 50%; border: 0; background: none;
  display: grid; place-items: center; text-align: center; transform: translate(-50%, -50%); will-change: transform, opacity; }
.fly-on .au-ring-halo { display: block; position: absolute; inset: 0; border-radius: 50%; padding: 2px;
  background: conic-gradient(var(--c0, var(--teal-2)), var(--c1, var(--teal)), transparent 55%, var(--c0, var(--teal-2)));
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2px)); mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2px));
  filter: drop-shadow(0 0 16px var(--c0, var(--teal-2))); will-change: transform; animation: au-spin 8s linear infinite; }
.fly-on .au-ring-halo::after { content: ""; position: absolute; inset: 9%; border-radius: 50%; border: 1px dashed rgba(234, 244, 242, .18); }
.fly-on .au-ring-body { max-width: 30ch; padding: 0 20px; }
.fly-on .au-fly .au-step__n { font-size: clamp(60px, 9vmin, 110px); }
.fly-on .au-fly .au-step__title { font-size: clamp(28px, 4.4vmin, 46px) !important; }
.au-fly-hud { display: none; }
.fly-on .au-fly-hud { display: flex; position: absolute; left: var(--gut); right: var(--gut); bottom: 28px; justify-content: space-between; align-items: center; gap: 20px; z-index: 2; }
.au-fly-hud ol { display: flex; gap: 8px; margin: 0; padding: 0; list-style: none; }
.au-fly-hud li { padding: 8px 14px; border-radius: var(--r-pill); border: 1px solid var(--line); font-size: 12.5px; color: var(--muted); transition: color .3s, background .3s, border-color .3s; }
.au-fly-hud li.on { color: var(--night); background: var(--teal-2); border-color: var(--teal-2); }
.au-fly-hud .meter { flex: 1; max-width: 280px; height: 2px; background: var(--line); border-radius: 2px; overflow: hidden; }
.au-fly-hud .meter i { display: block; height: 100%; background: linear-gradient(90deg, var(--teal-2), var(--sun), var(--coral)); transform-origin: 0 50%; transform: scaleX(0); }
.au-fly-stars { display: none; }
.fly-on .au-fly-stars { display: block; position: absolute; inset: -20%; background-image: radial-gradient(rgba(255,255,255,.7) 1px, transparent 1.5px), radial-gradient(rgba(43,195,176,.7) 1px, transparent 1.5px);
  background-size: 90px 90px, 140px 140px; background-position: 0 0, 40px 60px; opacity: .3; }
@media (max-width: 640px) { .au-fly-hud ol { display: none; } .au-fly-hud .meter { max-width: none; } }

/* ---------- vertical timeline ---------- */
.au-timeline { list-style: none; margin: 0; padding: 0 0 0 34px; position: relative; display: grid; gap: var(--sp-5); }
.au-timeline::before { content: ""; position: absolute; left: 11px; top: 6px; bottom: 6px; width: 2px; background: linear-gradient(var(--teal-2), var(--sun), var(--coral)); opacity: .5; border-radius: 2px; }
.au-timeline li { position: relative; }
.au-timeline li::before { content: ""; position: absolute; left: -29px; top: 26px; width: 14px; height: 14px; border-radius: 50%; background: var(--night); border: 2px solid var(--teal-2); box-shadow: 0 0 14px var(--teal-2); }

/* ---------- products / media tiles ---------- */
.au-prods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.au-prods > :only-child { grid-column: 1 / -1; }
@media (max-width: 860px) { .au-prods { grid-template-columns: 1fr; } }
.au-prod { border-radius: var(--r-lg); overflow: hidden; display: flex; flex-direction: column; background: var(--glass-bg); border: var(--glass-border); color: var(--ink); }
.au-prod__stage { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: radial-gradient(80% 70% at 50% 40%, var(--g, rgba(43, 195, 176, .28)), transparent 70%), var(--night-2); }
.au-prod__stage img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1s var(--ease); }
.au-prod:hover .au-prod__stage img { transform: scale(1.05); }
.au-prod__tag { position: absolute; left: var(--sp-5); top: var(--sp-5); z-index: 1; padding: 7px 12px; border-radius: var(--r-pill); font-size: 12px; color: var(--ink); background: rgba(5, 11, 15, .55); border: var(--glass-border); -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
.au-prod__b { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--sp-4); padding: var(--sp-5) var(--sp-6) var(--sp-6); border-top: var(--glass-border); margin-top: auto; }
.au-prod__b h3 { font: 600 var(--fs-h3)/1.1 var(--display); letter-spacing: -.035em; }
.au-prod__b p { margin-top: var(--sp-2) !important; color: var(--muted); font-size: var(--fs-body); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.au-media { position: relative; border-radius: var(--r-lg); overflow: hidden; border: var(--glass-border); background: var(--night-2); }
.au-media img, .au-media iframe, .au-media video { display: block; width: 100%; height: 100%; object-fit: cover; border: 0; }
.au-media--16x9 { aspect-ratio: 16 / 9; } .au-media--4x3 { aspect-ratio: 4 / 3; } .au-media--1x1 { aspect-ratio: 1; }
.au-media::after { content: ""; position: absolute; inset: 0; pointer-events: none; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06); border-radius: inherit; }
.au-float { animation: au-bob 6s ease-in-out infinite; }
@keyframes au-bob { 50% { transform: translateY(-14px); } }

/* ---------- packages promo + counters ---------- */
.au-pack { position: relative; border-radius: var(--r-lg); padding: clamp(var(--sp-6), 5vw, var(--sp-8)); overflow: hidden; isolation: isolate; background: var(--glass-bg); border: var(--glass-border); }
.au-pack::before { content: ""; position: absolute; inset: -40%; z-index: -1; background: conic-gradient(rgba(43, 195, 176, .22), rgba(253, 220, 122, .14), rgba(242, 111, 85, .2), rgba(43, 195, 176, .22)); filter: blur(60px); will-change: transform; animation: au-spin 18s linear infinite; }
.au-pack-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; flex-wrap: wrap; }
.au-pack-top .au-h2 { font-size: var(--fs-h2-sm) !important; max-width: 18ch; }
.au-pack-top p { margin-top: 16px !important; color: var(--ink-2); max-width: 50ch; }
.au-counters { display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: var(--sp-4); margin-top: var(--sp-7); }
.au-counter { border-radius: var(--r-md); padding: var(--sp-5); background: rgba(5, 11, 15, .45); border: var(--glass-border); }
.au-counter .n { display: block; font: 600 clamp(36px, calc(16vw / var(--cols, 3)), 88px)/1 var(--display); white-space: nowrap; letter-spacing: -.05em; color: var(--ink); text-shadow: 0 0 24px rgba(43, 195, 176, .8), 0 0 60px rgba(43, 195, 176, .45); font-variant-numeric: tabular-nums; }
.au-counter:nth-child(3n+2) .n { text-shadow: 0 0 24px rgba(253, 220, 122, .8), 0 0 60px rgba(253, 220, 122, .4); }
.au-counter:nth-child(3n+3) .n { text-shadow: 0 0 24px rgba(242, 111, 85, .8), 0 0 60px rgba(242, 111, 85, .4); }
.au-counter .l { display: block; margin-top: var(--sp-3); color: var(--muted); font-size: var(--fs-body); }
@media (max-width: 1080px) { .au-counters { grid-template-columns: repeat(2, minmax(0, 1fr)); --cols: 2; } }
@media (max-width: 560px) { .au-counters { grid-template-columns: 1fr; --cols: 1; } }
.au-pills { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.au-pills span { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: var(--r-pill); border: 1px solid var(--line); background: rgba(255, 255, 255, .05); font-size: 14px; }
.au-pills span i { color: var(--teal-2); }

/* ---------- quotes ---------- */
.au-quotes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.au-quotes > :only-child { grid-column: 1 / -1; }
@media (max-width: 860px) { .au-quotes { grid-template-columns: 1fr; } }
.au-quote { border-radius: var(--r-lg); padding: clamp(var(--sp-5), 3.4vw, var(--sp-7)); margin: 0; background: var(--glass-bg); border: var(--glass-border); display: flex; flex-direction: column; }
.au-quote blockquote { margin: var(--sp-4) 0 0; font: 500 clamp(19px, 1.8vw, 25px)/1.45 var(--display); letter-spacing: -.02em; color: var(--ink); }
.au-quote blockquote::before { content: "\201C"; display: block; font-size: 64px; line-height: .6; height: 26px; color: var(--teal-2); text-shadow: 0 0 24px rgba(43, 195, 176, .6); }
.au-quote figcaption { display: flex; align-items: center; gap: 12px; margin-top: auto; padding-top: 26px; }
.au-quote .av { width: 48px; height: 48px; flex: none; border-radius: 50%; display: grid; place-items: center; overflow: hidden; font: 600 18px/1 var(--display); color: var(--night); background: linear-gradient(135deg, var(--teal-2), var(--sun)); }
.au-quote:nth-child(even) .av { background: linear-gradient(135deg, var(--coral), var(--sun)); }
.au-quote .av img { width: 100%; height: 100%; object-fit: cover; }
.au-quote figcaption b { display: block; font-weight: 600; }
.au-quote figcaption small { color: var(--muted); font-size: 13px; }
.au-stars { display: inline-flex; gap: 2px; color: var(--sun); font-size: 15px; }
.au-stars .off { color: rgba(234, 244, 242, .2); }

/* ---------- CTA band ---------- */
.au-cta { text-align: center; overflow: hidden; isolation: isolate; }
.au-cta-glow { position: absolute; left: 50%; top: 50%; z-index: -1; width: min(1000px, 140vw); aspect-ratio: 2 / 1; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(closest-side, rgba(43, 195, 176, .3), rgba(242, 111, 85, .12) 55%, transparent); filter: blur(30px); pointer-events: none; }
.au-cta .au-h2 { font-size: clamp(40px, 6.4vw, 96px) !important; line-height: .98; margin-left: auto; margin-right: auto; max-width: 18ch; }
.au-cta .au-lede { margin-left: auto; margin-right: auto; }
.au-cta-row { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: var(--sp-6); margin-top: var(--sp-7); }
.au-orbit-btn { position: relative; display: inline-grid; place-items: center; width: 200px; height: 200px; border-radius: 50%; isolation: isolate; }
.au-orbit-btn .core { position: relative; z-index: 2; display: grid; place-items: center; align-content: center; gap: 6px; width: 150px; height: 150px; padding: 18px; border-radius: 50%; text-align: center;
  background: radial-gradient(circle at 35% 30%, #3FE0CC, var(--teal) 70%); color: var(--night); font: 600 15px/1.2 var(--display); box-shadow: 0 0 60px -6px rgba(43, 195, 176, .9), inset 0 0 20px rgba(255, 255, 255, .25); transition: transform .5s var(--spring); }
.au-orbit-btn .core i { font-size: 24px; }
.au-orbit-btn:hover .core { transform: scale(1.06); }
.au-orbit-btn .orb { position: absolute; inset: 0; border-radius: 50%; border: 1px solid rgba(234, 244, 242, .16); animation: au-spin 7s linear infinite; }
.au-orbit-btn .orb::before { content: ""; position: absolute; left: 50%; top: -5px; width: 10px; height: 10px; margin-left: -5px; border-radius: 50%; background: var(--sun); box-shadow: 0 0 16px 4px rgba(253, 220, 122, .8); }
.au-orbit-btn .orb.o2 { inset: -18px; animation-duration: 11s; animation-direction: reverse; border-style: dashed; }
.au-orbit-btn .orb.o2::before { background: var(--coral); box-shadow: 0 0 16px 4px rgba(242, 111, 85, .8); }
@keyframes au-spin { to { transform: rotate(360deg); } }
.au-cta-alt { display: grid; gap: 12px; }

/* ---------- lists ---------- */
.au-checks { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.au-checks li { position: relative; padding-left: 32px; color: var(--ink-2); }
.au-checks li::before { content: "\2713"; position: absolute; left: 0; top: 0; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: 13px; font-weight: 700; line-height: 1; color: var(--night); background: var(--teal-2); }
.au-dl { display: grid; gap: 0; margin: 0; }
.au-dl > div { display: flex; justify-content: space-between; gap: var(--sp-4); padding: 14px 0; border-bottom: 1px solid var(--line); }
.au-dl > div:last-child { border-bottom: 0; }
.au-dl dt { color: var(--muted); font-size: var(--fs-small); display: inline-flex; align-items: center; gap: 8px; }
.au-dl dt i { color: var(--teal-2); font-size: 17px; }
.au-dl dd { margin: 0; font-weight: 600; text-align: right; }
.au-info { display: grid; gap: var(--sp-4); }
.au-info-item { display: flex; gap: var(--sp-4); align-items: center; }
.au-info-item .au-card__icon { box-shadow: 0 0 22px -10px var(--c, var(--teal-2)); }
.au-info-item .au-card__icon { width: 48px; height: 48px; font-size: 21px; border-radius: 14px; }
.au-info-item small { display: block; color: var(--muted); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.au-info-item > div > a, .au-info-item > div > span, .au-info-item address { display: block; margin-top: 4px; font-style: normal; color: var(--ink); font-weight: 500; overflow-wrap: anywhere; }
.au-info-item a:hover { color: var(--teal-2); }

/* ---------- forms ---------- */
.au-form { display: grid; gap: var(--sp-5); }
.au-form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-5); }
@media (max-width: 680px) { .au-form-row { grid-template-columns: 1fr; } }
.au-field { display: grid; gap: 8px; min-width: 0; }
.au-label { font: 600 13px/1.3 var(--body); letter-spacing: .02em; color: var(--ink-2); }
.au-label .req { color: var(--coral); margin-left: 2px; }
.au input[type="text"], .au input[type="email"], .au input[type="tel"], .au input[type="url"], .au input[type="number"], .au input[type="password"], .au input[type="search"], .au input[type="date"],
.au select, .au textarea, .au-input {
  width: 100%; min-height: 52px; padding: 13px 16px; border-radius: 14px; border: 1px solid var(--line-2); background: rgba(255, 255, 255, .04); color: var(--ink);
  font: 400 15px/1.4 var(--body); transition: border-color .3s, background .3s, box-shadow .3s; -webkit-appearance: none; appearance: none; }
.au textarea { min-height: 150px; resize: vertical; }
.au select { padding-right: 44px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23A4B7B4' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; }
.au select option { background: var(--night-2); color: var(--ink); }
.au input::placeholder, .au textarea::placeholder { color: rgba(164, 183, 180, .6); }
.au input:focus, .au select:focus, .au textarea:focus { outline: 0; border-color: var(--teal-2); background: rgba(43, 195, 176, .06); box-shadow: 0 0 0 4px rgba(43, 195, 176, .15); }
.au-field.has-error input, .au-field.has-error select, .au-field.has-error textarea, .au .is-invalid { border-color: var(--danger) !important; box-shadow: 0 0 0 4px rgba(255, 122, 107, .12); }
.au-help { font-size: 12.5px; color: var(--muted); }
.au-errors, .au .errorlist { margin: 0; padding: 0; list-style: none; color: var(--danger); font-size: 13px; }
.au input[type="file"] { width: 100%; padding: 14px; border-radius: 14px; border: 1px dashed var(--line-2); background: rgba(255, 255, 255, .03); color: var(--muted); font: 400 14px var(--body); cursor: pointer; }
.au input[type="file"]::file-selector-button { margin-right: 14px; padding: 9px 16px; border: 0; border-radius: var(--r-pill); background: var(--teal-2); color: var(--night); font: 600 13px var(--body); cursor: pointer; }
.au input[type="checkbox"], .au input[type="radio"] { width: 20px; height: 20px; flex: none; margin: 0; accent-color: var(--teal-2); cursor: pointer; }
.au-check { display: flex; align-items: flex-start; gap: 12px; color: var(--ink-2); font-size: 14.5px; cursor: pointer; }
.au-check input { margin-top: 2px !important; }
.au-checkgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: 10px; }
.au-option { position: relative; display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 14px; border: 1px solid var(--line); background: rgba(255, 255, 255, .03); cursor: pointer; transition: border-color .3s, background .3s; }
.au-option:hover { border-color: var(--line-2); }
.au-option:has(input:checked) { border-color: var(--teal-2); background: rgba(43, 195, 176, .08); }
.au-option:has(input:disabled) { opacity: .75; cursor: default; }
.au-option__body { flex: 1; min-width: 0; }
.au-option__title { display: block; font-weight: 600; color: var(--ink); }
.au-option__sub { display: block; font-size: 12.5px; color: var(--muted); }
.au-option__price { font: 600 14px var(--display); color: var(--sun); white-space: nowrap; }
.au input[type="range"] { width: 100%; accent-color: var(--teal-2); }
.au-turnstile, .au .cf-turnstile { min-height: 65px; }
.au .captcha { border-radius: 10px; background: #fff; padding: 4px; }
.au-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }

/* ---------- tables ---------- */
.au-table-wrap { overflow-x: auto; border-radius: var(--r-md); border: var(--glass-border); }
.au-table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.au-table th, .au-table td { padding: 14px 18px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: top; }
.au-table th { font: 600 12px/1.3 var(--body); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); background: rgba(255, 255, 255, .03); }
.au-table tr:last-child td { border-bottom: 0; }

/* ---------- pagination ---------- */
.au-pagination { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; margin-top: var(--sp-7); }
.au-pagination a, .au-pagination span { min-width: 46px; height: 46px; padding: 0 14px; display: inline-grid; place-items: center; border-radius: var(--r-pill); border: 1px solid var(--line); font-weight: 600; font-size: 14px; color: var(--ink); transition: background .3s, border-color .3s; }
.au-pagination a:hover { border-color: var(--teal-2); }
.au-pagination .is-current { background: var(--teal-2); border-color: var(--teal-2); color: var(--night); }
.au-pagination .is-gap { border: 0; min-width: 20px; color: var(--muted); }

/* ---------- tabs ---------- */
.au-tabs { display: flex; flex-wrap: nowrap; scrollbar-width: none; -webkit-overflow-scrolling: touch; gap: 6px; padding: 5px; border-radius: var(--r-pill); border: 1px solid var(--line); background: rgba(255, 255, 255, .03); width: fit-content; max-width: 100%; overflow-x: auto; }
.au-tab { padding: 10px 18px; border-radius: var(--r-pill); border: 0; background: none; color: var(--muted); font: 600 14px var(--body); cursor: pointer; white-space: nowrap; transition: background .3s, color .3s; }
.au-tab:hover { color: var(--ink); }
.au-tab[aria-selected="true"] { background: var(--teal-2); color: var(--night); }
.au-tabpanel { margin-top: var(--sp-6); }
.au-tabpanel[hidden] { display: none; }

/* ---------- accordion / FAQ (details/summary, no JS needed) ---------- */
.au-faq { display: grid; gap: 12px; }
.au-faq details { border-radius: var(--r-md); border: var(--glass-border); background: var(--glass-bg); overflow: hidden; transition: border-color .3s; }
.au-faq details[open] { border-color: rgba(43, 195, 176, .45); }
.au-faq summary { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4); padding: 20px 22px; cursor: pointer; list-style: none; font: 600 17px/1.4 var(--display); letter-spacing: -.01em; color: var(--ink); }
.au-faq summary::-webkit-details-marker { display: none; }
.au-faq summary::after { content: "+"; flex: none; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--line); font: 400 20px/1 var(--body); color: var(--teal-2); transition: transform .4s var(--spring), background .3s; }
.au-faq details[open] summary::after { transform: rotate(45deg); background: rgba(43, 195, 176, .12); }
.au-faq .au-faq__a { padding: 0 22px 22px; color: var(--muted); line-height: 1.7; }

/* ---------- alerts + messages ---------- */
.au-alert { display: flex; align-items: flex-start; gap: 12px; padding: 16px 18px; border-radius: var(--r-md); border: 1px solid var(--line); background: rgba(255, 255, 255, .05); color: var(--ink); font-size: 14.5px; }
.au-alert i { font-size: 20px; flex: none; }
.au-alert--success { border-color: rgba(59, 212, 122, .45); background: rgba(59, 212, 122, .08); } .au-alert--success i { color: var(--success); }
.au-alert--error, .au-alert--danger { border-color: rgba(255, 122, 107, .5); background: rgba(255, 122, 107, .08); } .au-alert--error i, .au-alert--danger i { color: var(--danger); }
.au-alert--warning { border-color: rgba(253, 220, 122, .5); background: rgba(253, 220, 122, .08); } .au-alert--warning i { color: var(--sun); }
.au-alert--info { border-color: rgba(43, 195, 176, .45); background: rgba(43, 195, 176, .08); } .au-alert--info i { color: var(--teal-2); }
.au-messages { position: fixed; z-index: 400; top: 90px; right: 16px; left: 16px; display: grid; justify-items: end; gap: 10px; pointer-events: none; }
.au-messages .au-alert { pointer-events: auto; max-width: 440px; background: rgba(8, 20, 26, .94); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: var(--shadow); transition: opacity .4s, transform .4s var(--ease); }
.au-messages .au-alert.is-out { opacity: 0; transform: translateX(30px); }
.au-alert__close { margin-left: auto; background: none; border: 0; color: var(--muted); cursor: pointer; font-size: 18px; padding: 0; }

/* ---------- prose (rich text: blog, legal, descriptions) ---------- */
.au-prose { color: var(--ink-2); font-size: 16.5px; line-height: 1.8; overflow-wrap: break-word; }
.au-prose > * + * { margin-top: 1.05em; }
.au-prose h1, .au-prose h2, .au-prose h3, .au-prose h4 { color: var(--ink); font-family: var(--display); letter-spacing: -.025em; line-height: 1.2; }
.au-prose h1 { font-size: 34px; } .au-prose h2 { font-size: 28px; margin-top: 1.9em; } .au-prose h3 { font-size: 21px; margin-top: 1.6em; } .au-prose h4 { font-size: 18px; margin-top: 1.4em; }
.au-prose p, .au-prose ul, .au-prose ol, .au-prose blockquote, .au-prose pre, .au-prose table, .au-prose figure { margin-bottom: 0; }
.au-prose a { color: var(--teal-2); text-decoration: underline; text-decoration-color: rgba(43, 195, 176, .4); text-underline-offset: 3px; }
.au-prose a:hover { color: var(--sun); }
.au-prose strong, .au-prose b { color: var(--ink); }
.au-prose ul, .au-prose ol { padding-left: 1.3em; }
.au-prose li + li { margin-top: .45em; }
.au-prose li::marker { color: var(--teal-2); }
.au-prose blockquote { margin-left: 0; margin-right: 0; padding: 18px 22px; border-left: 3px solid var(--teal-2); border-radius: 0 var(--r-md) var(--r-md) 0; background: rgba(43, 195, 176, .06); color: var(--ink); font-style: italic; }
.au-prose img { border-radius: var(--r-md); height: auto; }
.au-prose code { padding: 2px 7px; border-radius: 6px; background: rgba(255, 255, 255, .08); font-size: .9em; }
.au-prose pre { padding: 18px; border-radius: var(--r-md); background: #03080B; border: 1px solid var(--line); overflow-x: auto; font-size: 14px; line-height: 1.6; }
.au-prose pre code { padding: 0; background: none; }
.au-prose table { width: 100%; border-collapse: collapse; font-size: 15px; display: block; overflow-x: auto; }
.au-prose th, .au-prose td { padding: 10px 14px; border: 1px solid var(--line); text-align: left; }
.au-prose hr { border: 0; height: 1px; background: var(--line); margin: 2em 0; }
.au-prose iframe { max-width: 100%; border-radius: var(--r-md); }

/* ---------- empty state ---------- */
.au-empty { display: grid; justify-items: center; gap: var(--sp-3); padding: clamp(40px, 6vw, 72px) var(--sp-5); text-align: center; border-radius: var(--r-lg); border: 1px dashed var(--line-2); background: rgba(255, 255, 255, .02); color: var(--muted); }
.au-empty i { font-size: 38px; color: var(--teal-2); opacity: .8; }
.au-empty h3 { font: 600 20px/1.3 var(--display); color: var(--ink); }

/* ---------- filter / search bar ---------- */
.au-filters { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-4); margin-bottom: var(--sp-7); }
.au-search { position: relative; display: flex; align-items: center; min-width: min(100%, 320px); }
.au-search i { position: absolute; left: 16px; color: var(--muted); font-size: 18px; pointer-events: none; }
.au .au-search input { padding-left: 46px; border-radius: var(--r-pill); }

/* ---------- share + icon buttons ---------- */
.au-icon-btn { width: 44px; height: 44px; border-radius: 50%; display: inline-grid; place-items: center; border: 1px solid var(--line); background: var(--glass); color: var(--ink); font-size: 18px; cursor: pointer; transition: background .3s, color .3s, transform .5s var(--spring); }
.au-icon-btn:hover { background: var(--teal-2); color: var(--night); transform: translateY(-3px); }

/* ---------- modal (<dialog class="au-modal">) ---------- */
.au-modal { width: min(520px, calc(100vw - 32px)); padding: 0; border: var(--glass-border); border-radius: var(--r-lg); background: var(--night-2); color: var(--ink); box-shadow: var(--shadow); }
.au-modal::backdrop { background: rgba(2, 6, 8, .7); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.au-modal__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 20px 22px; border-bottom: 1px solid var(--line); }
.au-modal__body { padding: 22px; }

/* ---------- stats ---------- */
.au-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: var(--sp-4); }
.au-stat { border-radius: var(--r-md); padding: var(--sp-5); background: var(--glass-bg); border: var(--glass-border); }
.au-stat .n { display: block; font: 600 clamp(34px, 4vw, 56px)/1 var(--display); letter-spacing: -.04em; color: var(--ink); text-shadow: 0 0 24px rgba(43, 195, 176, .6); }
.au-stat .l { display: block; margin-top: 8px; color: var(--muted); font-size: 14px; }

/* ---------- footer ---------- */
.au-foot { position: relative; padding: var(--sp-8) var(--gut) 0; border-top: var(--glass-border); overflow: hidden; font-family: var(--body); }
.au-foot::before { content: ""; position: absolute; left: 50%; bottom: -40%; width: 120%; height: 80%; transform: translateX(-50%); background: radial-gradient(closest-side, rgba(43, 195, 176, .18), transparent); pointer-events: none; }
.au-foot-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-5); padding-bottom: var(--sp-7); margin-bottom: var(--sp-7); border-bottom: 1px solid var(--line); }
.au-foot-cta h2 { font: 600 clamp(28px, 3.6vw, 48px)/1.05 var(--display) !important; letter-spacing: -.04em; max-width: 20ch; }
.au-foot-grid { position: relative; display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.3fr; gap: 36px; }
.au-foot-grid h4 { margin-bottom: var(--sp-4) !important; font: 600 var(--fs-label)/1 var(--body) !important; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
.au-foot-grid ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.au-foot-grid a { color: rgba(234, 244, 242, .85); transition: color .3s; }
.au-foot-grid a:hover { color: var(--teal-2); }
.au-foot-grid address { font-style: normal; color: rgba(234, 244, 242, .85); }
.au-foot-about img { height: 34px; width: auto; }
.au-foot-about p { margin-top: 18px !important; color: var(--muted); max-width: 38ch; }
.au-foot-about .tag { display: block; margin-top: 18px; font: 600 clamp(26px, 2.6vw, 38px)/1.05 var(--display); letter-spacing: -.035em; text-wrap: balance;
  background: linear-gradient(100deg, var(--teal-2), var(--sun) 55%, var(--coral)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.au-social { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.au-social a { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--line); font-size: 18px; transition: background .3s, color .3s, transform .5s var(--spring); }
.au-social a:hover { background: var(--teal-2); color: var(--night); transform: translateY(-4px); }
.au-foot-word { margin-top: clamp(40px, 6vw, 80px); text-align: center; font: 700 clamp(84px, 21vw, 320px)/.78 var(--display); letter-spacing: -.07em; user-select: none;
  background: linear-gradient(180deg, rgba(234, 244, 242, .16), rgba(234, 244, 242, 0) 85%); -webkit-background-clip: text; background-clip: text; color: transparent; text-transform: lowercase; }
.au-foot-bot { position: relative; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 24px; padding: 20px 0 calc(22px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--line); font-size: 13px; color: var(--muted); }
.au-foot-bot nav { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.au-foot-bot a:hover { color: var(--ink); }
@media (max-width: 940px) { .au-foot-grid { grid-template-columns: 1fr 1fr; } .au-foot-about { grid-column: 1 / -1; } }
@media (max-width: 520px) { .au-foot-grid { grid-template-columns: 1fr; } }

/* ---------- floating WhatsApp + back-to-top ---------- */
.au-wa-float { position: fixed; right: 20px; bottom: 20px; z-index: 90; width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center; background: #25D366; color: #fff; box-shadow: 0 12px 34px -8px rgba(37, 211, 102, .7); transition: transform .5s var(--spring); }
.au-wa-float:hover { transform: scale(1.08); color: #fff; }
.au-wa-float svg { width: 30px; height: 30px; fill: #fff; }
.au-wa-float::after { content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 2px solid rgba(37, 211, 102, .4); animation: au-ring 2.2s infinite; pointer-events: none; }
@keyframes au-ring { from { transform: scale(1); opacity: 1; } to { transform: scale(1.4); opacity: 0; } }
.au-top { position: fixed; right: 24px; bottom: 92px; z-index: 89; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--line); background: rgba(8, 20, 26, .85);
  color: var(--ink); font-size: 20px; cursor: pointer; opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .4s, transform .4s var(--ease), visibility 0s .4s; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.au-top.show { opacity: 1; visibility: visible; transform: none; transition: opacity .4s, transform .4s var(--ease); }
.au-top:hover { border-color: var(--teal-2); color: var(--teal-2); }
@media (max-width: 680px) { .au-wa-float { width: 52px; height: 52px; right: 16px; bottom: 16px; } .au-top { right: 19px; bottom: 80px; } }

/* ---------- cookie consent ---------- */
.au-cookie { position: fixed; z-index: 500; left: 16px; right: 16px; bottom: 16px; display: flex; justify-content: flex-start; pointer-events: none; }
.au-cookie__card { pointer-events: auto; width: min(460px, 100%); max-height: calc(100vh - 32px); overflow-y: auto; padding: 22px; border-radius: var(--r-lg); border: var(--glass-border); background: rgba(8, 20, 26, .96);
  -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); box-shadow: var(--shadow); opacity: 0; transform: translateY(20px); transition: opacity .4s, transform .5s var(--ease); }
.au-cookie.show .au-cookie__card { opacity: 1; transform: none; }
.au-cookie[hidden] { display: none; }
.au-cookie__title { display: flex; align-items: center; gap: 10px; font: 600 18px/1.3 var(--display); }
.au-cookie__title i { color: var(--teal-2); font-size: 22px; }
.au-cookie__text { margin-top: 10px !important; color: var(--muted); font-size: 14px; line-height: 1.6; }
.au-cookie__text a { color: var(--teal-2); text-decoration: underline; }
.au-cookie__cats { display: grid; gap: 10px; margin-top: 16px; }
.au-cookie__cats[hidden] { display: none; }
.au-cookie__cat { display: flex; gap: 12px; align-items: flex-start; padding: 12px; border-radius: 12px; border: 1px solid var(--line); }
.au-cookie__cat b { display: block; font-size: 14px; }
.au-cookie__cat small { display: block; color: var(--muted); font-size: 12.5px; margin-top: 2px; }
.au-cookie__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.au-cookie__actions .au-btn { min-height: 42px; padding: 0 16px; font-size: 13.5px; flex: 1 1 auto; }

/* ---------- seasonal greeting overlay ---------- */
.au-xmas { position: fixed; inset: 0; z-index: 600; display: grid; place-items: center; padding: var(--gut); text-align: center; background: radial-gradient(80% 60% at 50% 30%, rgba(43, 195, 176, .28), transparent 60%), radial-gradient(60% 50% at 50% 100%, rgba(242, 111, 85, .25), transparent 60%), rgba(5, 11, 15, .97);
  transition: opacity .8s; }
.au-xmas[hidden] { display: none; }
.au-xmas.out { opacity: 0; pointer-events: none; }
.au-xmas h2 { font: 600 clamp(44px, 8vw, 110px)/1 var(--display) !important; letter-spacing: -.05em; }
.au-xmas p { margin-top: 16px !important; color: var(--ink-2); font-size: var(--fs-lede); }
.au-xmas .au-btn { margin-top: 32px; }
.au-snow { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.au-snow i { position: absolute; top: -10px; width: 4px; height: 4px; border-radius: 50%; background: #fff; box-shadow: 0 0 8px #fff; opacity: .7; animation: au-fall linear infinite; }
@keyframes au-fall { to { transform: translate3d(30px, 105vh, 0); } }

/* ---------- reduced motion: keep everything visible ---------- */
@media (prefers-reduced-motion: reduce) {
  .au *, .au *::before, .au *::after { animation: none !important; transition-duration: .01ms !important; }
  .js-anim .au-glow-h { visibility: visible; }
}

.au-tabs::-webkit-scrollbar { display: none; }
.au-tabs > * { flex: none; white-space: nowrap; }

/* compact media cards (services, products, projects, blog, resources, courses) */
.au-card--flush .au-card__media { aspect-ratio: 16 / 9; }
.au-card--flush .au-card__content { padding: var(--sp-4) var(--sp-5) var(--sp-5); }
.au-card--flush .au-card__title { margin-top: var(--sp-3) !important; font-size: clamp(17px, 1.25vw, 20px) !important; line-height: 1.25 !important; }
.au-card--flush .au-card__body { font-size: var(--fs-small); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.au-card:not(.au-card--flush) { padding: var(--sp-5); }
.au-card:not(.au-card--flush) .au-card__title { margin-top: var(--sp-4) !important; }

/* keep the bottom links clear of the floating WhatsApp / back-to-top buttons */
.au-foot-bot { padding-right: 84px; }
@media (max-width: 680px) { .au-foot-bot { padding-right: 0; padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); } }

/* ---------- product cards: compact, 3 across ---------- */
.au-prods { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-5); }
.au-prods > :only-child { grid-column: auto; }
@media (max-width: 1080px) { .au-prods { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .au-prods { grid-template-columns: 1fr; } }
.au-prod__stage { aspect-ratio: 16 / 9; }
.au-prod__tag { left: var(--sp-4); top: var(--sp-4); padding: 5px 10px; font-size: 11px; }
.au-prod__b { padding: var(--sp-4) var(--sp-5) var(--sp-5); }
.au-prod__b h3 { font-size: clamp(17px, 1.25vw, 20px); line-height: 1.25; }
.au-prod__b p { font-size: var(--fs-small); }
.au-prod__b .au-go { width: 38px; height: 38px; flex: none; }

/* ---------- counters: number always fits its box ---------- */
.au-counter { container-type: inline-size; min-width: 0; }
.au-counter .n { font-size: clamp(26px, 19cqi, 72px); }

/* ---------- ambient aurora behind every page (cheap CSS, visible even with reduced motion) ---------- */
body.au::before { content: ""; position: fixed; inset: -20vh -20vw; z-index: -1; pointer-events: none;
  background:
    radial-gradient(38vw 26vh at 18% 22%, rgba(43, 195, 176, .2), transparent 70%),
    radial-gradient(34vw 24vh at 82% 38%, rgba(242, 111, 85, .10), transparent 70%),
    radial-gradient(42vw 28vh at 50% 82%, rgba(253, 220, 122, .07), transparent 70%),
    radial-gradient(30vw 22vh at 70% 70%, rgba(1, 123, 110, .14), transparent 70%);
  filter: blur(20px); animation: au-ambient 38s ease-in-out infinite alternate; }
@keyframes au-ambient {
  0% { transform: translate3d(0, 0, 0) rotate(0deg); }
  50% { transform: translate3d(4vw, -3vh, 0) rotate(4deg); }
  100% { transform: translate3d(-3vw, 4vh, 0) rotate(-3deg); }
}
@media (prefers-reduced-motion: reduce) { body.au::before { animation: none; } }

html { background: var(--night); }

/* ======================= "How we work" timeline (templates/aurora/process.html) ======================= */
.au-proc__list { --p: 1; position: relative; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: var(--sp-5); }
.au-proc__rail { position: absolute; left: calc(100% / var(--n, 4) / 2); right: calc(100% / var(--n, 4) / 2); top: 35px; height: 2px; border-radius: 2px; background: var(--line); pointer-events: none; }
.au-proc__rail i { position: absolute; inset: 0; border-radius: inherit; transform-origin: 0 50%; transform: scaleX(var(--p));
  background: linear-gradient(90deg, var(--teal-2), var(--sun), var(--coral)); box-shadow: 0 0 18px rgba(43, 195, 176, .6), 0 0 36px rgba(242, 111, 85, .25); }
.au-proc__step { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; }
.au-proc__node { position: relative; z-index: 1; width: 72px; height: 72px; border-radius: 50%; display: grid; place-items: center; font-size: 26px; color: var(--ink);
  background: radial-gradient(circle at 35% 30%, rgba(255, 255, 255, .14), rgba(5, 11, 15, .92) 70%); border: 1px solid var(--line);
  transition: transform .7s var(--spring), box-shadow .6s, border-color .6s, color .6s; }
.au-proc__node b { font: 600 22px/1 var(--display); }
.au-proc__node::before { content: ""; position: absolute; inset: -5px; border-radius: 50%; padding: 2px; opacity: .25; transition: opacity .6s;
  background: conic-gradient(from var(--ang), var(--c), transparent 40%, var(--c) 70%, transparent);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  animation: au-spin-ang 7s linear infinite; }
.au-proc__step.is-on .au-proc__node { transform: scale(1.08); color: var(--c); border-color: transparent; box-shadow: 0 0 0 6px rgba(5, 11, 15, .9), 0 0 38px -4px var(--c); }
.au-proc__step.is-on .au-proc__node::before { opacity: 1; }
.au-proc__card { position: relative; width: 100%; margin-top: var(--sp-5); padding: var(--sp-5); border-radius: var(--r-lg); background: var(--glass-bg); border: var(--glass-border); overflow: hidden; isolation: isolate;
  transition: transform .7s var(--spring), border-color .6s, opacity .6s; opacity: .55; }
.au-proc__card::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0; transition: opacity .8s;
  background: radial-gradient(120% 80% at 50% 0%, color-mix(in srgb, var(--c) 22%, transparent), transparent 70%); }
.au-proc__step.is-on .au-proc__card { opacity: 1; transform: translateY(-4px); border-color: color-mix(in srgb, var(--c) 45%, transparent); }
.au-proc__step.is-on .au-proc__card::before { opacity: 1; }
.au-proc__n { display: block; font: 600 var(--fs-label)/1 var(--body); letter-spacing: .2em; color: var(--c); }
.au-proc__title { margin-top: var(--sp-3) !important; font: 600 clamp(18px, 1.4vw, 22px)/1.2 var(--display) !important; letter-spacing: -.03em; }
.au-proc__body { margin-top: var(--sp-3) !important; color: var(--muted); font-size: var(--fs-small); line-height: 1.6; }
.au-proc__tags { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: var(--sp-4); }
.au-proc__tags span { padding: 4px 10px; border-radius: var(--r-pill); font-size: 11.5px; color: var(--ink-2); border: 1px solid var(--line); }
@media (max-width: 900px) {
  .au-proc__list { grid-template-columns: 1fr; gap: var(--sp-4); }
  .au-proc__rail { left: 35px; right: auto; top: 36px; bottom: 36px; width: 2px; height: auto; }
  .au-proc__rail i { transform-origin: 50% 0; transform: scaleY(var(--p)); }
  .au-proc__step { flex-direction: row; align-items: flex-start; text-align: left; gap: var(--sp-4); }
  .au-proc__node { flex: none; width: 72px; height: 72px; }
  .au-proc__card { margin-top: 0; }
  .au-proc__tags { justify-content: flex-start; }
}
@media (prefers-reduced-motion: reduce) { .au-proc__node::before { animation: none; } }

/* ======================= aurora identity for every card ======================= */
.au-card, .au-prod, .au-step { --edge: linear-gradient(135deg, rgba(43, 195, 176, .55), rgba(253, 220, 122, .18) 40%, rgba(255, 255, 255, .04) 60%, rgba(242, 111, 85, .45)); }
.au-card:not(.au-card--glow)::before, .au-prod::before { content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; pointer-events: none; z-index: 2;
  background: var(--edge); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); opacity: .45; transition: opacity .5s; }
.au-prod { position: relative; isolation: isolate; transition: transform .6s var(--spring), box-shadow .5s; }
.au-card:not(.au-card--glow):hover::before, .au-prod:hover::before { opacity: 1; }
a.au-card, .au-card--glow, .au-prod { transition: transform .6s var(--spring), box-shadow .5s, border-color .4s; }
a.au-card:hover, .au-card--glow:hover, .au-prod:hover { transform: translateY(-6px); box-shadow: 0 30px 70px -40px rgba(43, 195, 176, .55), 0 18px 50px -30px rgba(242, 111, 85, .35); }
.au-card { background: radial-gradient(120% 70% at 0% 0%, rgba(43, 195, 176, .07), transparent 60%), var(--glass-bg); }
/* --glow cards: show a faint full edge at rest, the spinning highlight on hover */
.au-card--glow { box-shadow: inset 0 0 0 1px rgba(43, 195, 176, .18); }

/* ======================= sections: aurora glow + tighter rhythm ======================= */
:root { --sec-y: clamp(64px, 7.5vw, 112px); }
.au-sec { isolation: isolate; overflow-x: clip; }
.au-sec::after { content: ""; position: absolute; z-index: -1; pointer-events: none; width: min(70vw, 900px); height: 70%; top: 15%;
  background: radial-gradient(closest-side, rgba(43, 195, 176, .09), transparent); filter: blur(10px); }
.au-sec:nth-of-type(odd)::after { left: -18%; }
.au-sec:nth-of-type(even)::after { right: -18%; background: radial-gradient(closest-side, rgba(242, 111, 85, .07), transparent); }

/* ======================= long-form content (blog, resources, legal) ======================= */
/* `.au p { margin: 0 }` is more specific than `.au-prose > *`, so restate the rhythm with .au in front */
.au .au-prose { max-width: 72ch; }
.au .au-prose > * + * { margin-top: 1.1em; }
.au .au-prose :is(h1, h2) { margin-top: 1.9em; margin-bottom: 0; }
.au .au-prose h3 { margin-top: 1.6em; }
.au .au-prose h4 { margin-top: 1.3em; }
.au .au-prose > :is(h1, h2, h3, h4):first-child, .au .au-prose > [hidden] + * { margin-top: 0; }
.au .au-prose :is(h1, h2, h3, h4) + * { margin-top: .65em; }
.au .au-prose li > p { margin: 0; }
.au .au-prose li > p + p { margin-top: .5em; }
.au .au-prose hr { margin: 2.2em 0; border: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--line) 20%, var(--line) 80%, transparent); }
.au .au-prose img { max-width: 100%; height: auto; border-radius: var(--r-md); }
.au .au-prose table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.au .au-prose th, .au .au-prose td { padding: 10px 14px; border: 1px solid var(--line); text-align: left; }
.au .au-prose :not(pre) > code { padding: 2px 7px; border-radius: 6px; background: rgba(43, 195, 176, .1); color: var(--teal-2); font-size: .88em; white-space: break-spaces; }

/* code frames built by pages/prose.js */
.au .au-prose .au-code { margin-left: 0; margin-right: 0; border-radius: var(--r-md); overflow: hidden; border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(43, 195, 176, .05), transparent 40px), #03080B; box-shadow: 0 20px 50px -35px rgba(43, 195, 176, .5); }
.au-code figcaption { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 10px 8px 16px; border-bottom: 1px solid var(--line);
  font: 600 11.5px/1 var(--body); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.au-code figcaption > span::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 10px; border-radius: 50%; vertical-align: 1px;
  background: var(--teal-2); box-shadow: 14px 0 0 var(--sun), 28px 0 0 var(--coral); margin-right: 38px; }
.au-code__copy { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: var(--r-pill); border: 1px solid var(--line); background: rgba(255, 255, 255, .03);
  color: var(--ink-2); font: 500 12px/1 var(--body); letter-spacing: 0; text-transform: none; cursor: pointer; transition: color .3s, border-color .3s; }
.au-code__copy:hover { color: var(--teal-2); border-color: rgba(43, 195, 176, .45); }
.au-code__copy.is-done { color: var(--teal-2); }
.au .au-prose .au-code pre { margin: 0; padding: 16px 18px; border: 0; border-radius: 0; background: none; overflow-x: auto; max-height: 560px;
  font: 400 13.5px/1.65 ui-monospace, "SF Mono", Menlo, Consolas, monospace; tab-size: 2; -webkit-overflow-scrolling: touch; }
.au .au-prose .au-code pre code { padding: 0; background: none; color: #D7E6E3; white-space: pre; font: inherit; }
@media (max-width: 640px) { .au .au-prose .au-code pre { font-size: 12.5px; padding: 14px; max-height: 460px; } .au .au-prose { font-size: 16px; } }
/* highlight.js tokens in Aurora colours */
.au-code .hljs-keyword, .au-code .hljs-built_in, .au-code .hljs-meta { color: #F26F55; }
.au-code .hljs-string, .au-code .hljs-regexp, .au-code .hljs-template-variable { color: #FDDC7A; }
.au-code .hljs-title, .au-code .hljs-title.class_, .au-code .hljs-type, .au-code .hljs-class { color: #5FE0CF; }
.au-code .hljs-number, .au-code .hljs-literal, .au-code .hljs-symbol { color: #F7A88F; }
.au-code .hljs-comment, .au-code .hljs-quote { color: #6E8A84; font-style: italic; }
.au-code .hljs-attr, .au-code .hljs-property, .au-code .hljs-params, .au-code .hljs-variable { color: #A9E6DD; }
.au-code .hljs-function, .au-code .hljs-title.function_ { color: #8EEBDD; }
.au-code .hljs-tag, .au-code .hljs-name, .au-code .hljs-selector-tag { color: #F26F55; }

/* ======================= WebGL aurora behind every page hero (aurora-bg.js) ======================= */
.au-has-gl { position: relative; isolation: isolate; overflow: hidden; }
.au-hero-gl { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; display: block;
  -webkit-mask-image: linear-gradient(180deg, #000 70%, transparent); mask-image: linear-gradient(180deg, #000 70%, transparent);
  animation: au-gl-in 1.6s var(--ease) both; }
.au-has-gl > .au-aurora { display: none; }            /* the CSS aurora is only the no-WebGL fallback */
@keyframes au-gl-in { from { opacity: 0; } to { opacity: 1; } }
/* keep hero text readable over the brightest ribbons: soft shade on the text side, aurora stays vivid on the right */
.au-has-gl::after { content: ""; position: absolute; inset: 0; height: auto; z-index: -1; pointer-events: none;
  background: linear-gradient(90deg, rgba(5, 11, 15, .62) 0%, rgba(5, 11, 15, .38) 38%, rgba(5, 11, 15, 0) 68%); }
.au-has-gl.au-page-hero--center::after { background: radial-gradient(60% 70% at 50% 50%, rgba(5, 11, 15, .5), transparent 75%); }
.au-has-gl .au-lede { text-shadow: 0 1px 18px rgba(5, 11, 15, .8); }
@media (max-width: 760px) { .au-has-gl::after { background: linear-gradient(180deg, rgba(5, 11, 15, .25), rgba(5, 11, 15, .55)); } }
