/* ==========================================================================
   Răzvan Detailing — COMPONENTS
   Responsive synthesis of the approved v2 mockups (desktop + mobile) on the
   tokens in css/tokens.css. Dark + gold, RO-primary. One sheet, no build.
   Sections: base · layout · nav · buttons · hero · cards · pachete ·
   calculator · reviews · process · gallery · journal · article · footer ·
   quickbar · placeholder · a11y · responsive.
   ========================================================================== */

/* ---------- base ---------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--rd-black);color:var(--rd-on-dark);font-family:var(--rd-font);
  font-size:var(--fs-body);line-height:var(--lh-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
img,picture,svg,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}
h1,h2,h3,h4{margin:0;font-family:var(--rd-font-display);font-weight:var(--fw-medium);letter-spacing:var(--ls-tight)}
p{margin:0}
:focus-visible{outline:2px solid var(--rd-focus);outline-offset:2px;border-radius:var(--r-sm)}
.on-light :focus-visible,.section.paper :focus-visible{outline-color:var(--rd-focus-ink)}
.acc-h:focus-visible,.svc:focus-visible,.chip:focus-visible{outline-offset:-2px}
.btn.gold:focus-visible,.preset.on:focus-visible{outline-offset:-3px}
.prose a.btn{text-decoration:none}
.btn.gold:focus-visible,.chip.on:focus-visible,.preset.on:focus-visible{outline-color:var(--rd-black)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:fixed;top:8px;left:8px;z-index:var(--z-skip);transform:translateY(-150%);background:var(--rd-gold);color:var(--rd-black);
  padding:10px 16px;border-radius:var(--r-pill);font-weight:var(--fw-heavy);transition:transform var(--dur-base) var(--ease)}
.skip:focus{transform:none}

/* ---------- layout ---------- */
.wrap{width:var(--container);margin-inline:auto}
.section{padding-block:var(--section-pad)}
.section.dark{background:var(--rd-surface-000);color:var(--rd-on-dark)}
.section.band{background:var(--rd-surface-050)}
.section.paper{background:var(--rd-paper);color:var(--rd-ink)}
.section.tight{padding-block:var(--sp-10)}
.eyebrow{display:inline-flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-eyebrow);font-weight:var(--fw-heavy);
  letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--rd-gold);margin:0 0 var(--sp-4)}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--rd-gold);border-radius:2px}
.section.paper .eyebrow{color:var(--rd-gold-ink)}
.display{font-size:var(--fs-hero);line-height:var(--lh-display);letter-spacing:var(--ls-tight);text-wrap:balance;margin:0}
.h1{font-size:var(--fs-h1);line-height:var(--lh-heading);text-wrap:balance}
.h2{font-size:var(--fs-h2);line-height:var(--lh-tight);text-wrap:balance;margin:0 0 var(--sp-2)}
.h3{font-size:var(--fs-h3);line-height:var(--lh-tight)}
.lead{font-size:var(--fs-lead);line-height:var(--lh-snug);color:var(--rd-on-dark-72);max-width:56ch;margin:var(--sp-3) 0 0}
.section.paper .lead,.section.paper .muted{color:var(--rd-muted)}
.muted{color:var(--rd-on-dark-56)}
.overline{font-size:var(--fs-body-sm);font-weight:var(--fw-medium);color:var(--rd-on-dark-56);letter-spacing:var(--ls-brand);margin:0 0 var(--sp-2)}
.grid{display:grid;gap:var(--grid-gap)}
/* grids that follow text always get breathing room */
:is(h1,h2,h3,p) + .grid{margin-top:var(--sp-6)}
.grid.start{align-items:start}
.grid.center{align-items:center;gap:var(--sp-8)}
.card.flush{border:0}
.mt-2{margin-top:var(--sp-2)}.mt-3{margin-top:var(--sp-3)}.mt-4{margin-top:var(--sp-4)}.mt-5{margin-top:var(--sp-5)}.mt-6{margin-top:var(--sp-6)}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.actions{display:flex;flex-wrap:wrap;gap:var(--sp-3);align-items:center;margin-top:var(--sp-6)}

