/* Elevation 6 - elevation6.com. Single stylesheet: brand tokens followed by
   site layout. No external dependencies, no webfonts. */
:root{
/* Named palette - the eight colours on the Aurora deck's palette slide */
--e6-void:#050A0F;
--e6-navy:#0D1928;
--e6-ice:#EEF2F5;
--e6-slate:#B3BFCA;
--e6-green:#33D977;
--e6-teal:#00BFC0;
--e6-blue:#2F8ADC;
--e6-graphite:#5A656E;

/* Neutral ramp - the working greys the deck uses between Ice and Void */
--e6-grey-100:#EEF2F5;
--e6-grey-200:#C8CFD4;
--e6-grey-300:#B3BFCA;
--e6-grey-400:#A4B0BA;
--e6-grey-500:#94A0AA;
--e6-grey-600:#7D8892;
--e6-grey-700:#5A656E;
--e6-grey-800:#2A3742;
--e6-grey-850:#1E2A36;
--e6-grey-900:#17222D;
--e6-grey-950:#0D1928;
--e6-grey-1000:#050A0F;

/* Aurora gradient stops, taken from the logo mark's own linearGradient */
--e6-aurora-blue:#2D91D7;
--e6-aurora-green:#2AD67E;
--e6-aurora-violet:#7351EA;
--e6-gradient-aurora:linear-gradient(75deg,var(--e6-aurora-blue) 0%,var(--e6-aurora-green) 42%,var(--e6-aurora-violet) 100%);
/* Left-to-right variant for rules, underlines and progress fills */
--e6-gradient-rule:linear-gradient(90deg,var(--e6-green) 0%,var(--e6-teal) 50%,var(--e6-blue) 100%);

/* Surfaces */
--surface-page:var(--e6-void);
--surface-panel:var(--e6-navy);
--surface-card:var(--e6-navy);
--surface-inset:#0A1420;
--surface-inverse:var(--e6-ice);

/* Text */
--text-primary:var(--e6-ice);
--text-body:var(--e6-grey-200);
--text-secondary:var(--e6-slate);
--text-label:var(--e6-grey-400);
--text-muted:var(--e6-grey-600);
--text-caption:var(--e6-graphite);
--text-on-light:var(--e6-void);
--text-link:var(--e6-teal);
--text-link-hover:var(--e6-green);

/* Borders - three weights of hairline, all near-invisible by design */
--border-subtle:var(--e6-grey-900);
--border-hairline:var(--e6-grey-850);
--border-strong:var(--e6-grey-800);
--border-accent:var(--e6-teal);

/* Accents */
--accent-primary:var(--e6-teal);
--accent-secondary:var(--e6-green);
--accent-tertiary:var(--e6-blue);

/* Status - as used on the deck's detail table */
--status-positive:var(--e6-green);
--status-active:var(--e6-teal);
--status-info:var(--e6-blue);
--status-idle:var(--e6-grey-600);
--status-critical:#FF5A5A;
--status-warning:#F5B33C;

/* Tints - flat overlays for badges and hover fills */
--tint-teal-12:rgba(0,191,192,.12);
--tint-teal-20:rgba(0,191,192,.2);
--tint-green-12:rgba(51,217,119,.12);
--tint-blue-12:rgba(47,138,220,.12);
--tint-ice-06:rgba(238,242,245,.06);
--tint-ice-10:rgba(238,242,245,.1);
--scrim-void-60:rgba(5,10,15,.6);
--scrim-void-85:rgba(5,10,15,.85);
}

:root{
--font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
--font-mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace; /* no brand mono face was supplied; system mono only, for hex values and code */
--font-display:var(--font-sans); /* the brand has no separate display face; Inter Bold carries display duty */

--weight-regular:400;
--weight-bold:700;

/* Tracking. The brand's only tracked type is uppercase micro-labels. */
--tracking-tight:-.02em;
--tracking-normal:0;
--tracking-label:.12em;
--tracking-wordmark:.26em;

--leading-display:.86; /* the deck sets 86% line spacing on the title */
--leading-tight:1.1;
--leading-body:1.35;
--leading-loose:1.5;

/* Web scale */
--text-xs:12px;
--text-sm:14px;
--text-base:16px;
--text-md:18px;
--text-lg:20px;
--text-xl:24px;
--text-2xl:32px;
--text-3xl:40px;
--text-4xl:56px;
--text-5xl:72px;

/* Deck scale - px at a 1920x1080 stage, straight off the Aurora master */
--slide-title:92px;      /* title slide headline, bold, 86% leading */
--slide-header:66px;     /* section header on content layout A */
--slide-header-sm:60px;  /* header on layouts C and D */
--slide-stat:84px;       /* lead figure */
--slide-closing:82px;    /* "Thank you" */
--slide-body:32px;
--slide-body-sm:30px;
--slide-list:31px;
--slide-subtitle:38px;   /* title slide supporting line */
--slide-card-title:28px;
--slide-label:26px;
--slide-eyebrow:25px;
--slide-footer:24px;
--slide-caption:24px;
--slide-icon-label:20px;
}

