/* ============================================================================
   CABINET AVOCAT SIMONA JEFLEA — CONCEPT 8 · „STICKY STACK"
   Panouri care se fixează și se suprapun la derulare ca un teanc de cărți.
   Suprafețe în progresie silver → glacier → wine → ink, crimson pe cifră.
   Culori exclusiv din PALETTE.md. Tipografie: Bricolage Grotesque + Newsreader.
   ========================================================================== */

/* ---------- 1 · TOKENI ---------- */
:root{
  --ink-900:#111113;   --ink-800:#1A1A1C;   --ink-700:#242427;   --ink-600:#3E3E41;
  --silver-50:#F6F6F5; --silver-100:#EDEDEB; --silver-200:#D5D5D4;
  --silver-300:#C0C1BE; --silver-400:#AEAFAE; --silver-600:#7C7C7A;
  --glacier-50:#EEF2F7; --glacier-100:#DCE4EE; --glacier-200:#A8B4C6;
  --glacier-400:#919EB0; --glacier-600:#798699; --glacier-800:#4D4854;
  --wine-950:#1A0F11;  --wine-900:#2A1518;  --wine-800:#46262B;
  --wine-600:#653C43;  --wine-400:#82555C;
  --brand-crimson:#D5054F; --brand-mid:#9B0C41; --brand-burgundy:#8A0E3A;
  --brand-tint:#FDF2F6;    --brand-tint-2:#F2D3DF;

  --canvas:var(--glacier-50); --canvas-2:var(--silver-50);
  --sheet:var(--silver-50);   --sheet-2:var(--glacier-100);
  --deep:var(--wine-950);
  --tx:var(--wine-950); --tx-dim:var(--wine-600);
  --tx-on-deep:var(--silver-50); --tx-on-deep-dim:var(--glacier-200);
  --accent:var(--brand-crimson); --accent-deep:var(--brand-mid);
  --accent-soft:var(--brand-tint); --accent-edge:var(--brand-tint-2);
  --line:color-mix(in srgb, var(--wine-950) 13%, transparent);
  --line-soft:color-mix(in srgb, var(--wine-950) 7%, transparent);
  --line-deep:color-mix(in srgb, var(--silver-50) 17%, transparent);
  --ring:var(--brand-crimson); --bad:var(--brand-mid); --good:var(--brand-burgundy);

  --f-display:"Bricolage Grotesque","Helvetica Neue",Helvetica,Arial,sans-serif;
  --f-read:"Newsreader","Iowan Old Style",Georgia,"Times New Roman",serif;
  --t-mega:clamp(2.7rem,1.1rem + 6.6vw,6.5rem);  --t-xl:clamp(1.95rem,1.15rem + 3.3vw,3.9rem);
  --t-lg:clamp(1.5rem,1.15rem + 1.5vw,2.35rem);  --t-md:clamp(1.16rem,1.06rem + .46vw,1.46rem);
  --t-intro:clamp(1.07rem,1rem + .36vw,1.3rem);  --t-base:clamp(1rem,.972rem + .13vw,1.0625rem);
  --t-sm:.9375rem; --t-xs:.75rem; --t-ord:clamp(3.6rem,1.6rem + 8.4vw,8.5rem);
  --lh-tight:.96; --lh-snug:1.12; --lh-read:1.68;
  --track-w:.18em; --track-m:.1em;

  --s1:.25rem; --s2:.5rem; --s3:.75rem; --s4:1rem; --s5:1.5rem;
  --s6:2rem; --s7:2.75rem; --s8:4rem; --s9:6rem;
  --band:clamp(4.25rem,2rem + 8.5vw,9rem);

  --r-card:28px; --r-mid:18px; --r-sm:12px; --r-pill:999px;
  --shell:1280px; --gut:clamp(1.15rem,.35rem + 3.2vw,3.75rem);
  --h-pill:58px; --h-pad:11px;
  --h-header:calc(var(--h-pill) + (var(--h-pad) * 2));
  --deck-top:calc(var(--h-header) + var(--s3));
  --peek:clamp(8px,.95vw,15px);

  --sh-s:0 1px 2px color-mix(in srgb,var(--wine-950) 7%,transparent), 0 10px 26px -16px color-mix(in srgb,var(--wine-950) 34%,transparent);
  --sh-m:0 2px 4px color-mix(in srgb,var(--wine-950) 7%,transparent), 0 26px 58px -30px color-mix(in srgb,var(--wine-950) 42%,transparent);
  --sh-lift:0 -1px 0 color-mix(in srgb,var(--silver-50) 40%,transparent), 0 -22px 48px -26px color-mix(in srgb,var(--wine-950) 52%,transparent), 0 34px 74px -46px color-mix(in srgb,var(--wine-950) 46%,transparent);

  --e-out:cubic-bezier(.16,1,.3,1); --e-io:cubic-bezier(.4,0,.2,1);
  --d1:.16s; --d2:.36s; --d3:.7s;
}

/* ---------- 2 · RESET & BAZĂ ---------- */
/* overflow-x:clip nu creează un container de derulare, deci position:sticky
   rămâne funcțional — spre deosebire de overflow-x:hidden, care l-ar rupe. */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; overflow-x:clip; scroll-padding-top:calc(var(--h-header) + var(--s4)); }
