/* ============================================================================
   URated — Public site design system  ("Editorial Command Brief", LIGHT)
   Warm ivory paper · near-black ink · single persimmon accent · hairline
   borders · soft warm shadows · faint grid texture · expressive grotesque
   display + mono console labels · orchestrated motion.
   Loaded ONLY by the public layout (the authenticated app is untouched).
   ============================================================================ */

:root {
    /* Canvas */
    --paper:   #f4f0e8;
    --paper-2: #faf7f1;
    --panel:   #ffffff;
    --panel-2: #f8f4ec;
    --line:    rgba(26, 22, 16, .12);
    --line-2:  rgba(26, 22, 16, .20);

    /* Ink / foreground */
    --fg:      #16140f;
    --fg-soft: #4c473d;
    --fg-mute: #8a8475;

    /* Accent */
    --accent:    #ff4a25;   /* persimmon / ember */
    --accent-2:  #11705a;   /* deep teal (secondary cue) */
    --accent-3:  #2f5fe0;   /* cobalt (info cue) */
    --on-accent: #fffaf6;

    /* Effects */
    --glow:      0 10px 30px -8px rgba(255, 74, 37, .45);
    --shadow-xl: 0 38px 80px -34px rgba(40, 28, 16, .42);
    --shadow-md: 0 18px 44px -22px rgba(40, 28, 16, .30);
    --shadow-sm: 0 2px 8px -2px rgba(40, 28, 16, .14);

    /* Radii */
    --r-sm: 9px;
    --r:    14px;
    --r-lg: 22px;
    --r-xl: 30px;

    /* Type */
    --display: "Bricolage Grotesque", "Spline Sans", ui-sans-serif, system-ui, sans-serif;
    --body:    "Spline Sans", ui-sans-serif, system-ui, -apple-system, sans-serif;
    --mono:    "Spline Sans Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

    --wrap: 1180px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body.site {
    margin: 0;
    background: var(--paper);
    color: var(--fg);
    font-family: var(--body);
    font-size: 17px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
}

/* Atmosphere: warm paper + faint grid + soft accent tints */
body.site::before {
    content: "";
    position: fixed; inset: 0; z-index: -2;
    background:
        radial-gradient(55% 45% at 82% -6%, rgba(255, 74, 37, .10), transparent 60%),
        radial-gradient(45% 40% at 6% 8%, rgba(17, 112, 90, .07), transparent 55%),
        var(--paper);
}
body.site::after {
    content: "";
    position: fixed; inset: 0; z-index: -1;
    background-image:
        linear-gradient(rgba(26,22,16,.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(26,22,16,.05) 1px, transparent 1px);
    background-size: 64px 64px;
    -webkit-mask-image: radial-gradient(80% 60% at 50% 0%, #000 25%, transparent 78%);
            mask-image: radial-gradient(80% 60% at 50% 0%, #000 25%, transparent 78%);
    opacity: .8;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
::selection { background: var(--accent); color: var(--on-accent); }

.wrap { width: min(100% - 2.6rem, var(--wrap)); margin-inline: auto; }

/* ---- Type helpers -------------------------------------------------------- */
.eyebrow {
    font-family: var(--mono); font-size: .76rem; letter-spacing: .22em;
    text-transform: uppercase; color: var(--fg-mute);
    display: inline-flex; align-items: center; gap: .6rem;
}
.eyebrow::before {
    content: ""; width: 7px; height: 7px; border-radius: 50%;
    background: var(--accent); box-shadow: 0 0 0 4px rgba(255,74,37,.16);
    animation: pulse 2.4s ease-in-out infinite;
}
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }

.display { font-family: var(--display); font-weight: 700; line-height: .98; letter-spacing: -.025em; margin: 0; }
.ink-accent, .accent { color: var(--accent); }
.lead { color: var(--fg-soft); font-size: 1.12rem; max-width: 54ch; }

/* ---- Buttons ------------------------------------------------------------- */
.btn {
    --bg: transparent;
    display: inline-flex; align-items: center; gap: .55rem;
    font-family: var(--mono); font-size: .82rem; letter-spacing: .04em; font-weight: 500;
    padding: .85rem 1.4rem; border-radius: 999px;
    border: 1px solid var(--line-2); background: var(--bg); color: var(--fg);
    cursor: pointer;
    transition: transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s, background .25s, color .25s, border-color .25s;
    white-space: nowrap;
}
.btn:hover { transform: translateY(-2px); }
.btn--primary { --bg: var(--accent); color: var(--on-accent); border-color: var(--accent); font-weight: 600; }
.btn--primary:hover { box-shadow: var(--glow); }
.btn--ghost { background: var(--panel); }
.btn--ghost:hover { border-color: var(--accent); color: var(--accent); }
.btn--lg { padding: 1.05rem 1.8rem; font-size: .9rem; }
.btn__arrow { transition: transform .25s; }
.btn:hover .btn__arrow { transform: translateX(3px); }

/* ---- Header -------------------------------------------------------------- */
.nav { position: sticky; top: 0; z-index: 50; transition: background .3s, border-color .3s, backdrop-filter .3s, box-shadow .3s; border-bottom: 1px solid transparent; }
.nav.is-stuck { background: rgba(250, 247, 241, .82); backdrop-filter: saturate(140%) blur(14px); border-bottom-color: var(--line); box-shadow: var(--shadow-sm); }
.nav__inner { display: flex; align-items: center; gap: 1.5rem; height: 76px; }
.nav__brand { display: flex; align-items: center; gap: .55rem; margin-right: auto; }
.nav__brand img { height: 30px; width: auto; }
.nav__brand .wordmark { font-family: var(--display); font-weight: 700; font-size: 1.32rem; letter-spacing: -.02em; }
.nav__links { display: flex; gap: .35rem; }
.nav__links a { position: relative; padding: .5rem .85rem; font-size: .95rem; color: var(--fg-soft); border-radius: 8px; transition: color .2s; }
.nav__links a::after { content: ""; position: absolute; left: .85rem; right: .85rem; bottom: .28rem; height: 2px; background: var(--accent); transform: scaleX(0); transform-origin: left; transition: transform .28s cubic-bezier(.2,.8,.2,1); }
.nav__links a:hover, .nav__links a.is-active { color: var(--fg); }
.nav__links a:hover::after, .nav__links a.is-active::after { transform: scaleX(1); }
.nav__actions { display: flex; align-items: center; gap: .7rem; }
.nav__burger { display: none; width: 44px; height: 44px; border: 1px solid var(--line-2); border-radius: 11px; background: var(--panel); color: var(--fg); font-size: 1.2rem; cursor: pointer; }
.nav__drawer { display: none; }

/* ---- Section scaffolding ------------------------------------------------- */
.section { padding: clamp(4.5rem, 9vw, 8rem) 0; }
.section--tight { padding: clamp(3rem, 6vw, 5rem) 0; }
.sec-head { max-width: 60ch; margin-bottom: 3rem; }
.sec-head h2 { font-family: var(--display); font-weight: 700; font-size: clamp(2rem, 4.4vw, 3.1rem); line-height: 1.02; letter-spacing: -.025em; margin: 1rem 0 .9rem; }
.sec-head p { color: var(--fg-soft); margin: 0; }
.sec-head--center { margin-inline: auto; text-align: center; }
.sec-head--center .eyebrow { justify-content: center; }

/* ---- Hero ---------------------------------------------------------------- */
.hero { position: relative; padding-top: clamp(3rem, 6vw, 5rem); padding-bottom: clamp(4rem, 8vw, 7rem); }
.hero__grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.hero__title { font-family: var(--display); font-weight: 700; font-size: clamp(2.8rem, 7vw, 5.4rem); line-height: .94; letter-spacing: -.03em; margin: 1.4rem 0; }
.hero__title .accent { color: var(--accent); white-space: nowrap; }
.hero__sub { color: var(--fg-soft); font-size: 1.18rem; max-width: 46ch; margin: 0 0 2rem; }
.hero__cta { display: flex; gap: .9rem; flex-wrap: wrap; align-items: center; }
.hero__note { margin-top: 1.6rem; font-family: var(--mono); font-size: .78rem; color: var(--fg-mute); letter-spacing: .03em; }

.rise { opacity: 0; transform: translateY(22px); animation: rise .9s cubic-bezier(.2,.8,.2,1) forwards; }
.rise-1 { animation-delay: .05s; } .rise-2 { animation-delay: .16s; } .rise-3 { animation-delay: .27s; }
.rise-4 { animation-delay: .38s; } .rise-5 { animation-delay: .5s; }
@keyframes rise { to { opacity: 1; transform: none; } }

/* ---- Hero "command deck" centerpiece ------------------------------------- */
.deck { position: relative; border-radius: var(--r-xl); background: var(--panel); border: 1px solid var(--line-2); box-shadow: var(--shadow-xl); overflow: hidden; animation: float 7s ease-in-out infinite; }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
.deck::before { content: ""; position: absolute; inset: 0; background: radial-gradient(120% 80% at 80% -10%, rgba(255,74,37,.10), transparent 55%); pointer-events: none; }
.deck__bar { display: flex; align-items: center; gap: .6rem; padding: .9rem 1.1rem; border-bottom: 1px solid var(--line); background: var(--panel-2); }
.deck__dot { width: 11px; height: 11px; border-radius: 50%; background: var(--line-2); }
.deck__dot:nth-child(1) { background: var(--accent); }
.deck__dot:nth-child(2) { background: #f0a500; }
.deck__dot:nth-child(3) { background: var(--accent-2); }
.deck__title { margin-left: .6rem; font-family: var(--mono); font-size: .74rem; letter-spacing: .12em; text-transform: uppercase; color: var(--fg-mute); }
.deck__live { margin-left: auto; font-family: var(--mono); font-size: .68rem; letter-spacing: .14em; color: var(--accent); display: inline-flex; align-items: center; gap: .4rem; }
.deck__live::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 8px var(--accent); animation: pulse 1.6s infinite; }
.deck__body { padding: .6rem; display: grid; gap: .5rem; }
.row { display: grid; grid-template-columns: auto 1fr auto; gap: .8rem; align-items: center; padding: .8rem .9rem; border-radius: var(--r); background: var(--paper-2); border: 1px solid var(--line); transition: transform .3s, border-color .3s, background .3s; }
.row:hover { transform: translateX(4px); border-color: var(--line-2); background: #fff; }
.row__badge { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; font-family: var(--mono); font-size: .72rem; font-weight: 600; color: var(--on-accent); background: var(--fg); }
.row__badge--ig { background: linear-gradient(135deg, #f9a14a, #ff5b8d); color: #fff; }
.row__badge--x  { background: #fff; color: var(--fg); border: 1px solid var(--line-2); }
.row__badge--gb { background: var(--accent-2); color: #fff; }
.row__meta { min-width: 0; }
.row__who { font-size: .9rem; font-weight: 600; }
.row__text { font-size: .82rem; color: var(--fg-mute); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tag { font-family: var(--mono); font-size: .64rem; letter-spacing: .08em; text-transform: uppercase; padding: .28rem .55rem; border-radius: 999px; border: 1px solid var(--line-2); color: var(--fg-soft); white-space: nowrap; background: var(--paper-2); }
.tag--urgent { color: var(--accent); border-color: rgba(255,74,37,.4); background: rgba(255,74,37,.08); }
.tag--lead   { color: var(--accent-2); border-color: rgba(17,112,90,.4); background: rgba(17,112,90,.08); }
.tag--pos    { color: var(--accent-3); border-color: rgba(47,95,224,.4); background: rgba(47,95,224,.08); }
.deck__float { position: absolute; right: -14px; bottom: 26px; background: var(--accent); color: var(--on-accent); font-family: var(--mono); font-size: .72rem; font-weight: 600; letter-spacing: .04em; padding: .7rem .95rem; border-radius: 12px; box-shadow: var(--glow); animation: float 5.5s ease-in-out infinite reverse; }

/* ---- Marquee ------------------------------------------------------------- */
.marquee { border-block: 1px solid var(--line); padding: 1.4rem 0; -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); overflow: hidden; }
.marquee__track { display: flex; gap: 1rem; width: max-content; animation: scroll 36s linear infinite; }
.marquee:hover .marquee__track { animation-play-state: paused; }
@keyframes scroll { to { transform: translateX(-50%); } }
.chip { flex: none; font-family: var(--mono); font-size: .8rem; letter-spacing: .06em; color: var(--fg-soft); padding: .6rem 1.05rem; border: 1px solid var(--line-2); border-radius: 999px; background: var(--panel); display: inline-flex; align-items: center; gap: .5rem; }
.chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }

/* ---- Feature cards ------------------------------------------------------- */
.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
.card { position: relative; padding: 1.8rem; border-radius: var(--r-lg); background: var(--panel); border: 1px solid var(--line); overflow: hidden; box-shadow: var(--shadow-sm); transition: transform .35s cubic-bezier(.2,.8,.2,1), border-color .35s, box-shadow .35s; }
.card::after { content: ""; position: absolute; inset: 0; background: radial-gradient(120% 90% at 100% 0%, rgba(255,74,37,.08), transparent 50%); opacity: 0; transition: opacity .35s; }
.card:hover { transform: translateY(-6px); border-color: var(--line-2); box-shadow: var(--shadow-md); }
.card:hover::after { opacity: 1; }
.card__ico { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 13px; background: rgba(255,74,37,.1); border: 1px solid rgba(255,74,37,.25); color: var(--accent); margin-bottom: 1.1rem; }
.card__ico svg { width: 24px; height: 24px; }
.card h3 { font-family: var(--display); font-weight: 600; font-size: 1.3rem; margin: 0 0 .5rem; letter-spacing: -.01em; }
.card p { color: var(--fg-soft); margin: 0; font-size: .96rem; }
.card--wide { grid-column: span 2; }

/* ---- Pipeline ------------------------------------------------------------ */
.pipe { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; counter-reset: step; }
.pipe__step { position: relative; padding: 1.6rem; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--panel); box-shadow: var(--shadow-sm); }
.pipe__step::before { counter-increment: step; content: "0" counter(step); font-family: var(--mono); font-size: .8rem; color: var(--accent); letter-spacing: .1em; }
.pipe__step h3 { font-family: var(--display); font-size: 1.32rem; font-weight: 600; margin: .5rem 0 .5rem; }
.pipe__step p { color: var(--fg-soft); margin: 0; font-size: .94rem; }
.pipe__step:not(:last-child)::after { content: "→"; position: absolute; right: -1.05rem; top: 50%; transform: translateY(-50%); color: var(--fg-mute); font-size: 1.2rem; }

/* ---- Split (AI) ---------------------------------------------------------- */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.composer { border-radius: var(--r-xl); border: 1px solid var(--line-2); background: var(--panel); box-shadow: var(--shadow-md); padding: 1.3rem; }
.composer__src { border-left: 3px solid var(--accent); padding: .2rem 0 .2rem .9rem; margin-bottom: 1.1rem; }
.composer__src .who { font-size: .82rem; color: var(--fg-mute); font-family: var(--mono); letter-spacing: .04em; }
.composer__src .msg { font-size: 1rem; color: var(--fg); margin-top: .3rem; }
.composer__draft { background: rgba(255,74,37,.06); border: 1px solid rgba(255,74,37,.22); border-radius: var(--r); padding: 1rem; }
.composer__draft .label { font-family: var(--mono); font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
.composer__draft .body { margin-top: .5rem; font-size: .98rem; color: var(--fg-soft); }
.composer__tools { display: flex; gap: .5rem; margin-top: 1rem; flex-wrap: wrap; }
.composer__tools .pillbtn { font-family: var(--mono); font-size: .72rem; letter-spacing: .05em; padding: .45rem .8rem; border-radius: 999px; border: 1px solid var(--line-2); color: var(--fg-soft); background: var(--paper-2); }

/* ---- Stats band ---------------------------------------------------------- */
.stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.stat-b { text-align: center; padding: 1.6rem 1rem; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--panel); box-shadow: var(--shadow-sm); }
.stat-b__n { font-family: var(--display); font-weight: 700; font-size: clamp(2.2rem, 4vw, 3rem); color: var(--accent); letter-spacing: -.02em; }
.stat-b__l { font-family: var(--mono); font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; color: var(--fg-mute); margin-top: .3rem; }

/* ---- CTA ----------------------------------------------------------------- */
.cta { position: relative; text-align: center; border-radius: var(--r-xl); padding: clamp(3rem, 7vw, 5.5rem) 1.5rem; background: linear-gradient(180deg, var(--panel), var(--panel-2)); border: 1px solid var(--line-2); overflow: hidden; box-shadow: var(--shadow-md); }
.cta::before { content: ""; position: absolute; inset: 0; background: radial-gradient(60% 120% at 50% -20%, rgba(255,74,37,.16), transparent 60%); }
.cta > * { position: relative; }
.cta h2 { font-family: var(--display); font-weight: 700; font-size: clamp(2.2rem, 5vw, 3.6rem); line-height: 1; letter-spacing: -.03em; margin: 0 0 1rem; }
.cta p { color: var(--fg-soft); max-width: 50ch; margin: 0 auto 2rem; }
.cta__row { display: flex; gap: .9rem; justify-content: center; flex-wrap: wrap; }

/* ---- Forms --------------------------------------------------------------- */
.formwrap { max-width: 600px; }
.field { margin-bottom: 1.1rem; }
.field label { display: block; font-family: var(--mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--fg-mute); margin-bottom: .5rem; }
.field input, .field textarea { width: 100%; background: var(--panel); border: 1px solid var(--line-2); border-radius: var(--r); color: var(--fg); font-family: var(--body); font-size: 1rem; padding: .85rem 1rem; transition: border-color .2s, box-shadow .2s; }
.field input:focus, .field textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 4px rgba(255,74,37,.14); }
.field textarea { min-height: 140px; resize: vertical; }

/* ---- Prose --------------------------------------------------------------- */
.prose { max-width: 70ch; color: var(--fg-soft); }
.prose h1 { font-family: var(--display); font-size: clamp(2.2rem,5vw,3rem); color: var(--fg); letter-spacing: -.025em; margin: 0 0 1.2rem; }
.prose h2 { font-family: var(--display); font-size: 1.4rem; color: var(--fg); margin: 2.2rem 0 .7rem; }
.prose p, .prose li { line-height: 1.75; }
.prose a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }

/* ---- Flash --------------------------------------------------------------- */
.flash-stack { width: min(100% - 2.6rem, var(--wrap)); margin: 1.4rem auto 0; }
.flash { padding: .9rem 1.1rem; border-radius: var(--r); font-size: .95rem; margin-bottom: .6rem; border: 1px solid var(--line-2); background: var(--panel); }
.flash--success { background: rgba(17,112,90,.1); border-color: rgba(17,112,90,.35); color: var(--fg); }
.flash--error { background: rgba(255,74,37,.1); border-color: rgba(255,74,37,.4); color: var(--fg); }
.flash ul { margin: .4rem 0 0; padding-left: 1.1rem; }
.flash__close { float: right; background: none; border: 0; color: var(--fg-mute); font-size: 1.2rem; cursor: pointer; line-height: 1; }

/* ---- Footer -------------------------------------------------------------- */
.foot { border-top: 1px solid var(--line); margin-top: 3rem; padding: clamp(3rem, 6vw, 4.5rem) 0 2rem; }
.foot__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 2rem; }
.foot__brand .wordmark { font-family: var(--display); font-weight: 700; font-size: 1.5rem; }
.foot__brand p { color: var(--fg-mute); font-size: .92rem; max-width: 30ch; margin: .8rem 0 0; }
.foot__col h4 { font-family: var(--mono); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--fg-mute); margin: 0 0 1rem; }
.foot__col a { display: block; color: var(--fg-soft); padding: .3rem 0; font-size: .95rem; transition: color .2s; }
.foot__col a:hover { color: var(--accent); }
.foot__base { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .6rem; margin-top: 3rem; padding-top: 1.6rem; border-top: 1px solid var(--line); font-family: var(--mono); font-size: .74rem; letter-spacing: .04em; color: var(--fg-mute); }

/* ---- Scroll reveal ------------------------------------------------------- */
[data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity .8s cubic-bezier(.2,.8,.2,1), transform .8s cubic-bezier(.2,.8,.2,1); }
[data-reveal].in { opacity: 1; transform: none; }

/* ---- Secondary pages ----------------------------------------------------- */
.phero { padding: clamp(3.5rem, 7vw, 6rem) 0 clamp(1.2rem, 3vw, 2.2rem); }
.phero h1 { font-family: var(--display); font-weight: 700; font-size: clamp(2.4rem, 6vw, 4rem); line-height: 1; letter-spacing: -.03em; margin: 1rem 0 1rem; }
.phero .lead { font-size: 1.15rem; }
.panel { background: var(--panel); border: 1px solid var(--line-2); border-radius: var(--r-xl); padding: 1.7rem; box-shadow: var(--shadow-md); }
.split-2 { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.formgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
.btn--block { width: 100%; justify-content: center; }
.platgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.pcard { padding: 1.4rem; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--panel); box-shadow: var(--shadow-sm); transition: transform .3s, border-color .3s, box-shadow .3s; }
.pcard:hover { transform: translateY(-4px); border-color: var(--line-2); box-shadow: var(--shadow-md); }
.pcard__cat { font-family: var(--mono); font-size: .64rem; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
.pcard h3 { font-family: var(--display); font-size: 1.18rem; font-weight: 600; margin: .5rem 0 .4rem; }
.pcard p { color: var(--fg-mute); font-size: .85rem; margin: 0; }
.note { border: 1px solid rgba(255,74,37,.25); background: rgba(255,74,37,.06); border-radius: var(--r-lg); padding: 1.4rem 1.6rem; color: var(--fg-soft); margin-top: 2rem; }
.note strong { color: var(--fg); }
.contact-list { list-style: none; padding: 0; margin: 1.8rem 0 0; display: grid; gap: .9rem; }
.contact-list li { color: var(--fg-soft); }
.contact-list strong { font-family: var(--mono); font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--fg-mute); margin-right: .7rem; }
.link-arrow { color: var(--accent); font-family: var(--mono); font-size: .85rem; letter-spacing: .03em; display: inline-flex; gap: .4rem; margin-top: 1.4rem; transition: gap .2s; }
.link-arrow:hover { gap: .75rem; }

/* ---- Auth ---------------------------------------------------------------- */
.auth { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; width: min(100% - 2.6rem, var(--wrap)); margin: clamp(2.5rem, 6vw, 5rem) auto; min-height: 58vh; }
.auth--narrow { grid-template-columns: 1fr; max-width: 520px; }
.auth__card { background: var(--panel); border: 1px solid var(--line-2); border-radius: var(--r-xl); box-shadow: var(--shadow-xl); padding: clamp(1.8rem, 4vw, 2.6rem); }
.auth__brand { display: inline-flex; align-items: center; gap: .55rem; margin-bottom: 1.4rem; }
.auth__brand .brand__mark-img { border-radius: 8px; }
.auth__brand .brand__name { font-family: var(--display); font-weight: 700; font-size: 1.4rem; }
.auth__title { font-family: var(--display); font-weight: 700; font-size: clamp(1.8rem, 4vw, 2.4rem); letter-spacing: -.02em; margin: .2rem 0 .4rem; }
.auth__sub { color: var(--fg-soft); margin: 0 0 1.6rem; }
.form .field { display: block; margin-bottom: 1.05rem; }
.field__label { display: block; font-family: var(--mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--fg-mute); margin-bottom: .5rem; }
.input { width: 100%; background: var(--panel); border: 1px solid var(--line-2); border-radius: var(--r); color: var(--fg); font-family: var(--body); font-size: 1rem; padding: .8rem 1rem; transition: border-color .2s, box-shadow .2s; }
.input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 4px rgba(255,74,37,.14); }
.input.is-invalid { border-color: var(--accent); }
.field__error { display: block; color: var(--accent); font-size: .82rem; margin-top: .35rem; }
.form__row--split { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.2rem; }
.check { display: inline-flex; align-items: center; gap: .5rem; color: var(--fg-soft); font-size: .9rem; }
.check input { accent-color: var(--accent); }
.link { color: var(--accent); font-size: .9rem; }
.link:hover { text-decoration: underline; text-underline-offset: 3px; }
.auth__demo { margin-top: 1.6rem; padding-top: 1.4rem; border-top: 1px solid var(--line); }
.auth__demo h4 { font-family: var(--mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--fg-mute); margin: 0 0 .8rem; font-weight: 500; }
.auth__demo h4 span { text-transform: none; letter-spacing: 0; }
.auth__demo code { background: var(--panel-2); padding: .1rem .4rem; border-radius: 5px; color: var(--accent); }
.auth__demo ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; }
.auth__demo li { font-size: .88rem; color: var(--fg-soft); }
.auth__demo strong { color: var(--fg); font-family: var(--mono); font-size: .82rem; }
.auth__aside { padding: 2rem; }
.auth__aside blockquote { margin: 0; }
.auth__aside blockquote p { font-family: var(--display); font-weight: 700; font-size: clamp(1.8rem, 3.5vw, 2.8rem); line-height: 1.05; letter-spacing: -.02em; color: var(--fg); }
.auth__aside cite { display: block; margin-top: 1.2rem; font-style: normal; color: var(--fg-mute); font-size: .95rem; max-width: 34ch; }
.auth__foot { margin-top: 1.4rem; }

/* ---- Responsive ---------------------------------------------------------- */
@media (max-width: 940px) {
    .hero__grid { grid-template-columns: 1fr; }
    .deck { max-width: 520px; }
    .split { grid-template-columns: 1fr; }
    .cards { grid-template-columns: 1fr 1fr; }
    .card--wide { grid-column: span 2; }
    .pipe { grid-template-columns: 1fr; gap: 1.8rem; }
    .pipe__step:not(:last-child)::after { content: "↓"; right: auto; left: 1.6rem; top: auto; bottom: -1.5rem; transform: none; }
    .stats { grid-template-columns: 1fr 1fr; }
    .foot__grid { grid-template-columns: 1fr 1fr; }
    .platgrid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) { .auth { grid-template-columns: 1fr; } .auth__aside { display: none; } .split-2 { grid-template-columns: 1fr; } }
@media (max-width: 720px) {
    body.site { font-size: 16px; }
    .nav__links, .nav__actions .btn--ghost { display: none; }
    .nav__burger { display: grid; place-items: center; }
    .cards { grid-template-columns: 1fr; }
    .card--wide { grid-column: span 1; }
    .stats { grid-template-columns: 1fr 1fr; }
    .foot__grid { grid-template-columns: 1fr 1fr; }
    .deck__float { right: 8px; }
    .nav__drawer.open { display: block; position: fixed; inset: 76px 0 0; z-index: 49; background: rgba(244,240,232,.97); backdrop-filter: blur(12px); padding: 1.5rem; }
    .nav__drawer.open a { display: block; font-family: var(--display); font-size: 1.6rem; padding: .9rem 0; border-bottom: 1px solid var(--line); color: var(--fg); }
    .nav__drawer.open .btn { margin-top: 1.4rem; width: 100%; justify-content: center; }
}
@media (max-width: 560px) { .formgrid { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .platgrid { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .foot__grid { grid-template-columns: 1fr; } }

/* ---- Reduced motion ------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto; }
    .rise, [data-reveal] { opacity: 1; transform: none; }
}

/* Flash variants: warning + info */
.flash--warning { background: rgba(240,165,0,.10); border-color: rgba(240,165,0,.4); color: var(--fg); }
.flash--info { background: rgba(47,95,224,.08); border-color: rgba(47,95,224,.35); color: var(--fg); }