:root{
--space-1:4px;
--space-2:8px;
--space-3:12px;
--space-4:16px;
--space-5:20px;
--space-6:24px;
--space-8:32px;
--space-10:40px;
--space-12:48px;
--space-16:64px;
--space-20:80px;
--space-26:104px;
--space-30:120px;

/* Deck grid - measured from the Aurora master at 1920x1080 */
--slide-w:1920px;
--slide-h:1080px;
--slide-margin-x:120px;      /* every element starts at x=120 */
--slide-margin-top:104px;    /* header baseline block starts at y=104 */
--slide-footer-y:979px;      /* footer row */
--slide-content-w:1680px;    /* 1920 - 2x120 */
--slide-col-4:528px;         /* four-up reference card */
--slide-col-gap:48px;        /* 576px pitch: 120 / 696 / 1272 */
--slide-col-3:569px;         /* three-up stat column, 581px pitch */
--slide-row-pitch:105px;     /* numbered list rows */

/* Web layout */
--container-max:1280px;
--gutter:24px;
--section-y:96px;
}

:root{
/* Radii. The Aurora deck rounds cards by exactly 4px on a 1920px stage -
   effectively square. Nothing in the brand is pill-shaped except toggles. */
--radius-none:0;
--radius-xs:2px;
--radius-sm:4px;
--radius-md:6px;
--radius-lg:8px;
--radius-pill:999px;

--border-width:1px;
--border-width-thick:3px;    /* the dashed image-placeholder frame */
--rule-height:1px;
--accent-rule-w:96px;        /* title-slide gradient rule */
--accent-rule-h:3px;

/* Elevation. Dark-on-dark: separation comes from hairlines and fills,
   not drop shadows. Shadows appear only under floating layers. */
--shadow-none:none;
--shadow-panel:0 1px 0 rgba(238,242,245,.04) inset;
--shadow-raised:0 8px 24px rgba(5,10,15,.5);
--shadow-overlay:0 24px 64px rgba(5,10,15,.7);
--glow-teal:0 0 24px rgba(0,191,192,.25);
--glow-green:0 0 24px rgba(51,217,119,.22);

--focus-ring:0 0 0 2px var(--e6-void),0 0 0 4px var(--e6-teal);

/* Blur is used for one thing: a frosted panel over aurora photography. */
--blur-panel:blur(16px); /* @kind other */
--scrim-bottom:linear-gradient(180deg,rgba(5,10,15,0) 0%,rgba(5,10,15,.9) 100%); /* @kind color */
--scrim-left:linear-gradient(90deg,rgba(5,10,15,.92) 0%,rgba(5,10,15,.4) 55%,rgba(5,10,15,0) 100%); /* @kind color */
}

:root{
--dur-fast:120ms /* @kind other */;
--dur-base:180ms /* @kind other */;
--dur-slow:320ms /* @kind other */;
--dur-aurora:24s /* @kind other */;
--ease-standard:cubic-bezier(.2,0,.2,1) /* @kind other */;
--ease-out:cubic-bezier(0,0,.2,1) /* @kind other */;
--ease-in-out:cubic-bezier(.4,0,.2,1) /* @kind other */;
--transition-base:color var(--dur-base) var(--ease-standard),background-color var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard),opacity var(--dur-base) var(--ease-standard);
}
@media (prefers-reduced-motion:reduce){:root{--dur-fast:0ms /* @kind other */;--dur-base:0ms /* @kind other */;--dur-slow:0ms /* @kind other */}}

/* Elevation 6 marketing site. Foundations come from the design system's
   styles.css; this file only holds page-level layout and the hero animation. */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:hidden}
body{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;margin:0;background:var(--surface-page);color:var(--text-body);font-family:var(--font-sans);font-size:16px;line-height:var(--leading-body);-webkit-font-smoothing:antialiased;text-wrap:pretty}
a{color:var(--text-link);text-decoration:none;transition:var(--transition-base)}
a:hover{color:var(--text-link-hover)}
:focus-visible{outline:none;box-shadow:var(--focus-ring);border-radius:var(--radius-sm)}
img,svg{max-width:100%}
h1,h2,h3{margin:0;color:var(--text-primary);font-weight:var(--weight-bold);letter-spacing:-.02em;line-height:var(--leading-tight)}
p{margin:0}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:16px;z-index:60;padding:10px 14px;background:var(--surface-panel);color:var(--text-primary)}