@media (prefers-reduced-motion:no-preference){ html{ scroll-behavior:smooth; } }
body{
  margin:0; overflow-x:clip; background:var(--canvas); color:var(--tx);
  font-family:var(--f-read); font-size:var(--t-base); font-optical-sizing:auto;
  line-height:var(--lh-read); overflow-wrap:break-word;
  font-feature-settings:"kern" 1,"liga" 1;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img,svg{ display:block; max-width:100%; }
img{ height:auto; }
h1,h2,h3,h4,p,figure,blockquote,dl,dd{ margin:0; }
ul,ol{ margin:0; padding:0; list-style:none; }
a{ color:inherit; text-decoration:none; }
button,input,select,textarea{ font:inherit; color:inherit; }
h1,h2,h3,h4{ text-wrap:balance; }
p{ text-wrap:pretty; }
:focus-visible{ outline:2px solid var(--ring); outline-offset:3px; border-radius:var(--r-sm); }
::selection{ background:var(--accent); color:var(--silver-50); }
section[id]{ scroll-margin-top:calc(var(--h-header) + var(--s4)); }

.shell{ width:100%; max-width:var(--shell); margin-inline:auto; padding-inline:var(--gut); }
.vh{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.jump{
  position:fixed; inset-block-start:var(--s3); inset-inline-start:var(--s3); z-index:400;
  transform:translateY(-180%); background:var(--deep); color:var(--silver-50);
  padding:var(--s3) var(--s5); border-radius:var(--r-pill);
  font-family:var(--f-display); font-size:var(--t-sm); font-weight:600; letter-spacing:.03em;
  box-shadow:var(--sh-m); transition:transform var(--d2) var(--e-out);
}
.jump:focus-visible{ transform:none; }

/* ---------- 3 · PRIMITIVE TIPOGRAFICE ---------- */
.headline{
  font-family:var(--f-display); font-weight:600; font-variation-settings:"wdth" 100,"opsz" 96;
  line-height:var(--lh-snug); letter-spacing:-.035em; color:var(--tx);
}
.headline i{ font-style:normal; font-variation-settings:"wdth" 82,"opsz" 96; font-weight:300; }
.kicker{
  display:inline-flex; align-items:center; gap:var(--s3);
  font-family:var(--f-display); font-size:var(--t-xs); font-weight:700;
  letter-spacing:var(--track-w); text-transform:uppercase; color:var(--accent-deep);
}
.kicker::before{ content:""; flex:none; inline-size:26px; block-size:7px; border-radius:var(--r-pill); background:var(--accent); }
.intro{ font-size:var(--t-intro); line-height:1.62; color:var(--tx-dim); }
.tiny{ font-size:var(--t-sm); }
.band-head{ display:grid; gap:var(--s5); padding-block-end:var(--s7); }
.band-head h2{ font-size:var(--t-xl); }
.band-head__aside{ display:grid; gap:var(--s4); align-content:end; }
@media (min-width:920px){ .band-head{ grid-template-columns:minmax(0,7fr) minmax(0,4.4fr); gap:var(--s8); align-items:end; } }
.tagline{
  display:flex; flex-wrap:wrap; gap:var(--s2);
  font-family:var(--f-display); font-size:var(--t-xs); font-weight:600;
  letter-spacing:var(--track-m); text-transform:uppercase;
}
.tagline li{ padding:.34rem .72rem; border-radius:var(--r-pill); border:1px solid var(--line); color:var(--tx-dim); }

/* ---------- 4 · BUTOANE & LINKURI ---------- */
.action{
  --a-bg:var(--accent); --a-fg:var(--silver-50); --a-bd:var(--accent);
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s3);
  padding:.92rem 1.5rem; background:var(--a-bg); color:var(--a-fg);
  border:1.5px solid var(--a-bd); border-radius:var(--r-pill);
  font-family:var(--f-display); font-size:var(--t-sm); font-weight:700; line-height:1.2;
  cursor:pointer; box-shadow:var(--sh-s);
  transition:transform var(--d2) var(--e-out), box-shadow var(--d2) var(--e-out), background var(--d2) var(--e-io), color var(--d2) var(--e-io), border-color var(--d2) var(--e-io);
}
.action svg{ inline-size:16px; block-size:16px; flex:none; transition:transform var(--d2) var(--e-out); }
.action:hover{ transform:translateY(-3px); box-shadow:var(--sh-m); --a-bg:var(--accent-deep); --a-bd:var(--accent-deep); }
.action:hover svg{ transform:translateX(4px); }
.action:active{ transform:translateY(0); }
.action--line{ --a-bg:transparent; --a-fg:var(--tx); --a-bd:var(--line); box-shadow:none; }
.action--line:hover{ --a-bg:var(--deep); --a-fg:var(--silver-50); --a-bd:var(--deep); }
.action--onDeep{ --a-bg:transparent; --a-fg:var(--silver-50); --a-bd:var(--line-deep); box-shadow:none; }
.action--onDeep:hover{ --a-bg:var(--silver-50); --a-fg:var(--wine-950); --a-bd:var(--silver-50); }
.action--mini{ padding:.58rem 1.05rem; font-size:var(--t-xs); letter-spacing:.06em; text-transform:uppercase; }
.pull{
  display:inline-flex; align-items:center; gap:var(--s2);
  font-family:var(--f-display); font-weight:700; font-size:var(--t-sm);
  color:var(--accent-deep); padding-block-end:2px;
  background-image:linear-gradient(currentColor,currentColor);
  background-size:100% 1.5px; background-position:0 100%; background-repeat:no-repeat;
  transition:background-size var(--d2) var(--e-out), color var(--d1) var(--e-io);
}
.pull:hover{ background-size:22% 1.5px; color:var(--accent); }
.pull svg{ inline-size:15px; block-size:15px; }
.pull--deep{ color:var(--accent-edge); }
.pull--deep:hover{ color:var(--silver-50); }

/* ---------- 5 · ANTET PLUTITOR ---------- */
/* Antetul e sticky la top:0 și ocupă --h-header; panourile se fixează mai jos,
   la --deck-top, deci cele două straturi sticky nu se suprapun niciodată. */
.topbar{ position:sticky; inset-block-start:0; z-index:200; padding-block:var(--h-pad); pointer-events:none; }
.topbar > .shell{ pointer-events:auto; }
.topbar__pill{
  block-size:var(--h-pill); display:flex; align-items:center; justify-content:space-between;
  gap:var(--s4); padding-inline:var(--s3); border-radius:var(--r-pill);
  border:1px solid var(--line-soft);
  background:color-mix(in srgb, var(--silver-50) 76%, transparent);
  backdrop-filter:saturate(165%) blur(16px); -webkit-backdrop-filter:saturate(165%) blur(16px);
  transition:background var(--d2) var(--e-io), box-shadow var(--d2) var(--e-io), border-color var(--d2) var(--e-io);
}
.topbar.is-float .topbar__pill{ background:color-mix(in srgb, var(--silver-50) 93%, transparent); border-color:var(--line); box-shadow:var(--sh-m); }
.brand{ display:flex; align-items:center; gap:var(--s3); flex:none; padding-inline-start:var(--s2); }
.brand__logo{ block-size:38px; inline-size:auto; flex:none; transition:transform var(--d2) var(--e-out); }
.brand:hover .brand__logo{ transform:translateY(-2px) rotate(-3deg); }
.brand__txt{ display:grid; line-height:1.14; }
.brand__name{ font-family:var(--f-display); font-weight:700; font-size:1rem; letter-spacing:-.02em; transition:color var(--d1) var(--e-io); }
.brand:hover .brand__name{ color:var(--accent); }
.brand__role{ font-family:var(--f-display); font-size:.605rem; font-weight:600; letter-spacing:var(--track-w); text-transform:uppercase; color:var(--tx-dim); }
.mainnav{ display:none; }
.mainnav__list{ display:flex; align-items:center; gap:clamp(.1rem,1.1vw,.6rem); }
.mainnav__item{
  display:block; padding:.5rem .72rem; border-radius:var(--r-pill);
  font-family:var(--f-display); font-size:.815rem; font-weight:600; color:var(--tx-dim);
  transition:color var(--d1) var(--e-io), background var(--d1) var(--e-io);
}
.mainnav__item:hover{ color:var(--tx); background:color-mix(in srgb, var(--wine-950) 6%, transparent); }
.mainnav__item[aria-current="true"]{ color:var(--silver-50); background:var(--deep); }
.topbar__cta{ display:none; }
.toggle{
  inline-size:44px; block-size:44px; flex:none; display:grid; place-items:center;
  background:transparent; border:1px solid var(--line); border-radius:var(--r-pill); cursor:pointer;
  transition:background var(--d1) var(--e-io);
}
.toggle:hover{ background:color-mix(in srgb, var(--wine-950) 6%, transparent); }
.toggle__bars{ inline-size:19px; block-size:13px; position:relative; }
.toggle__bars i{ position:absolute; inset-inline:0; block-size:2px; border-radius:2px; background:var(--tx); transition:transform var(--d2) var(--e-out), opacity var(--d1) var(--e-io); }
.toggle__bars i:nth-child(1){ inset-block-start:0; }
.toggle__bars i:nth-child(2){ inset-block-start:5.5px; }
.toggle__bars i:nth-child(3){ inset-block-start:11px; }
.toggle[aria-expanded="true"] i:nth-child(1){ transform:translateY(5.5px) rotate(45deg); }
.toggle[aria-expanded="true"] i:nth-child(2){ opacity:0; transform:scaleX(.3); }
.toggle[aria-expanded="true"] i:nth-child(3){ transform:translateY(-5.5px) rotate(-45deg); }

/* ---------- 6 · SERTAR MOBIL ---------- */
.sheet{
  position:fixed; inset:var(--h-header) var(--s3) var(--s3); z-index:190;
  display:flex; flex-direction:column; gap:var(--s5);
  padding:var(--s6) var(--s5) var(--s5); border-radius:var(--r-card);
  background:var(--deep); color:var(--tx-on-deep); box-shadow:var(--sh-m);
  overflow-y:auto; overscroll-behavior:contain;
  opacity:0; visibility:hidden; transform:translateY(-14px) scale(.985);
  transition:opacity var(--d2) var(--e-io), transform var(--d2) var(--e-out), visibility var(--d2);
}
.sheet.is-open{ opacity:1; visibility:visible; transform:none; }
.sheet__list{ display:grid; }
.sheet__link{
  display:flex; align-items:baseline; gap:var(--s4); padding-block:var(--s4);
  border-block-end:1px solid var(--line-deep);
  font-family:var(--f-display); font-weight:600; font-size:clamp(1.4rem,6.2vw,1.95rem);
  line-height:1.15; letter-spacing:-.03em;
  transition:color var(--d1) var(--e-io), padding-inline-start var(--d2) var(--e-out);
}
.sheet__link:hover{ color:var(--accent-edge); padding-inline-start:var(--s2); }
.sheet__link i{ font-style:normal; font-size:.7rem; font-weight:700; letter-spacing:var(--track-m); color:var(--accent); flex:none; }
.sheet__foot{ display:grid; gap:var(--s3); justify-items:start; }
.sheet__foot a:not(.action){ font-size:var(--t-sm); color:var(--tx-on-deep-dim); }
.sheet__foot a:not(.action):hover{ color:var(--silver-50); }
body.is-locked,body:has(.sheet.is-open){ overflow:hidden; }
.gauge{ block-size:2px; margin-block-start:var(--h-pad); }
.gauge__fill{ block-size:100%; inline-size:0%; background:var(--accent); border-radius:var(--r-pill); transition:inline-size .09s linear; }
@media (min-width:1060px){
  .mainnav{ display:block; }
  .topbar__cta{ display:inline-flex; }
  .toggle,.sheet{ display:none; }
}

/* ---------- 7 · HERO (titlu fixat, conținut care curge) ---------- */
.opener{ padding-block:clamp(2rem,1rem + 4.5vw,4.5rem) var(--band); }
.opener__grid{ display:grid; gap:var(--s7); }
.opener__pin{ display:grid; gap:var(--s5); align-content:start; }
.opener__title{ font-size:var(--t-mega); line-height:var(--lh-tight); letter-spacing:-.05em; }
.opener__title span{ display:block; }
.opener__title .is-key{ color:var(--accent-deep); font-variation-settings:"wdth" 88,"opsz" 96; font-weight:800; }
.opener__title .is-thin{ font-family:var(--f-read); font-style:italic; font-weight:300; letter-spacing:-.02em; color:var(--tx-dim); }
.opener__badge{
  display:inline-flex; align-items:center; gap:var(--s3); justify-self:start;
  padding:.55rem .95rem .55rem .6rem; border-radius:var(--r-pill);
  background:var(--sheet); border:1px solid var(--line-soft); box-shadow:var(--sh-s);
  font-family:var(--f-display); font-size:var(--t-xs); font-weight:700;
  letter-spacing:var(--track-m); text-transform:uppercase;
}
.opener__badge svg{ inline-size:19px; block-size:19px; color:var(--accent); flex:none; }
.opener__flow{ display:grid; gap:var(--s6); align-content:start; }
.opener__shot{ position:relative; isolation:isolate; container-type:inline-size; aspect-ratio:1/1.12; max-inline-size:620px; }
/* rama (înclinată în 3D) poartă și fundalul și decupajul; capul depășește marginea de sus */
.opener__frame{
  position:absolute; inset:14% 0 0 0;
  transform:perspective(1400px) rotateY(6deg) rotate(-1.2deg); transform-origin:50% 100%;
}
.opener__skin{
  position:absolute; inset:0; border-radius:var(--r-card); overflow:clip;
  border:1px solid color-mix(in srgb,var(--glacier-800) 16%,transparent); box-shadow:var(--sh-m);
  background:
    radial-gradient(58% 46% at 62% 30%, color-mix(in srgb,var(--brand-tint-2) 78%,transparent), transparent 72%),
    linear-gradient(160deg, var(--glacier-200) 0%, var(--glacier-100) 44%, var(--glacier-50) 100%);
}
.opener__skin::before{
  content:""; position:absolute; inset:auto 0 0 0; block-size:44%;
  background:repeating-linear-gradient(180deg, color-mix(in srgb,var(--glacier-800) 15%,transparent) 0 1px, transparent 1px 22px);
  -webkit-mask-image:linear-gradient(180deg, transparent, #000 45%); mask-image:linear-gradient(180deg, transparent, #000 45%);
}
.opener__skin::after{ content:""; position:absolute; inset:0; background-image:var(--grain); opacity:.14; mix-blend-mode:multiply; pointer-events:none; }
.opener__mono{
  position:absolute; inset-inline-start:-.04em; inset-block-start:-.16em;
  font-family:var(--f-display); font-weight:800; font-style:normal;
  font-variation-settings:"wdth" 78,"opsz" 96; font-size:62cqi; line-height:1; letter-spacing:-.09em;
  color:color-mix(in srgb,var(--silver-50) 60%,transparent); user-select:none;
}
.opener__cut{
  position:absolute; inset-block-end:0; inset-inline-start:50%; translate:-47% 0;
  inline-size:min(76%,385px); block-size:auto; max-width:none;
  filter:var(--dsh-light);
}
.opener__shot figcaption{
  position:absolute; inset-inline:var(--s4); inset-block-end:var(--s4);
  display:flex; flex-wrap:wrap; align-items:center; gap:var(--s2) var(--s3);
  padding:.55rem .9rem; border-radius:var(--r-pill);
  background:color-mix(in srgb, var(--silver-50) 88%, transparent);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  font-family:var(--f-display); font-size:var(--t-xs); font-weight:600;
  letter-spacing:var(--track-m); text-transform:uppercase; color:var(--tx);
}
.opener__shot figcaption::before{ content:""; inline-size:7px; block-size:7px; border-radius:var(--r-pill); background:var(--accent); flex:none; }
.opener__cta{ display:flex; flex-wrap:wrap; gap:var(--s3); }
.opener__facts{ display:grid; gap:var(--s2); padding:var(--s5); border-radius:var(--r-mid); background:var(--sheet); border:1px solid var(--line-soft); box-shadow:var(--sh-s); }
.opener__facts > div{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--s3); padding-block:var(--s2); }
.opener__facts > div + div{ border-block-start:1px solid var(--line-soft); }
.opener__facts dt{ font-family:var(--f-display); font-size:var(--t-xs); font-weight:600; letter-spacing:var(--track-m); text-transform:uppercase; color:var(--tx-dim); }
.opener__facts dd{ font-family:var(--f-display); font-weight:600; font-size:var(--t-sm); text-align:end; }
.opener__facts dd a:hover{ color:var(--accent); }
@media (min-width:920px){
  .opener__grid{ grid-template-columns:minmax(0,1.02fr) minmax(0,1fr); column-gap:clamp(2rem,4vw,5rem); align-items:start; }
  .opener__pin{ position:sticky; inset-block-start:calc(var(--h-header) + var(--s5)); align-self:start; }
  .opener__flow{ gap:var(--s7); padding-block-start:var(--s4); }
  .opener__shot{ aspect-ratio:1/1.12; }
}

/* ---------- 8 · BARĂ DE ÎNCREDERE ---------- */
.creds{ padding-block-end:var(--band); }
.creds__grid{ display:grid; gap:var(--s4); grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr)); }
.creds__card{
  display:grid; gap:var(--s3); align-content:start; padding:var(--s5);
  border-radius:var(--r-mid); background:var(--sheet); border:1px solid var(--line-soft);
  box-shadow:var(--sh-s); transition:transform var(--d2) var(--e-out), box-shadow var(--d2) var(--e-out);
}
.creds__card:hover{ transform:translateY(-5px); box-shadow:var(--sh-m); }
.creds__ico{ inline-size:38px; block-size:38px; padding:8px; border-radius:var(--r-sm); background:var(--accent-soft); color:var(--accent-deep); }
.creds__val{ font-family:var(--f-display); font-weight:700; font-size:clamp(1.3rem,1rem + 1.3vw,1.85rem); line-height:1.1; letter-spacing:-.035em; }
.creds__lbl{ font-family:var(--f-display); font-size:var(--t-xs); font-weight:600; letter-spacing:var(--track-m); text-transform:uppercase; color:var(--tx-dim); }