/* ---------- buttons / CTAs (gold = primary tel: CTA, green = secondary WhatsApp) ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);min-height:48px;padding:13px 22px;
  border-radius:var(--r-pill);font-size:var(--fs-body-sm);font-weight:var(--fw-heavy);border:1px solid transparent;
  transition:transform var(--dur-base) var(--ease),background var(--dur-base) var(--ease),border-color var(--dur-base) var(--ease)}
.btn:hover{transform:translateY(-1px)}
.btn.wa{background:var(--rd-fill-dark);color:var(--rd-on-dark);border-color:rgb(from var(--rd-green) r g b / .5)}
.btn.wa:hover{border-color:var(--rd-green)}
.section.paper .btn.wa{background:transparent;color:var(--rd-ink);border-color:rgb(from var(--rd-green) r g b / .6)}
[data-sum-send].btn.wa,.btn.wa.solid{background:var(--rd-green);color:#04210f;border-color:transparent}
[data-sum-send].btn.wa:hover,.btn.wa.solid:hover{background:#1fbf5b}
.btn.gold{background:var(--rd-gold);color:var(--rd-black)}
.btn.gold:hover{background:var(--rd-gold-2)}
.btn.ghost{background:var(--rd-fill-dark);color:var(--rd-on-dark);border-color:var(--rd-fill-dark-line)}
.section.paper .btn.ghost{background:transparent;color:var(--rd-ink);border-color:var(--rd-line)}
.btn.block{width:100%}
.btn.sm{min-height:40px;padding:9px 15px;font-size:var(--fs-small)}
.tellink{display:inline-flex;align-items:center;gap:var(--sp-2);font-weight:var(--fw-bold);font-size:var(--fs-body-sm);
  color:var(--rd-on-dark);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--rd-fill-dark-line)}
.section.paper .tellink{color:var(--rd-ink);text-decoration-color:var(--rd-line)}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:var(--z-nav);height:var(--nav-h);display:flex;align-items:center;gap:var(--sp-5);
  padding-inline:clamp(18px,5vw,40px);background:rgba(3,3,4,.9);backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid var(--rd-line-dark-2)}
.nav .brand{font-family:var(--rd-font-display);color:var(--rd-gold);font-weight:var(--fw-medium);font-size:var(--fs-lg);letter-spacing:.01em;white-space:nowrap}
.nav .langswitch,.nav .cta,.burger{flex-shrink:0}
.nav .links{display:flex;gap:var(--sp-5);margin-left:var(--sp-3)}
.nav .links a{font-size:var(--fs-body-sm);font-weight:var(--fw-semibold);color:var(--rd-on-dark-80);transition:color var(--dur-fast) var(--ease)}
.nav .links a:hover{color:var(--rd-on-dark)}
.nav .links a[aria-current]{color:var(--rd-gold);font-weight:var(--fw-heavy);text-decoration:underline;text-underline-offset:8px;text-decoration-thickness:2px}
.nav .spacer{flex:1}
.langswitch{display:inline-flex;border:1px solid var(--rd-fill-dark-line);border-radius:var(--r-pill);overflow:hidden}
.langswitch button{font-size:var(--fs-micro);font-weight:var(--fw-bold);color:var(--rd-on-dark-56);padding:6px 10px;min-height:34px;transition:background var(--dur-base) var(--ease)}
.langswitch button[aria-pressed="true"]{background:var(--rd-gold);color:var(--rd-black)}
.nav .cta{background:var(--rd-gold);color:var(--rd-black);font-weight:var(--fw-heavy);font-size:var(--fs-body-sm);
  padding:9px 16px;border-radius:var(--r-pill);min-height:40px;display:inline-flex;align-items:center}
.nav .cta:hover{background:var(--rd-gold-2)}
.nav .cta{transition:background var(--dur-base) var(--ease)}
.burger{display:none;width:44px;height:44px;border:1px solid var(--rd-fill-dark-line);border-radius:var(--r-sm);
  flex-direction:column;align-items:center;justify-content:center;gap:4px}
.burger span{width:17px;height:2px;background:var(--rd-on-dark);border-radius:2px}
.mobilemenu{position:fixed;inset:var(--nav-h) 0 auto 0;z-index:var(--z-nav);background:rgba(8,8,10,.99);
  backdrop-filter:blur(16px);border-bottom:1px solid var(--rd-line-dark);box-shadow:var(--sh-menu);
  transform:translateY(-130%);visibility:hidden;transition:transform var(--dur-slow) var(--ease-out),visibility 0s linear var(--dur-slow);max-height:calc(100vh - var(--nav-h));overflow:auto}
.mobilemenu.open{transform:none;visibility:visible;transition:transform var(--dur-slow) var(--ease-out)}
.mobilemenu a{display:block;padding:16px 22px;font-size:17px;font-weight:var(--fw-semibold);
  color:var(--rd-on-dark-80);border-bottom:1px solid var(--rd-line-dark-2);min-height:44px}
.mobilemenu a[aria-current]{color:var(--rd-gold)}
.mobilemenu .langswitch{margin:14px 22px}
.scrim{position:fixed;inset:0;z-index:calc(var(--z-nav) - 1);background:rgba(0,0,0,.55);opacity:0;pointer-events:none;transition:opacity var(--dur-slow) var(--ease)}
.scrim.open{opacity:1;pointer-events:auto}

/* ---------- hero ---------- */
.hero{position:relative;min-height:clamp(480px,62svh,700px);display:flex;align-items:center;overflow:hidden}
.hero.short{min-height:400px}
.hero.short .inner{padding-block:var(--sp-6)}
.hero .bg{position:absolute;inset:0;z-index:0}
.hero .bg img{width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(0,0,0,.86),rgba(0,0,0,.55) 62%,rgba(0,0,0,.4))}
.hero.center::after{background:linear-gradient(180deg,rgba(0,0,0,.52),rgba(0,0,0,.82))}
.hero .overline,.hero .kicker{color:var(--rd-on-dark-80)}
.hero .inner{position:relative;z-index:2;width:var(--container);margin-inline:auto}
.hero.center{text-align:center}
.hero.center .inner{max-width:920px}
.hero .kicker{font-size:var(--fs-body-sm);font-weight:var(--fw-bold);color:var(--rd-on-dark-80);margin:0 0 var(--sp-3)}
.hero .lead{max-width:60ch}
.hero.center .lead{margin-inline:auto}
.hero.center .actions{justify-content:center}

