/* ============================================================================
   Valmier website — rebrand layer (2026-10-24, owner: "dark great rebrand", logo "Folded V").
   Loaded LAST on every page, after ui.css and the page CSS. Monochrome: black ground, white type and
   actions, grey hairlines; colour only for status (green = online/ok). No gradients, glows, embers or
   Vormir sky. Headings move from Lalezar to Vazirmatn Bold. Same rules as panel/valmier/static/brand.css.
   ========================================================================== */

:root{
  --abyss:#0A0A0B; --night:#141416; --night-2:#18181B; --night-3:#202024; --dusk:#2A2A2E; --violet:#3A3A3F;
  --crimson:#F2F2EF; --crimson-hi:#FFFFFF; --ember:#F2F2EF; --soul:#F2F2EF; --gold:#F2F2EF;
  --sky:#F2F2EF; --sky-soft:rgba(242,242,239,.06);
  --bone:#F2F2EF; --ash:rgba(242,242,239,.66); --ash-dim:rgba(242,242,239,.46); --ink:#0A0A0B;
  --ok:#3DBE7A; --warn:#F0A23A; --bad:#F0574D;
  --line:rgba(242,242,239,.09); --line-2:rgba(242,242,239,.15); --line-3:rgba(242,242,239,.24);
  --card-top:none; --shadow-1:none; --shadow-2:none; --glow-crimson:none; --glow-soul:none;
  --display:"Vazirmatn",Tahoma,"Segoe UI",system-ui,sans-serif;
}

/* ---- ground and type ------------------------------------------------------ */
body{background:var(--abyss)}
body::before{display:none}
::selection{background:rgba(242,242,239,.25)}
:focus-visible{outline-color:var(--bone)}
a{color:var(--bone)}
h1,.h1,h2,.h2{font-weight:700;letter-spacing:-.01em}
h1,.h1{line-height:1.3} h2,.h2{line-height:1.4}
.brand{font:700 21px/1 var(--text);letter-spacing:-.01em}
.brand img,.lc-head img,.s-brand img{box-shadow:none}
.trust b,.stat-strip b,.price .amt b,.m-hero b,.track span,.step .n,.orb b,.s-brand,.nav-sheet__links a{font-weight:700}
.kicker{color:var(--ash)}
.kicker::before{background:var(--line-3)}
.horizon{background:var(--line-2);box-shadow:none}
.progress,.scroll-progress{background:var(--bone);box-shadow:none}

/* ---- buttons: white slab, black text; ghost = hairline ---------------------- */
.btn{background:var(--bone);color:var(--ink);box-shadow:none}
.btn:hover{color:var(--ink);background:#FFFFFF;filter:none}
.btn--ghost,.band .btn--ghost{background:transparent;border-color:var(--line-3);color:var(--bone);box-shadow:none}
.btn--ghost:hover,.band .btn--ghost:hover{background:rgba(242,242,239,.06);border-color:rgba(242,242,239,.4);color:var(--bone);box-shadow:none}
.btn--soul{background:var(--bone);color:var(--ink);box-shadow:none}
.btn--light{background:var(--bone);color:var(--ink);box-shadow:none}
.btn--quiet{background:none;color:var(--bone)}

/* ---- cards, tiles, tags, callouts ------------------------------------------ */
.card,.card--interactive{background:var(--night);border-color:var(--line);box-shadow:none}
.card--interactive:hover,.feat:hover,.loc-card:hover,.step:hover{border-color:var(--line-3);box-shadow:none}
.tile,.tile--soul{background:rgba(242,242,239,.06);border-color:var(--line);color:var(--bone);box-shadow:none}
.card--interactive:hover .tile{border-color:var(--line-3)}
.tag--soul{color:var(--bone);background:rgba(242,242,239,.06);border-color:var(--line-2)}
.callout{border-color:var(--line-2);background:rgba(242,242,239,.04)}
.callout svg{stroke:var(--bone)}
.callout b,.callout strong{color:var(--bone)}
.input:focus,.select:focus,.textarea:focus{border-color:rgba(242,242,239,.5);box-shadow:none}
.to-top:hover{border-color:var(--line-3)}

/* ---- hero: black field with a faint dot grid instead of the Vormir sky ---------- */
.climb{background:var(--abyss);
  background-image:radial-gradient(rgba(242,242,239,.075) 1px,transparent 1.3px);background-size:24px 24px;background-position:-12px -12px}
.climb::after{content:"";position:absolute;inset:auto 0 0;height:40%;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,transparent,var(--abyss))}
.aurora,.stars,.embers,.cliffs{display:none}
.hero-badge{background:var(--night);border-color:var(--line-2);color:var(--bone)}
.hero h1 .glow{background:none;color:var(--bone);-webkit-text-fill-color:currentColor;animation:word .85s var(--ease) .34s forwards}
.hero .lead{color:var(--ash)}
.hero-links a:hover{color:var(--bone)}
.trust{border-top-color:var(--line)}