/* ---------- 9 · MISIUNE ---------- */
.mission{ padding-block:var(--band); background:var(--canvas-2); }
.mission__grid{ display:grid; gap:var(--s6); }
.mission__card{ display:grid; gap:var(--s5); align-content:start; padding:clamp(1.5rem,1rem + 2.4vw,3rem); border-radius:var(--r-card); background:var(--sheet-2); box-shadow:var(--sh-s); }
.mission__card p{ max-width:58ch; }
.mission__lede{ font-size:var(--t-intro); line-height:1.6; }
.mission__lede::first-letter{ float:inline-start; font-family:var(--f-display); font-weight:800; font-size:3.9em; line-height:.8; padding-inline-end:.09em; padding-block-start:.03em; color:var(--accent); }
.mission__sep{ block-size:1px; border:0; margin:0; background:var(--line); }
.mission__aside{ display:grid; gap:var(--s5); align-content:start; }
.mission__fig{
  position:relative; isolation:isolate; aspect-ratio:9/10; border-radius:var(--r-card); overflow:clip; box-shadow:var(--sh-m);
  background:linear-gradient(170deg, var(--silver-50), var(--glacier-50) 55%, var(--glacier-100));
}
.mission__fig::before{
  content:""; position:absolute; inset:auto 0 0 0; block-size:46%; z-index:0;
  background:repeating-linear-gradient(180deg, color-mix(in srgb,var(--glacier-800) 14%,transparent) 0 1px, transparent 1px 20px);
  -webkit-mask-image:linear-gradient(180deg, transparent, #000 50%); mask-image:linear-gradient(180deg, transparent, #000 50%);
}
.mission__fig::after{ content:""; position:absolute; inset:0; z-index:5; background-image:var(--grain); opacity:.12; mix-blend-mode:multiply; pointer-events:none; }
/* placa: dreptunghi rotunjit înclinat în 3D, care iese prin marginea stângă; capul depășește marginea de sus a plăcii */
.mission__plate{
  position:absolute; inset:11% 10% 18% -10%; z-index:1; border-radius:var(--r-card);
  background:linear-gradient(160deg, var(--glacier-200), var(--glacier-100) 82%);
  border:1px solid color-mix(in srgb,var(--glacier-800) 18%,transparent);
  transform:perspective(1200px) rotateY(-7deg) rotate(-2.4deg); transform-origin:50% 100%;
}
.mission__plate::before{ content:""; position:absolute; inset-inline-start:17%; inset-block-start:9%; inline-size:22%; block-size:4px; border-radius:var(--r-pill); background:var(--accent); }
.mission__cut{
  position:absolute; inset-block-end:-4%; inset-inline-start:51%; translate:-50% 0; z-index:2;
  inline-size:100%; max-inline-size:585px; block-size:auto; max-width:none; filter:var(--dsh-light);
}
/* „biroul": un plan în fața figurii — ascunde resturile de hârtie de la baza decupajului și dă mâinilor un sprijin */
.mission__desk{
  position:absolute; inset:auto -4% -2% -4%; block-size:10%; z-index:3; border-radius:var(--r-mid) var(--r-mid) 0 0;
  background:linear-gradient(180deg, var(--glacier-200), var(--glacier-100));
  box-shadow:0 -1px 0 color-mix(in srgb,var(--silver-50) 85%,transparent), 0 -22px 36px -14px color-mix(in srgb,var(--wine-950) 30%,transparent);
}
.mission__desk::after{ content:""; position:absolute; inset-inline:0; inset-block-start:0; block-size:2px; background:linear-gradient(90deg, var(--brand-crimson) 0 28%, transparent 60%); }
.mission__note{
  display:grid; gap:var(--s3); padding:var(--s5); border-radius:var(--r-mid);
  border:1px solid var(--line); border-inline-start:4px solid var(--accent);
  background:var(--sheet); font-size:var(--t-sm); color:var(--tx-dim);
}
.mission__note strong{ font-family:var(--f-display); color:var(--tx); }
@media (min-width:960px){ .mission__grid{ grid-template-columns:minmax(0,1.45fr) minmax(0,1fr); gap:var(--s7); align-items:start; } }

/* ---------- 10 · MOTTO ---------- */
.motto{ padding-block:var(--band); background:var(--canvas-2); }
.motto__card{
  position:relative; display:grid; gap:var(--s5); justify-items:center; text-align:center;
  padding:clamp(2.5rem,1.5rem + 5vw,5.5rem) clamp(1.25rem,1rem + 3vw,4rem);
  border-radius:var(--r-card); background:var(--deep); color:var(--tx-on-deep);
  box-shadow:var(--sh-m); overflow:clip;
}
.motto__card::before{ content:""; position:absolute; inset-block-start:0; inset-inline:0; block-size:6px; background:linear-gradient(90deg,var(--brand-crimson),var(--brand-mid),var(--brand-burgundy)); }
.motto__mark{ font-family:var(--f-read); font-style:italic; font-weight:300; font-size:clamp(3.2rem,8vw,5.5rem); line-height:.55; color:var(--accent); opacity:.6; }
.motto blockquote{ font-family:var(--f-read); font-style:italic; font-weight:300; font-size:clamp(1.85rem,.9rem + 4.2vw,4.25rem); line-height:1.1; letter-spacing:-.035em; max-width:17ch; }
.motto figcaption{ display:flex; align-items:center; gap:var(--s3); font-family:var(--f-display); font-size:var(--t-xs); font-weight:600; letter-spacing:var(--track-w); text-transform:uppercase; color:var(--tx-on-deep-dim); }
.motto figcaption::before,.motto figcaption::after{ content:""; inline-size:24px; block-size:1px; background:var(--line-deep); }
/* ============================================================================
   11 · TEANCUL DE PANOURI (piesa centrală)
   .deck > .deck__slot (bloc înalt, poartă view-timeline)
                       > .deck__pin (position:sticky)
                         > .card (suprafața)
   Niciun strămoș nu are overflow:hidden — altfel sticky s-ar rupe.
   Implicit (mobil / ecrane joase): teanc dezactivat, simplă succesiune.
   ========================================================================== */
.practice{ padding-block:var(--band); }
.deck{ display:grid; gap:var(--s5); counter-reset:deck; }
.deck__slot{ counter-increment:deck; }
.card{
  position:relative; isolation:isolate; display:grid;
  border-radius:var(--r-card); background:var(--surf); color:var(--on-surf);
  border:1px solid var(--edge); box-shadow:var(--sh-m);
  overflow:clip; transform-origin:50% 0%;
}
.card__body{
  container-type:inline-size; container-name:card;
  position:relative; z-index:2; display:grid; gap:var(--s4); align-content:start;
  padding:clamp(1.4rem,1rem + 2.6vw,3.25rem);
}
.card__top{ display:flex; align-items:center; justify-content:space-between; gap:var(--s4); flex-wrap:wrap; }
.card__ord{
  font-family:var(--f-display); font-weight:800; font-size:var(--t-ord);
  line-height:.82; letter-spacing:-.06em; font-variant-numeric:lining-nums tabular-nums;
  color:var(--accent);
}
.card__ord::after{ content:counter(deck,decimal-leading-zero); }
.card__chip{
  display:inline-flex; align-items:center; padding:.4rem .8rem; border-radius:var(--r-pill);
  border:1px solid var(--edge-strong); font-family:var(--f-display); font-size:var(--t-xs);
  font-weight:700; letter-spacing:var(--track-m); text-transform:uppercase; color:var(--on-surf-dim);
}
.card__title{ font-family:var(--f-display); font-weight:700; font-size:var(--t-lg); line-height:1.1; letter-spacing:-.035em; color:var(--on-surf); }
.card__text{ font-size:var(--t-intro); line-height:1.6; color:var(--on-surf-dim); max-width:52ch; }
.card__tags{ display:flex; flex-wrap:wrap; gap:var(--s2); font-family:var(--f-display); font-size:var(--t-xs); font-weight:600; letter-spacing:var(--track-m); text-transform:uppercase; }
.card__tags li{ padding:.34rem .7rem; border-radius:var(--r-pill); background:var(--tagbg); color:var(--on-surf-dim); }
.card__foot{ display:flex; flex-wrap:wrap; gap:var(--s4); align-items:center; margin-block-start:var(--s2); }
.card__media{ position:relative; z-index:1; background:var(--tagbg); overflow:clip; }
.card__veil{ position:absolute; inset:0; z-index:5; border-radius:inherit; background:var(--ink-900); opacity:0; pointer-events:none; }
@container card (min-width:520px){ .card__tags{ font-size:.7rem; } }

/* progresia de suprafețe: silver → glacier → wine → ink */
.deck__slot:nth-child(1) .card{ --surf:var(--silver-50); --on-surf:var(--wine-950); --on-surf-dim:var(--wine-600); --edge:var(--line); --edge-strong:var(--line); --tagbg:color-mix(in srgb,var(--wine-950) 6%,transparent); }
.deck__slot:nth-child(2) .card{ --surf:var(--glacier-50); --on-surf:var(--wine-950); --on-surf-dim:var(--wine-600); --edge:var(--line); --edge-strong:var(--line); --tagbg:color-mix(in srgb,var(--glacier-800) 10%,transparent); }
.deck__slot:nth-child(3) .card{ --surf:var(--glacier-100); --on-surf:var(--wine-950); --on-surf-dim:var(--wine-600); --edge:color-mix(in srgb,var(--glacier-800) 22%,transparent); --edge-strong:color-mix(in srgb,var(--glacier-800) 34%,transparent); --tagbg:color-mix(in srgb,var(--silver-50) 62%,transparent); }
.deck__slot:nth-child(4) .card{ --surf:var(--wine-900); --on-surf:var(--silver-50); --on-surf-dim:var(--glacier-200); --edge:var(--line-deep); --edge-strong:var(--line-deep); --tagbg:color-mix(in srgb,var(--silver-50) 10%,transparent); }
.deck__slot:nth-child(5) .card{ --surf:var(--wine-950); --on-surf:var(--silver-50); --on-surf-dim:var(--glacier-200); --edge:var(--line-deep); --edge-strong:var(--line-deep); --tagbg:color-mix(in srgb,var(--silver-50) 10%,transparent); }
.deck__slot:nth-child(6) .card{ --surf:var(--ink-900); --on-surf:var(--silver-50); --on-surf-dim:var(--glacier-200); --edge:var(--line-deep); --edge-strong:var(--line-deep); --tagbg:color-mix(in srgb,var(--silver-50) 10%,transparent); }
.deck__slot:nth-child(n+4) .pull{ color:var(--accent-edge); }
.deck__slot:nth-child(n+4) .pull:hover{ color:var(--silver-50); }

@media (min-width:760px){
  .card{ grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr); align-items:stretch; }
  .card__media{ min-block-size:100%; }
}