/* ---------- cards ---------- */
.card{background:var(--rd-surface-150);border:1px solid var(--rd-line-dark);border-radius:var(--r-card);overflow:hidden;
  transition:border-color var(--dur-base) var(--ease),transform var(--dur-base) var(--ease)}
a.card:hover{border-color:var(--rd-line-dark-strong);transform:translateY(-2px)}
.section.paper .card{background:#fff;border-color:var(--rd-line-soft);box-shadow:var(--sh-card-light)}
.card .media{aspect-ratio:16/10;position:relative}
.card .media img{width:100%;height:100%;object-fit:cover}
.card .body{padding:var(--pad-card)}
.card h3{font-size:var(--fs-card-h);margin:0 0 var(--sp-2)}
.card p{font-size:var(--fs-body-sm);color:var(--rd-on-dark-72);margin:0}
.section.paper .card p{color:var(--rd-muted)}
.tick{display:flex;gap:var(--sp-2);font-size:var(--fs-body-sm);color:var(--rd-on-dark-72);margin:var(--sp-2) 0}
.tick::before{content:"✓";color:var(--rd-gold-text);font-weight:var(--fw-heavy)}
.section.paper .tick{color:var(--rd-ink)}.section.paper .tick::before{color:var(--rd-gold-ink)}
.step-n{font-family:var(--rd-font-display);color:var(--rd-gold-text);font-size:26px;font-weight:var(--fw-medium);margin-bottom:var(--sp-1)}
.price{font-family:var(--rd-font-display);font-weight:var(--fw-medium);font-size:var(--fs-price);font-variant-numeric:tabular-nums;margin-top:var(--sp-3)}
.price .from{display:block;font-family:var(--rd-font);font-size:var(--fs-micro);font-weight:var(--fw-heavy);
  letter-spacing:.08em;text-transform:uppercase;color:var(--rd-on-dark-56)}

/* ---------- pachete: sticky class picker ---------- */
.pk-sticky{position:sticky;top:var(--nav-h);z-index:calc(var(--z-nav) - 2);display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2);
  padding:12px clamp(18px,5vw,40px);background:rgba(5,5,5,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--rd-line-dark)}
