/* =============================================================
   SIGNAL — child of Katy Krama
   Agency theme: dark stage, oversized display, work before words.

   Loads AFTER the parent stylesheet, so it only needs to restate
   what changes. Almost all of that is the token block — which is
   the point of building the parent on variables.
   ============================================================= */
@import url("https://fonts.googleapis.com/css2?family=Archivo:wght@400..900&family=Archivo+Black&family=Kantumruy+Pro:wght@300..700&family=JetBrains+Mono:wght@400;700&display=swap");

:root{
  --stone:#0E0F12;          /* the stage goes dark */
  --stone-2:#171A1F;
  --white:#0A0B0D;
  --ink:#F4F4F2;            /* text inverts */
  --slate:#9AA0A8;
  --line:#2A2E35;

  --madder:#FF4D2E;         /* signal orange, deliberately hot */
  --madder-ink:#FF6A4F;     /* lighter on dark, for contrast */
  --brand-blue:#4DA3FF;
  --indigo:#1B1E24;
  --navy-lift:#22262E;

  --display:"Archivo","Kantumruy Pro",system-ui,sans-serif;
  --body:"Archivo","Kantumruy Pro",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
}
html[data-lang="km"]{
  --display:"Kantumruy Pro","Archivo",system-ui,sans-serif;
  --body:"Kantumruy Pro","Archivo",system-ui,sans-serif;
}

/* the weave becomes a faint scanline rather than a textile */
.krama{
  background-image:
    repeating-linear-gradient(0deg, rgba(255,77,46,.10) 0 1px, transparent 1px 6px),
    repeating-linear-gradient(90deg, rgba(77,163,255,.05) 0 1px, transparent 1px 32px);
}

/* display type wants to be much bigger and much tighter */
h1{font-size:clamp(2.6rem,9vw,7rem);letter-spacing:-.045em;font-weight:900;text-transform:uppercase}
html[data-lang="km"] h1{font-size:clamp(1.9rem,5.4vw,4rem);letter-spacing:0;text-transform:none;font-weight:700}
h2.sec-title,.page-title{font-weight:800;letter-spacing:-.04em}
.page-title{font-size:clamp(2.2rem,6vw,4.6rem);text-transform:uppercase}
html[data-lang="km"] .page-title{text-transform:none;letter-spacing:0}
.disc-letter{font-weight:900;color:var(--madder);opacity:.9}

header.nav{background:rgba(14,15,18,.9);border-bottom-color:var(--line)}
.brand img{filter:invert(1) brightness(1.6) contrast(1.1)}
.foot-logo{filter:none}
footer{background:#070809}

.btn-primary{background:var(--madder);border-color:var(--madder);color:#0A0B0D;font-weight:700}
.btn-primary:hover{background:#fff;border-color:#fff;color:#0A0B0D}
.btn-ghost{border-color:var(--line);color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--stone)}

.offers{background:#07080A}
.offer{background:#07080A}
.offer:hover{background:#101318}
.proof{background:#101318}
.card,.prod{background:var(--stone-2)}
.card:hover,.prod:hover{background:#1E2229}
.contact{background:#101318}
.benefits{background:#101318}
.benefit{background:#101318}
.benefit:hover{background:#171A1F}
.cat-chip{background:var(--stone-2);color:var(--ink)}
.cat-chip.is-on{background:var(--madder);color:#0A0B0D;border-color:var(--madder)}
.field input,.field textarea,.choice > span,input[type=file]{background:var(--stone-2);color:var(--ink)}
.choice input:checked + span{background:var(--madder);color:#0A0B0D;border-color:var(--madder)}
.prose pre{background:#000;color:#D6E5EE}
.prose code{background:var(--stone-2)}
.toc{background:var(--stone-2)}
.order-box{background:var(--stone-2);border-color:var(--madder)}
.author-mark{background:var(--madder);color:#0A0B0D}
.step-n{background:var(--madder);color:#0A0B0D}
.article-cta{background:var(--stone-2)}
.related{background:#101318}
.related .card{background:#101318}