/* Site-wide starfield: the same three star layers as the hero, fixed behind
   every page so the sky continues past the home page. */
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.6;background-repeat:repeat;background-image:radial-gradient(1px 1px at 24px 30px,rgba(238,242,245,.9) 50%,transparent 51%),radial-gradient(1.3px 1.3px at 190px 150px,rgba(238,242,245,.75) 50%,transparent 51%),radial-gradient(1px 1px at 300px 60px,rgba(179,191,202,.6) 50%,transparent 51%);background-size:340px 300px}

.hero body::before{display:none}
main,.site-head,.site-foot{position:relative;z-index:1}
main{flex:1 0 auto}
/* Pages whose single block should sit in the optical centre of the viewport. */
body.centred main{display:flex;flex-direction:column}
body.centred .site-foot{margin-top:0}

/* Shell */
.wrap{width:100%;max-width:1120px;margin:0 auto;padding:0 24px}
@media(min-width:768px){.wrap{padding:0 40px}}

/* Header */
.site-head{position:sticky;top:0;z-index:30;background:rgba(5,10,15,.86);-webkit-backdrop-filter:var(--blur-panel);backdrop-filter:var(--blur-panel);border-bottom:1px solid var(--border-hairline)}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:72px}
.site-head .brand{display:flex;align-items:center;padding:4px 0}
.site-head .brand img{width:240px;height:auto;display:block}
.site-nav{display:flex;align-items:center;gap:20px}
.site-nav a{display:flex;align-items:center;min-height:44px;font-size:14px;color:var(--text-secondary);border-bottom:2px solid transparent}
.site-nav a:hover{color:var(--text-primary)}
.site-nav a[aria-current="page"]{color:var(--text-primary);font-weight:var(--weight-bold);border-bottom-color:var(--accent-primary)}
@media(max-width:719px){.site-head .wrap{min-height:0;flex-direction:column;align-items:flex-start;gap:2px;padding-top:14px;padding-bottom:2px}.site-head .brand img{width:min(240px,72vw)}.site-nav{gap:16px;flex-wrap:wrap}}
@media(min-width:768px){.site-nav{gap:36px}.site-head .brand img{width:260px}}

/* Footer */
.site-foot{margin-top:96px;border-top:1px solid var(--border-hairline);padding:40px 0 48px}
.site-foot .wrap{display:flex;flex-direction:column;gap:8px;font-size:14px;color:var(--text-muted)}
.site-foot img.name{width:min(240px,72vw);height:auto;display:block}
@media(min-width:768px){.site-foot{margin-top:128px}.site-foot .wrap{flex-direction:row;align-items:flex-end;gap:32px}}