/* MODUL FIXAT. Elementul agățat este .deck__slot, iar blocul lui de încadrare
   este .deck — înalt cât toate cardurile la un loc. De aceea panourile rămân
   fixate și se adună unul peste altul. Dacă sticky s-ar pune pe .deck__pin,
   cursa de agățare ar fi zero (slotul e exact cât cardul) și teancul nu ar apărea.
   Fiecare slot se oprește cu --peek mai jos decât precedentul, lăsând muchiile
   vizibile ca într-un pachet de cărți. */
@media (min-width:900px) and (min-height:640px){
  .deck{ display:block; padding-block-end:12svh; }
  /* Coada descrescătoare face ca fiecare slot să se desprindă cu --peek mai
     devreme decât următorul, așa că teancul iese din ecran păstrând treptele,
     în loc să se turtească brusc într-un singur card. */
  .deck__slot{
    position:sticky;
    inset-block-start:calc(var(--deck-top) + (var(--i) * var(--peek)));
    padding-block-end:calc((5 - var(--i)) * var(--peek));
  }
  .card{ min-block-size:calc(100svh - var(--deck-top) - (5 * var(--peek)) - var(--s6)); box-shadow:var(--sh-lift); }
}

/* Adâncime condusă de derulare. Un singur cronometru declarat pe .deck (care
   nu e agățat, deci progresează continuu); fiecare card își ia felia lui de
   20% — cele cinci treceri dintre cele șase panouri. */
@supports (animation-timeline:view()){
  @media (min-width:900px) and (min-height:640px) and (prefers-reduced-motion:no-preference){
    .practice{ timeline-scope:--deckline; }
    .deck{ view-timeline-name:--deckline; view-timeline-axis:block; }
    .deck__slot:not(:last-child) .card,
    .deck__slot:not(:last-child) .card__veil{
      animation-timeline:--deckline;
      animation-range:contain calc(var(--i) * 20%) contain calc((var(--i) + 1) * 20%);
      animation-timing-function:linear; animation-fill-mode:both;
    }
    .deck__slot:not(:last-child) .card{ animation-name:card-recede; }
    .deck__slot:not(:last-child) .card__veil{ animation-name:veil-rise; }
  }
}
@keyframes card-recede{ from{ transform:scale(1); } to{ transform:scale(.935); } }
@keyframes veil-rise{ from{ opacity:0; } to{ opacity:.46; } }

/* indicator lateral al teancului */
.rail{
  position:fixed; inset-inline-start:clamp(10px,1.6vw,26px); inset-block-start:50%; z-index:150;
  display:none; gap:var(--s3); justify-items:center;
  padding:var(--s4) var(--s3); border-radius:var(--r-pill);
  background:color-mix(in srgb, var(--silver-50) 82%, transparent);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border:1px solid var(--line-soft); box-shadow:var(--sh-s);
  transform:translateY(-50%) translateX(-14px); opacity:0; visibility:hidden;
  transition:opacity var(--d2) var(--e-io), transform var(--d2) var(--e-out), visibility var(--d2);
}
.rail.is-on{ opacity:1; visibility:visible; transform:translateY(-50%); }
.rail__n{ font-family:var(--f-display); font-size:.68rem; font-weight:700; letter-spacing:.06em; color:var(--tx-dim); font-variant-numeric:tabular-nums; }
.rail__n--now{ color:var(--accent-deep); }
.rail__dots{ display:grid; gap:9px; }
.rail__dots i{ display:block; inline-size:7px; block-size:7px; border-radius:var(--r-pill); background:var(--glacier-200); transition:background var(--d2) var(--e-io), transform var(--d2) var(--e-out); }
.rail__dots i.is-live{ background:var(--accent); transform:scale(1.55); }
@media (min-width:1280px) and (min-height:640px){ .rail{ display:grid; } }

/* ---------- 12 · PROCES (același limbaj, la scară mică) ---------- */
.route-band{ padding-block:var(--band); background:var(--canvas-2); }
.route{ display:grid; gap:var(--s4); counter-reset:route; }
.route__slot{ counter-increment:route; }
.route__card{
  position:relative; display:grid; gap:var(--s4);
  grid-template-columns:auto minmax(0,1fr); align-items:start;
  padding:clamp(1.25rem,1rem + 1.7vw,2.25rem); border-radius:var(--r-card);
  background:var(--sheet); border:1px solid var(--line-soft); box-shadow:var(--sh-m);
}
.route__slot:nth-child(2) .route__card{ background:var(--glacier-50); }
.route__slot:nth-child(3) .route__card{ background:var(--glacier-100); border-color:color-mix(in srgb,var(--glacier-800) 20%,transparent); }
.route__slot:nth-child(4) .route__card{ background:var(--deep); color:var(--tx-on-deep); border-color:var(--line-deep); }
.route__slot:nth-child(4) .route__txt{ color:var(--tx-on-deep-dim); }
.route__slot:nth-child(4) .route__ord{ background:color-mix(in srgb,var(--silver-50) 10%,transparent); color:var(--accent-edge); }
.route__slot:nth-child(4) .route__step{ color:var(--accent-edge); }
.route__ord{
  display:grid; place-items:center; inline-size:clamp(50px,7vw,68px); block-size:clamp(50px,7vw,68px);
  border-radius:var(--r-mid); background:var(--accent-soft); color:var(--accent-deep);
  font-family:var(--f-display); font-weight:800; font-size:clamp(1.15rem,1rem + .8vw,1.6rem);
  letter-spacing:-.03em; font-variant-numeric:tabular-nums;
}
.route__ord::after{ content:counter(route,decimal-leading-zero); }
.route__head{ display:grid; gap:var(--s2); }
.route__step{ font-family:var(--f-display); font-size:var(--t-xs); font-weight:700; letter-spacing:var(--track-w); text-transform:uppercase; color:var(--accent-deep); }
.route__card h3{ font-family:var(--f-display); font-weight:700; font-size:var(--t-md); line-height:1.15; letter-spacing:-.03em; }
.route__txt{ color:var(--tx-dim); font-size:var(--t-sm); max-width:56ch; }
@media (min-width:900px) and (min-height:640px){
  .route{ gap:0; }
  .route__slot{ min-block-size:min(52svh,400px); }
  .route__pin{ position:sticky; inset-block-start:calc(var(--deck-top) + (var(--j) * 20px)); }
  .route__card{ min-block-size:clamp(190px,24svh,230px); align-content:center; }
}

/* ---------- 13 · ÎNTREBĂRI FRECVENTE ---------- */
.qa-band{ padding-block:var(--band); }
.qa-band__grid{ display:grid; gap:var(--s6); align-items:start; }
.qa{ display:grid; border-radius:var(--r-card); background:var(--sheet); border:1px solid var(--line-soft); box-shadow:var(--sh-m); overflow:clip; }
.qa__row + .qa__row{ border-block-start:1px solid var(--line-soft); }
.qa__row:has(.qa__trigger[aria-expanded="true"]){ background:var(--glacier-50); }
.qa__h{ margin:0; }
.qa__trigger{
  inline-size:100%; display:flex; align-items:center; justify-content:space-between; gap:var(--s5);
  padding:clamp(1.1rem,.9rem + .8vw,1.6rem) clamp(1.15rem,.9rem + 1.4vw,2.25rem);
  background:none; border:0; cursor:pointer; text-align:start;
  font-family:var(--f-display); font-weight:600; font-size:clamp(1.03rem,.98rem + .5vw,1.3rem);
  line-height:1.3; letter-spacing:-.025em; transition:color var(--d1) var(--e-io);
}
.qa__trigger:hover,.qa__trigger[aria-expanded="true"]{ color:var(--accent-deep); }
.qa__sign{
  position:relative; flex:none; inline-size:30px; block-size:30px; border-radius:var(--r-pill);
  border:1.5px solid var(--line);
  transition:background var(--d2) var(--e-io), border-color var(--d2) var(--e-io), transform var(--d2) var(--e-out);
}
.qa__sign::before,.qa__sign::after{ content:""; position:absolute; inset-block-start:50%; inset-inline:8px; block-size:1.5px; border-radius:2px; background:currentColor; transform:translateY(-50%); transition:transform var(--d2) var(--e-out), opacity var(--d1) var(--e-io); }
.qa__sign::after{ transform:translateY(-50%) rotate(90deg); }
.qa__trigger[aria-expanded="true"] .qa__sign{ background:var(--accent); border-color:var(--accent); color:var(--silver-50); transform:rotate(180deg); }
.qa__trigger[aria-expanded="true"] .qa__sign::after{ opacity:0; transform:translateY(-50%) rotate(0deg); }
.qa__drop{ display:grid; grid-template-rows:0fr; transition:grid-template-rows var(--d2) var(--e-out); }
.qa__drop.is-open{ grid-template-rows:1fr; }
.qa__drop > div{ overflow:hidden; }
.qa__drop p{ padding:0 clamp(1.15rem,.9rem + 1.4vw,2.25rem) clamp(1.15rem,.9rem + 1vw,1.75rem); max-width:66ch; color:var(--tx-dim); font-size:var(--t-sm); }
.qa__side{ display:grid; gap:var(--s4); align-content:start; padding:clamp(1.4rem,1rem + 1.8vw,2.25rem); border-radius:var(--r-card); background:var(--deep); color:var(--tx-on-deep); box-shadow:var(--sh-m); }
.qa__side h3{ font-family:var(--f-display); font-weight:700; font-size:var(--t-md); letter-spacing:-.03em; }
.qa__side p{ color:var(--tx-on-deep-dim); font-size:var(--t-sm); }
.qa__side hr{ block-size:1px; border:0; margin:0; background:var(--line-deep); }
.qa__side ul{ display:grid; gap:var(--s3); }
@media (min-width:1000px){ .qa-band__grid{ grid-template-columns:minmax(0,1.75fr) minmax(0,1fr); gap:var(--s7); } }