.pk-sticky .lbl{font-size:var(--fs-micro);font-weight:var(--fw-heavy);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--rd-on-dark-56)}
.pk-sticky .live{font-size:var(--fs-body-sm);color:var(--rd-on-dark-72)}
.pk-sticky .live b{color:var(--rd-gold-text)}
.pk-sticky [data-pk-wa]{margin-left:auto}
.pk-chips{display:contents} /* desktop: wrapper vanishes, chips sit inline in the bar */
.chip{flex:none;font-size:var(--fs-body-sm);font-weight:var(--fw-semibold);border:1px solid var(--rd-fill-dark-line);
  background:var(--rd-fill-dark);color:var(--rd-on-dark-80);border-radius:var(--r-pill);padding:10px 16px;min-height:44px;
  display:inline-flex;align-items:center;white-space:nowrap;transition:background var(--dur-base) var(--ease),border-color var(--dur-base) var(--ease)}
.chip.on{background:var(--rd-gold);color:var(--rd-black);border-color:var(--rd-gold)}
.section.paper .chip{background:#fff;color:var(--rd-muted);border-color:var(--rd-line)}
.section.paper .chip.on{background:var(--rd-ink);color:#fff;border-color:var(--rd-ink)}
.pcard{display:flex;flex-direction:column;background:var(--rd-surface-150);border:1px solid var(--rd-line-dark);
  border-radius:var(--r-card);overflow:hidden}
.pcard.feat{border:2px solid var(--rd-gold);background:var(--rd-gold-soft-dim);box-shadow:var(--sh-gold);transform:translateY(-6px)}
.pcard .media{aspect-ratio:4/3;position:relative}
.pcard .media img{width:100%;height:100%;object-fit:cover}
.pcard .body{display:flex;flex-direction:column;flex:1;padding:var(--pad-card)}
.pcard .price{margin-top:auto}
.pcard .btn{margin-top:var(--sp-3)}
.pcard .customize{margin-top:var(--sp-2);text-align:center;font-size:var(--fs-small);color:var(--rd-gold-text)}
.badge{align-self:flex-start;font-size:var(--fs-micro);font-weight:var(--fw-heavy);letter-spacing:.04em;text-transform:uppercase;
  color:var(--rd-black);background:var(--rd-gold);border-radius:var(--r-sm);padding:3px 9px;margin-bottom:var(--sp-2)}

/* ---------- calculator ---------- */
.calc{display:grid;grid-template-columns:1fr 320px;gap:var(--grid-gap);align-items:start;margin-top:var(--sp-6)}
.presets{display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center;margin-bottom:var(--sp-4)}
.preset{flex:none;font-size:var(--fs-small);font-weight:var(--fw-semibold);border:1px dashed var(--rd-gold);color:var(--rd-gold-text);
  background:transparent;border-radius:var(--r-pill);padding:9px 14px;min-height:40px;display:inline-flex;align-items:center}
.preset.on{background:var(--rd-gold);color:var(--rd-black);border-style:solid}
.field-l{width:100%;font-size:var(--fs-micro);font-weight:var(--fw-heavy);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;
  color:var(--rd-on-dark-56);margin:var(--sp-3) 0 var(--sp-2)}
.chiprow{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.acc{border:1px solid var(--rd-line-dark);border-radius:var(--r-md);overflow:hidden;margin-bottom:var(--sp-2);background:var(--rd-surface-150)}
.acc-h{display:flex;align-items:center;gap:var(--sp-2);width:100%;padding:13px 16px;min-height:52px;text-align:left}
.acc-htitle{margin:0;font:inherit}
.acc-h .acc-lbl{font-size:var(--fs-body);font-weight:var(--fw-bold)}
.acc-count{font-size:var(--fs-micro);font-weight:var(--fw-heavy);color:var(--rd-on-dark-56);background:var(--rd-fill-dark);
  border:1px solid var(--rd-line-dark);border-radius:var(--r-pill);padding:2px 8px}
.acc-sel{margin-left:auto;font-size:var(--fs-small);font-weight:var(--fw-bold);color:var(--rd-gold-text)}
.acc-car{color:var(--rd-on-dark-56);font-size:var(--fs-micro);transition:transform var(--dur-base) var(--ease)}
.acc.open .acc-car{transform:rotate(90deg)}
.acc-body{display:none;grid-template-columns:1fr 1fr;gap:var(--sp-2);padding:2px 16px 16px}
.acc.open .acc-body{display:grid}
.svc{display:flex;align-items:center;gap:var(--sp-2);width:100%;min-height:48px;padding:11px 13px;text-align:left;
  font-size:var(--fs-body-sm);border:1px solid var(--rd-line-dark);border-radius:var(--r-md);color:var(--rd-on-dark-72);
  transition:border-color var(--dur-base) var(--ease),background var(--dur-base) var(--ease)}
.svc[aria-checked="true"]{border-color:var(--rd-gold);background:var(--rd-gold-soft-dim);color:var(--rd-on-dark)}
.svc .tk{flex:none;width:18px;height:18px;border-radius:var(--r-sm);border:1.5px solid var(--rd-fill-dark-line);
  display:grid;place-items:center;font-size:11px;color:transparent}
.svc[aria-checked="true"] .tk{background:var(--rd-gold);border-color:var(--rd-gold);color:var(--rd-black)}
.svc .p{margin-left:auto;font-variant-numeric:tabular-nums;font-weight:var(--fw-bold);color:var(--rd-on-dark-56)}
.svc[aria-checked="true"] .p{color:var(--rd-gold-text)}
.summary{position:sticky;top:var(--sticky-top);background:var(--rd-surface-200);border:1px solid var(--rd-fill-dark-line);
  border-radius:var(--r-md);padding:var(--pad-panel-lg);box-shadow:var(--sh-sticky)}
.summary .t{font-size:var(--fs-micro);font-weight:var(--fw-heavy);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--rd-on-dark-56)}
.summary .total{font-family:var(--rd-font-display);font-weight:var(--fw-medium);font-size:var(--fs-total);font-variant-numeric:tabular-nums;margin:2px 0}
.summary .cap{font-size:var(--fs-small);color:var(--rd-on-dark-56)}
.sumlist{display:flex;flex-direction:column;gap:2px;margin:var(--sp-3) 0;max-height:180px;overflow:auto}
.sumlist .i{display:flex;justify-content:space-between;gap:var(--sp-3);font-size:var(--fs-small);color:var(--rd-on-dark-72)}
.sumlist .i span:nth-child(2){margin-left:auto;font-variant-numeric:tabular-nums}
.sumlist .i span:nth-child(2):last-child{margin-right:40px}
.sumlist .i button{margin-left:0;color:var(--rd-on-dark-56);font-size:15px;padding:2px 6px;min-width:28px;min-height:28px}
.reconc{display:none;font-size:var(--fs-small);color:var(--rd-gold-text);background:var(--rd-gold-soft-dim);
  border-radius:var(--r-sm);padding:9px 12px;margin-top:var(--sp-3)}
.reconc.show{display:block}
.btn.wa.off{opacity:.45;pointer-events:none}

/* ---------- reviews ---------- */
.stars{display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap}
.stars .rating{font-family:var(--rd-font-display);font-size:48px;font-weight:var(--fw-medium)}
.stars .s{color:var(--rd-gold);font-size:22px;letter-spacing:3px}
.quote{font-size:var(--fs-lead);line-height:var(--lh-snug)}
.quote cite{display:block;margin-top:var(--sp-2);font-style:normal;font-size:var(--fs-small);color:var(--rd-on-dark-56)}
.section.paper .quote cite{color:var(--rd-muted)}

/* ---------- process / story ---------- */
.story{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;min-height:340px}
.story.flip{direction:rtl}.story.flip>*{direction:ltr}
.story .copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(28px,4vw,56px)}
.story .media img,.story .media{width:100%;height:100%;object-fit:cover;min-height:280px}

/* ---------- gallery (before/after) ---------- */
.ba{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:4px;border-radius:var(--r-md);overflow:hidden}
.ba img{aspect-ratio:4/3;width:100%;object-fit:cover}
.ba .lbl{position:absolute;bottom:8px;font-size:var(--fs-micro);font-weight:var(--fw-heavy);text-transform:uppercase;
  letter-spacing:.06em;background:rgba(0,0,0,.62);color:#fff;padding:3px 8px;border-radius:var(--r-sm)}
.ba .lbl.b{left:8px}.ba .lbl.a{right:8px}

/* ---------- journal ---------- */
.jfilters{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin:var(--sp-4) 0 0}
.jcard{display:block}
.jcard[hidden]{display:none}
.jmeta{font-size:var(--fs-micro);font-weight:var(--fw-heavy);letter-spacing:.05em;text-transform:uppercase;color:var(--rd-gold-ink);margin:var(--sp-3) 0 var(--sp-1)}
.section.dark .jmeta{color:var(--rd-gold-text)}

/* ---------- article + legal prose ---------- */
.prose{max-width:70ch;margin-inline:auto}
.prose .h1{font-size:clamp(30px,4vw,48px);line-height:1.06}
.prose .media{border-radius:var(--r-md);overflow:hidden;margin:var(--sp-6) 0}
.prose .media img{width:100%;height:auto;display:block}
.prose h2{font-size:clamp(24px,3vw,34px);margin:var(--sp-8) 0 var(--sp-3)}
.prose h3{font-size:22px;margin:var(--sp-6) 0 var(--sp-2)}
.prose p{margin:0 0 var(--sp-4);color:var(--rd-ink)}
.section.dark .prose p{color:var(--rd-on-dark-80)}
.prose ul,.prose ol{margin:0 0 var(--sp-4) 1.1em;color:var(--rd-ink)}
.prose li{margin:var(--sp-2) 0}
.prose a{color:var(--rd-gold-ink);text-decoration:underline;text-underline-offset:2px}
.cta-bridge{background:var(--rd-soft);border:1px solid var(--rd-line-soft);border-radius:var(--r-md);padding:var(--pad-panel-lg);margin:var(--sp-8) 0}

/* ---------- footer ---------- */
.footer{background:var(--rd-black);border-top:1px solid var(--rd-line-dark-2);padding:var(--sp-10) 0 var(--sp-9)}
.footer .cols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:var(--sp-8)}
.footer .brand{font-family:var(--rd-font-display);color:var(--rd-gold);font-size:22px;margin-bottom:var(--sp-2)}
.footer h4{font-size:var(--fs-micro);letter-spacing:.1em;text-transform:uppercase;color:var(--rd-on-dark);margin:0 0 var(--sp-3);font-family:var(--rd-font);font-weight:var(--fw-heavy)}
.footer a,.footer p{display:block;color:var(--rd-on-dark-56);font-size:var(--fs-body-sm);margin:var(--sp-2) 0;transition:color var(--dur-fast) var(--ease)}
.footer a:hover{color:var(--rd-on-dark)}
.footer .fine a{margin:0;font-size:inherit;color:inherit}
.footer .fine{align-items:baseline;margin-top:var(--sp-8);padding-top:var(--sp-5);border-top:1px solid var(--rd-line-dark-2);
  display:flex;flex-wrap:wrap;gap:var(--sp-3) var(--sp-6);font-size:var(--fs-small);color:var(--rd-on-dark-52)}

/* ---------- mobile quickbar + calculator bottom-sheet (small screens) ---------- */
.quickbar{display:none;position:fixed;bottom:0;left:0;right:0;z-index:var(--z-nav);gap:var(--sp-2);
  padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:rgba(6,6,7,.97);backdrop-filter:blur(12px);
  border-top:1px solid var(--rd-line-dark)}
.qbtn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:52px;
  border-radius:var(--r-md);background:var(--rd-graphite-2);font-size:var(--fs-micro);font-weight:var(--fw-bold);color:var(--rd-on-dark-72)}