/* Page blocks */
.page-head{padding-top:72px;padding-bottom:0}
.page-head h1{font-size:clamp(34px,7vw,56px)}
.page-head .lede{margin-top:20px;max-width:60ch;font-size:clamp(17px,2.2vw,20px);color:var(--text-secondary)}
@media(min-width:768px){.page-head{padding-top:104px}}
.prose{margin-top:40px;max-width:66ch;display:flex;flex-direction:column;gap:24px;font-size:17px;color:var(--text-body)}
.prose ul{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:12px}
.prose li{font-size:17px;line-height:var(--leading-loose);color:var(--text-body)}
.prose .prose-head{margin-top:8px}
.section{margin-top:72px}
@media(min-width:768px){.section{margin-top:104px}}
.eyebrow{font-size:12px;font-weight:var(--weight-bold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--accent-primary)}
.eyebrow.eyebrow-blue{color:var(--accent-tertiary)}
.rule{height:1px;background:var(--border-hairline);border:0;margin:0}
.btn{display:inline-flex;align-items:center;justify-content:center;height:48px;padding:0 26px;background:var(--accent-primary);color:var(--text-on-light);font-size:15px;font-weight:var(--weight-bold);border-radius:var(--radius-sm);border:1px solid var(--accent-primary)}
.btn:hover{background:#1ACDCE;border-color:#1ACDCE;color:var(--text-on-light)}
.btn:active{background:#00A8A9;border-color:#00A8A9;transform:translateY(1px)}
.btn-quiet{background:transparent;color:var(--text-primary);border-color:var(--border-strong)}
.btn-quiet:hover{background:var(--tint-ice-06);border-color:var(--e6-grey-700);color:var(--text-primary)}

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

.statement{font-size:clamp(28px,5vw,48px);max-width:24ch;letter-spacing:-.025em}

/* Services page ------------------------------------------------------------
   Ten service cards. Each carries its own accent (--c) sampled along the
   aurora ramp, green through teal and blue to violet. */
.tone-1{--c:oklch(.76 .15 150)}
.tone-2{--c:oklch(.76 .13 201)}
.tone-3{--c:oklch(.72 .14 252)}
.tone-4{--c:oklch(.72 .16 303)}
.tone-5{--c:oklch(.78 .14 167)}
.tone-6{--c:oklch(.74 .13 218)}
.tone-7{--c:oklch(.72 .15 269)}
.tone-8{--c:oklch(.77 .13 184)}
.tone-9{--c:oklch(.73 .14 235)}
.tone-10{--c:oklch(.72 .16 286)}

/* Jump nav */
.svc-jump{display:grid;grid-template-columns:repeat(2,1fr);grid-auto-rows:1fr;gap:8px;margin-top:32px}
@media(min-width:640px){.svc-jump{grid-template-columns:repeat(5,1fr)}}
.svc-jump a{display:flex;align-items:center;justify-content:center;text-align:center;min-height:52px;padding:8px 12px;font-size:13px;line-height:1.25;background:var(--tint-blue-12);border:1px solid var(--border-strong);color:var(--accent-tertiary);background:var(--tint-blue-12);border:1px solid color-mix(in oklab,var(--accent-tertiary) 34%,transparent);border-radius:var(--radius-xs);transition:var(--transition-base)}
.svc-jump a:hover{color:var(--e6-grey-100);background:color-mix(in oklab,var(--accent-tertiary) 22%,transparent);border-color:color-mix(in oklab,var(--accent-tertiary) 70%,transparent)}

/* Card grid. Each rule states a flat fallback before its color-mix form so
   engines without color-mix()/oklch() still render a legible card. */
.svc-list{display:grid;grid-template-columns:1fr;gap:16px;margin-top:32px;align-items:start}
@media(min-width:900px){.svc-list{grid-template-columns:repeat(2,1fr);gap:20px}}
.svc{background:var(--surface-card);border:1px solid var(--border-hairline);color:var(--text-body);position:relative;display:flex;flex-direction:column;align-items:flex-start;overflow:hidden;scroll-margin-top:88px;min-height:var(--svc-min,0px);background:linear-gradient(160deg,color-mix(in oklab,var(--c) 9%,var(--surface-card)) 0%,var(--surface-card) 58%);border:1px solid color-mix(in oklab,var(--c) 22%,var(--border-hairline));border-radius:var(--radius-md);padding:24px;transition:var(--transition-base)}
@media(min-width:768px){.svc{padding:32px}}
.svc::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--c),transparent 78%)}
.svc.is-expandable{cursor:pointer}
.svc:hover{border-color:color-mix(in oklab,var(--c) 46%,var(--border-hairline));background:linear-gradient(160deg,color-mix(in oklab,var(--c) 15%,var(--surface-card)) 0%,var(--surface-card) 58%)}
.svc.open{grid-column:1/-1;cursor:auto;min-height:0}
.svc-head{display:flex;align-items:center;gap:16px;padding-right:110px}
.svc-ico{flex:none;display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:var(--radius-sm);background:var(--tint-ice-06);border:1px solid var(--border-strong);color:var(--accent-primary);color:var(--c);background:color-mix(in oklab,var(--c) 15%,transparent);border:1px solid color-mix(in oklab,var(--c) 30%,transparent)}
.svc-glyph{width:28px;height:28px;display:block}
.svc-name{font-size:clamp(24px,3vw,30px);letter-spacing:-.02em;line-height:1.1;color:var(--text-primary)}
.svc-sub{margin-top:18px;font-size:clamp(17px,2vw,19px);font-weight:var(--weight-bold);line-height:1.3;letter-spacing:-.01em;color:var(--c)}
.svc-intro{margin-top:12px;font-size:16px;color:var(--text-body);max-width:68ch}
.svc-intro.dim{margin-top:10px;color:var(--text-secondary)}
.svc-actions{align-self:stretch;display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:auto;padding-top:22px}
.svc-toggle{-webkit-appearance:none;appearance:none;align-self:flex-start;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 16px;background:var(--tint-ice-06);border:1px solid var(--border-strong);color:var(--accent-primary);background:color-mix(in oklab,var(--c) 14%,transparent);border:1px solid color-mix(in oklab,var(--c) 34%,transparent);border-radius:var(--radius-sm);font-family:var(--font-sans);font-size:15px;font-weight:var(--weight-bold);letter-spacing:-.01em;color:var(--c);cursor:pointer;transition:var(--transition-base)}
.svc-toggle:hover{background:color-mix(in oklab,var(--c) 22%,transparent);border-color:color-mix(in oklab,var(--c) 66%,transparent)}
.svc-toggle svg{width:18px;height:18px;flex:none;stroke-width:2.8;transition:transform var(--dur-slow) var(--ease-standard)}
.svc.open .svc-toggle svg{transform:rotate(180deg)}
.svc-top{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;background:transparent;border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-size:15px;font-weight:var(--weight-bold);letter-spacing:-.01em;color:var(--text-secondary);transition:var(--transition-base)}
.svc-top:hover{background:var(--tint-ice-06);border-color:var(--border-strong);color:var(--text-primary)}
.svc-top svg{width:18px;height:18px;flex:none;stroke-width:2.8}
.svc:not(.open) .svc-top{display:none}