/* phone mock: graphite device, white instruments */
.phone{background:#1A1A1D;box-shadow:0 0 0 1px rgba(255,255,255,.1),0 40px 80px -40px #000}
.screen{background:#0E0E10}
.dial .tick{stroke:rgba(242,242,239,.12)}
.dial .tick.on{stroke:var(--bone)}
.orb{background:#141416;border-color:var(--line-2);box-shadow:none}
.orb::after{display:none}
.orb b{background:none;color:var(--bone);-webkit-text-fill-color:currentColor}
.s-row{background:#141416;border-color:var(--line)}
.s-row em{background:rgba(242,242,239,.08);color:var(--ash)}
.chip{background:var(--night);border-color:var(--line-2);box-shadow:none}
.chip .d{box-shadow:none}
.scrollcue span::after{background:var(--bone)}

/* ---- sections -------------------------------------------------------------- */
.marquee{background:var(--abyss)}
.track span{color:var(--ash-dim)}
.track span::after{background:var(--line-3)}
.f-d{border-color:var(--line-2);background:var(--night)}
.m-hero{background:#000;border:1px solid var(--line-2)}
.m-hero b{color:var(--bone)}
.sw{background:var(--bone);box-shadow:none}
.sw::after{background:var(--ink)}
.bar i{background:var(--bone)}
.route .lit{stroke:var(--bone)}
.route .node.ir rect{stroke:var(--line-3);filter:none}
.route .pk{fill:var(--bone);filter:none}
.legend i{background:var(--bone)}
.legend svg{stroke:var(--bone)}
.price .badge{background:var(--bone);color:var(--ink);box-shadow:none}
.price .amt b{background:none;color:var(--bone);-webkit-text-fill-color:currentColor}
.price--best{background:var(--night);border-color:var(--line-3);box-shadow:none}
.price--best::after{background:var(--bone);box-shadow:none;height:1px}
.price .price-link{color:var(--bone)}
.price li::before{background-color:rgba(61,190,122,.12);border-color:rgba(61,190,122,.28)}
.step .n{background:var(--bone);color:var(--ink);box-shadow:none}
.log>li::before{border-color:var(--bone);box-shadow:none}
.guide-card .arrow{color:var(--ash)}
.faq details[open]{border-color:var(--line-3);background:rgba(242,242,239,.035)}
.faq summary::after,.faq details[open] summary::after{background-color:rgba(242,242,239,.08);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F2F2EF' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E")}
.faq a{color:var(--bone);text-decoration:underline;text-underline-offset:3px}

/* finale band: white slab, black type — the one loud moment on the page */
.band{background:var(--bone);color:var(--ink);box-shadow:none}
.band::after,.band .embers{display:none}
.band h2{color:var(--ink)}
.band p{color:rgba(10,10,11,.7)}
.band .btn{background:var(--ink);color:var(--bone)}
.band .btn--ghost{background:transparent;border-color:rgba(10,10,11,.25);color:var(--ink)}
.band .btn--ghost:hover{background:rgba(10,10,11,.06);border-color:rgba(10,10,11,.45);color:var(--ink)}

/* live chat */
.lc-fab{background:var(--bone);color:var(--ink);box-shadow:0 10px 30px -10px rgba(0,0,0,.8)}
.lc-fab::before{display:none}
.lc-badge{background:var(--bad);color:#fff}
.lc-head{background:var(--night-2)}
.lc-msg.visitor{background:var(--bone);color:var(--ink);box-shadow:none}
.lc-chips button{border-color:var(--line-2);background:rgba(242,242,239,.05);color:var(--bone)}
.lc-chips button:hover{background:rgba(242,242,239,.1)}
.lc-in:focus{border-color:rgba(242,242,239,.5);box-shadow:none}

/* numbers that used to be amber gradient text */
.stat-strip b,.calc__amount output{background:none;color:var(--bone);-webkit-text-fill-color:currentColor}
.stat-strip{background:var(--night)}

/* ---- reseller page -------------------------------------------------------- */
.r-hero{background:var(--abyss)}
.r-hero::after{background:var(--line);box-shadow:none}
/* the sun-over-cliffs picture becomes the Folded V on a dot grid */
.r-art{background:#0E0E10;background-image:radial-gradient(rgba(242,242,239,.08) 1px,transparent 1.3px);background-size:20px 20px}
.r-art__sun,.r-art__cliff,.r-art__glow{display:none}
.r-art::before{content:"";position:absolute;inset:0;margin:auto;width:42%;aspect-ratio:48/44;opacity:.95;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='8 12 48 44'%3E%3Cpolygon points='8,12 22,12 32,40 32,56' fill='%23F2F2EF'/%3E%3Cpolygon points='56,12 42,12 32,40 32,56' fill='%23F2F2EF' fill-opacity='.5'/%3E%3C/svg%3E") center/contain no-repeat}
.chip-btn[aria-pressed="true"]{background:var(--bone);color:var(--ink);box-shadow:none}
.calc__out{background:rgba(242,242,239,.04);border-color:var(--line-2)}
.step__n{background:var(--bone);color:var(--ink);box-shadow:none;font-weight:700}
.cta-band{background:var(--bone);color:var(--ink);box-shadow:none}
.cta-band::after{display:none}
.cta-band h2{color:var(--ink)}
.cta-band p{color:rgba(10,10,11,.7)}
.cta-band .btn{background:var(--ink);color:var(--bone)}
.cta-band .btn--ghost{background:transparent;border-color:rgba(10,10,11,.25);color:var(--ink)}