/* ---------- 14 · CONTACT ---------- */
.reach{ padding-block:var(--band); background:var(--canvas-2); }
.reach__grid{ display:grid; gap:var(--s6); align-items:start; }
.reach__facts{ display:grid; gap:var(--s4); align-content:start; padding:clamp(1.4rem,1rem + 1.8vw,2.5rem); border-radius:var(--r-card); background:var(--sheet-2); box-shadow:var(--sh-s); }
.reach__fact{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:var(--s4); align-items:start; padding-block:var(--s3); }
.reach__fact + .reach__fact{ border-block-start:1px solid color-mix(in srgb,var(--glacier-800) 20%,transparent); }
.reach__ico{ inline-size:34px; block-size:34px; padding:7px; flex:none; border-radius:var(--r-sm); background:var(--sheet); color:var(--accent-deep); }
.reach__k{ font-family:var(--f-display); font-size:var(--t-xs); font-weight:600; letter-spacing:var(--track-m); text-transform:uppercase; color:var(--tx-dim); }
.reach__v{ font-family:var(--f-display); font-weight:600; font-size:var(--t-sm); line-height:1.45; }
.reach__v a{ background-image:linear-gradient(var(--line),var(--line)); background-size:100% 1.5px; background-position:0 100%; background-repeat:no-repeat; transition:background-size var(--d2) var(--e-out), color var(--d1) var(--e-io); }
.reach__v a:hover{ color:var(--accent); background-size:0% 1.5px; }
.reach__fig{
  position:relative; isolation:isolate; margin-block-start:var(--s2); aspect-ratio:16/9; border-radius:var(--r-mid); overflow:clip; box-shadow:var(--sh-s);
  background:linear-gradient(160deg, var(--silver-50), var(--glacier-100));
}
.reach__fig::before{
  content:""; position:absolute; inset:0; z-index:0;
  background:repeating-linear-gradient(180deg, color-mix(in srgb,var(--glacier-800) 12%,transparent) 0 1px, transparent 1px 18px);
  -webkit-mask-image:linear-gradient(90deg, #000 30%, transparent 75%); mask-image:linear-gradient(90deg, #000 30%, transparent 75%);
}
/* natură statică: telefonul (obiect, nu se oglindește) intră din colțul de jos-dreapta, pe un disc glacier;
   tăietura de la încheietură rămâne sub marginea figurii */
.reach__plate{
  position:absolute; inset-block-start:-32%; inset-inline-end:-9%; inline-size:74%; aspect-ratio:1; z-index:1; border-radius:50%;
  background:radial-gradient(circle at 42% 40%, var(--glacier-200), var(--glacier-100) 72%);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--glacier-800) 14%,transparent), 0 0 0 10px color-mix(in srgb,var(--brand-crimson) 5%,transparent);
}
.reach__cut{
  position:absolute; inset-block-end:-14%; inset-inline-end:4%; z-index:2;
  inline-size:min(54%,300px); block-size:auto; max-width:none;
  filter:drop-shadow(0 18px 22px color-mix(in srgb,var(--wine-950) 28%,transparent)) drop-shadow(0 2px 4px color-mix(in srgb,var(--wine-950) 12%,transparent));
}
.reach__fig figcaption{
  position:absolute; z-index:3; inset-inline-start:var(--s3); inset-block-end:var(--s3);
  padding:.4rem .75rem; border-radius:var(--r-pill);
  background:color-mix(in srgb, var(--silver-50) 90%, transparent);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  font-family:var(--f-display); font-size:var(--t-xs); font-weight:600;
  letter-spacing:var(--track-m); text-transform:uppercase; color:var(--tx);
}
.enquiry{ display:grid; gap:var(--s5); padding:clamp(1.4rem,1rem + 1.8vw,2.5rem); border-radius:var(--r-card); background:var(--sheet); border:1px solid var(--line-soft); box-shadow:var(--sh-m); }
.enquiry__pair{ display:grid; gap:var(--s5); }
@media (min-width:620px){ .enquiry__pair{ grid-template-columns:1fr 1fr; } }
.cell{ display:grid; gap:var(--s2); }
.cell label{ font-family:var(--f-display); font-size:var(--t-xs); font-weight:700; letter-spacing:var(--track-m); text-transform:uppercase; color:var(--tx-dim); transition:color var(--d1) var(--e-io); }
.cell:has(input:focus-visible) label,.cell:has(textarea:focus-visible) label{ color:var(--accent-deep); }
.cell label .req{ color:var(--accent); }
.cell input,.cell textarea{
  inline-size:100%; padding:.82rem 1rem; background:var(--canvas);
  border:1.5px solid var(--line-soft); border-radius:var(--r-sm);
  font-family:var(--f-read); font-size:var(--t-base); color:var(--tx);
  transition:border-color var(--d2) var(--e-io), background var(--d2) var(--e-io);
}
.cell textarea{ resize:vertical; min-block-size:132px; line-height:1.6; }
.cell input::placeholder,.cell textarea::placeholder{ color:var(--glacier-600); }
.cell input:focus,.cell textarea:focus{ outline:0; border-color:var(--accent); background:var(--silver-50); }
.cell input:focus-visible,.cell textarea:focus-visible{ outline:0; }
.cell[data-bad="true"] input,.cell[data-bad="true"] textarea{ border-color:var(--bad); background:var(--accent-soft); }
.cell__msg{ font-size:var(--t-xs); color:var(--bad); min-block-size:1em; font-family:var(--f-display); font-weight:600; }
.consent{ position:relative; display:grid; grid-template-columns:auto minmax(0,1fr); gap:var(--s3); align-items:start; cursor:pointer; }
.consent input{ position:absolute; opacity:0; inline-size:1px; block-size:1px; }
.consent__box{
  inline-size:22px; block-size:22px; margin-block-start:2px; flex:none;
  border:1.5px solid var(--line); border-radius:7px; background:var(--canvas);
  display:grid; place-items:center;
  transition:background var(--d1) var(--e-io), border-color var(--d1) var(--e-io);
}
.consent__box svg{ inline-size:12px; block-size:12px; color:var(--silver-50); opacity:0; transform:scale(.5); transition:opacity var(--d1) var(--e-io), transform var(--d1) var(--e-out); }
.consent:has(input:checked) .consent__box{ background:var(--accent); border-color:var(--accent); }
.consent:has(input:checked) .consent__box svg{ opacity:1; transform:none; }
.consent input:focus-visible + .consent__box{ outline:2px solid var(--ring); outline-offset:3px; }
.consent__txt{ font-size:var(--t-sm); color:var(--tx-dim); }
.cell[data-bad="true"] .consent__box{ border-color:var(--bad); }
.enquiry__send{ display:flex; flex-wrap:wrap; gap:var(--s4); align-items:center; }
.enquiry__state{ font-size:var(--t-sm); min-block-size:1.5em; font-family:var(--f-display); font-weight:600; }
.enquiry__state[data-state="ok"]{ color:var(--good); }
.enquiry__state[data-state="err"]{ color:var(--bad); }
.enquiry:has(.enquiry__state[data-state="ok"]){ border-color:color-mix(in srgb,var(--brand-burgundy) 45%,transparent); }
@media (min-width:1000px){ .reach__grid{ grid-template-columns:minmax(0,1fr) minmax(0,1.18fr); gap:var(--s7); } }

/* ---------- 15 · SUBSOL ---------- */
.colophon{
  position:relative; z-index:2; background:var(--ink-900); color:var(--tx-on-deep);
  border-start-start-radius:var(--r-card); border-start-end-radius:var(--r-card);
  padding-block:var(--s8) var(--s5); margin-block-start:calc(var(--r-card) * -1);
}
.colophon a{ color:var(--tx-on-deep-dim); }
.colophon a:hover{ color:var(--silver-50); }
.colophon__top{ display:grid; gap:var(--s7); padding-block-end:var(--s7); border-block-end:1px solid var(--line-deep); }
.colophon__brand{ display:grid; gap:var(--s4); max-width:40ch; }
.colophon__lock{ display:flex; align-items:center; gap:var(--s4); }
.colophon__logo{ block-size:54px; inline-size:auto; flex:none; }
.colophon__name{ font-family:var(--f-display); font-weight:700; font-size:clamp(1.35rem,1rem + 1.6vw,1.95rem); line-height:1.12; letter-spacing:-.035em; color:var(--silver-50); }
.colophon__brand p{ color:var(--tx-on-deep-dim); font-size:var(--t-sm); }
.colophon__cols{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s6); }
.colophon__col h3{ font-family:var(--f-display); font-size:var(--t-xs); font-weight:700; letter-spacing:var(--track-w); text-transform:uppercase; color:var(--glacier-200); margin-block-end:var(--s4); }
.colophon__col li{ margin-block-end:var(--s2); }
.colophon__col a{ font-size:var(--t-sm); }
.colophon__policy{ padding-block-start:var(--s5); font-size:var(--t-xs); line-height:1.75; color:var(--glacier-200); max-width:82ch; }
.colophon__policy strong{ color:var(--silver-50); font-family:var(--f-display); }
.colophon__bot{ display:flex; flex-wrap:wrap; gap:var(--s3) var(--s5); justify-content:space-between; align-items:center; padding-block-start:var(--s5); font-size:var(--t-xs); color:var(--glacier-200); }
@media (min-width:860px){
  .colophon__top{ grid-template-columns:minmax(0,5fr) minmax(0,6.5fr); gap:var(--s9); }
  .colophon__cols{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}

/* ============================================================================
   18 · SCENE CU DECUPAJE
   Fotografiile fără fundal sunt așezate pe „plăci" construite din paleta
   machetei (glacier / silver / wine / ink), cu umbre colorate în tonul suprafeței.
   Înclinările se aplică ramei sau plăcii, niciodată persoanei singure;
   oglindirea se aplică doar portretelor, ca subiectul să privească spre text.
   Fiecare sesiune foto apare de cel mult două ori, în decupaje diferite:
   portret (hero, card 05), birou (misiune, card 03), consultație (card 02);
   obiectele rămân accente: ciocănelul (card 04), telefonul (contact).
   Cardurile 01 și 06 sunt pur grafice (teanc de avize, semnul §).
   ========================================================================== */
:root{
  --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='100%' height='100%' filter='url(%23g)'/></svg>");
  --dsh-light:drop-shadow(0 22px 26px color-mix(in srgb,var(--wine-950) 24%,transparent)) drop-shadow(0 3px 5px color-mix(in srgb,var(--wine-950) 10%,transparent));
  --dsh-dark:drop-shadow(0 0 1px color-mix(in srgb,var(--silver-100) 42%,transparent)) drop-shadow(0 26px 34px color-mix(in srgb,var(--ink-900) 62%,transparent));
}
.scene{ container-type:inline-size; }
.scene::after{ content:""; position:absolute; inset:0; z-index:4; background-image:var(--grain); opacity:.1; mix-blend-mode:multiply; pointer-events:none; }
.scene__plate,.scene__cut,.scene__group,.scene__glyph,.scene__stack{ position:absolute; }
.scene__cut{ block-size:auto; max-width:none; }
.scene__group{ inset-block-end:0; inset-inline-start:50%; translate:-50% 0; }
.scene__group .scene__cut{ position:relative; block-size:100%; inline-size:auto; z-index:2; }
.scene__group .scene__plate{ z-index:1; }
@media (max-width:759.98px){ .scene{ block-size:clamp(320px,92vw,460px); } }

/* 01 · registru: pagină liniată cu margine crimson; peste ea, un teanc de „avize" (plăci-document)
   înclinat în 3D și sigilat cu un inel crimson — ecoul grafic al teancului de carduri, în locul
   fotografiei cu cărți tăiate pe trei laturi. */
.scene--ledger{ background:linear-gradient(180deg, var(--glacier-50), var(--silver-50)); }
.scene--ledger::before{
  content:""; position:absolute; inset:0; z-index:0;
  background:
    linear-gradient(90deg, transparent 13%, var(--brand-crimson) 13%, var(--brand-crimson) calc(13% + 1.5px), transparent calc(13% + 1.5px)),
    repeating-linear-gradient(180deg, transparent 0 27px, color-mix(in srgb,var(--glacier-800) 16%,transparent) 27px 28px);
}
.scene__stack{
  inset-inline-start:50%; inset-block-end:-6%; translate:-42% 0; z-index:2;
  inline-size:min(66%,350px); aspect-ratio:3/4;
  transform:perspective(1200px) rotateY(-9deg) rotate(-3deg); transform-origin:50% 100%;
}
.scene__doc{
  position:absolute; inset:0; border-radius:var(--r-mid);
  background:linear-gradient(170deg, var(--silver-50), var(--glacier-50));
  border:1px solid color-mix(in srgb,var(--glacier-800) 22%,transparent);
  box-shadow:0 26px 46px -22px color-mix(in srgb,var(--wine-950) 42%,transparent), 0 2px 4px color-mix(in srgb,var(--wine-950) 6%,transparent);
  transform-origin:50% 100%;
}
.scene__doc:nth-child(1){ transform:rotate(-7deg) translate(-10%,-5%); background:linear-gradient(170deg, var(--glacier-100), var(--glacier-200)); }
.scene__doc:nth-child(2){ transform:rotate(-2.5deg) translate(-4%,-2%); background:linear-gradient(170deg, var(--glacier-50), var(--glacier-100)); }
.scene__doc:nth-child(3)::before{
  content:""; position:absolute; inset:11% 13% auto; block-size:46%;
  background:
    linear-gradient(90deg, var(--wine-950) 0 44%, transparent 44%) 0 0/100% 4px no-repeat,
    repeating-linear-gradient(180deg, transparent 0 13px, color-mix(in srgb,var(--glacier-800) 36%,transparent) 13px 14.5px);
  -webkit-mask-image:linear-gradient(180deg, #000 55%, transparent); mask-image:linear-gradient(180deg, #000 55%, transparent);
}
.scene__doc:nth-child(3)::after{
  content:""; position:absolute; inset-inline-end:11%; inset-block-end:10%; inline-size:25%; aspect-ratio:1; border-radius:50%;
  border:1.5px solid color-mix(in srgb,var(--brand-crimson) 75%,transparent);
  background:radial-gradient(circle, var(--brand-crimson) 0 17%, transparent 18%);
  box-shadow:0 0 0 8px color-mix(in srgb,var(--brand-crimson) 7%,transparent);
}

/* 02 · arcadă: figura oglindită privește spre text; capul depășește ușor arcada */
.scene--arch{ background:linear-gradient(180deg, var(--glacier-100), var(--glacier-50)); }
.scene--arch .scene__group{ block-size:min(93%,780px,120cqi); }
.scene--arch .scene__plate{
  inset-block-end:0; inset-inline-start:50%; translate:-50% 0; inline-size:140%; block-size:82%;
  border-radius:999px 999px 0 0;
  background:linear-gradient(180deg, var(--glacier-200), var(--glacier-100) 78%);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--glacier-800) 16%,transparent);
}
.scene--arch .scene__cut{ transform:scaleX(-1); filter:var(--dsh-light); }
.scene--arch .scene__group::before{
  content:""; position:absolute; inset-inline:-38%; inset-block-end:0; block-size:1.5px; z-index:0;
  background:linear-gradient(90deg, transparent, var(--brand-crimson) 30% 70%, transparent);
}