/* Expanded body: the from / to shifts */
.svc-body{align-self:stretch;margin-top:28px;padding-top:28px;border-top:1px solid color-mix(in oklab,var(--c) 26%,var(--border-hairline));display:flex;flex-direction:column;gap:16px;cursor:auto}
.svc-body[hidden]{display:none}
.shift{display:grid;grid-template-columns:1fr;gap:16px;padding:20px;background:var(--surface-inset);border:1px solid var(--border-hairline);border-radius:var(--radius-sm)}
@media(min-width:900px){.shift{grid-template-columns:1fr 1fr;column-gap:24px;row-gap:0;align-items:stretch;padding:24px 28px}}
.shift-side{display:flex;align-items:flex-start;gap:14px;padding:16px;border-radius:var(--radius-sm)}
.shift-side.from{background:rgba(238,242,245,.03);border:1px solid var(--border-strong)}
.shift-side.to{background:var(--tint-ice-06);border:1px solid var(--border-strong);background:color-mix(in oklab,var(--c) 10%,transparent);border:1px solid color-mix(in oklab,var(--c) 34%,transparent);border-radius:var(--radius-sm)}
.shift-ico{flex:none;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-sm);background:var(--tint-ice-06);border:1px solid var(--border-strong);color:var(--text-label)}
.shift-side.to .shift-ico{background:color-mix(in oklab,var(--c) 18%,transparent);border-color:color-mix(in oklab,var(--c) 34%,transparent);color:var(--text-primary)}
.shift-glyph{width:24px;height:24px;display:block}
.shift-side.from .shift-glyph [opacity]{opacity:.75}
.shift-lbl{margin-bottom:6px;font-size:11px;font-weight:var(--weight-bold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-label)}
.shift-side.to .shift-lbl{color:var(--c)}
.shift-txt{font-size:15px;line-height:1.45;color:var(--text-body)}
.shift-side.to .shift-txt{color:var(--text-primary)}
@media(min-width:900px){}
.shift-foot{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding-top:14px;border-top:1px solid var(--border-subtle)}
@media(min-width:900px){.shift-foot{grid-column:1/-1;margin-top:20px}}
.shift-tags{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.tag{padding:7px 13px;font-size:13px;line-height:1.3;background:var(--tint-ice-06);border:1px solid var(--border-strong);color:var(--accent-primary);color:var(--c);background:color-mix(in oklab,var(--c) 10%,transparent);border:1px solid color-mix(in oklab,var(--c) 34%,transparent);border-radius:var(--radius-xs)}
.svc-cta{display:flex;flex-wrap:wrap;align-items:center;gap:20px;margin-top:12px;padding-top:26px;border-top:1px solid var(--border-hairline)}
.svc-cta p{font-size:17px;font-weight:var(--weight-bold);color:var(--text-primary)}
.svc .btn{gap:10px;background:var(--accent-primary);background:var(--c);border-color:var(--c);color:var(--text-on-light)}
.svc .btn svg{width:16px;height:16px;flex:none}
.svc .btn:hover{background:color-mix(in oklab,var(--e6-ice) 18%,var(--c));border-color:color-mix(in oklab,var(--e6-ice) 18%,var(--c));color:var(--text-on-light)}
.svc .btn:active{background:color-mix(in oklab,var(--e6-void) 12%,var(--c));border-color:color-mix(in oklab,var(--e6-void) 12%,var(--c))}

.contact-only{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:64px 24px;text-align:center}
.contact-only h1{font-size:clamp(26px,6vw,56px);letter-spacing:-.03em}
.contact-only h1 a{color:var(--text-primary)}
.contact-only h1 a:hover{color:var(--accent-primary)}

.prose-head{font-size:clamp(20px,3vw,26px);margin-top:8px}

/* Home: one screen, no scroll */
body.home{height:100vh;height:100svh;overflow:hidden}
body.home main{flex:1 1 auto;min-height:0}
body.home .hero{min-height:0;height:100%}
body.home .site-foot{margin-top:0;padding:20px 0 22px}
@media(min-width:768px){body.home .site-foot{padding:24px 0 26px}}

/* Aurora pause control */
.aurora-pause{position:absolute;left:20px;bottom:20px;z-index:3;display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 12px;background:rgba(5,10,15,.55);border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-family:var(--font-sans);font-size:12px;letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-secondary);cursor:pointer;opacity:.92;transition:var(--transition-base)}
.aurora-pause:hover{opacity:1;color:var(--text-primary);border-color:var(--e6-grey-600)}
.aurora-pause svg{width:12px;height:12px;flex:none;fill:currentColor}
.aurora-pause[hidden]{display:none}
@media(min-width:768px){.aurora-pause{left:28px;bottom:28px}}