.qbtn .i{font-size:17px}
.qbtn .i svg,.sheetbar .call svg,.sheetbar .car svg{display:block}
.qbtn.wa{background:var(--rd-green);color:#04210f}
.sheetbar{display:none}

/* anchor targets land clear of the sticky nav */
#calculator,#faq,#locatie,#contact{scroll-margin-top:calc(var(--nav-h) + 8px)}

/* hover feedback on the toggle controls (pointer devices only) */
.preset{transition:background var(--dur-base) var(--ease),color var(--dur-base) var(--ease)}
.faq-q{transition:color var(--dur-fast) var(--ease)}
@media (hover:hover){
  .chip:not(.on):hover,.svc[aria-checked="false"]:hover{border-color:var(--rd-line-dark-strong)}
  .section.paper .chip:not(.on):hover{border-color:rgba(0,0,0,.28)}
  .preset:not(.on):hover{background:var(--rd-gold-soft-dim)}
  .faq-q:hover{color:var(--rd-gold-text)}
  .section.paper .faq-q:hover{color:var(--rd-gold-ink)}
}

/* ---------- map embed ---------- */
.mapbox{border-radius:var(--r-md);overflow:hidden;border:1px solid var(--rd-line-dark);background:var(--rd-surface-150);min-height:360px}
.section.paper .mapbox{border-color:var(--rd-line-soft);background:var(--rd-soft)}
.mapbox iframe{border:0;display:block;width:100%;height:360px}

/* ---------- generated-image placeholder tile ---------- */
.ph-tile{position:relative;display:grid;place-items:center;background:var(--ph-tile-bg);border:var(--ph-tile-border);overflow:hidden}
.ph-tile::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 62% 38%,rgb(from var(--rd-gold) r g b / .22),transparent 70%)}
.ph-tile .plabel{position:relative;z-index:1;font-size:var(--fs-small);font-weight:var(--fw-semibold);color:var(--ph-label);
  background:var(--ph-label-bg);border:1px solid var(--ph-label-line);border-radius:var(--r-pill);padding:5px 12px}