/* 03 · fereastră: bust așezat la birou, pe o placă rotunjită înclinată în 3D; capul depășește
   marginea de sus a plăcii, umerii ies prin marginea de jos a cardului (tăietura rămâne ascunsă) */
.scene--window{ background:linear-gradient(160deg, var(--glacier-100), var(--glacier-50) 70%); }
/* fereastra e legată de card (nu de figură): pe cardurile înalte din teanc crește în sus, cu linii fine deasupra capului */
.scene--window .scene__plate{
  inset-block-end:-7%; inset-inline-start:50%; translate:-47% 0; z-index:1;
  inline-size:min(80%,430px); block-size:min(92%,600px); border-radius:var(--r-card);
  background:linear-gradient(170deg, var(--glacier-200), var(--glacier-100) 72%);
  border:1px solid color-mix(in srgb,var(--glacier-800) 18%,transparent);
  transform:perspective(1200px) rotateY(9deg) rotate(2.5deg); transform-origin:50% 100%; box-shadow:var(--sh-m);
}
.scene--window .scene__plate::before{
  content:""; position:absolute; inset:16% 12% auto; block-size:34%;
  background:repeating-linear-gradient(180deg, color-mix(in srgb,var(--glacier-800) 16%,transparent) 0 1px, transparent 1px 20px);
  -webkit-mask-image:linear-gradient(180deg, #000 40%, transparent); mask-image:linear-gradient(180deg, #000 40%, transparent);
}
.scene--window .scene__plate::after{ content:""; position:absolute; inset-inline-start:12%; inset-block-start:8%; inline-size:26%; block-size:4px; border-radius:var(--r-pill); background:var(--accent); }
.scene--window .scene__group{ block-size:min(72%,345px,80cqi); translate:-47% 0; z-index:2; }
.scene--window .scene__cut{ filter:var(--dsh-light); }

/* 04 · ciocănel: obiect pe o placă deschisă, peste bordo-ul închis */
.scene--gavel{ background:radial-gradient(90% 70% at 50% 42%, var(--wine-800), var(--wine-900) 72%); }
.scene--gavel .scene__plate{
  inset-inline-start:50%; inset-block-start:50%; inline-size:min(80%,440px); aspect-ratio:1; z-index:1; border-radius:var(--r-card);
  background:linear-gradient(160deg, var(--glacier-100), var(--glacier-200));
  transform:translate(-50%,-50%) perspective(1200px) rotateY(-8deg) rotate(5deg);
  box-shadow:0 34px 70px -24px color-mix(in srgb,var(--wine-950) 80%,transparent), 0 0 0 1px color-mix(in srgb,var(--silver-50) 12%,transparent);
}
.scene--gavel .scene__plate::before{
  content:""; position:absolute; inset:0; border-radius:inherit;
  background:repeating-linear-gradient(180deg, transparent 0 22px, color-mix(in srgb,var(--glacier-800) 14%,transparent) 22px 23px);
  -webkit-mask-image:linear-gradient(180deg, transparent 40%, #000); mask-image:linear-gradient(180deg, transparent 40%, #000);
}
.scene--gavel .scene__plate::after{ content:""; position:absolute; inset-inline-start:12%; inset-block-start:12%; inline-size:26%; block-size:4px; border-radius:var(--r-pill); background:var(--accent); }
.scene--gavel .scene__cut{
  z-index:2; inset-inline-start:50%; inset-block-start:50%; inline-size:min(92%,600px);
  transform:translate(-50%,-42%) rotate(-7deg);
  filter:drop-shadow(0 22px 22px color-mix(in srgb,var(--wine-950) 55%,transparent)) drop-shadow(0 3px 4px color-mix(in srgb,var(--wine-950) 30%,transparent));
}

/* 05 · bust: portret pe un disc bordo, inel crimson, contur luminos pe fundal închis */
.scene--bust{ background:linear-gradient(180deg, var(--wine-950), var(--wine-900)); }
.scene--bust .scene__group{ block-size:min(88%,480px,88cqi); }
.scene--bust .scene__plate{
  inset-inline-start:50%; inset-block-end:24%; translate:-50% 0; inline-size:100%; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle at 50% 38%, var(--wine-600), var(--wine-800) 68%);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--brand-crimson) 55%,transparent), 0 0 0 16px color-mix(in srgb,var(--brand-crimson) 7%,transparent);
}
.scene--bust .scene__cut{ filter:var(--dsh-dark); }

/* 06 · paragraf: semnul § pe o rețea de linii fine, în locul unei fotografii care nu spunea nimic */
.scene--statute{ background:linear-gradient(180deg, var(--ink-800), var(--ink-900)); }
.scene--statute::before{
  content:""; position:absolute; inset:0; z-index:0;
  background-image:
    linear-gradient(90deg, color-mix(in srgb,var(--silver-50) 7%,transparent) 1px, transparent 1px),
    linear-gradient(180deg, color-mix(in srgb,var(--silver-50) 7%,transparent) 1px, transparent 1px);
  background-size:52px 52px; background-position:center;
}
.scene--statute .scene__glyph{
  inset-block-end:-.19em; inset-inline-end:7%; z-index:1;
  font-family:var(--f-read); font-style:italic; font-weight:300; font-size:clamp(14rem,92cqi,28rem); line-height:1;
  color:transparent; background:linear-gradient(180deg, var(--glacier-200), var(--wine-600) 85%);
  -webkit-background-clip:text; background-clip:text; user-select:none;
}
.scene--statute .scene__plate{
  inset-block-start:16%; inset-inline-start:12%; inline-size:38%; aspect-ratio:1; z-index:2; border-radius:50%;
  border:1.5px solid color-mix(in srgb,var(--brand-crimson) 70%,transparent);
}
.scene--statute .scene__plate::after{ content:""; position:absolute; inset:50% auto auto 50%; inline-size:12px; block-size:12px; border-radius:50%; translate:-50% -50%; background:var(--accent); }
.scene--statute::after{ mix-blend-mode:screen; opacity:.08; }

/* ---------- 16 · APARIȚII LA DERULARE ---------- */
.js [data-rise]{ opacity:0; transform:translateY(24px); transition:opacity var(--d3) var(--e-out), transform var(--d3) var(--e-out); transition-delay:calc(var(--r,0) * 75ms); }
.js [data-rise].is-in{ opacity:1; transform:none; }

/* ---------- 17 · MIȘCARE REDUSĂ: teancul se desface ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .js [data-rise]{ opacity:1 !important; transform:none !important; }
  .deck{ display:grid !important; gap:var(--s5) !important; padding-block-end:0 !important; }
  .deck__slot,.deck__pin,.route__pin,.opener__pin{ position:static !important; padding-block-start:0 !important; }
  .card{ min-block-size:0 !important; transform:none !important; box-shadow:var(--sh-m) !important; }
  .card__veil{ display:none !important; }
  .route{ gap:var(--s4) !important; }
  .route__slot{ min-block-size:0 !important; }
  .rail{ display:none !important; }
}
/* ============================================================================
   STICKY STACK · COMPLETĂRI PENTRU SITE-UL COMPLET
   Secțiuni care nu existau în macheta design-8 (parcurs profesional, articole,
   program, paginile interioare) și punți pentru marcajul editabil al panoului
   de administrare. Toți tokenii vin din blocul :root de mai sus.
   ========================================================================== */

/* ---------- A · PUNȚI PENTRU TEXTUL EDITABIL ---------- */
/* Titlurile venite din panou folosesc <strong>/<em> acolo unde macheta
   folosea <i>; le dăm aceeași tăietură îngustă. */