/* About: founder card with a drop-down bio */
.bio-section{margin-top:64px;margin-bottom:64px}
.bio-card{display:inline-block;width:auto;max-width:100%;position:relative;overflow:hidden;background:var(--surface-card);border:1px solid var(--border-hairline);background:linear-gradient(160deg,color-mix(in oklab,var(--accent-tertiary) 10%,var(--surface-card)) 0%,var(--surface-card) 58%);border:1px solid color-mix(in oklab,var(--accent-tertiary) 26%,var(--border-hairline));border-radius:var(--radius-md);padding:24px}
@media(min-width:768px){.bio-card{padding:32px}}
.bio-card::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--accent-tertiary),transparent 78%)}
.bio-card .bio-head{margin-bottom:0;align-items:center}
.bio-card .bio-portrait img{object-position:50% 50%}
.bio-card .bio-sky{background-size:120px 130px,120px 130px,120px 130px,100% 100%,100% 100%}
.bio-name h2{margin:0 0 14px;font-size:clamp(26px,4vw,34px);font-weight:var(--weight-bold);line-height:1.2;color:var(--accent-tertiary)}
.bio-name .bio-role{margin:0 0 6px;font-size:17px;line-height:1.5;color:var(--text-secondary)}
.bio-name .bio-role:last-child{margin-bottom:0}
.bio-more{margin-top:24px;border-top:1px solid var(--border-hairline);padding-top:20px}
.bio-more summary{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 16px;list-style:none;background:var(--tint-blue-12);border:1px solid var(--border-strong);color:var(--accent-tertiary);background:var(--tint-blue-12);border:1px solid color-mix(in oklab,var(--accent-tertiary) 34%,transparent);border-radius:var(--radius-sm);font-size:15px;font-weight:var(--weight-bold);color:var(--accent-tertiary);cursor:pointer;transition:var(--transition-base)}
.bio-more summary::-webkit-details-marker{display:none}
.bio-more summary::marker{content:""}
.bio-more summary:hover{background:color-mix(in oklab,var(--accent-tertiary) 22%,transparent);border-color:color-mix(in oklab,var(--accent-tertiary) 66%,transparent)}
.bio-more summary svg{width:12px;height:12px;flex:none;transition:transform var(--dur-slow) var(--ease-standard)}
.bio-more[open] summary svg{transform:rotate(180deg)}
.bio-more-body{display:flex;flex-direction:column;gap:20px;margin-top:22px}
.bio-more-body p{font-size:17px;line-height:1.7;max-width:62ch;color:var(--text-secondary)}
.bio-more-body p.bio-aside{color:var(--text-muted)}

/* Hero */
.hero{isolation:isolate;position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--e6-void)}
.hero-copy{position:relative;z-index:2;text-align:center;padding:96px 24px}
.hero-copy h1.hero-mark{display:flex;justify-content:center}
.hero-copy h1.hero-mark img{width:min(76vw,620px);height:auto;display:block}
.hero-copy p{margin-top:20px;font-size:clamp(16px,3.4vw,24px);color:var(--text-secondary);letter-spacing:.01em}
.hero-scroll{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);z-index:2;font-size:11px;letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--e6-graphite)}

/* Sky: WebGL aurora curtains (aurora.js) with static CSS starfields over them. */
#aurora-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0;will-change:transform;transform:translateZ(0)}
.stars{position:absolute;inset:0;z-index:1;background-repeat:repeat;pointer-events:none;mix-blend-mode:screen;background-image:radial-gradient(1px 1px at 20px 30px,rgba(238,242,245,.9) 50%,transparent 51%),radial-gradient(1.4px 1.4px at 150px 118px,rgba(238,242,245,1) 50%,transparent 51%),radial-gradient(1px 1px at 262px 56px,rgba(179,191,202,.7) 50%,transparent 51%),radial-gradient(1px 1px at 84px 214px,rgba(238,242,245,.6) 50%,transparent 51%),radial-gradient(1.6px 1.6px at 322px 176px,rgba(238,242,245,.55) 50%,transparent 51%);background-size:360px 300px}
.stars-2,.stars-3{display:none}

