/* ============================================================================
   konstatum.css -- lumea Konstatum. PRODUCTIE. v2.0 -- 2026-07-26
   Se incarca DOAR pe paginile cu Template Name: Konstatum.
   Pe acele pagini, main.css (skin cyberpunk TTN) e scos din coada -> izolare totala.

   TEZA: contrast deliberat pe fiecare axa fata de tothenoc.com.
     #040810 -> podea de mozaic calda | Orbitron caps -> serif | glow -> nimic
   Singurele obiecte cyberpunk: chipul de intoarcere si architrava de bronz.

   Cai: fisierele sunt in wp-content/themes/tothenoc-theme/assets/
   ============================================================================ */

:root{
  --k-paper:#F2EFE8; --k-paper-2:#EAE6DC;
  --k-ink:#1A1714; --k-ink-soft:#4A443C;
  --k-rule:#C9C2B4; --k-accent:#6B4A2F;
  --k-pass:#2F5D3A; --k-fail:#8C2F2F; --k-nt:#6E6A63;
  --ttn-bg:#040810; --ttn-red:#FF2D2D; --ttn-cyan:#00FFD4;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}

/* ---- PODEAUA: mozaic fusion (ASCII sus / mozaic jos), 1:1, repetat ----
   NU `cover`, NU scalare. Orice scalare sub 1:1 subtiaza rostul de 1px sub un
   pixel si distruge mozaicul. Vezi DECIZII-DESIGN.md. */
body.konstatum{
  background:#1a150e url("konstatum-mosaic.png") center / auto fixed repeat;
  color:var(--k-ink);
  font-family:"EB Garamond",Georgia,"Times New Roman",serif;
  font-size:20px;line-height:1.62;-webkit-font-smoothing:antialiased;
}

/* ---- chipul de intoarcere: pluteste PE mozaic, in afara lespezii ---- */
.k-float{max-width:48rem;margin:0 auto;padding:1.6rem 5.2rem .9rem}
.k-back{
  display:inline-flex;align-items:center;gap:.55rem;
  background:var(--ttn-bg);color:var(--ttn-cyan);
  font-family:"Share Tech Mono",ui-monospace,monospace;
  font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  padding:.5rem .9rem;text-decoration:none;border:1px solid #16202c;
  clip-path:polygon(0 0,100% 0,calc(100% - 9px) 100%,0 100%);
}
.k-back .k-dot{width:6px;height:6px;background:var(--ttn-red);border-radius:50%;display:inline-block}
.k-back:hover{color:#fff}

/* ============================ LESPEDEA ============================
   Documentul ca piatra asezata pe mozaic, nu ca div.
   Materie cu vinisoare + rima calda + GROSIME la baza + farame pe laturi. */
.k-wrap{
  position:relative;
  max-width:48rem;margin:0 auto;padding:0 5.2rem 5rem;
  background:
    linear-gradient(74deg,  transparent 31.3%, rgba(120,86,34,.055) 31.4%, rgba(120,86,34,.055) 31.6%, transparent 31.7%),
    linear-gradient(-21deg, transparent 62.1%, rgba(96,66,22,.045) 62.2%, rgba(96,66,22,.045) 62.4%, transparent 62.5%),
    linear-gradient(58deg,  transparent 84.6%, rgba(255,250,232,.5) 84.7%, rgba(255,250,232,.5) 84.9%, transparent 85.0%),
    radial-gradient(115% 60% at 50% 50%, rgba(107,74,47,0) 62%, rgba(107,74,47,.07) 88%, rgba(84,56,30,.16) 100%),
    linear-gradient(168deg,#F5F1E7 0%,#F2EFE8 40%,#EDE7D9 100%);
  background-repeat:no-repeat;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.85),
    inset 0 -1px 0 rgba(120,86,34,.18),
    0 2px 3px rgba(0,0,0,.32),
    0 22px 70px rgba(0,0,0,.55);
}
/* FARAMELE: piatra nu se taie, se sfarama IN AFARA ei, peste mozaic.
   Blocuri de 4px = pasul mozaicului fin (tessera 3 + rost 1).
   Stau in afara cutiei -> nu pot atinge textul prin constructie.
   (Varianta cu mask-image a fost abandonata: esua tacit.) */
.k-wrap::before,.k-wrap::after{
  content:"";position:absolute;top:0;bottom:0;width:64px;pointer-events:none;
}
.k-wrap::before{left:-64px;background:url("slab-crumbs-left.png") right top repeat-y}
.k-wrap::after{right:-64px;background:url("slab-crumbs-right.png") left top repeat-y}

.k-slab-edge{
  max-width:48rem;margin:-2px auto 0;height:9px;
  background:linear-gradient(180deg,#D8CBAF 0%,#BCAA85 55%,#8E7C58 100%);
  box-shadow:0 10px 26px rgba(0,0,0,.6);
  clip-path:polygon(0 0,100% 0,98.6% 100%,1.4% 100%);
}

/* ======================= ARCHITRAVA (meniu) =======================
   Banda de inscriptie care poarta sectiunile. Lipita sus la scroll.
   UN SINGUR SIR, obligatoriu: nowrap pe container SI pe elemente. */
.k-architrave{
  position:sticky;top:0;z-index:30;
  margin:0 -5.2rem 0;padding:1.02rem 2.4rem .92rem;
  background:linear-gradient(180deg,#4E4433 0%,#3E3628 55%,#332C20 100%);
  border-bottom:1px solid rgba(201,162,39,.35);
  box-shadow:inset 0 1px 0 rgba(214,178,96,.22), 0 3px 12px rgba(0,0,0,.45);
  display:flex;flex-wrap:nowrap;align-items:baseline;justify-content:center;
  white-space:nowrap;overflow:hidden;
}
.k-architrave a{
  font-family:"EB Garamond",Georgia,serif;font-weight:600;
  font-size:.76rem;letter-spacing:.13em;text-transform:uppercase;
  color:#D9B458;text-decoration:none;padding:.15rem 0;white-space:nowrap;
  text-shadow:0 -1px 1px rgba(0,0,0,.75), 0 1px 0 rgba(224,190,106,.25);
}
.k-architrave a:hover{color:#F2D588}
.k-architrave a.k-here{color:#FFF0C4;border-bottom:1px solid #C9A227}
.k-architrave .k-sep{color:rgba(201,162,39,.42);padding:0 .5rem;font-size:.76rem;user-select:none}

/* ---- antet + motto ---- */
.k-masthead{padding:3rem 0 2rem;border-bottom:1px solid var(--k-rule)}
.k-wordmark{font-size:2.9rem;line-height:1;margin:0 0 .7rem;font-weight:500;letter-spacing:.02em}
.k-standfirst{margin:0;color:var(--k-ink-soft);font-size:1.12rem;font-style:italic}
.k-motto{margin:2rem 0 0;padding-top:1.5rem;border-top:1px solid var(--k-rule)}
.k-motto q{display:block;font-size:1.55rem;font-style:italic;quotes:none}
.k-motto .k-gloss{
  display:block;margin-top:.45rem;font-family:"IBM Plex Mono",ui-monospace,monospace;
  font-size:11.5px;letter-spacing:.17em;text-transform:uppercase;color:var(--k-accent)
}

/* ---- continut generic (the_content) ---- */
.k-body h2{font-size:1.5rem;font-weight:600;margin:2.6rem 0 1rem;padding-top:2.4rem;border-top:1px solid var(--k-rule)}
.k-body h2:first-child{border-top:none;padding-top:0;margin-top:1.6rem}
.k-body h3{font-size:1.2rem;font-weight:600;margin:1.8rem 0 .6rem}
.k-body p{margin:0 0 1.15rem}
.k-body ul,.k-body ol{margin:0 0 1.3rem;padding-left:1.3rem}
.k-body li{margin:.35rem 0}
.k-body a{color:var(--k-accent);text-underline-offset:3px}
.k-body strong{font-weight:600}
.k-body blockquote{margin:1.6rem 0;padding-left:1.4rem;border-left:2px solid var(--k-accent);font-style:italic;color:var(--k-ink-soft)}

/* ---- semnatura tipografica: linia in patru parti ---- */
.k-fourpart{border-left:2px solid var(--k-accent);padding-left:1.4rem;margin:1.6rem 0}
.k-fourpart dt{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:11.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--k-accent);margin-top:1rem}
.k-fourpart dd{margin:.15rem 0 0}

/* ---- verdicte: stinse, NU semafor ---- */
.k-verdicts{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.4rem 0}
.k-v{font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;padding:.34rem .7rem;border:1px solid currentColor;border-radius:2px}
.k-v.p{color:var(--k-pass)} .k-v.f{color:var(--k-fail)} .k-v.n{color:var(--k-nt)}

/* ---- dovada: singurul loc unde revine mono ---- */
.k-evidence,.k-body pre{
  background:var(--k-paper-2);border:1px solid var(--k-rule);
  font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:13px;line-height:1.55;
  padding:1rem 1.1rem;margin:1.5rem 0;white-space:pre-wrap;color:var(--k-ink-soft);overflow-x:auto
}
.k-tally{display:flex;gap:2.2rem;margin:1.4rem 0 .3rem;flex-wrap:wrap}
.k-tally div{font-family:"IBM Plex Mono",monospace}
.k-tally b{display:block;font-size:1.9rem;font-weight:500;line-height:1.1}
.k-tally span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--k-nt)}

/* ---- termeni + CTA ---- */
.k-terms{display:flex;gap:2.5rem;flex-wrap:wrap;margin:1.2rem 0}
.k-terms b{font-size:1.45rem;font-weight:600;display:block}
.k-terms span{font-size:.95rem;color:var(--k-ink-soft)}
.k-cta{margin-top:1.4rem}
.k-cta a{display:inline-block;border:1px solid var(--k-accent);color:var(--k-accent);text-decoration:none;padding:.7rem 1.3rem;font-size:1rem}
.k-cta a:hover{background:var(--k-accent);color:var(--k-paper)}
.k-secondary{margin-top:1rem;font-size:.98rem;color:var(--k-ink-soft)}

.k-footer{padding:2.4rem 0;margin-top:3rem;color:var(--k-nt);font-size:.9rem;border-top:1px solid var(--k-rule)}
.k-footer em{font-style:italic;color:var(--k-ink-soft)}

/* ---- mobil: faramele si podeaua se retrag, textul ramane rege ---- */
@media(max-width:900px){
  .k-wrap{padding:0 1.6rem 3.5rem;max-width:100%}
  .k-wrap::before,.k-wrap::after{display:none}
  .k-architrave{margin:0 -1.6rem;padding:.9rem 1rem;justify-content:flex-start;overflow-x:auto}
  .k-float{padding:1rem 1.6rem .7rem}
  body.konstatum{font-size:18px}
  .k-wordmark{font-size:2.1rem}
  .k-slab-edge{max-width:100%}
}