/*
  /advocacy — page-scoped styles.
  Structure / editorial reference: docs/research/advocacy-prototype-v3.html
  (a design/structure reference only — never served directly, never iframed,
  docs/research is not public).

  Same isolation pattern as codul-de-conduita.css / educatie.css /
  franciza-in-romania.css: reuse the site's real tokens (var(--gold),
  var(--gold-soft), var(--gold-deep), var(--serif), var(--sans),
  var(--maxw)) plus the global primitives already loaded sitewide
  (.wrap / .crumb / .eyebrow / .btn / .btn-gold / .btn-ghost / .reveal).
  Everything specific to this page is scoped under `.adv` so it can never
  leak into the global design system.

  var(--gold) already equals the prototype's #D4AF37 exactly. The
  prototype's #020408 near-black navy has no sitewide token, so it is
  introduced ONLY as scoped `--adv-navy*` custom properties, exactly the
  way codul-de-conduita.css introduces `--cod-navy`. No new global color
  values are added. The prototype's serif/Segoe stack is NOT imported —
  headings use the site's own var(--serif) (Cormorant Garamond) and body
  copy var(--sans) (Manrope), both already loaded sitewide.

  Photography policy (owner-locked): exactly ONE photograph on the whole
  page — the Zagreb hero. Every other section is a pure CSS/HTML editorial
  object. No image slots, no galleries.
*/

.adv{
  --adv-navy:#020408;
  --adv-navy-2:#0a1018;
  --adv-panel:#0c121b;
  --adv-paper:#fffdf8;
  --adv-ink:#14181e;
  --adv-muted:#6a6f76;
  --adv-hair:rgba(20,24,30,.12);
  --adv-line:rgba(212,175,55,.26);
  --adv-line-soft:rgba(212,175,55,.12);

  background:var(--adv-navy);
  color:#f4efe4;
}

.adv section{padding:72px 0;scroll-margin-top:96px;border-top:1px solid var(--adv-line-soft)}
.adv section:first-of-type{border-top:0}
.adv h1,.adv h2,.adv h3{font-family:var(--serif);color:#fff;font-weight:600;line-height:1.16}
.adv h2{font-size:clamp(26px,3vw,38px);margin:0 0 16px}
.adv h3{font-size:19px;margin:0 0 10px}
.adv p,.adv li,.adv a,.adv dt,.adv dd,.adv summary{font-family:var(--sans)}
.adv p{margin:0 0 14px;line-height:1.68;color:rgba(244,239,228,.82)}
.adv a{color:var(--gold-soft)}
.adv strong,.adv b{color:#f6f1e6;font-weight:600}
.adv .eyebrow{color:var(--gold-soft)}
.adv .eyebrow::before{background:var(--gold-soft)}
.adv .adv-muted{color:rgba(244,239,228,.62)}
.adv .adv-crumb{padding-top:26px}

/* ---------- HERO ---------- */
.adv-hero{padding:80px 0 64px}
.adv-hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:48px;align-items:center}
.adv-hero-copy > :last-child{margin-bottom:0}
.adv-hero h1{font-size:clamp(38px,6vw,66px);line-height:1.04;letter-spacing:-.02em;margin:16px 0 22px}
.adv-hero .adv-lead{font-family:var(--serif);font-size:clamp(20px,2.3vw,27px);line-height:1.42;color:#f4f0e6;margin:0 0 16px}
.adv-hero .adv-sublead{font-size:16px;line-height:1.7;color:rgba(244,239,228,.72);margin:0}

/* the single photograph — restrained navy-integrated editorial framing */
.adv-hero-figure{margin:0;position:relative}
.adv-hero-figure img{
  display:block;width:100%;height:auto;aspect-ratio:3 / 2;object-fit:cover;
  border:1px solid var(--adv-line);
}
.adv-hero-figure::after{
  /* navy edge gradient so the photo sits inside the dark environment */
  content:"";position:absolute;inset:0;pointer-events:none;
  border:1px solid var(--adv-line);
  background:linear-gradient(180deg,rgba(2,4,8,0) 55%,rgba(2,4,8,.55) 100%),
             linear-gradient(90deg,rgba(2,4,8,.35) 0%,rgba(2,4,8,0) 22%);
}
.adv-hero-figure figcaption{
  margin-top:12px;font-size:12.5px;letter-spacing:.02em;color:rgba(244,239,228,.78);
  border-left:2px solid var(--gold);padding-left:12px;
}

/* ---------- generic editorial grids / panels ---------- */
.adv-g2{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:24px}
.adv-g3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px}
.adv-lead-copy{max-width:64ch;font-size:16.5px;line-height:1.72}

.adv-panel{
  background:rgba(255,255,255,.03);
  border:1px solid var(--adv-line-soft);
  padding:22px 20px;
}
.adv-panel h3{font-size:17px;margin:0 0 8px}
.adv-panel p{margin:0;font-size:14.5px;color:rgba(244,239,228,.7)}
.adv-panel.is-edge{box-shadow:inset 3px 0 0 var(--gold)}

/* what-it-is / what-it-is-not distinction */
.adv-distinct{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--adv-line);border:1px solid var(--adv-line);margin-top:24px}
.adv-distinct > div{background:var(--adv-navy-2);padding:20px 18px}
.adv-distinct dt{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-soft);margin:0 0 8px}
.adv-distinct dd{margin:0;font-size:14px;line-height:1.6;color:rgba(244,239,228,.78)}