.hero-veil{position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(5,8,15,.55) 0%,rgba(5,8,15,.28) 34%,rgba(5,8,15,.75) 80%,#050A0F 100%)}



/* 404 */
.err{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:64px 24px;text-align:center}
.err .code{font-size:12px;font-weight:var(--weight-bold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--accent-primary)}
.err h1{font-size:clamp(30px,6vw,52px);letter-spacing:-.03em}
.err p{font-size:17px;color:var(--text-secondary);max-width:46ch}
.err .btn{margin-top:12px}

/* Contact form */
.contact-page{padding-top:72px;padding-bottom:0}
.contact-page .lede{max-width:560px}
.contact-page h1{font-size:clamp(34px,7vw,56px)}
.contact-page .lede{margin-top:20px;font-size:clamp(17px,2.2vw,20px);color:var(--text-secondary)}
@media(min-width:768px){.contact-page{padding-top:104px}}
.contact-form{display:flex;flex-direction:column;gap:24px;margin-top:40px;max-width:560px}
.field{display:flex;flex-direction:column;gap:8px}
.field label{font-size:14px;font-weight:var(--weight-bold);color:var(--text-primary)}
.field input,.field textarea{width:100%;min-height:48px;padding:12px 14px;background:var(--surface-inset);color:var(--text-primary);font-family:inherit;font-size:16px;line-height:var(--leading-body);border:1px solid var(--border-strong);border-radius:var(--radius-sm);transition:var(--transition-base)}
.field textarea{min-height:132px;resize:vertical}
/* About: founder bio with the site's night sky behind the portrait. */
.bio{display:block;margin-top:var(--space-16);padding-bottom:var(--space-16)}
.bio-head{display:flex;align-items:flex-start;gap:24px;margin-bottom:28px}
.bio-name{padding-top:2px}
.bio-copy .bio-role{margin:0 0 6px;font-size:17px;line-height:1.5;color:var(--text-secondary)}
.bio-portrait{position:relative;flex:none;width:104px;height:148px;margin:0;overflow:hidden;border:1px solid var(--border-hairline);border-radius:var(--radius-sm);background:radial-gradient(120% 90% at 50% 12%,#12243B 0%,#0A1524 46%,#050A0F 100%)}
.bio-sky{position:absolute;inset:0;background-repeat:repeat,repeat,repeat,no-repeat,no-repeat;background-image:radial-gradient(1px 1px at 24px 30px,rgba(238,242,245,.95) 50%,transparent 51%),radial-gradient(1.4px 1.4px at 190px 150px,rgba(238,242,245,.8) 50%,transparent 51%),radial-gradient(1px 1px at 300px 60px,rgba(179,191,202,.65) 50%,transparent 51%),radial-gradient(70% 45% at 30% 22%,rgba(45,145,215,.34) 0%,transparent 70%),radial-gradient(60% 40% at 76% 8%,rgba(42,214,126,.22) 0%,transparent 72%);background-size:340px 300px,340px 300px,340px 300px,100% 100%,100% 100%}
.bio-portrait img{position:relative;display:block;width:100%;height:100%;object-fit:cover;object-position:50% 8%}
.bio-copy h2{margin:0 0 14px;font-size:var(--text-2xl);font-weight:var(--weight-bold);color:var(--accent-primary);line-height:1.2}
.bio-copy p{margin:0 0 24px;font-size:17px;line-height:1.7;color:var(--text-secondary);text-wrap:pretty;max-width:68ch}
.bio-copy .bio-aside{margin-bottom:0;color:var(--text-muted)}
.field input:hover,.field textarea:hover{border-color:var(--e6-grey-700)}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--accent-primary);box-shadow:var(--focus-ring)}
.contact-form .btn{align-self:flex-start;font-family:inherit;cursor:pointer}
.honeypot{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.form-note{font-size:15px;color:var(--status-critical)}
.form-note[hidden]{display:none}
.site-foot .est{color:var(--text-muted)}
@media(min-width:768px){.site-foot .est{margin-left:auto}}
.hidden{display:none}

/* Legal pages */
.legal{padding-top:72px;padding-bottom:0}
.legal>*{max-width:70ch}
@media(min-width:768px){.legal{padding-top:104px}}
.legal h1{font-size:clamp(30px,6vw,48px)}
.legal .updated{margin-top:20px;font-size:14px;color:var(--text-muted)}
.legal .legal-lede{margin-top:32px;padding-bottom:8px;font-size:clamp(17px,2.2vw,19px);line-height:var(--leading-loose);color:var(--text-primary)}
.legal h2{margin-top:64px;margin-bottom:4px;font-size:13px;font-weight:var(--weight-bold);line-height:var(--leading-body);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--accent-primary)}
@media(min-width:768px){.legal h2{margin-top:72px}}
.legal p{margin-top:20px;font-size:16px;line-height:var(--leading-loose);color:var(--text-secondary)}
.legal ul{margin:20px 0 0;padding-left:22px;display:flex;flex-direction:column;gap:12px}
.legal li{font-size:16px;line-height:var(--leading-loose);color:var(--text-secondary)}
.legal h2+p,.legal h2+ul{margin-top:16px}
.legal>*:last-child{padding-bottom:8px}


/* From / To transformation tiles. One scene per service item, sitting bottom-right
   of the row: the tile opens in the From state, clears, and the To state assembles, on a loop. Each layer's
   animation is declared inline on the SVG group; --dur and --dly live here
   and on the SVG so a whole strip can be retimed in one place. */
.card-anim{position:absolute;top:20px;right:20px;width:88px;height:88px;padding:10px;background:rgba(7,16,25,.92);border:1px solid color-mix(in oklab,var(--c) 18%,#17222D);border-radius:var(--radius-xs);line-height:0;z-index:1}
.card-anim svg{display:block;width:100%;height:100%;--dur:6.4s;--dly:0s}
.card-anim g{transform-box:fill-box;transform-origin:center}
.shift-anim{flex:none;padding:4px 6px;background:#071019;border:1px solid var(--border-subtle);border-radius:var(--radius-xs);line-height:0}
.shift-anim svg{display:block;max-width:100%;height:auto;--dur:6.4s;--dly:0s}
.shift-anim g{transform-box:fill-box;transform-origin:center}

@keyframes e6out{0%,24%{opacity:1;transform:translate(0,0) scale(1)}44%,100%{opacity:0;transform:translate(var(--tx,0px),var(--ty,0px)) scale(var(--k,.9))}}
@keyframes e6in{0%,32%{opacity:0;transform:translate(var(--tx,0px),var(--ty,0px)) scale(var(--k,.82))}50%,86%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(var(--tx,0px),var(--ty,0px)) scale(var(--k,.82))}}
@keyframes e6conv{0%,12%{opacity:.9;transform:translate(var(--tx,0px),var(--ty,0px))}46%,100%{opacity:0;transform:translate(0,0)}}
@keyframes e6draw{0%,30%{stroke-dashoffset:var(--dl,60);opacity:0}38%{opacity:1}52%,86%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:var(--dl,60);opacity:0}}
@keyframes e6drift{0%,18%{opacity:.8;transform:translate(0,0)}72%,100%{opacity:0;transform:translate(var(--tx,6px),var(--ty,10px))}}
@keyframes e6rise{0%,30%{transform:scaleY(.1);opacity:.3}52%,86%{transform:scaleY(1);opacity:1}100%{transform:scaleY(.1);opacity:.3}}
@keyframes e6pulse{0%,32%{opacity:0;transform:scale(.5)}56%{opacity:.7;transform:scale(1)}80%,100%{opacity:0;transform:scale(1.4)}}
@keyframes e6grow{0%,28%{transform:scale(.25);opacity:.4}54%,86%{transform:scale(1);opacity:1}100%{transform:scale(.25);opacity:.4}}
@keyframes e6spin{to{transform:rotate(360deg)}}
@keyframes e6spinr{to{transform:rotate(-360deg)}}
@keyframes e6needle{0%,28%{transform:rotate(-54deg)}54%{transform:rotate(30deg)}66%{transform:rotate(8deg)}86%{transform:rotate(16deg)}100%{transform:rotate(-54deg)}}
@keyframes e6blink{0%,30%{opacity:.12}52%,86%{opacity:1}100%{opacity:.12}}
@keyframes e6travel{0%,26%{opacity:0;transform:translateX(0)}36%{opacity:1}62%{transform:translateX(var(--tx,80px));opacity:1}74%,100%{opacity:0;transform:translateX(var(--tx,80px))}}

/* Reduced motion holds each strip on its To state. */
@media(prefers-reduced-motion:reduce){
.shift-anim g{animation:none !important;transform:none !important}
.shift-anim g[style*="e6out"],.shift-anim g[style*="e6conv"],.shift-anim g[style*="e6drift"],.shift-anim g[style*="e6pulse"]{display:none}
.shift-anim g[style*="e6draw"]{stroke-dashoffset:0 !important}
}