.headline strong,
.headline b{ font-weight:300; font-style:normal; font-variation-settings:"wdth" 82,"opsz" 96; }
.headline em{ font-family:var(--f-read); font-style:italic; font-weight:300; letter-spacing:-.02em; }

/* Titlul din hero este un singur câmp editabil: „Avocat <b>Nume</b> <span>Oraș</span>". */
.opener__title b,
.opener__title span{ display:block; font-weight:inherit; }
.opener__title b{ color:var(--accent-deep); font-variation-settings:"wdth" 88,"opsz" 96; font-weight:800; }
.opener__title span{ font-family:var(--f-read); font-style:italic; font-weight:300; letter-spacing:-.02em; color:var(--tx-dim); }

/* Insigna din hero: etichetă + valoare, ambele editabile. */
.opener__badge b{ font-weight:700; }
.opener__badge i{ font-style:normal; color:var(--tx-dim); }

/* Legendele figurilor conțin o pictogramă urmată de text. */
figcaption svg{ inline-size:15px; block-size:15px; flex:none; color:var(--accent); }

.mainnav__item{ white-space:nowrap; padding-inline:clamp(.34rem,.55vw,.55rem); }
.mainnav__list{ gap:clamp(.05rem,.45vw,.38rem); }
.topbar__cta{ white-space:nowrap; }
@media (min-width:1060px) and (max-width:1279.98px){ .topbar__cta{ display:none; } }

/* .thread vine din textul editabil salvat în panou, nu din șabloane. */
.thread{
  display:inline-flex; align-items:center; gap:var(--s2);
  font-family:var(--f-display); font-weight:700; font-size:var(--t-sm);
  color:var(--accent-deep); padding-block-end:2px;
  background-image:linear-gradient(currentColor,currentColor);
  background-size:100% 1.5px; background-position:0 100%; background-repeat:no-repeat;
  transition:background-size var(--d2) var(--e-out), color var(--d1) var(--e-io);
}
.thread:hover{ background-size:22% 1.5px; color:var(--accent); }
.thread svg{ inline-size:15px; block-size:15px; flex:none; }
.colophon .thread{ color:var(--accent-edge); }
.colophon .thread:hover{ color:var(--silver-50); }

/* Numerele de ordine vin din panou, nu din contorul CSS. */
.card__ord[data-ed-field]::after,
.route__ord[data-ed-field]::after{ content:none; }

/* ---------- B · PROGRAM (coloana din hero) ---------- */
.hours{
  display:grid; gap:var(--s4); padding:var(--s5); border-radius:var(--r-mid);
  background:var(--sheet); border:1px solid var(--line-soft); box-shadow:var(--sh-s);
}
.hours__k{ font-family:var(--f-display); font-size:var(--t-xs); font-weight:700; letter-spacing:var(--track-w); text-transform:uppercase; color:var(--accent-deep); }
.hours__v{ display:flex; flex-wrap:wrap; gap:var(--s2) var(--s3); align-items:baseline; font-family:var(--f-display); font-weight:700; font-size:var(--t-md); letter-spacing:-.03em; }
.hours__v span + span{ color:var(--tx-dim); font-weight:600; font-size:var(--t-sm); }
.hours__list{ display:grid; gap:var(--s1); margin:0; }
.hours__list > div{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--s3); padding-block:var(--s2); }
.hours__list > div + div{ border-block-start:1px solid var(--line-soft); }
.hours__list dt{ font-family:var(--f-display); font-size:var(--t-sm); font-weight:600; color:var(--tx-dim); }
.hours__list dd{ font-family:var(--f-display); font-size:var(--t-sm); font-weight:600; text-align:end; }

/* ---------- C · INVITAȚIA DIN HERO ---------- */
.pitch{
  display:grid; gap:var(--s4); justify-items:start;
  padding:clamp(1.4rem,1rem + 1.6vw,2rem); border-radius:var(--r-mid);
  background:var(--deep); color:var(--tx-on-deep); box-shadow:var(--sh-m);
}
.pitch__t{ font-family:var(--f-display); font-weight:700; font-size:var(--t-md); line-height:1.18; letter-spacing:-.03em; }
.pitch__p{ font-size:var(--t-sm); color:var(--tx-on-deep-dim); max-width:46ch; }