/* ---------- principles ---------- */
.adv-principles{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:24px}
.adv-principle{
  background:rgba(255,255,255,.03);border:1px solid var(--adv-line-soft);
  border-left:3px solid var(--gold);padding:18px 20px;
}
.adv-principle strong{display:block;margin-bottom:6px;color:#fff;font-family:var(--serif);font-size:18px}
.adv-principle p{margin:0;font-size:14.5px;color:rgba(244,239,228,.72)}

/* ---------- process ---------- */
.adv-process{display:grid;grid-template-columns:1fr;border:1px solid var(--adv-line);margin-top:24px}
.adv-process div{padding:16px 18px;border-bottom:1px solid var(--adv-line-soft)}
.adv-process div:last-child{border-bottom:0}
.adv-process strong{
  display:block;font-family:var(--sans);font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-soft);margin-bottom:5px;
}
.adv-process span{font-size:14.5px;color:rgba(244,239,228,.78);line-height:1.6}

/* ---------- result / precedent cards ---------- */
.adv-cards{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:24px}
.adv-card{
  background:var(--adv-panel);border:1px solid var(--adv-line-soft);
  padding:24px 22px;display:flex;flex-direction:column;
}
.adv-card .adv-meta{
  font-family:var(--sans);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gold-soft);font-weight:700;margin:0 0 6px;
}
.adv-card h3{margin:2px 0 12px}
.adv-card p{font-size:14.5px;color:rgba(244,239,228,.74);margin:0 0 10px}
.adv-card p:last-child{margin-bottom:0}
.adv-facts{
  font-family:var(--sans);font-size:13px;background:rgba(255,255,255,.02);
  border:1px solid var(--adv-line-soft);padding:12px 14px;margin:0 0 12px;
}
.adv-facts dt{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(244,239,228,.55);margin-top:8px}
.adv-facts dt:first-child{margin-top:0}
.adv-facts dd{margin:2px 0 0;color:rgba(244,239,228,.85)}
.adv-card .adv-note{
  margin-top:12px;padding-top:10px;border-top:1px solid var(--adv-line-soft);
  font-size:12.5px;color:rgba(244,239,228,.58);line-height:1.6;
}

