/* ==========================================================================
   stub.css - shared stylesheet for the simple stub pages
   (solutions/*, resources/*, company/*, get-started/demo).
   VERY simple, Reporting-like but plainer: white canvas, Satoshi display
   headings, Inter body, ink on white, monochrome slate accents. No holo
   decoration beyond at most one inline .hl pill in a hero heading
   (foil styling itself lives in holo-fallback.css - never restyled here).
   All tokens from brand/elevate-tokens.css; layout via .wrap in site.css.
   ========================================================================== */

/* ---------- hero (small, ~40vh) ---------- */
.stub-hero{min-height:40vh;display:flex;align-items:center;padding:160px 0 var(--space-lg);isolation:isolate;}
.stub-hero .wrap{text-align:center;}
.stub-hero__h{font-family:var(--font-display);font-weight:var(--w-bold);font-size:clamp(38px,5.5vw,64px);line-height:1.06;letter-spacing:-0.02em;color:var(--ink);margin:0 auto;max-width:22ch;}
.stub-hero__lead{font-size:20px;line-height:1.5;color:var(--slate-600);max-width:52ch;margin:var(--space-sm) auto 0;}
.stub-hero__cta{display:flex;justify-content:center;gap:var(--space-xs);margin-top:var(--space-md);}

/* simple CSS-only reveal, hero children only (no JS, no scroll effects) */
@keyframes stub-rise{from{opacity:0;transform:translateY(var(--reveal-rise));}to{opacity:1;transform:none;}}
.stub-hero .wrap>*{animation:stub-rise var(--dur-reveal) var(--ease-silk) both;}
.stub-hero .wrap>:nth-child(2){animation-delay:var(--stagger);}
.stub-hero .wrap>:nth-child(3){animation-delay:calc(var(--stagger)*2);}
.stub-hero .wrap>:nth-child(4){animation-delay:calc(var(--stagger)*3);}
@media(prefers-reduced-motion:reduce){.stub-hero .wrap>*{animation:none;}}

/* ---------- sections ---------- */
.stub-sec{padding:var(--space-lg) 0;}
.stub-h2{font-family:var(--font-display);font-weight:var(--w-bold);font-size:clamp(28px,3.6vw,44px);line-height:1.12;letter-spacing:-0.015em;color:var(--ink);margin:0 0 var(--space-sm);max-width:26ch;}
.stub-p{font-size:17px;line-height:1.6;color:var(--slate-600);max-width:62ch;margin:0 0 16px;}
.stub-p--punch{color:var(--ink);font-weight:var(--w-medium);}
.stub-meta{font-size:14px;color:var(--slate-500);margin:0;}
.stub-p--after-grid{margin-top:var(--space-sm);}
.stub-linkrow{margin:var(--space-xs) 0 0;}
/* links: ink with underline, never color (monochrome law) */
.stub-link{color:var(--slate-950);font-size:16px;font-weight:600;text-decoration:underline;text-underline-offset:3px;}
.stub-link:hover{color:var(--slate-600);}

/* ---------- card grids (2-3 columns) ---------- */
.stub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-sm);margin-top:var(--space-md);}
.stub-grid--2{grid-template-columns:repeat(2,1fr);}
@media(max-width:880px){.stub-grid,.stub-grid--2{grid-template-columns:1fr;}}
.stub-card{background:var(--fill-1);border-radius:var(--radius-card);padding:var(--space-sm);}
.stub-card--hot{background:var(--slate-200);}
.stub-card h3{font-family:var(--font-display);font-weight:var(--w-bold);font-size:20px;line-height:1.25;letter-spacing:-0.01em;color:var(--ink);margin:0 0 8px;}
.stub-card p{font-size:15px;line-height:1.55;color:var(--slate-600);margin:0;}
.stub-card .stub-meta{margin-top:12px;}
.stub-card__num{font-family:var(--font-display);font-weight:var(--w-bold);font-size:clamp(30px,3.4vw,42px);line-height:1.05;letter-spacing:-0.02em;color:var(--ink);margin:0 0 8px;}
.stub-card__label{font-size:14px;font-weight:600;color:var(--slate-500);margin:0 0 12px;}
a.stub-card{display:block;transition:background var(--dur) ease;}
a.stub-card:hover{background:var(--fill-2);}
.stub-card__go{display:inline-block;font-size:14px;font-weight:600;color:var(--slate-950);text-decoration:underline;text-underline-offset:3px;margin-top:12px;}

/* press cards: outlet logo row on top */
.stub-card__logo{display:flex;align-items:center;height:40px;margin-bottom:16px;}
.stub-card__logo img{max-height:40px;max-width:170px;width:auto;height:auto;display:block;object-fit:contain;}

/* ---------- checklist ---------- */
.stub-list{list-style:none;margin:var(--space-sm) 0 0;padding:0;max-width:62ch;}
.stub-list li{position:relative;padding:6px 0 6px 32px;font-size:17px;line-height:1.6;color:var(--slate-600);}
.stub-list li::before{content:"\2713";position:absolute;left:0;top:6px;width:22px;height:22px;border-radius:var(--radius-pill);background:var(--slate-100);color:var(--slate-950);font-size:13px;font-weight:var(--w-bold);display:flex;align-items:center;justify-content:center;}

/* ---------- CTA band (ink panel, white-on-ink button -> demo) ---------- */
.stub-cta{padding:var(--space-lg) 0 0;}
.stub-cta__panel{background:var(--slate-950);border-radius:var(--radius-card);padding:var(--space-lg) var(--space-md);text-align:center;isolation:isolate;}   /* the closer foil pill's z-index:-1 fallback */
.stub-cta__h{font-family:var(--font-display);font-weight:var(--w-bold);font-size:clamp(28px,3.4vw,40px);line-height:1.12;letter-spacing:-0.015em;color:var(--on-dark);margin:0 auto;max-width:24ch;}
.stub-cta__p{font-size:17px;line-height:1.6;color:rgba(255,255,255,0.82);max-width:56ch;margin:16px auto 0;}
.stub-cta__actions{display:flex;justify-content:center;align-items:center;gap:var(--space-sm);margin-top:var(--space-md);}
/* 2x closer CTA: sizes the foil pill face (same values on every page) */
.btn--holo-xl .hl.hl--btn{font-size:22px;padding:22px 44px;border-radius:var(--radius-pill,9999px);}
.stub-cta__link{color:#fff;font-size:16px;font-weight:600;}
.stub-cta__link:hover{text-decoration:underline;}

/* ---------- forms (demo + contact; mock, no submission) ---------- */
.stub-form{background:var(--fill-1);border-radius:var(--radius-card);padding:var(--space-md);max-width:520px;margin:0 auto;display:grid;gap:20px;}
.stub-field{display:grid;gap:8px;text-align:left;}
.stub-label{font-size:14px;font-weight:600;color:var(--ink);}
.stub-input,.stub-select,.stub-textarea{font-family:var(--font-body);font-size:16px;color:var(--ink);background:var(--surface);border:1px solid var(--slate-200);border-radius:var(--radius-input);padding:12px 16px;width:100%;}
.stub-textarea{min-height:110px;resize:vertical;}
.stub-input:focus,.stub-select:focus,.stub-textarea:focus{outline:2px solid var(--slate-950);outline-offset:0;border-color:var(--slate-950);}
.stub-form .btn{width:100%;}
.stub-form .btn:active{transform:scale(0.98);}
.stub-form__note{font-size:14px;line-height:1.5;color:var(--slate-500);margin:0;text-align:center;}