/* ---------- D · PARCURS PROFESIONAL ---------- */
.cv{ padding-block:var(--band); background:var(--canvas-2); }
.cv__grid{ display:grid; gap:var(--s6); align-items:start; }
.cv__aside{ display:grid; gap:var(--s5); align-content:start; }
.cv__fig{
  position:relative; isolation:isolate; aspect-ratio:9/10; border-radius:var(--r-card); overflow:clip; box-shadow:var(--sh-m);
  background:linear-gradient(170deg, var(--silver-50), var(--glacier-50) 55%, var(--glacier-100));
}
.cv__fig::before{
  content:""; position:absolute; inset:auto 0 0 0; block-size:46%; z-index:0;
  background:repeating-linear-gradient(180deg, color-mix(in srgb,var(--glacier-800) 14%,transparent) 0 1px, transparent 1px 20px);
  -webkit-mask-image:linear-gradient(180deg, transparent, #000 50%); mask-image:linear-gradient(180deg, transparent, #000 50%);
}
.cv__fig::after{ content:""; position:absolute; inset:0; z-index:5; background-image:var(--grain); opacity:.12; mix-blend-mode:multiply; pointer-events:none; }
.cv__plate{
  position:absolute; inset:10% -9% 16% 9%; z-index:1; border-radius:var(--r-card);
  background:linear-gradient(160deg, var(--glacier-200), var(--glacier-100) 82%);
  border:1px solid color-mix(in srgb,var(--glacier-800) 18%,transparent);
  transform:perspective(1200px) rotateY(7deg) rotate(2.4deg); transform-origin:50% 100%;
}
.cv__plate::before{ content:""; position:absolute; inset-inline-end:17%; inset-block-start:9%; inline-size:22%; block-size:4px; border-radius:var(--r-pill); background:var(--accent); }
.cv__cut{
  position:absolute; inset-block-end:-3%; inset-inline-start:49%; translate:-50% 0; z-index:2;
  inline-size:100%; max-inline-size:520px; block-size:auto; max-width:none; filter:var(--dsh-light);
}
.cv__desk{
  position:absolute; inset:auto -4% -2% -4%; block-size:9%; z-index:3; border-radius:var(--r-mid) var(--r-mid) 0 0;
  background:linear-gradient(180deg, var(--glacier-200), var(--glacier-100));
  box-shadow:0 -1px 0 color-mix(in srgb,var(--silver-50) 85%,transparent), 0 -22px 36px -14px color-mix(in srgb,var(--wine-950) 30%,transparent);
}
.cv__fig figcaption{
  position:absolute; z-index:4; inset-inline:var(--s3); inset-block-end:var(--s3);
  display:flex; flex-wrap:wrap; align-items:center; gap:var(--s2);
  padding:.45rem .8rem; border-radius:var(--r-pill);
  background:color-mix(in srgb, var(--silver-50) 90%, transparent);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  font-family:var(--f-display); font-size:var(--t-xs); font-weight:600;
  letter-spacing:var(--track-m); text-transform:uppercase; color:var(--tx);
}
.cv__id{ display:grid; gap:var(--s3); padding:var(--s5); border-radius:var(--r-mid); background:var(--sheet); border:1px solid var(--line-soft); box-shadow:var(--sh-s); }
.cv__k{ font-family:var(--f-display); font-size:var(--t-xs); font-weight:700; letter-spacing:var(--track-w); text-transform:uppercase; color:var(--accent-deep); }
.cv__name{ font-family:var(--f-display); font-weight:700; font-size:var(--t-md); line-height:1.15; letter-spacing:-.035em; }

.cv__main{ display:grid; gap:var(--s6); align-content:start; }
.cv__bio{ display:grid; gap:var(--s4); padding:clamp(1.4rem,1rem + 2.2vw,2.75rem); border-radius:var(--r-card); background:var(--sheet-2); box-shadow:var(--sh-s); }
.cv__bio p{ max-width:62ch; }
.cv__bio p:first-child::first-letter{ float:inline-start; font-family:var(--f-display); font-weight:800; font-size:3.6em; line-height:.8; padding-inline-end:.09em; padding-block-start:.03em; color:var(--accent); }

.cv__cols{ display:grid; gap:var(--s5); }
.cv__col{ display:grid; gap:var(--s4); align-content:start; padding:clamp(1.25rem,1rem + 1.5vw,2rem); border-radius:var(--r-card); background:var(--sheet); border:1px solid var(--line-soft); box-shadow:var(--sh-s); }
.cv__col h3{ font-family:var(--f-display); font-weight:700; font-size:var(--t-md); letter-spacing:-.03em; }
.cv__line{ display:grid; gap:var(--s4); }
.cv__line li{ position:relative; display:grid; gap:var(--s1); padding-inline-start:var(--s5); }
.cv__line li::before{ content:""; position:absolute; inset-inline-start:0; inset-block-start:.52em; inline-size:9px; block-size:9px; border-radius:var(--r-pill); background:var(--accent); }
.cv__line li::after{ content:""; position:absolute; inset-inline-start:4px; inset-block:1.35em -1.1rem; inline-size:1px; background:var(--line); }
.cv__line li:last-child::after{ display:none; }
.cv__when{ font-family:var(--f-display); font-size:var(--t-xs); font-weight:700; letter-spacing:var(--track-m); text-transform:uppercase; color:var(--accent-deep); }
.cv__what{ font-size:var(--t-sm); color:var(--tx-dim); max-width:52ch; }

.cv__more{ display:grid; gap:var(--s5); padding:clamp(1.4rem,1rem + 1.8vw,2.5rem); border-radius:var(--r-card); background:var(--deep); color:var(--tx-on-deep); box-shadow:var(--sh-m); }
.cv__more .cv__k{ color:var(--accent-edge); }
.cv__more h3{ font-family:var(--f-display); font-weight:700; font-size:var(--t-lg); line-height:1.12; letter-spacing:-.035em; }
.cv__skills{ display:grid; gap:var(--s4); }
.cv__skill{ display:grid; gap:var(--s2); padding-block-start:var(--s4); border-block-start:1px solid var(--line-deep); }
.cv__skill h4{ font-family:var(--f-display); font-weight:700; font-size:var(--t-sm); letter-spacing:.01em; }
.cv__skill p{ font-size:var(--t-sm); color:var(--tx-on-deep-dim); max-width:56ch; }
.cv__more .pull{ color:var(--accent-edge); justify-self:start; }
.cv__more .pull:hover{ color:var(--silver-50); }
@media (min-width:960px){
  .cv__grid{ grid-template-columns:minmax(0,1fr) minmax(0,1.9fr); gap:var(--s7); }
  .cv__aside{ position:sticky; inset-block-start:calc(var(--h-header) + var(--s5)); }
  .cv__cols{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cv__skills{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .cv__skill{ border-block-start:0; border-inline-start:1px solid var(--line-deep); padding-block-start:0; padding-inline-start:var(--s4); }
}

/* ---------- E · COMPLETĂRI PENTRU CARDURILE DE PRACTICĂ ---------- */
.card__lead{ font-family:var(--f-display); font-size:var(--t-sm); font-weight:700; color:var(--on-surf); }
.card__pts{ display:grid; gap:var(--s2); font-size:var(--t-sm); color:var(--on-surf-dim); max-width:56ch; }
.card__pts li{ position:relative; padding-inline-start:var(--s5); }
.card__pts li::before{ content:""; position:absolute; inset-inline-start:0; inset-block-start:.6em; inline-size:7px; block-size:7px; border-radius:var(--r-pill); background:var(--accent); }

/* ---------- F · FIGURI MICI ÎN CAPETELE DE BANDĂ ---------- */
.spot{
  position:relative; isolation:isolate; aspect-ratio:4/3; border-radius:var(--r-mid); overflow:clip;
  box-shadow:var(--sh-s); background:linear-gradient(160deg, var(--silver-50), var(--glacier-100));
}
.spot::before{
  content:""; position:absolute; inset:0; z-index:0;
  background:repeating-linear-gradient(180deg, color-mix(in srgb,var(--glacier-800) 12%,transparent) 0 1px, transparent 1px 18px);
  -webkit-mask-image:linear-gradient(90deg, #000 30%, transparent 78%); mask-image:linear-gradient(90deg, #000 30%, transparent 78%);
}
.spot__plate{
  position:absolute; inset-block-start:-26%; inset-inline-end:-8%; inline-size:70%; aspect-ratio:1; z-index:1; border-radius:50%;
  background:radial-gradient(circle at 42% 40%, var(--glacier-200), var(--glacier-100) 72%);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--glacier-800) 14%,transparent), 0 0 0 10px color-mix(in srgb,var(--brand-crimson) 5%,transparent);
}
.spot__cut{
  position:absolute; inset-block-end:-6%; inset-inline-start:50%; translate:-50% 0; z-index:2;
  block-size:112%; inline-size:auto; max-width:none; filter:var(--dsh-light);
}
.spot--wide .spot__cut{ inset-block-end:0; block-size:auto; inline-size:100%; }
.spot--wide .spot__plate{ display:none; }
.spot figcaption{
  position:absolute; z-index:3; inset-inline-start:var(--s3); inset-block-end:var(--s3);
  display:flex; flex-wrap:wrap; align-items:center; gap:var(--s2);
  padding:.4rem .75rem; border-radius:var(--r-pill);
  background:color-mix(in srgb, var(--silver-50) 90%, transparent);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  font-family:var(--f-display); font-size:var(--t-xs); font-weight:600;
  letter-spacing:var(--track-m); text-transform:uppercase; color:var(--tx);
}
.band-head__aside .spot{ margin-block-start:var(--s4); }
.qa__side .spot{ margin-block-start:var(--s2); }
.qa__side .spot figcaption{ inset-inline:var(--s3); }

/* raftul lat din misiune */
.mission__shelf{
  position:relative; isolation:isolate; aspect-ratio:16/8; border-radius:var(--r-mid); overflow:clip;
  box-shadow:var(--sh-s); background:var(--glacier-100);
}
.mission__shelf img{ position:absolute; inset:0; inline-size:100%; block-size:100%; object-fit:cover; }
.mission__shelf figcaption{
  position:absolute; z-index:3; inset-inline-start:var(--s3); inset-block-end:var(--s3);
  display:flex; flex-wrap:wrap; align-items:center; gap:var(--s2);
  padding:.4rem .75rem; border-radius:var(--r-pill);
  background:color-mix(in srgb, var(--silver-50) 90%, transparent);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  font-family:var(--f-display); font-size:var(--t-xs); font-weight:600;
  letter-spacing:var(--track-m); text-transform:uppercase; color:var(--tx);
}

/* ---------- G · ARTICOLE (acasă + pagina dedicată) ---------- */
/* Clasa .tile--post este impusă de oglindirea din panoul de administrare:
   la fiecare salvare articolele de pe prima pagină primesc exact acest set de
   clase. O folosim deci ca selector unic, pe amândouă paginile. */
.press{ padding-block:var(--band); }
.press__grid{ display:grid; gap:var(--s5); }
@media (min-width:820px){ .press__grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.press__foot{ display:flex; flex-wrap:wrap; gap:var(--s4); align-items:center; padding-block-start:var(--s6); }

.tile--post{
  position:relative; display:grid; gap:var(--s4); align-content:start;
  padding:clamp(1.35rem,1rem + 1.5vw,2rem); border-radius:var(--r-card);
  background:var(--sheet); border:1px solid var(--line-soft); box-shadow:var(--sh-m);
  transition:transform var(--d2) var(--e-out), box-shadow var(--d2) var(--e-out);
}
.tile--post::before{
  content:""; position:absolute; inset-block-start:0; inset-inline:clamp(1.35rem,1rem + 1.5vw,2rem);
  block-size:4px; border-radius:0 0 var(--r-pill) var(--r-pill); background:var(--accent);
}
.tile--post:hover{ transform:translateY(-5px); box-shadow:var(--sh-lift); }
.post__meta{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--s2) var(--s3); }
.post__date{ font-family:var(--f-display); font-size:var(--t-xs); font-weight:600; letter-spacing:var(--track-m); text-transform:uppercase; color:var(--tx-dim); }
.post__cat{ padding:.3rem .7rem; border-radius:var(--r-pill); background:var(--accent-soft); color:var(--accent-deep); font-family:var(--f-display); font-size:var(--t-xs); font-weight:700; letter-spacing:var(--track-m); text-transform:uppercase; }
.post__title{ font-family:var(--f-display); font-weight:700; font-size:var(--t-md); line-height:1.16; letter-spacing:-.035em; }
.post__body{ display:grid; gap:var(--s3); font-size:var(--t-sm); color:var(--tx-dim); max-width:68ch; }
.post__body sup{ font-size:.7em; }
.tile--post .pull{ justify-self:start; margin-block-start:var(--s1); }

/* pe prima pagină textul lung se scurtează, ca dalele să rămână egale */
.press__grid .post__body{
  display:-webkit-box; -webkit-line-clamp:6; -webkit-box-orient:vertical;
  overflow:hidden; gap:0;
}
.press__grid .post__body p + p{ display:none; }

/* ---------- H · PAGINI INTERIOARE ---------- */
.leaf{ padding-block:clamp(1.5rem,1rem + 3vw,3.25rem) var(--band); }
.leaf__back{ display:inline-flex; align-items:center; gap:var(--s2); margin-block-end:var(--s5); font-family:var(--f-display); font-size:var(--t-sm); font-weight:700; color:var(--tx-dim); }
.leaf__back:hover{ color:var(--accent); }
.leaf__back svg{ inline-size:16px; block-size:16px; }
.leaf__head{ display:grid; gap:var(--s5); padding-block-end:var(--s7); }
.leaf__head h1{ font-size:var(--t-xl); }
@media (min-width:920px){ .leaf__head{ grid-template-columns:minmax(0,7fr) minmax(0,4.4fr); gap:var(--s8); align-items:end; } }
.leaf__list{ display:grid; gap:var(--s5); }
@media (min-width:820px){ .leaf__list--posts{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* documente */
.docs{ display:grid; gap:var(--s3); }
@media (min-width:760px){ .docs{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.doc{
  position:relative; isolation:isolate;
  display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:var(--s4); align-items:center;
  padding:var(--s5); border-radius:var(--r-mid); background:var(--sheet);
  border:1px solid var(--line-soft); box-shadow:var(--sh-s);
  transition:transform var(--d2) var(--e-out), box-shadow var(--d2) var(--e-out), border-color var(--d2) var(--e-io);
}
.doc:hover{ transform:translateY(-4px); box-shadow:var(--sh-m); border-color:var(--accent); }
.doc__ico{ inline-size:42px; block-size:42px; padding:9px; flex:none; border-radius:var(--r-sm); background:var(--accent-soft); color:var(--accent-deep); }
.doc__txt{ display:grid; gap:var(--s1); }
.doc__t{ font-family:var(--f-display); font-weight:700; font-size:var(--t-sm); line-height:1.3; letter-spacing:-.02em; }
.doc__d{ font-family:var(--f-display); font-size:var(--t-xs); font-weight:600; letter-spacing:var(--track-m); text-transform:uppercase; color:var(--tx-dim); }
.doc__go{ inline-size:34px; block-size:34px; flex:none; display:grid; place-items:center; border-radius:var(--r-pill); border:1px solid var(--line); color:var(--accent-deep); transition:background var(--d2) var(--e-io), color var(--d2) var(--e-io), transform var(--d2) var(--e-out); }
.doc__go svg{ inline-size:15px; block-size:15px; }
.doc:hover .doc__go{ background:var(--accent); border-color:var(--accent); color:var(--silver-50); transform:translate(2px,-2px); }
.doc__hit{ position:absolute; inset:0; z-index:3; border-radius:inherit; }
.doc:has(.doc__hit:focus-visible){ outline:2px solid var(--ring); outline-offset:3px; }

/* politica de confidențialitate */
.policy{ display:grid; gap:var(--s4); counter-reset:policy; }
.chapter{
  counter-increment:policy; display:grid; gap:var(--s4);
  padding:clamp(1.35rem,1rem + 1.8vw,2.5rem); border-radius:var(--r-card);
  background:var(--sheet); border:1px solid var(--line-soft); box-shadow:var(--sh-s);
}
.chapter__h{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:var(--s4); align-items:center; }
.chapter__n{
  display:grid; place-items:center; inline-size:clamp(44px,6vw,56px); block-size:clamp(44px,6vw,56px);
  border-radius:var(--r-mid); background:var(--accent-soft); color:var(--accent-deep);
  font-family:var(--f-display); font-weight:800; font-size:var(--t-md); font-variant-numeric:tabular-nums;
}
.chapter__n::after{ content:counter(policy,decimal-leading-zero); }
.chapter__t{ font-family:var(--f-display); font-weight:700; font-size:var(--t-md); line-height:1.2; letter-spacing:-.03em; }
.chapter__body{ display:grid; gap:var(--s4); color:var(--tx-dim); }
.chapter__body p{ max-width:74ch; }
.chapter__body strong{ color:var(--tx); font-family:var(--f-display); }

/* invitația de la finalul paginilor interioare */
.leaf__cta{
  display:grid; gap:var(--s4); justify-items:start; margin-block-start:var(--s7);
  padding:clamp(1.5rem,1rem + 2.4vw,3rem); border-radius:var(--r-card);
  background:var(--deep); color:var(--tx-on-deep); box-shadow:var(--sh-m);
}
.leaf__cta h2{ font-family:var(--f-display); font-weight:700; font-size:var(--t-lg); line-height:1.12; letter-spacing:-.035em; }
.leaf__cta p{ color:var(--tx-on-deep-dim); max-width:58ch; }

/* ---------- I · SERTAR MOBIL & SUBSOL ---------- */
.sheet__link span{ display:block; }
.colophon__legal{ display:flex; flex-wrap:wrap; gap:var(--s2) var(--s5); font-size:var(--t-xs); }
.colophon__badge{ display:inline-flex; align-items:center; gap:var(--s2); }
.colophon__badge::before{ content:""; inline-size:7px; block-size:7px; border-radius:var(--r-pill); background:var(--accent); }
