/* GEN Systems — shared stylesheet.
   Colorways are CSS variable themes on <html data-colorway="1..5">.
   Default (no attribute) = Colorway 1 "Continuity" (VERIFIED palette:
   Burgundy #641D35, Navy #101C31, White #FFFFFF, silver mark accents).
   Colorways 2-5 are labeled proposals from COLORWAYS.md.
   =====================================================================
   PER-PAGE PALETTES (Anton, Oct 21): each page bakes ONE colorway via
   its <html data-colorway>; there is no switcher. Map: Home/Support/
   About/Capabilities/Who We Serve/Security/Motion/Videos = 1 Continuity;
   Ask GEN = 2; Framework/Approach/Knowledge & AI/System Preview = 4;
   Consult/Pilot/Privacy/Terms = 5. Header + footer chrome is constant
   (frosted-glass header) — palettes vary page bodies only.
   ===================================================================== */
:root, [data-colorway="1"]{
  --burgundy:#641D35; --burgundy-deep:#4A1428; --navy:#101C31; --navy-lift:#2A3550;
  --ink:#101C31; --text:#2B3242; --muted:#5A6376;
  --bg:#FFFFFF; --alt:#EEF0F3; --surface:#FFFFFF; --border:#C7CCD4;
  --header-bg:#101C31; --header-text:#FFFFFF;
  --hero-bg:#101C31; --hero-text:#FFFFFF; --hero-sub:#D8DCE4;
  --band-bg:#641D35; --band-text:#FFFFFF;
  --footer-bg:#101C31; --footer-text:#D8DCE4;
  --accent:#641D35; --accent-text:#FFFFFF; --link:#641D35;
  --card-dark:#2A3550; --silver:#9AA3AF; --silver-light:#C7CCD4;
  --tile-bd:#8B98AC; --sec-dark:#101C31;
}
/* Colorway 2 — Light Continuity (PROPOSAL) */
[data-colorway="2"]{
  --ink:#101C31; --text:#2B3242; --muted:#5A6376;
  --bg:#FFFFFF; --alt:#F5F1EC; --surface:#FFFFFF; --border:#C7CCD4;
  --header-bg:#FFFFFF; --header-text:#101C31;
  --tile-bd:#9AA3AF; --sec-dark:#2A3550;
  --hero-bg:#F5F1EC; --hero-text:#101C31; --hero-sub:#414B5E;
  --band-bg:#101C31; --band-text:#FFFFFF;
  --footer-bg:#101C31; --footer-text:#D8DCE4;
  --accent:#641D35; --accent-text:#FFFFFF; --link:#641D35;
}
/* Colorway 3 — Burgundy-Dominant (PROPOSAL) */
[data-colorway="3"]{
  --ink:#101C31; --text:#2B3242; --muted:#5A6376;
  --bg:#FFFFFF; --alt:#F5F1EC; --surface:#FFFFFF; --border:#C7CCD4;
  --header-bg:#101C31; --header-text:#FFFFFF;
  --tile-bd:#8B98AC; --sec-dark:#101C31;
  --hero-bg:#641D35; --hero-text:#FFFFFF; --hero-sub:#F0DCE3;
  --band-bg:#101C31; --band-text:#FFFFFF;
  --footer-bg:#101C31; --footer-text:#D8DCE4;
  --accent:#641D35; --accent-text:#FFFFFF; --link:#641D35;
}
/* Colorway 4 — Navy-Dominant / Institutional (PROPOSAL) */
[data-colorway="4"]{
  --tile-bd:#8B98AC; --sec-dark:#0B1322;
  --ink:#101C31; --text:#2B3242; --muted:#5A6376;
  --bg:#FFFFFF; --alt:#F5F1EC; --surface:#FFFFFF; --border:#C7CCD4;
  --header-bg:#101C31; --header-text:#FFFFFF;
  --hero-bg:#101C31; --hero-text:#FFFFFF; --hero-sub:#D8DCE4;
  --band-bg:#101C31; --band-text:#FFFFFF;
  --footer-bg:#0B1322; --footer-text:#D8DCE4;
  --accent:#641D35; --accent-text:#FFFFFF; --link:#641D35;
}
/* Colorway 5 — Silver / Neutral (PROPOSAL) */
[data-colorway="5"]{
  --tile-bd:#7C8798; --sec-dark:#2A3550;
  --ink:#101C31; --text:#2B3242; --muted:#525B6D;
  --bg:#F5F1EC; --alt:#E9E4DC; --surface:#FFFFFF; --border:#9AA3AF;
  --header-bg:#F5F1EC; --header-text:#101C31;
  --hero-bg:#E9E4DC; --hero-text:#101C31; --hero-sub:#414B5E;
  --band-bg:#101C31; --band-text:#FFFFFF;
  --footer-bg:#101C31; --footer-text:#D8DCE4;
  --accent:#641D35; --accent-text:#FFFFFF; --link:#641D35;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--text);background:var(--bg);line-height:1.6;font-size:16.5px}
h1,h2,h3{font-family:'Fraunces',Georgia,serif;color:var(--ink);line-height:1.18;font-weight:600}
h1{font-size:2.5rem} h2{font-size:1.85rem;margin-bottom:.6rem} h3{font-size:1.18rem;margin-bottom:.35rem}
p{margin-bottom:1rem} a{color:var(--link)}
.wrap{max-width:1140px;margin:0 auto;padding:0 22px}
.eyebrow{font-size:.78rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:.7rem}
.lede{font-size:1.13rem}
section{padding:56px 0}
.alt{background:var(--alt)}
.skip{position:absolute;left:-9999px;top:0;background:var(--navy);color:#fff;padding:10px 16px;z-index:200}
.skip:focus{left:8px;top:8px}
/* Header */
header.site{position:sticky;top:0;z-index:100;background:var(--header-bg);color:var(--header-text);border-bottom:3px solid var(--burgundy)}
.head-in{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 0}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--header-text)}
.brand img{height:38px;width:auto}
.brand .wm{font-family:'Fraunces',Georgia,serif;font-weight:700;font-size:1.3rem;letter-spacing:.03em;line-height:1;color:var(--header-text)}
.brand .wm small{display:block;font-family:'Inter',sans-serif;font-weight:600;font-size:.58rem;letter-spacing:.52em;margin-top:3px}
nav.main{display:flex;gap:22px;align-items:center}
nav.main a{color:var(--header-text);text-decoration:none;font-size:.94rem;font-weight:500}
nav.main a:hover{text-decoration:underline}
nav.main .has-drop{position:relative}
.drop{display:none;position:absolute;top:100%;left:0;background:#fff;color:#2B3242;border:1px solid #C7CCD4;border-radius:10px;padding:10px;min-width:230px;box-shadow:0 10px 30px rgba(16,28,49,.18)}
.drop a{display:block;color:#101C31;padding:6px 8px;border-radius:6px}
.drop a:hover{background:#EEF0F3;text-decoration:none}
.has-drop:hover .drop,.has-drop:focus-within .drop{display:block}
.btn{display:inline-block;background:var(--accent);color:var(--accent-text);font-weight:600;font-size:.95rem;padding:11px 22px;border-radius:999px;text-decoration:none;border:1px solid var(--accent)}
.btn:hover{filter:brightness(1.12)}
.btn.ghost{background:transparent;color:inherit;border-color:currentColor}
.btn.light{background:#fff;color:#101C31;border-color:#fff}
.menu-btn{display:none;background:none;border:1px solid rgba(140,150,165,.5);color:var(--header-text);border-radius:8px;padding:8px 12px;font-size:.9rem}
.cta-mobile{display:none}
/* Frosted-glass header — the standard chrome on every page (Anton, Oct 21).
   Translucent white glass over whatever hero scrolls beneath it; dark
   lockup for contrast; near-opaque white fallback when backdrop-filter
   is unavailable. Logo, nav and CTA content are unchanged. */
header.site{background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);color:#101C31;border-bottom:1px solid rgba(16,28,49,.14);box-shadow:0 8px 28px rgba(16,28,49,.10)}
header.site .brand,header.site .brand .wm,header.site nav.main a{color:#101C31}
header.site .menu-btn{color:#101C31;border-color:rgba(16,28,49,.35)}
@supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){header.site{background:rgba(255,255,255,.97)}}
/* Agent Hub (/support/) */
.hub-hero{display:flex;gap:36px;align-items:center;flex-wrap:wrap}
.hub-hero>div{flex:1 1 340px}
.hub-art{flex:0 1 360px;background:#0B1322;border:2px solid #C7CCD4;border-radius:18px;padding:10px;margin:0}
.hub-art img{width:100%;height:auto;display:block;border-radius:12px}
.hub-art figcaption{color:#D8DCE4;font-size:.85rem;padding:9px 4px 3px;text-align:center}
.hub-lead{display:flex;gap:20px;align-items:center;flex-wrap:wrap}
.hub-lead-body{flex:1 1 300px}
.hub-thumb{width:64px;height:64px;border-radius:50%;object-fit:cover;border:2px solid var(--tile-bd);flex:0 0 auto}
.hub-lead .hub-thumb{width:84px;height:84px}
.hub-name{font-family:'Fraunces',Georgia,serif;font-size:1.5rem;font-weight:700;color:var(--ink);margin:0}
.hub-scope{margin:.3rem 0}
.hub-where{font-size:.85rem;font-weight:600;letter-spacing:.04em;color:var(--muted);text-transform:uppercase;margin:.1rem 0}
.hub-meta{font-size:.85rem;color:var(--muted);margin:.2rem 0 .5rem}
.hub-tile h3{margin-top:.6rem}
.st{font-weight:700;font-size:.8rem;letter-spacing:.03em}
.st-live{color:#1E7A46}
.st-staged{color:#5A6376}
.sev-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:16px}
.sev{border:2px solid var(--tile-bd);border-radius:12px;padding:13px 15px;background:var(--surface);display:grid;gap:3px}
.sev b{color:var(--ink);font-size:.95rem}
.sev span{font-size:.9rem;color:var(--text)}
.hub-note{font-size:.92rem;color:var(--muted);margin-top:14px}
/* Hero + bands */
.hero{background:var(--hero-bg);color:var(--hero-text);padding:64px 0 56px}
.hero h1{color:var(--hero-text);max-width:820px}
.hero .tagline{font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:1.25rem;color:var(--hero-text);margin:14px 0 6px}
.hero p{color:var(--hero-sub);max-width:760px}
.hero .row{display:flex;gap:34px;align-items:center;flex-wrap:wrap}
.hero .art{flex:0 0 300px}
.hero .art img{width:100%;height:auto;border-radius:16px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.band{background:var(--band-bg);color:var(--band-text);padding:52px 0}
.band h2{color:var(--band-text)}
.band p{color:var(--band-text);max-width:720px}
/* Layout blocks */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin-top:24px}
.card{background:var(--surface);border:2px solid var(--tile-bd);border-radius:16px;padding:22px}
.card h3 a{color:var(--ink);text-decoration:none}
.card h3 a:hover{text-decoration:underline}
.steps{counter-reset:step}
.step{display:flex;gap:16px;margin-top:20px}
.step .n{counter-increment:step;flex:0 0 42px;height:42px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}
.step .n::before{content:counter(step)}
.diagram{display:grid;gap:12px;margin-top:24px}
.dia-node{border:2px solid var(--tile-bd);border-left:5px solid var(--accent);border-radius:12px;padding:16px 18px;background:var(--surface)}
.dia-arrow{text-align:center;color:var(--muted);font-size:1.1rem;line-height:1}
table{width:100%;border-collapse:collapse;margin-top:18px;font-size:.95rem}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:2px solid var(--tile-bd);border-radius:12px;margin-top:18px}
.table-wrap table{margin-top:0;min-width:640px}
th,td{border:1px solid var(--border);padding:9px 12px;text-align:left;vertical-align:top}
th{background:var(--alt);color:var(--ink)}
.note{border:1px solid var(--tile-bd);border-left:4px solid var(--accent);background:var(--alt);padding:14px 18px;border-radius:0 12px 12px 0;margin:20px 0;font-size:.97rem}
ul.tight li{margin:6px 0 6px 20px}
.faq details{border:2px solid var(--tile-bd);border-radius:12px;padding:14px 18px;margin-top:12px;background:var(--surface)}
.faq summary{font-weight:600;color:var(--ink);cursor:pointer}
.demo-banner{background:var(--burgundy);color:#fff;padding:12px 0;font-size:.93rem;font-weight:600;text-align:center}
.tabs,.views{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0}
.tabs button,.views button{border:1px solid var(--accent);background:var(--surface);color:var(--accent);font-weight:600;padding:10px 20px;border-radius:999px;cursor:pointer;font-size:.95rem}
.tabs button[aria-selected="true"],.views button[aria-selected="true"]{background:var(--accent);color:#fff}
form.consult{display:grid;gap:14px;max-width:620px;margin-top:20px}
form.consult label{font-weight:600;color:var(--ink);display:grid;gap:6px;font-size:.97rem}
form.consult input,form.consult select,form.consult textarea{font:inherit;padding:11px 13px;border:1px solid var(--tile-bd);border-radius:10px;background:var(--surface);color:var(--text);width:100%}
form.consult .consent{font-weight:400;display:flex;gap:10px;align-items:flex-start}
form.consult .consent input{width:auto;margin-top:5px}
footer.site{background:var(--footer-bg);color:var(--footer-text);padding:44px 0 34px;font-size:.93rem}
footer.site a{color:var(--footer-text)}
footer.site .cols{display:flex;gap:40px;flex-wrap:wrap;justify-content:space-between}
footer.site nav{display:grid;gap:7px}
footer.site .tag{font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:1.05rem;color:#fff}
.small{font-size:.86rem;color:var(--muted)}
footer.site .small{color:var(--footer-text);opacity:.85}
/* ============================================================
   PREVIEW-ONLY colorway switcher — REMOVE BEFORE PRODUCTION
   ============================================================ */
/* Colorways are baked per page (data-colorway on <html>) — no switcher. */
.fig{margin:24px 0}
.fig img{width:100%;height:auto;display:block;border-radius:16px}
.card img.slot{width:100%;height:auto;display:block;border-radius:10px;margin-bottom:14px}
.band-img{display:block;width:100%;height:auto}
/* ============================================================
   Background-built imagery (Oct 20, 2026, Anton direction):
   imagery is the environment content sits in — full-screen and
   full-bleed background sections, sticky depth layers — never a
   picture in a box. Scrim is a fixed deep-navy treatment in EVERY
   colorway (the artwork family is navy-based), and text over
   imagery is always white/light with AA-checked scrims.
   ============================================================ */
/* Home hero: full-viewport arch backdrop, copy framed left over
   the image's open negative space; arch reads as silhouette. */
.hero-full{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;padding:88px 0 76px;background-color:#0B1322;background-image:url('/assets/img/hero-arch-full.jpg');background-size:cover;background-position:center 38%;color:#FFFFFF;--hero-text:#FFFFFF;--hero-sub:#DCE3EE;overflow:hidden}
.hero-full::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(10,17,32,.44),rgba(10,17,32,.44)),linear-gradient(97deg,rgba(9,15,27,.94) 0%,rgba(9,15,27,.86) 42%,rgba(9,15,27,.58) 70%,rgba(9,15,27,.42) 100%),linear-gradient(to top,rgba(9,15,27,.62) 0%,rgba(9,15,27,0) 42%),linear-gradient(to bottom,rgba(9,15,27,.45) 0%,rgba(9,15,27,0) 26%);z-index:0}
.hero-full>.wrap{position:relative;z-index:1;width:100%}
.hero-full h1{color:#FFFFFF;max-width:640px;text-shadow:0 1px 10px rgba(5,9,18,.45)}
.hero-full .tagline{color:#FFFFFF}
.hero-full p{color:var(--hero-sub);max-width:600px}
/* Subpage heroes with a backdrop image (same scrim discipline) */
.hero--img{position:relative;background-size:cover;background-position:center;color:#FFFFFF;--hero-text:#FFFFFF;--hero-sub:#DCE3EE;overflow:hidden}
.hero--img::before{content:"";position:absolute;inset:0;background:linear-gradient(97deg,rgba(9,15,27,.89) 0%,rgba(9,15,27,.76) 48%,rgba(9,15,27,.52) 100%);z-index:0}
.hero--img>.wrap{position:relative;z-index:1}
.hero--img h1{color:#FFFFFF;text-shadow:0 1px 8px rgba(5,9,18,.4)}
/* Marble hero (Support): the face render's own deep-navy field is the page
   navy — the sphere is shown whole, floating right of the copy, never cropped.
   (Placement rule, Anton Oct 21 2026: face-in-marble = GEN present and speaking
   — the support hero; pure marble = GEN as system — Q&A + chrome. See BUILD-NOTES.) */
.hero--marble{background-color:#0B1626;background-size:auto 112%;background-position:right -54px center;background-repeat:no-repeat}
/* Full-bleed background sections: copy sits in the image */
.bgs{position:relative;background-color:#0E1830;background-size:cover;background-position:center;color:#E9EDF4;overflow:hidden}
.bgs::before{content:"";position:absolute;inset:0;background:linear-gradient(94deg,rgba(9,15,27,.88) 0%,rgba(9,15,27,.74) 52%,rgba(9,15,27,.58) 100%);z-index:0}
.bgs>.wrap{position:relative;z-index:1}
.bgs h2,.bgs h3{color:#FFFFFF}
.bgs p,.bgs li{color:#DCE3EE}
.bgs .eyebrow{color:#E7B7C8}
.bgs a{color:#FFFFFF;text-decoration:underline;text-underline-offset:3px}
.bgs .btn{text-decoration:none}
.bgs .card{background:rgba(10,18,33,.68);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);border-color:rgba(201,139,163,.55);color:#E9EDF4}
.bgs .card p{color:#DCE3EE}
.bgs .card h3 a{color:#FFFFFF}
.bgs .dia-node{background:rgba(10,18,33,.68);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);border-color:rgba(201,139,163,.55);border-left-color:#C98BA3;color:#E9EDF4}
.bgs .dia-arrow{color:#C7CCD4}
.bgs .note{background:rgba(10,18,33,.72);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);border:1px solid rgba(201,139,163,.5);border-left:4px solid #C98BA3;color:#E9EDF4}
/* Sticky depth sections: background layer holds (position:sticky)
   while glass content scrolls over it. Works on mobile, where
   background-attachment:fixed is unreliable — no fixed fallback
   needed because the sticky layer IS the mechanism. */
.depth{position:relative;padding:0;background:#0B1322}
.depth__bg{position:sticky;top:0;height:100vh;height:100svh;background-size:cover;background-position:center}
.depth__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(94deg,rgba(9,15,27,.82) 0%,rgba(9,15,27,.62) 55%,rgba(9,15,27,.48) 100%)}
.depth__content{position:relative;margin-top:-100vh;margin-top:-100svh;min-height:158vh;min-height:158svh;display:flex;flex-direction:column;justify-content:flex-end;gap:22px;padding:72px 0 84px}
.depth__content .wrap{width:100%}
.glass{background:rgba(9,16,29,.76);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgba(199,204,212,.50);border-radius:18px;padding:30px 32px;color:#E9EDF4;box-shadow:0 24px 60px rgba(3,6,12,.45)}
.glass h2,.glass h3{color:#FFFFFF}
.glass p,.glass li{color:#DCE3EE}
.glass .eyebrow{color:#E7B7C8}
.glass a{color:#FFFFFF;text-decoration:underline;text-underline-offset:3px}
.glass .btn{text-decoration:none}
.glass .note{background:rgba(255,255,255,.07);border-left-color:#C98BA3;color:#E9EDF4}
/* ============================================================
   Phase 2 (Oct 21, 2026, Anton direction): heroes rotate color
   across the site; sections alternate dark/light down every
   page; every tile carries a defined border; the top of the
   site leads burgundy + blue and the switcher dots — labeled
   "Site colors" — sit at the top and re-skin header + page.
   ============================================================ */
/* Plain-hero color rotation (brand palette constants) */
.hero--burg{--hero-bg:#641D35;--hero-text:#FFFFFF;--hero-sub:#F0DCE3}
.hero--burgdeep{--hero-bg:#4A1428;--hero-text:#FFFFFF;--hero-sub:#EFD9E0}
.hero--burg .eyebrow,.hero--burgdeep .eyebrow{color:#E7B7C8}
.hero--light{--hero-bg:#EEF0F3;--hero-text:#101C31;--hero-sub:#414B5E}
/* White primary CTA where the hero ground is burgundy */
.hero--burg .btn,.hero--burgdeep .btn,.hero-full .btn,.hero--img.scrim-burg .btn,.hero--img.scrim-mix .btn{background:#FFFFFF;color:#641D35;border-color:#FFFFFF}
.hero--burg .btn.ghost,.hero--burgdeep .btn.ghost,.hero-full .btn.ghost,.hero--img.scrim-burg .btn.ghost,.hero--img.scrim-mix .btn.ghost{background:transparent;color:#FFFFFF;border-color:rgba(255,255,255,.75)}
/* Image-hero / background-section scrim tints */
.hero--img.scrim-burg::before{background:linear-gradient(97deg,rgba(46,11,26,.90) 0%,rgba(46,11,26,.78) 48%,rgba(46,11,26,.56) 100%)}
.hero--img.scrim-mix::before{background:linear-gradient(97deg,rgba(46,11,26,.89) 0%,rgba(16,28,49,.78) 55%,rgba(16,28,49,.55) 100%)}
.bgs--burg::before{background:linear-gradient(94deg,rgba(46,11,26,.89) 0%,rgba(46,11,26,.76) 52%,rgba(46,11,26,.60) 100%)}
/* Home hero: burgundy-led scrim (blue held in the right field),
   steel-blue eyebrow + ghost accents */
.hero-full::before{background:linear-gradient(rgba(10,17,32,.40),rgba(10,17,32,.40)),linear-gradient(97deg,rgba(9,15,27,.94) 0%,rgba(9,15,27,.86) 40%,rgba(10,17,33,.60) 68%,rgba(16,28,49,.45) 100%),linear-gradient(to top,rgba(7,11,20,.66) 0%,rgba(7,11,20,0) 42%),linear-gradient(to bottom,rgba(9,15,27,.50) 0%,rgba(9,15,27,0) 26%)}
.hero-full .eyebrow{color:#B9CBE8}
.hero-full .btn.ghost{border-color:#B9CBE8;color:#EFF4FC}
/* Zebra beats: plain dark (navy, theme-softened via --sec-dark)
   and burgundy sections, with dark-beat tile treatments */
.dark-sec{background:var(--sec-dark);color:#E9EDF4}
.burg-sec{background:#641D35;color:#F7E8ED}
.dark-sec h2,.dark-sec h3,.burg-sec h2,.burg-sec h3{color:#FFFFFF}
.dark-sec p,.dark-sec li{color:#DCE3EE}
.burg-sec p,.burg-sec li{color:#F3DDE5}
.dark-sec .eyebrow,.burg-sec .eyebrow{color:#E7B7C8}
.dark-sec a,.burg-sec a{color:#FFFFFF;text-decoration:underline;text-underline-offset:3px}
.dark-sec .btn,.burg-sec .btn{background:#FFFFFF;color:#641D35;border-color:#FFFFFF;text-decoration:none}
.dark-sec .btn.ghost,.burg-sec .btn.ghost{background:transparent;color:#FFFFFF;border-color:rgba(255,255,255,.75)}
.dark-sec .card,.burg-sec .card{background:rgba(255,255,255,.06);border:2px solid rgba(199,204,212,.50);color:#E9EDF4}
.burg-sec .card{background:rgba(16,28,49,.28)}
.dark-sec .card h3 a,.burg-sec .card h3 a{color:#FFFFFF}
.dark-sec .card p{color:#DCE3EE}
.burg-sec .card p{color:#F3DDE5}
.dark-sec .dia-node,.burg-sec .dia-node{background:rgba(255,255,255,.06);border:2px solid rgba(199,204,212,.50);border-left:5px solid #C98BA3;color:#E9EDF4}
.dark-sec .note,.burg-sec .note{background:rgba(255,255,255,.07);border:1px solid rgba(199,204,212,.45);border-left:4px solid #C98BA3;color:#E9EDF4}
.dark-sec .step .n,.burg-sec .step .n{background:#FFFFFF;color:#641D35}
.dark-sec .faq details,.burg-sec .faq details{background:rgba(255,255,255,.06);border-color:rgba(199,204,212,.50)}
.dark-sec .faq summary,.burg-sec .faq summary{color:#FFFFFF}
.dark-sec .small,.burg-sec .small{color:#C7CCD4}
/* Visually hidden: carries a background image's alt equivalent */
.vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* Capability cards: image as a background panel, bled to the
   card's top edges — part of the card, not a framed picture */
.card .slot-bg{height:172px;margin:-22px -22px 16px;border-radius:16px 16px 0 0;background-size:cover;background-position:center}
@media(max-width:820px){
  .hero-full{background-position:64% 42%;padding:64px 0 60px}
  .hero-full::before{background:linear-gradient(rgba(10,17,32,.30),rgba(10,17,32,.30)),linear-gradient(to bottom,rgba(9,15,27,.90) 0%,rgba(9,15,27,.80) 55%,rgba(7,11,20,.72) 100%)}
  .hero--img::before{background:linear-gradient(to bottom,rgba(9,15,27,.88),rgba(9,15,27,.78))}
  .hero--marble{background-size:auto 76%;background-position:center 12%}
  .bgs::before{background:linear-gradient(to bottom,rgba(9,15,27,.88),rgba(9,15,27,.76))}
  .depth__bg::after{background:linear-gradient(to bottom,rgba(9,15,27,.84),rgba(9,15,27,.70))}
  .depth__content{min-height:150vh;min-height:150svh;padding:52px 0 64px}
  .glass{padding:24px 22px}
  .card .slot-bg{height:150px}
}
@media(max-width:820px){
  header.site nav.main{background:rgba(255,255,255,.97);-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);border-bottom:1px solid rgba(16,28,49,.14)}
  header.site .drop a{color:#101C31}
  .hub-art{flex:1 1 100%;max-width:340px}
  nav.main{display:none;position:absolute;top:100%;left:0;right:0;background:var(--header-bg);flex-direction:column;align-items:flex-start;padding:14px 22px 20px;gap:13px}
  nav.main.open{display:flex}
  .drop{position:static;display:block;background:transparent;border:none;box-shadow:none;padding:4px 0 0 14px}
  .drop a{color:var(--header-text)}
  .menu-btn{display:block}
  .cta-mobile{display:inline-block;padding:8px 14px;font-size:.85rem;margin-left:auto}
  h1{font-size:1.95rem} h2{font-size:1.5rem}
  section{padding:40px 0}
  .hero .art{flex:1 1 100%;max-width:340px}
  th,td{padding:7px 9px}
}

/* ============================================================
   PREVIEW-ONLY — Motion tests (/motion/) — REMOVE BEFORE PRODUCTION.
   Tile-build animation concepts for the GEN tile (Family A) and
   signature button transitions (Family B). Winner becomes the
   standard open/Speak/Ask motion on /support/ + /ask-gen/.
   No-JS / end state = fully built tile: parts are only hidden
   while JS adds .playing. Reduced motion = end state directly.
   ============================================================ */
.mtest{border:2px solid var(--tile-bd);border-radius:16px;padding:24px 24px 26px;margin:0 0 26px;background:#FFFFFF}
.mtest-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 16px;margin-bottom:16px}
.mtest-head h3{margin:0}
.mtest-head p{margin:0;flex:1 1 260px}
.mtest-head .btn{margin-left:auto}
.gen-stage{position:relative;border-radius:18px;padding:30px 18px 34px;background:radial-gradient(120% 130% at 50% 0%,#16263F 0%,#0B1626 62%);overflow:hidden}
.gen-tile{position:relative;max-width:560px;margin:0 auto;background:linear-gradient(165deg,#152640 0%,#0B1626 70%);border:2px solid rgba(199,204,212,.55);border-radius:18px;padding:30px 26px 26px;color:#E9EDF4;text-align:center;overflow:hidden;box-shadow:0 24px 60px rgba(3,6,12,.45)}
.gt-frame{position:absolute;inset:0;border:2px solid #C7CCD4;border-radius:16px;opacity:0;pointer-events:none}
.gt-orb{position:relative;width:150px;height:150px;margin:2px auto 14px}
.gt-orb img{width:150px;height:150px;border-radius:50%;object-fit:cover;display:block}
.gt-ripple{position:absolute;inset:-14px;border:2px solid rgba(199,204,212,.75);border-radius:50%;opacity:0;pointer-events:none}
.gt-ribbon{position:absolute;left:-25%;width:150%;height:58px;border-radius:50%;opacity:0;pointer-events:none}
.gt-ribbon.r1{top:16%;background:linear-gradient(90deg,transparent 0%,rgba(199,204,212,.85) 38%,rgba(154,163,175,.85) 62%,transparent 100%)}
.gt-ribbon.r2{bottom:14%;background:linear-gradient(90deg,transparent 0%,rgba(142,42,74,.9) 38%,rgba(100,29,53,.9) 62%,transparent 100%)}
.gt-dot{position:absolute;left:50%;top:40%;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;background:url('/assets/media-generation-gen-support-marble-pure-0-8bab65ac-ee92-408b-a8d0-5e5d4e8df183.webp') center/cover;box-shadow:0 0 26px 8px rgba(201,139,163,.65);opacity:0;pointer-events:none}
.gt-flood{position:absolute;inset:0;background:linear-gradient(to top,#641D35 0%,#3D1B33 55%,#101C31 100%);opacity:0;transform:scaleY(0);transform-origin:bottom;pointer-events:none}
.gt-shine{position:absolute;top:-10%;bottom:-10%;left:0;width:38%;background:linear-gradient(100deg,transparent 0%,rgba(255,255,255,.35) 50%,transparent 100%);transform:translateX(-170%) skewX(-14deg);pointer-events:none}
.gt-wire{position:absolute;inset:10px;border:1.5px dashed rgba(185,203,232,.85);border-radius:12px;opacity:0;pointer-events:none}
.gt-tick{position:absolute;font:600 .62rem/1 ui-monospace,Menlo,monospace;letter-spacing:.08em;color:#B9CBE8}
.gt-tick.t1{top:-7px;left:14px;background:#0E1B30;padding:0 6px}
.gt-tick.t2{bottom:-7px;right:14px;background:#0E1B30;padding:0 6px}
.gt-tick.t3{top:44%;left:-8px;background:#0E1B30;padding:4px 2px;writing-mode:vertical-rl}
.gt-eyebrow{margin:0 0 4px;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#E7B7C8}
.gt-name{margin:0 0 6px;font-family:Fraunces,Georgia,serif;font-size:1.9rem;font-weight:600;color:#FFFFFF}
.gt-status{margin:0 auto 18px;max-width:420px;color:#DCE3EE}
.gt-controls{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.gt-minis{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:640px;margin:0 auto 20px}
.gt-minis span{border:2px solid rgba(199,204,212,.55);border-radius:12px;padding:9px 14px;font-size:.85rem;font-weight:600;color:#E9EDF4;background:rgba(255,255,255,.05);opacity:0}
.gen-stage.done[data-anim="3"] .gt-minis span,.gen-stage:not(.playing)[data-anim="3"] .gt-minis span{opacity:1}
.gt-convo{display:none;text-align:left;margin-top:22px;border-top:1px solid rgba(199,204,212,.35);padding-top:18px}
.gen-tile.open .gt-convo{display:block;animation:gt-fade-up .35s ease both}
.gt-convo-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.gt-convo-head img{width:46px;height:46px;border-radius:50%;object-fit:cover;object-position:50% 34%}
.gt-convo-head b{color:#FFFFFF}
.gt-convo-head .small{color:#C7CCD4}
.gt-live{width:9px;height:9px;border-radius:50%;background:#7FB069;margin-left:auto}
.gt-bubble{background:rgba(255,255,255,.07);border:1px solid rgba(199,204,212,.35);border-radius:12px;padding:12px 14px;color:#E9EDF4}
.gt-inputrow{display:flex;gap:10px;margin-top:12px;align-items:center}
.gt-inputrow .fake-input{flex:1;border:1.5px dashed rgba(199,204,212,.5);border-radius:10px;padding:10px 12px;color:#9AA3AF;font-size:.9rem}
.gt-note{margin:10px 0 0;font-size:.8rem;color:#9AA3AF}
/* --- Family A keyframes --- */
@keyframes gt-fade-up{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes gt-fade-in{from{opacity:0}to{opacity:1}}
@keyframes gt-settle{0%{opacity:0;transform:translateY(-56px) scale(.94)}42%{opacity:1}60%{transform:translateY(8px) scale(1.012)}79%{transform:translateY(-3px) scale(.998)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes gt-ripple{0%{opacity:0;transform:scale(.55)}18%{opacity:.85}100%{opacity:0;transform:scale(1.32)}}
@keyframes gt-frame-in{from{opacity:0;transform:scale(.982)}to{opacity:1;transform:scale(1)}}
@keyframes gt-swirl-a{0%{opacity:0;transform:rotate(-16deg) translateX(-34%) scaleY(.55)}45%{opacity:.95}78%{opacity:.85}100%{opacity:0;transform:rotate(5deg) translateX(16%) scaleY(1)}}
@keyframes gt-swirl-b{0%{opacity:0;transform:rotate(13deg) translateX(32%) scaleY(.55)}45%{opacity:.95}78%{opacity:.85}100%{opacity:0;transform:rotate(-5deg) translateX(-15%) scaleY(1)}}
@keyframes gt-resolve{0%{opacity:0;transform:scale(.48) rotate(-11deg);filter:blur(9px)}62%{opacity:1;filter:blur(0)}78%{transform:scale(1.03) rotate(1deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes gt-flip-in{from{opacity:0;transform:perspective(600px) rotateX(72deg) translateY(12px)}to{opacity:1;transform:perspective(600px) rotateX(0) translateY(0)}}
@keyframes gt-tile-in{from{opacity:0;transform:translateY(30px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes gt-pop{0%{opacity:0;transform:scale(.55)}70%{opacity:1;transform:scale(1.07)}100%{opacity:1;transform:scale(1)}}
@keyframes gt-bloom{from{clip-path:circle(3% at 50% 40%)}to{clip-path:circle(80% at 50% 40%)}}
@keyframes gt-dot{0%{opacity:1;transform:scale(1)}55%{opacity:1;transform:scale(2.4)}100%{opacity:0;transform:scale(3.2)}}
@keyframes gt-bloom-orb{from{transform:scale(.22)}to{transform:scale(1)}}
@keyframes gt-flood{0%{opacity:.96;transform:scaleY(0)}52%{opacity:.96;transform:scaleY(1)}78%{opacity:.96}100%{opacity:0;transform:scaleY(1)}}
@keyframes gt-wire{0%{opacity:0}12%{opacity:1}72%{opacity:1}100%{opacity:0}}
@keyframes gt-shine{from{transform:translateX(-170%) skewX(-14deg)}to{transform:translateX(360%) skewX(-14deg)}}
@keyframes gt-sketch{0%{opacity:.4;filter:grayscale(1) contrast(1.08)}60%{opacity:.75;filter:grayscale(.35)}100%{opacity:1;filter:none}}
/* A1 · Marble Settle */
.gen-stage.playing[data-anim="1"] .gen-tile{animation:gt-frame-in .55s ease both}
.gen-stage.playing[data-anim="1"] .gt-orb{animation:gt-settle 1.05s cubic-bezier(.28,.84,.42,1) both}
.gen-stage.playing[data-anim="1"] .gt-ripple{animation:gt-ripple .9s ease-out .5s both}
.gen-stage.playing[data-anim="1"] .gt-eyebrow,.gen-stage.playing[data-anim="1"] .gt-name,.gen-stage.playing[data-anim="1"] .gt-status{animation:gt-fade-up .45s ease .55s both}
.gen-stage.playing[data-anim="1"] .gt-controls{animation:gt-fade-up .45s ease .95s both}
/* A2 · Swirl Assemble */
.gen-stage.playing[data-anim="2"] .gt-ribbon.r1{animation:gt-swirl-a 1.3s ease both}
.gen-stage.playing[data-anim="2"] .gt-ribbon.r2{animation:gt-swirl-b 1.3s ease .1s both}
.gen-stage.playing[data-anim="2"] .gt-orb{animation:gt-resolve 1.3s ease both}
.gen-stage.playing[data-anim="2"] .gt-frame{animation:gt-fade-in .5s ease .5s both}
.gen-stage.playing[data-anim="2"] .gt-eyebrow,.gen-stage.playing[data-anim="2"] .gt-name,.gen-stage.playing[data-anim="2"] .gt-status{animation:gt-fade-up .45s ease .68s both}
.gen-stage.playing[data-anim="2"] .gt-controls{animation:gt-fade-up .45s ease 1s both}
/* A3 · Tile Cascade */
.gen-stage.playing[data-anim="3"] .gt-minis span{animation:gt-flip-in .5s ease both}
.gen-stage.playing[data-anim="3"] .gt-minis span:nth-child(1){animation-delay:.02s}
.gen-stage.playing[data-anim="3"] .gt-minis span:nth-child(2){animation-delay:.19s}
.gen-stage.playing[data-anim="3"] .gt-minis span:nth-child(3){animation-delay:.36s}
.gen-stage.playing[data-anim="3"] .gt-minis span:nth-child(4){animation-delay:.53s}
.gen-stage.playing[data-anim="3"] .gen-tile{animation:gt-tile-in .55s ease .72s both}
.gen-stage.playing[data-anim="3"] .gt-orb{animation:gt-pop .45s ease .98s both}
.gen-stage.playing[data-anim="3"] .gt-eyebrow,.gen-stage.playing[data-anim="3"] .gt-name,.gen-stage.playing[data-anim="3"] .gt-status{animation:gt-fade-up .4s ease 1.05s both}
.gen-stage.playing[data-anim="3"] .gt-controls{animation:gt-fade-up .4s ease 1.22s both}
/* A4 · Glass Bloom */
.gen-stage.playing[data-anim="4"] .gen-tile{animation:gt-bloom 1.2s cubic-bezier(.3,.7,.3,1) both}
.gen-stage.playing[data-anim="4"] .gt-dot{animation:gt-dot 1.05s ease both}
.gen-stage.playing[data-anim="4"] .gt-orb{animation:gt-bloom-orb 1.2s cubic-bezier(.3,.7,.3,1) both}
.gen-stage.playing[data-anim="4"] .gt-eyebrow,.gen-stage.playing[data-anim="4"] .gt-name,.gen-stage.playing[data-anim="4"] .gt-status{animation:gt-fade-up .45s ease .55s both}
.gen-stage.playing[data-anim="4"] .gt-controls{animation:gt-fade-up .45s ease .95s both}
/* A5 · Blueprint Build */
.gen-stage.playing[data-anim="5"] .gen-tile{background-image:linear-gradient(rgba(185,203,232,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(185,203,232,.13) 1px,transparent 1px),linear-gradient(165deg,#152640 0%,#0B1626 70%);background-size:26px 26px,26px 26px,cover}
.gen-stage.playing[data-anim="5"] .gt-wire{animation:gt-wire 1.5s ease both}
.gen-stage.playing[data-anim="5"] .gt-flood{animation:gt-flood 1.5s ease .1s both}
.gen-stage.playing[data-anim="5"] .gt-orb,.gen-stage.playing[data-anim="5"] .gt-eyebrow,.gen-stage.playing[data-anim="5"] .gt-name,.gen-stage.playing[data-anim="5"] .gt-status{animation:gt-sketch 1.5s ease both}
.gen-stage.playing[data-anim="5"] .gt-shine{animation:gt-shine .6s ease 1.02s both}
.gen-stage.playing[data-anim="5"] .gt-controls{animation:gt-fade-up .4s ease 1.12s both}

/* --- Family B: signature button transitions --- */
.btest{border:2px solid var(--tile-bd);border-radius:16px;padding:24px;margin:0 0 26px;background:#FFFFFF}
.btest-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 16px;margin-bottom:16px}
.btest-head h3{margin:0}
.btest-head p{margin:0;flex:1 1 260px}
.b-stage{position:relative;border-radius:14px;background:linear-gradient(170deg,#131F36 0%,#0B1626 70%);padding:26px 20px;overflow:hidden;color:#E9EDF4}
.b-view{display:none}
.b-view.on{display:block}
.b-view h4{margin:0 0 8px;font-family:Fraunces,Georgia,serif;font-size:1.35rem;font-weight:600;color:#FFFFFF}
.b-view p{color:#DCE3EE}
.b-src-tile{max-width:440px;margin:6px auto;text-align:center;border:2px solid rgba(199,204,212,.55);border-radius:16px;padding:24px 22px;background:rgba(255,255,255,.04)}
.b-src-tile .gt-orb{width:110px;height:110px;margin-bottom:10px}
.b-src-tile .gt-orb img{width:110px;height:110px}
.b-back{margin-top:18px}
.b-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:14px}
.b-cell{border:2px solid rgba(199,204,212,.5);border-radius:12px;padding:14px;background:rgba(255,255,255,.05)}
.b-cell b{display:block;color:#FFFFFF;margin-bottom:4px}
.b-cell span{color:#C7CCD4;font-size:.88rem}
.b-wire{position:absolute;inset:8px;border:1.5px dashed rgba(185,203,232,.9);border-radius:12px;opacity:0;pointer-events:none;z-index:3}
.b-flood{position:absolute;inset:0;background:linear-gradient(to top,#641D35 0%,#3D1B33 55%,#101C31 100%);opacity:0;transform:scaleY(0);transform-origin:bottom;pointer-events:none;z-index:2}
.b-ribbon{position:absolute;left:-25%;width:150%;height:52px;border-radius:50%;opacity:0;pointer-events:none;z-index:2}
.b-ribbon.r1{top:14%;background:linear-gradient(90deg,transparent 0%,rgba(199,204,212,.85) 38%,rgba(154,163,175,.85) 62%,transparent 100%)}
.b-ribbon.r2{bottom:12%;background:linear-gradient(90deg,transparent 0%,rgba(142,42,74,.9) 38%,rgba(100,29,53,.9) 62%,transparent 100%)}
.b-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;max-width:520px;margin:16px auto 4px}
.b-cal span{border:2px solid rgba(199,204,212,.5);border-radius:10px;padding:9px 2px;text-align:center;font-size:.85rem;color:#E9EDF4;background:rgba(255,255,255,.04)}
.b-cal span.sel{border-color:#C98BA3;background:rgba(100,29,53,.5);color:#FFFFFF;font-weight:700}
@keyframes b-fade-out{from{opacity:1}to{opacity:0}}
@keyframes b-fade-in{from{opacity:0}to{opacity:1}}
@keyframes b-bloom{from{clip-path:circle(3% at 50% 26%);opacity:.4}to{clip-path:circle(82% at 50% 26%);opacity:1}}
@keyframes b-swirl{from{opacity:0;transform:rotate(-2.6deg) scale(.955)}to{opacity:1;transform:rotate(0) scale(1)}}
.b-view.leaving{animation:b-fade-out .28s ease both}
.b-view.x-bloom{animation:b-bloom .85s cubic-bezier(.3,.7,.3,1) both}
.b-view.x-bloom .gt-convo-head img{animation:gt-pop .5s ease .3s both}
.b-view.x-swirl{animation:b-swirl .85s ease both}
.b-view.x-swirl .b-ribbon.r1{animation:gt-swirl-a .85s ease both}
.b-view.x-swirl .b-ribbon.r2{animation:gt-swirl-b .85s ease .08s both}
.b-view.x-cascade [data-casc]{animation:gt-flip-in .5s ease both;animation-delay:var(--d,0s)}
.b-view.x-blueprint .b-wire{animation:gt-wire .9s ease both}
.b-view.x-blueprint .b-flood{animation:gt-flood .9s ease both}
.b-view.x-settle .b-orb-drop{animation:gt-settle .85s cubic-bezier(.28,.84,.42,1) both}
.b-view.x-settle .b-cal span{animation:gt-tile-in .45s ease both;animation-delay:var(--d,0s)}
.b-orb-drop{width:120px;height:120px;margin:2px auto 8px}
.b-orb-drop img{width:120px;height:120px;border-radius:50%;object-fit:cover;display:block}
/* Reduced motion: every test lands in its end state instantly */
@media (prefers-reduced-motion: reduce){
  .gen-tile,.gen-tile *,.gt-minis span,.b-view,.b-view *,.b-ribbon,.b-wire,.b-flood{animation:none!important;transition:none!important}
  .gt-ribbon,.gt-ripple,.gt-dot,.gt-shine,.gt-wire,.gt-flood,.b-ribbon,.b-wire,.b-flood{opacity:0!important}
  .gt-minis span{opacity:1}
}
@media(max-width:820px){
  .mtest,.btest{padding:18px 16px 20px}
  .gen-stage{padding:22px 10px 26px}
  .gen-tile{padding:24px 16px 20px}
  .gt-orb,.gt-orb img{width:124px;height:124px}
  .b-cal{gap:5px}
  .b-cal span{padding:7px 1px;font-size:.78rem}
}
/* ============================================================
   Blog (/blog/) — light reading treatment (pages bake colorway 5,
   the ivory/silver-light reading palette, burgundy accents).
   Index = systematic labeled tiles; posts = one reading column.
   ============================================================ */
.post-tile{display:flex;flex-direction:column;gap:7px;text-decoration:none;color:var(--text)}
.post-tile .t-label{font-size:.72rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--accent)}
.post-tile h3{font-size:1.3rem;line-height:1.25;margin:0}
.post-tile h3 a{color:var(--ink);text-decoration:none}
.post-tile h3 a:hover{text-decoration:underline}
.post-tile .t-promise{color:var(--muted);flex:1}
.post-tile .t-meta{font-size:.78rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.post-col{max-width:760px;margin:0 auto}
.byline{display:flex;gap:10px;flex-wrap:wrap;align-items:baseline;font-size:.9rem;color:var(--muted);margin:14px 0 26px}
.byline .who{font-weight:700;color:var(--ink);letter-spacing:.02em}
.post-body h2{margin-top:2.4rem}
.post-body ul{margin:0 0 1rem 22px}
.post-body li{margin:7px 0}
.post-body ol{margin:0 0 1rem 22px}
.post-body ol li{margin:7px 0}
.pullquote{font-family:'Fraunces',Georgia,serif;font-style:italic;font-weight:500;font-size:1.5rem;line-height:1.35;color:var(--ink);border-left:4px solid var(--accent);padding:4px 0 4px 24px;margin:36px 0}
.post-foot{border-top:2px solid var(--tile-bd);margin-top:44px;padding-top:22px;display:flex;gap:14px;flex-wrap:wrap;justify-content:space-between;align-items:center}
@media(max-width:640px){.pullquote{font-size:1.28rem;padding-left:18px}}