/* ---------- reveal (respect reduced-motion) ---------- */
.reveal{opacity:0;transform:translateY(14px);transition:opacity var(--dur-reveal) var(--ease-out),transform var(--dur-reveal) var(--ease-out)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *{transition-duration:.001ms!important;animation-duration:.001ms!important}
  .reveal{opacity:1;transform:none}
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1100px){
  .g3,.g4{grid-template-columns:repeat(2,1fr)}
  .calc{grid-template-columns:1fr 280px}
  .footer .cols{grid-template-columns:1fr 1fr}
  /* tablet band: links don't fit next to brand + CTA — burger takes over, gold CTA stays */
  .nav .links{display:none}
  .burger{display:flex}
}
@media (max-width:820px){
  .nav .cta{display:none} /* the quickbar already carries the persistent call CTA on phones */
  .story{grid-template-columns:1fr}
  .story.flip{direction:ltr}
  .calc{grid-template-columns:1fr}
  /* on phones the sidebar summary is replaced by a pinned bottom sheet */
  .calc .summary{display:none}
  .quickbar{display:flex}
  body.has-quickbar{padding-bottom:calc(66px + env(safe-area-inset-bottom))}
  .sheetbar{display:block;position:fixed;bottom:0;left:0;right:0;z-index:calc(var(--z-nav) + 1);
    background:rgba(6,6,7,.98);backdrop-filter:blur(12px);border-top:1px solid var(--rd-fill-dark-line)}
  .sheetbar .head{display:flex;align-items:center;gap:var(--sp-2);padding:11px 14px calc(9px + env(safe-area-inset-bottom))}
  .sheetbar .grow{flex:1;min-width:0;display:flex;align-items:center;gap:var(--sp-2);text-align:left}
  .sheetbar .cnt{font-size:var(--fs-micro);color:var(--rd-on-dark-56)}
  .sheetbar .total{display:block;font-family:var(--rd-font-display);font-weight:var(--fw-medium);font-size:24px;font-variant-numeric:tabular-nums}
  .sheetbar .car{color:var(--rd-on-dark-56);font-size:12px;transition:transform var(--dur-base) var(--ease)}
  .sheetbar.open .car{transform:rotate(180deg)}
  .sheetbar .call{flex:none;width:46px;height:46px;border-radius:var(--r-pill);background:var(--rd-graphite-2);display:grid;place-items:center;font-size:17px}
  .sheetbar .go{background:var(--rd-green);color:#04210f;font-weight:var(--fw-heavy);font-size:var(--fs-small);padding:12px 15px;border-radius:var(--r-pill);min-height:46px;display:inline-flex;align-items:center}
  .sheetbar .go.off{opacity:.45;pointer-events:none}
  .sheet{max-height:0;overflow:hidden;transition:max-height var(--dur-slow) var(--ease)}
  .sheetbar.open .sheet{max-height:320px}
  .sheet .inner{padding:12px 14px;overflow-y:auto;max-height:300px}
  body.calc-page{padding-bottom:calc(70px + env(safe-area-inset-bottom))}
  .acc-body{grid-template-columns:1fr}
}
@media (max-width:560px){
  .g2,.g3,.g4{grid-template-columns:1fr}
  .hero.short{min-height:340px}
  .actions{gap:var(--sp-2)}
  .hero .actions .btn{flex:1 1 auto}
  /* compact footer: brand + contact full-width, Pagini | Urmărește side by side */
  .footer{padding:var(--sp-8) 0 var(--sp-7)}
  .footer .cols{grid-template-columns:1fr 1fr;gap:var(--sp-5) var(--sp-6)}
  .footer .cols > div:nth-child(1){grid-column:1/-1;order:0}
  .footer .cols > div:nth-child(2){order:1}
  .footer .cols > div:nth-child(4){order:2}
  .footer .cols > div:nth-child(3){grid-column:1/-1;order:3}
  .footer .brand{font-size:18px;margin-bottom:var(--sp-1)}
  .footer a,.footer p{margin:var(--sp-1) 0;font-size:var(--fs-small)}
  .footer h4{margin-bottom:var(--sp-2)}
  .footer .fine{margin-top:var(--sp-5);padding-top:var(--sp-4);gap:var(--sp-2) var(--sp-4);font-size:var(--fs-micro)}
  /* compact sticky picker: price readout on top, swipeable chip row, full-width CTA */
  .pk-sticky .lbl{display:none}
  .pk-sticky .live{order:0;flex:1 0 100%;margin-left:0}
  .pk-chips{order:1;display:flex;flex:1 0 100%;gap:var(--sp-2);overflow-x:auto;padding-bottom:2px;
    scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .pk-chips::-webkit-scrollbar{display:none}
  .pk-chips .chip{flex:none}
  .pk-sticky [data-pk-wa]{margin-left:0;order:2;width:100%;justify-content:center}
}

/* ==========================================================================
   REVIEW FIXES
   ========================================================================== */
/* mobile menu is a mobile-only overlay — remove it from desktop entirely */
@media (min-width:1101px){ .mobilemenu,.scrim{display:none} }
/* priced .card: pin the price to a shared baseline like .pcard */
.card.priced{display:flex;flex-direction:column}
.card.priced .body{display:flex;flex-direction:column;flex:1}
.card.priced .price{margin-top:auto}
/* generated-image placeholder label: corner-pin on heroes so it never sits behind headline copy */
.hero .bg .ph-tile{place-items:end start}
.hero .bg .ph-tile .plabel{margin:16px}
/* service catalog rows — light-surface default (the catalog lives on .section.paper), dark override */
.catrow{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sp-4);padding:9px 0;border-top:1px solid var(--rd-line-soft);font-size:var(--fs-body-sm);color:var(--rd-ink)}
.catrow:first-child{border-top:0}
.catprice{font-weight:var(--fw-bold);font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--rd-gold-ink)}
.catrow .onreq{color:var(--rd-muted);font-weight:var(--fw-semibold)}
.section.dark .catrow,.section.band .catrow{color:var(--rd-on-dark-80);border-color:var(--rd-line-dark-2)}
.section.dark .catprice,.section.band .catprice{color:var(--rd-gold-text)}
.section.dark .catrow .onreq,.section.band .catrow .onreq{color:var(--rd-on-dark-56)}
/* FAQ accordion */
.faq-item{border-top:1px solid var(--rd-line-dark-2)}
.faq-item:last-child{border-bottom:1px solid var(--rd-line-dark-2)}
.faq-q{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);width:100%;padding:18px 0;text-align:left;font-size:var(--fs-card-h);font-weight:var(--fw-bold);font-family:var(--rd-font-display);min-height:56px}
.faq-q::after{content:"+";color:var(--rd-gold);font-size:24px;font-weight:var(--fw-medium);transition:transform var(--dur-base) var(--ease)}
.faq-item.open .faq-q::after{content:"–"}
.faq-a{display:none;padding:0 0 18px;color:var(--rd-on-dark-72);max-width:70ch}
.faq-item.open .faq-a{display:block}
.section.paper .faq-item,.section.paper .faq-item:last-child{border-color:var(--rd-line-soft)}
.section.paper .faq-a{color:var(--rd-muted)}