/* ---------- status tags (spec §19 — must stay visually distinct) ---------- */
.adv-tags{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.adv-tag{
  display:inline-block;font-family:var(--sans);font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;font-weight:700;padding:4px 9px;line-height:1.4;
}
.adv-tag--result{background:var(--gold);color:#020408}                     /* REZULTAT / ACT PUBLIC */
.adv-tag--precedent{background:transparent;color:var(--gold-soft);border:1px solid var(--gold-soft)} /* PRECEDENT INSTITUȚIONAL */
.adv-tag--ongoing{background:transparent;color:#e6dfce;border:1px dashed rgba(244,239,228,.4)}       /* DEMERS ÎN CURS */
.adv-tag--dialogue{background:rgba(212,175,55,.14);color:var(--gold-soft);border:1px solid var(--adv-line-soft)} /* DIALOG INTERNAȚIONAL */
.adv-tag--initiative{background:rgba(255,255,255,.05);color:rgba(244,239,228,.8);border:1px solid rgba(244,239,228,.18)} /* INIȚIATIVĂ */
.adv-tag--direction{background:transparent;color:rgba(244,239,228,.62);border:1px dotted rgba(244,239,228,.35)}        /* DIRECȚIE DE ADVOCACY */

/* ---------- Zagreb dialogue (text only, NO second photo) ---------- */
.adv-dialogue{
  background:linear-gradient(180deg,rgba(212,175,55,.06),transparent 60%);
  border:1px solid var(--adv-line-soft);border-left:3px solid var(--gold);
  padding:26px 24px;margin-top:24px;
}
.adv-dialogue h2{font-size:clamp(22px,2.5vw,30px)}
.adv-dialogue p:last-child{margin-bottom:0}

/* ---------- directions list ---------- */
.adv-list{margin:18px 0 0;padding-left:20px;color:rgba(244,239,228,.8);line-height:1.85;font-size:15px}
.adv-list li{margin:4px 0}

/* ---------- FAQ (native <details>) ---------- */
.adv-faq details{border-bottom:1px solid var(--adv-line-soft);padding:16px 0}
.adv-faq details[open]{padding-bottom:18px}
.adv-faq summary{
  cursor:pointer;color:#fff;font-weight:600;font-size:15.5px;list-style:none;
  display:flex;justify-content:space-between;gap:16px;align-items:baseline;
}
.adv-faq summary::-webkit-details-marker{display:none}
.adv-faq summary::after{content:"+";color:var(--gold);font-weight:400;font-size:20px;line-height:1}
.adv-faq details[open] summary::after{content:"\2013"}
.adv-faq summary:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.adv-faq details p{margin:10px 0 0;color:rgba(244,239,228,.72);font-size:14.5px;line-height:1.7}

/* ---------- disclaimer ---------- */
.adv-disclaimer{font-size:13px;color:rgba(244,239,228,.6);line-height:1.65;max-width:70ch;margin-top:8px}

/* ---------- CTA ---------- */
.adv-cta{background:var(--adv-navy-2);border:1px solid var(--adv-line);padding:40px 32px;margin-top:8px}
.adv-cta h2{margin-top:0}
.adv-cta p{color:rgba(244,239,228,.78);max-width:64ch}
.adv-cta .adv-cta-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:24px}

/* ---------- responsive ---------- */
@media (max-width:1023px){
  .adv-hero-grid{grid-template-columns:1fr;gap:34px}
  .adv-g3,.adv-distinct{grid-template-columns:1fr}
  .adv-cards,.adv-principles,.adv-g2{grid-template-columns:1fr}
  .adv-distinct{gap:1px}
}
@media (max-width:640px){
  .adv section{padding:52px 0}
  .adv-hero{padding:56px 0 44px}
  .adv-hero-figure img{aspect-ratio:4 / 3}
  .adv-cta{padding:30px 20px}
  .adv-cta .adv-cta-actions .btn{width:100%;justify-content:center}
}

/* respect reduced motion for the site's .reveal animation on this page */
@media (prefers-reduced-motion:reduce){
  .adv .reveal{opacity:1 !important;transform:none !important;transition:none !important}
}
