/* ==========================================================================
   Pepiniera Nunu Doru I.I.
   Direcție vizuală: "Catalogul pepinierei" — hârtie, cerneală verde, etichetă legată
   ========================================================================== */

/* ---------- 1. Tokens ---------- */
:root {
  /* Culori */
  --paper:        #FAF6EC;
  --paper-2:      #F3EDDD;
  --paper-3:      #EAE2CD;
  --ink:          #1A2419;
  --ink-soft:     #3D4A3B;
  --muted:        #5F6B5E;
  --green-900:    #16301F;
  --green-700:    #2E5C3E;
  --green-600:    #3A7350;
  --gold:         #C1811F;
  --gold-deep:    #96631A;
  --gold-soft:    #E8C87A;
  --clay:         #A65A34;
  --border:       #DCD2BB;
  --border-dark:  #33452F;
  --wa:           #1F8A4C;

  /* Tipografie */
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-body:    "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Ritm */
  --wrap:         1180px;
  --gutter:       clamp(1.25rem, 4vw, 2.5rem);
  --sp-section:   clamp(4rem, 9vw, 7.5rem);
  --radius:       4px;
  --radius-lg:    10px;

  /* Umbre — discrete, ca de hârtie */
  --shadow-sm:    0 1px 2px rgba(26, 36, 25, .06);
  --shadow-md:    0 4px 16px rgba(26, 36, 25, .09);
  --shadow-lg:    0 18px 44px rgba(26, 36, 25, .16);

  --ease:         cubic-bezier(.22, .61, .36, 1);
}

/* ---------- 2. Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: 88px;
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img, svg { display: block; max-width: 100%; }
img { height: auto; }

h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 600;
  line-height: 1.12;
  margin: 0;
  letter-spacing: -.015em;
  font-variation-settings: "SOFT" 22, "WONK" 1;
}

p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }

a { color: var(--green-700); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--gold-deep); }

ul, ol { margin: 0; padding: 0; }

:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 3px;
  border-radius: 2px;
}

.skip-link {
  position: absolute; left: -9999px;
  background: var(--ink); color: var(--paper);
  padding: .85rem 1.35rem; z-index: 999; border-radius: 0 0 var(--radius) 0;
  font-weight: 600; text-decoration: none;
}
.skip-link:focus { left: 0; top: 0; }

/* ---------- 3. Layout ---------- */
.wrap {
  width: 100%;
  max-width: var(--wrap);
  margin-inline: auto;
  padding-inline: var(--gutter);
}
.wrap-narrow { max-width: 760px; }

.section { padding-block: var(--sp-section); }

.section-title {
  font-size: clamp(2rem, 5.2vw, 3.15rem);
  margin-bottom: .55em;
  max-width: 20ch;
}

.section-lede {
  font-size: clamp(1.0625rem, 2vw, 1.2rem);
  color: var(--muted);
  max-width: 62ch;
  margin-bottom: 3rem;
}

/* Eyebrow — linia mică de deasupra titlului, cu bară aurie */
.eyebrow {
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--gold-deep);
  margin-bottom: 1.1rem;
  display: flex;
  align-items: center;
  gap: .7rem;
}
.eyebrow::before {
  content: "";
  width: 30px; height: 2px;
  background: var(--gold);
  flex: none;
}

/* Secțiuni întunecate */
.dark {
  background: var(--green-900);
  color: var(--paper);
}
.dark .section-title { color: var(--paper); }
.dark .section-lede  { color: rgba(250, 246, 236, .76); }
.dark .eyebrow       { color: var(--gold-soft); }
.dark .eyebrow::before { background: var(--gold-soft); }
.dark a { color: var(--gold-soft); }
.dark a:hover { color: #fff; }

/* ---------- 4. Butoane ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  min-height: 48px;              /* țintă de atingere confortabilă */
  padding: .8rem 1.45rem;
  border: 1px solid transparent;
  border-radius: var(--radius);
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  touch-action: manipulation;
  transition: transform .18s var(--ease), background-color .18s var(--ease),
              box-shadow .18s var(--ease), color .18s var(--ease);
}
.btn svg { width: 20px; height: 20px; flex: none; }
.btn:hover  { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }

.btn-lg { min-height: 56px; padding: 1rem 1.85rem; font-size: 1.0625rem; }

.btn-primary { background: var(--green-700); color: #fff; box-shadow: var(--shadow-md); }
.btn-primary:hover { background: var(--green-600); color: #fff; box-shadow: var(--shadow-lg); }

.btn-gold { background: var(--gold); color: #24170A; box-shadow: var(--shadow-md); }
.btn-gold:hover { background: var(--gold-soft); color: #24170A; box-shadow: var(--shadow-lg); }

.btn-whatsapp { background: transparent; color: var(--green-700); border-color: var(--border); }
.btn-whatsapp:hover { background: var(--wa); border-color: var(--wa); color: #fff; }
.dark .btn-whatsapp { color: var(--paper); border-color: rgba(250,246,236,.34); }
.dark .btn-whatsapp:hover { background: var(--wa); border-color: var(--wa); color: #fff; }

.btn-phone {
  background: var(--paper-2);
  color: var(--ink);
  border-color: var(--border);
  font-variant-numeric: tabular-nums;
}
.btn-phone:hover { background: var(--green-700); border-color: var(--green-700); color: #fff; }

/* ---------- 5. Header ---------- */
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(250, 246, 236, .93);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid transparent;
  transition: border-color .25s var(--ease), box-shadow .25s var(--ease);
}
.site-header.is-stuck {
  border-bottom-color: var(--border);
  box-shadow: var(--shadow-sm);
}

.header-inner {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  min-height: 74px;
}

.brand {
  display: flex; align-items: center; gap: .7rem;
  text-decoration: none; color: var(--ink);
  margin-right: auto;
  min-height: 46px;
  touch-action: manipulation;
}
.brand-logo { width: 40px; height: 40px; object-fit: contain; flex: none; }
.brand-text strong {
  display: block;
  font-family: var(--font-display);
  font-size: 1.075rem;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -.01em;
}
.brand-text small {
  display: block;
  font-size: .7rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--muted);
}

.nav a {
  color: var(--ink-soft);
  text-decoration: none;
  font-size: .9375rem;
  font-weight: 500;
  position: relative;
}

/* --- Meniu mobil: panou care coboară de sub antet --- */
@media (max-width: 899px) {
  .nav {
    position: absolute;
    top: 100%; left: 0; right: 0;
    display: grid;
    background: var(--paper);
    border-bottom: 1px solid var(--border);
    box-shadow: var(--shadow-md);
    padding: .5rem var(--gutter) 1.25rem;

    /* Ascuns, dar animabil — și scos din ordinea de tabulare cât e închis */
    visibility: hidden;
    opacity: 0;
    transform: translateY(-10px);
    transition: opacity .22s var(--ease), transform .22s var(--ease), visibility .22s;
  }
  .nav a {
    padding: .95rem .25rem;          /* țintă de atingere confortabilă */
    min-height: 48px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--border);
    font-size: 1.0625rem;
  }
  .nav a:last-child { border-bottom: 0; }

  .site-header.nav-open .nav {
    visibility: visible;
    opacity: 1;
    transform: none;
  }
  .site-header.nav-open { border-bottom-color: transparent; }
}

/* Butonul hamburger */
.nav-toggle {
  width: 48px; height: 48px;
  display: grid; place-items: center;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  cursor: pointer;
  touch-action: manipulation;
  color: var(--ink);
}
.nav-toggle-box { display: grid; gap: 5px; width: 21px; }
.nav-toggle-bar {
  height: 2px; width: 100%;
  background: currentColor;
  border-radius: 2px;
  transition: transform .25s var(--ease), opacity .18s var(--ease);
}
.site-header.nav-open .nav-toggle-bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.site-header.nav-open .nav-toggle-bar:nth-child(2) { opacity: 0; }
.site-header.nav-open .nav-toggle-bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.header-cta { display: none; }

/* --- Desktop: bară orizontală, fără hamburger --- */
@media (min-width: 900px) {
  .nav { display: flex; gap: 1.75rem; }
  .nav a { padding: .5rem 0; }
  .nav a::after {
    content: "";
    position: absolute; left: 0; right: 0; bottom: 0;
    height: 2px; background: var(--gold);
    transform: scaleX(0); transform-origin: left;
    transition: transform .22s var(--ease);
  }
  .nav a:hover { color: var(--ink); }
  .nav a:hover::after { transform: scaleX(1); }

  .nav-toggle { display: none; }
  .header-cta { display: inline-flex; }
}

/* ---------- 6. Hero ----------
   Fotografiile din livadă au rezoluție mică (175 px), deci NU pot fi fundal pe tot ecranul.
   În loc să le întindem și să iasă neclare, le arătăm la mărimea lor reală, ca pe niște
   plăci lipite într-un catalog. Rămân clare și se potrivesc cu direcția vizuală. */
.hero {
  position: relative;
  background: var(--green-900);
  color: var(--paper);
  padding-block: clamp(2.75rem, 8vw, 5rem) clamp(3rem, 8vw, 5rem);
  isolation: isolate;
  overflow: hidden;
}

/* Textură discretă de rânduri, ca brazdele dintr-o livadă */
.hero::before {
  content: "";
  position: absolute; inset: 0; z-index: -1;
  background-image: repeating-linear-gradient(
    72deg, rgba(232, 200, 122, .05) 0 1px, transparent 1px 34px);
}

.hero-grid { display: grid; gap: clamp(2.5rem, 6vw, 4rem); align-items: center; }

.hero .eyebrow { color: var(--gold-soft); }
.hero .eyebrow::before { background: var(--gold-soft); }

@media (min-width: 900px) {
  .hero-grid { grid-template-columns: 1.05fr .95fr; }
}

/* --- Plăcile de catalog --- */
.plates {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 175px));
  gap: clamp(.9rem, 2.5vw, 1.35rem);
  justify-content: center;
}

.plate {
  margin: 0;
  background: var(--paper);
  padding: 9px 9px 0;
  border-radius: 2px;
  box-shadow: var(--shadow-lg);
  transition: transform .3s var(--ease);
}
.plate img { width: 100%; height: auto; border-radius: 1px; }
.plate figcaption {
  font-family: var(--font-display);
  font-size: .76rem;
  font-style: italic;
  color: var(--ink-soft);
  text-align: center;
  padding: .5rem .25rem .55rem;
}

/* Ușor înclinate, ca niște poze puse pe masă — nu perfect aliniate */
.plate            { transform: rotate(-1.4deg); }
.plate-2          { transform: rotate(1.1deg); }
.plate-3          { transform: rotate(.8deg); }
.plate-4          { transform: rotate(-.7deg); grid-column: 1 / -1; justify-self: center; max-width: 260px; }
.plate:hover      { transform: rotate(0) scale(1.03); z-index: 2; }

@media (prefers-reduced-motion: reduce) {
  .plate, .plate:hover { transform: none; }
}

.hero-title {
  font-size: clamp(2.4rem, 7.4vw, 4.9rem);
  font-weight: 600;
  line-height: 1.05;
  color: var(--paper);
  margin-bottom: .5em;
  text-wrap: balance;
}
.hero-title em {
  font-style: italic;
  color: var(--gold-soft);
  font-variation-settings: "SOFT" 40, "WONK" 1;
}

.hero-lede {
  font-size: clamp(1.075rem, 2.2vw, 1.3rem);
  color: rgba(250, 246, 236, .9);
  max-width: 48ch;
  margin-bottom: 2.25rem;
}

.hero-actions { display: flex; flex-wrap: wrap; gap: .9rem; margin-bottom: 1.35rem; }
.hero .btn-whatsapp { color: var(--paper); border-color: rgba(250,246,236,.42); background: rgba(250,246,236,.07); }
.hero .btn-whatsapp:hover { background: var(--wa); border-color: var(--wa); color: #fff; }
.hero-title { color: var(--paper); }

.hero-note { font-size: .9375rem; color: rgba(250, 246, 236, .72); }

/* ---------- 7. Sezon + numărătoare ---------- */
.season {
  background: var(--ink);
  color: var(--paper);
  padding-block: clamp(2.75rem, 6vw, 4rem);
  border-bottom: 3px solid var(--gold);
}
.season-inner {
  display: grid;
  gap: 2.5rem;
  align-items: center;
}
.season-title {
  font-size: clamp(1.5rem, 3.4vw, 2.15rem);
  color: var(--paper);
  margin-bottom: .55em;
  max-width: 24ch;
}
.season-copy p { color: rgba(250, 246, 236, .78); max-width: 56ch; }

.countdown {
  border: 1px solid rgba(232, 200, 122, .32);
  border-radius: var(--radius-lg);
  padding: 1.5rem 1.75rem;
  background: rgba(232, 200, 122, .06);
}
.countdown-label {
  font-size: .72rem; letter-spacing: .15em; text-transform: uppercase;
  color: var(--gold-soft); margin-bottom: 1rem; font-weight: 600;
}
.countdown-units { display: flex; gap: 1.6rem; margin-bottom: .9rem; }
.cu { display: flex; flex-direction: column; }
.cu-n {
  font-family: var(--font-display);
  font-size: clamp(2.1rem, 5.5vw, 2.9rem);
  font-weight: 600;
  line-height: 1;
  color: var(--paper);
  font-variant-numeric: tabular-nums;
}
.cu-l {
  font-size: .72rem; letter-spacing: .13em; text-transform: uppercase;
  color: rgba(250, 246, 236, .6); margin-top: .35rem;
}
.countdown-date { font-size: .9375rem; color: var(--gold-soft); margin: 0; }

@media (min-width: 880px) {
  .season-inner { grid-template-columns: 1.35fr .95fr; gap: 4rem; }
}

/* ---------- 8. De ce toamna ---------- */
.why-autumn { background: var(--paper-2); }

.autumn-grid {
  display: grid;
  gap: 1.25rem;
  margin-top: 2.75rem;
}
.autumn-card {
  background: var(--paper);
  border: 1px solid var(--border);
  border-top: 3px solid var(--green-700);
  border-radius: var(--radius);
  padding: 1.85rem 1.65rem;
}
.autumn-num {
  display: inline-block;
  font-family: var(--font-display);
  font-size: .9rem;
  font-weight: 700;
  letter-spacing: .06em;
  color: var(--gold-deep);
  text-transform: uppercase;
  margin-bottom: .9rem;
}
.autumn-card h3 { font-size: 1.24rem; margin-bottom: .55rem; }
.autumn-card p { color: var(--muted); font-size: .9875rem; margin: 0; }

@media (min-width: 760px) { .autumn-grid { grid-template-columns: repeat(3, 1fr); } }

/* ---------- 9. Etichete de pepinieră (specii) ---------- */
.tags {
  display: grid;
  gap: 1.15rem;
  list-style: none;
  grid-template-columns: repeat(auto-fill, minmax(232px, 1fr));
}

/* Cartonașul: colț tăiat + gaura de sfoară = eticheta reală din pepinieră */
.tag {
  position: relative;
  background: var(--paper);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 2.6rem 1.4rem 1.4rem;
  box-shadow: var(--shadow-sm);
  transition: transform .22s var(--ease), box-shadow .22s var(--ease),
              border-color .22s var(--ease);
  /* colțul din stânga sus tăiat, ca la un carton perforat */
  clip-path: polygon(22px 0, 100% 0, 100% 100%, 0 100%, 0 22px);
}
.tag:hover {
  transform: translateY(-4px) rotate(-.4deg);
  box-shadow: var(--shadow-md);
  border-color: var(--green-600);
}

/* Gaura prin care trece sfoara */
.tag-hole {
  position: absolute;
  top: 15px; left: 15px;
  width: 11px; height: 11px;
  border-radius: 50%;
  background: var(--paper-3);
  box-shadow: inset 0 1px 2px rgba(26, 36, 25, .3);
}

.tag-name {
  font-size: 1.55rem;
  margin-bottom: .1rem;
}
.tag-latin {
  font-family: var(--font-display);
  font-style: italic;
  font-size: .86rem;
  color: var(--muted);
  margin-bottom: 1.15rem;
  padding-bottom: 1.15rem;
  border-bottom: 1px dashed var(--border);
}

.tag-meta { margin: 0; font-size: .8125rem; }
.tag-meta > div { display: flex; justify-content: space-between; gap: .75rem; padding: .3rem 0; }
.tag-meta dt {
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .07em;
  font-size: .68rem;
  font-weight: 600;
  padding-top: .12rem;
}
.tag-meta dd { margin: 0; text-align: right; font-weight: 500; color: var(--ink-soft); }

.specii-cta {
  margin-top: 2.5rem;
  font-size: 1.05rem;
  color: var(--muted);
}
.specii-cta a { font-weight: 600; }

/* ---------- 9a. Cum se face un pom ---------- */
.altoire { background: var(--paper); }

.altoire-wrap { display: grid; gap: clamp(2rem, 5vw, 3.5rem); align-items: center; }

/* pe ecrane înguste, poza stă deasupra textului */
.altoire-foto { order: -1; }

@media (min-width: 940px) {
  .altoire-wrap { grid-template-columns: 1fr .82fr; gap: 4.5rem; }
  .altoire-foto { order: 0; }
}

/* --- Lista de pași --- */
.pasi-altoire { list-style: none; margin-top: .5rem; }

.pa {
  display: flex;
  gap: 1.1rem;
  padding: 1.1rem 0;
  border-top: 1px solid var(--border);
}
.pa:last-child { border-bottom: 1px solid var(--border); }

.pa-n {
  flex: none;
  width: 34px; height: 34px;
  display: grid; place-items: center;
  border-radius: 50%;
  background: var(--green-700);
  color: #fff;
  font-family: var(--font-display);
  font-size: .95rem;
  font-weight: 700;
}

.pa h3 { font-size: 1.14rem; margin-bottom: .3rem; }
.pa p  { font-size: .9125rem; color: var(--muted); margin: 0; }
.pa strong { color: var(--gold-deep); font-weight: 600; }

/* --- Poza --- */
.altoire-foto {
  margin: 0;
  background: var(--paper-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 10px;
  box-shadow: var(--shadow-md);
}
.altoire-foto img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius);
  background: var(--paper-3);
}
.altoire-foto figcaption {
  font-family: var(--font-display);
  font-style: italic;
  font-size: .84rem;
  color: var(--muted);
  text-align: center;
  padding: .75rem .5rem .3rem;
}

/* ---------- 9b. Galeria de soiuri ---------- */
.soiuri { background: var(--paper-2); }

/* --- Filtre pe specie --- */
.filtre {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-bottom: 1rem;
}
.filtru {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  min-height: 44px;
  padding: .55rem 1.05rem;
  background: var(--paper);
  border: 1px solid var(--border);
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: .9375rem;
  font-weight: 500;
  color: var(--ink-soft);
  cursor: pointer;
  touch-action: manipulation;
  transition: background-color .18s var(--ease), color .18s var(--ease),
              border-color .18s var(--ease);
}
.filtru span {
  font-size: .72rem;
  font-weight: 600;
  color: var(--muted);
  background: var(--paper-3);
  border-radius: 999px;
  padding: .1rem .45rem;
  font-variant-numeric: tabular-nums;
}
.filtru:hover { border-color: var(--green-600); color: var(--ink); }
.filtru.is-on {
  background: var(--green-700);
  border-color: var(--green-700);
  color: #fff;
}
.filtru.is-on span { background: rgba(255, 255, 255, .22); color: #fff; }

.filtru-stare {
  font-size: .875rem;
  color: var(--muted);
  min-height: 1.4em;
  margin-bottom: 2.25rem;
}

/* --- Grupuri pe specie --- */
.grup { margin-bottom: 3.25rem; }
.grup[hidden] { display: none; }

.grup-titlu {
  font-size: clamp(1.4rem, 3.2vw, 1.85rem);
  margin-bottom: 1.35rem;
  padding-bottom: .7rem;
  border-bottom: 2px solid var(--border);
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: .7rem;
}
.grup-latin {
  font-size: .84rem;
  font-style: italic;
  font-weight: 400;
  color: var(--muted);
  letter-spacing: 0;
}

/* --- Cardul de soi --- */
.soi-grid {
  list-style: none;
  display: grid;
  gap: 1.15rem;
  grid-template-columns: repeat(auto-fill, minmax(238px, 1fr));
}

.soi {
  background: var(--paper);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: var(--shadow-sm);
  transition: transform .22s var(--ease), box-shadow .22s var(--ease),
              border-color .22s var(--ease);
}
.soi:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
  border-color: var(--green-600);
}
.soi > img {
  width: 100%;
  aspect-ratio: 4 / 3;         /* spațiu rezervat → fără sărituri de layout */
  object-fit: cover;
  background: var(--paper-3);
  border-bottom: 1px solid var(--border);
}

.soi-txt { padding: 1.05rem 1.15rem 1.2rem; display: flex; flex-direction: column; flex: 1; }
.soi-txt h4 { font-size: 1.22rem; margin-bottom: .6rem; }
.soi-alias {
  font-family: var(--font-body);
  font-size: .72rem;
  font-weight: 500;
  font-style: normal;
  color: var(--gold-deep);
  letter-spacing: .01em;
  display: block;
  margin-top: .18rem;
}

.soi-meta {
  display: grid;
  gap: .18rem;
  margin-bottom: .7rem;
  padding-bottom: .7rem;
  border-bottom: 1px dashed var(--border);
  font-size: .78rem;
  color: var(--muted);
}
.soi-meta span { display: block; }

.soi-nota { font-size: .875rem; color: var(--ink-soft); margin: 0; }

@media (prefers-reduced-motion: reduce) {
  .soi:hover { transform: none; }
}

/* --- Mod restrâns: activ când e apăsat „Toate" ---
   47 de carduri mari însemnau mult prea mult derulat. Aici arătăm plăcuțe mici,
   doar cu poza, numele și luna coacerii. Detaliile apar când alegi o specie. */
.soiuri.restrans .soi-grid { grid-template-columns: repeat(auto-fill, minmax(126px, 1fr)); gap: .7rem; }
.soiuri.restrans .soi > img { aspect-ratio: 5 / 4; }
.soiuri.restrans .soi-txt   { padding: .6rem .7rem .75rem; }
.soiuri.restrans .soi-txt h4 { font-size: 1rem; margin-bottom: .3rem; }
.soiuri.restrans .soi-alias { display: none; }
.soiuri.restrans .soi-nota  { display: none; }
.soiuri.restrans .soi-meta {
  margin: 0; padding: 0; border-bottom: 0;
  font-size: .75rem;   /* 12px — pragul de sub care textul devine greu de citit */
  line-height: 1.35;
}
.soiuri.restrans .soi-meta span:nth-child(2) { display: none; }  /* ascundem vigoarea */

/* titlurile de specie devin mai strânse, ca să nu ocupe ele înălțimea */
/* Pe telefon, 2 coloane însemnau 24 de rânduri și 8 ecrane de derulat.
   Trecem pe 3 coloane și păstrăm doar poza și numele. */
@media (max-width: 560px) {
  .soiuri.restrans .soi-grid { grid-template-columns: repeat(3, 1fr); gap: .5rem; }
  .soiuri.restrans .soi-txt  { padding: .45rem .5rem .6rem; }
  .soiuri.restrans .soi-txt h4 { font-size: .875rem; line-height: 1.25; }
  .soiuri.restrans .soi-meta { display: none; }
  .soiuri.restrans .soi > img { aspect-ratio: 1 / 1; }
}

.soiuri.restrans .grup { margin-bottom: 1.6rem; }
.soiuri.restrans .grup-titlu {
  font-size: 1.08rem;
  margin-bottom: .7rem;
  padding-bottom: .4rem;
  border-bottom-width: 1px;
}

/* ---------- 10. Cantități / două trasee ---------- */
.cantitati { background: var(--paper-2); }

.lanes { display: grid; gap: 1.5rem; }

.lane {
  background: var(--paper);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: clamp(1.85rem, 4vw, 2.75rem);
  display: flex;
  flex-direction: column;
}
.lane-pro {
  background: var(--green-900);
  color: var(--paper);
  border-color: var(--green-900);
}

.lane-scale {
  font-family: var(--font-display);
  font-size: .95rem;
  font-weight: 700;
  letter-spacing: .05em;
  color: var(--gold-deep);
  margin-bottom: .7rem;
}
.lane-pro .lane-scale { color: var(--gold-soft); }

.lane-title { font-size: clamp(1.5rem, 3vw, 1.95rem); margin-bottom: .7rem; }
.lane-pro .lane-title { color: var(--paper); }

.lane-body { color: var(--muted); margin-bottom: 1.5rem; }
.lane-pro .lane-body { color: rgba(250, 246, 236, .78); }

.lane-list { list-style: none; margin-bottom: 2rem; }
.lane-list li {
  position: relative;
  padding-left: 1.75rem;
  padding-block: .42rem;
  font-size: .96rem;
}
.lane-list li::before {
  content: "";
  position: absolute; left: 0; top: .82rem;
  width: 9px; height: 9px;
  border-radius: 50%;
  background: var(--green-600);
}
.lane-pro .lane-list li::before { background: var(--gold); }
.lane-list { border-top: 1px dashed var(--border); padding-top: .75rem; }
.lane-pro .lane-list { border-top-color: rgba(232, 200, 122, .26); }

.lane .btn { margin-top: auto; align-self: flex-start; }

@media (min-width: 840px) { .lanes { grid-template-columns: 1fr 1fr; } }

/* ---------- 11. Încredere ---------- */

/* Cel mai puternic argument al unui pepinierist: vechimea. Îi dăm greutate vizuală. */
.trust-ani {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: .35em .85rem;
  margin: 0;
  padding: 1.5rem 0 0;
  border-top: 2px solid var(--gold);
  max-width: 46rem;
}
.ta-n {
  font-family: var(--font-display);
  font-size: clamp(3.2rem, 9vw, 5rem);
  font-weight: 700;
  line-height: .9;
  color: var(--gold-soft);
  font-variant-numeric: tabular-nums;
  letter-spacing: -.02em;
}
.ta-t {
  flex: 1 1 16rem;
  font-size: clamp(1.02rem, 2vw, 1.16rem);
  color: rgba(250, 246, 236, .84);
  line-height: 1.55;
}

.trust-grid { display: grid; gap: 1.15rem; margin-top: 3rem; }

.trust-item {
  border-top: 2px solid rgba(232, 200, 122, .35);
  padding-top: 1.35rem;
}
.trust-item h3 { font-size: 1.19rem; color: var(--paper); margin-bottom: .5rem; }
.trust-item p { color: rgba(250, 246, 236, .74); font-size: .9625rem; margin: 0; }

@media (min-width: 700px)  { .trust-grid { grid-template-columns: 1fr 1fr; gap: 2rem 2.5rem; } }
@media (min-width: 1040px) { .trust-grid { grid-template-columns: repeat(4, 1fr); } }

/* ---------- 11b. Certificări ---------- */
.certificari {
  margin-top: clamp(3rem, 7vw, 4.5rem);
  padding-top: clamp(2.25rem, 5vw, 3rem);
  border-top: 1px solid rgba(232, 200, 122, .26);
}
.cert-titlu { font-size: 1.35rem; color: var(--paper); margin-bottom: .45rem; }
.cert-lede { color: rgba(250, 246, 236, .7); font-size: .95rem; max-width: 58ch; margin-bottom: 1.75rem; }

/* Datele oficiale, scrise ca text — se citesc mult mai ușor decât de pe poză
   și pot fi găsite de motoarele de căutare. */
.cert-date {
  list-style: none;
  display: grid;
  gap: .85rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 168px), 1fr));
  margin-bottom: 2rem;
  max-width: 760px;
}
.cert-date li {
  border-left: 2px solid var(--gold);
  padding-left: .85rem;
}
.cert-date span {
  display: block;
  font-size: .68rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(250, 246, 236, .62);
  margin-bottom: .18rem;
}
.cert-date strong {
  font-family: var(--font-display);
  font-size: 1.12rem;
  font-weight: 600;
  color: var(--gold-soft);
  letter-spacing: .01em;
}

/* Documentele sunt late, nu verticale — le lăsăm la proporția lor reală,
   fără decupare: un act trebuie să rămână citibil. */
.cert-grid { display: grid; gap: 1.5rem; max-width: 780px; }
.cert {
  margin: 0;
  background: var(--paper);
  padding: 10px;
  border-radius: 2px;
  box-shadow: var(--shadow-lg);
}
.cert a { display: block; }
.cert img { width: 100%; height: auto; background: var(--paper-3); }
.cert figcaption {
  font-size: .78rem;
  color: var(--muted);
  text-align: center;
  padding-top: .65rem;
}
/* Documentele sunt late; pe telefon scrisul de pe ele e prea mic ca să se citească,
   așa că se deschid la mărime reală la atingere. */
.cert-mareste {
  display: block;
  margin-top: .2rem;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--gold-deep);
}
.cert a:hover + figcaption .cert-mareste { text-decoration: underline; }

/* ---------- 11c. Câmpul de pepinieră ---------- */
.camp {
  margin-top: clamp(3rem, 7vw, 4.5rem);
  padding-top: clamp(2.25rem, 5vw, 3rem);
  border-top: 1px solid rgba(232, 200, 122, .26);
}
.camp-titlu { font-size: 1.35rem; color: var(--paper); margin-bottom: .45rem; }
.camp-lede { color: rgba(250, 246, 236, .72); font-size: .95rem; max-width: 60ch; margin-bottom: 1.75rem; }

.camp-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
}
.camp-poza { margin: 0; }
.camp-poza img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius);
  background: rgba(250, 246, 236, .08);
}
.camp-poza figcaption {
  font-size: .78rem;
  color: rgba(250, 246, 236, .62);
  padding-top: .6rem;
}

/* ---------- 12. Mozaic fructe ---------- */
.mozaic {
  display: grid;
  gap: .9rem;
  grid-template-columns: repeat(2, 1fr);
}
.mz {
  margin: 0;
  position: relative;
  overflow: hidden;
  border-radius: var(--radius);
  background: var(--paper-3);
  aspect-ratio: 1 / 1;          /* spațiu rezervat → fără sărituri de layout */
}
.mz img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .5s var(--ease);
}
.mz:hover img { transform: scale(1.05); }

/* Eticheta cu numele soiului, peste poză */
.mz figcaption {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 1.6rem .9rem .75rem;
  font-size: .8125rem;
  color: #fff;
  background: linear-gradient(to top, rgba(12, 26, 15, .88), rgba(12, 26, 15, 0));
}
.mz figcaption strong { font-weight: 600; }

@media (min-width: 760px) {
  .mozaic { grid-template-columns: repeat(4, 1fr); }
  .mz-mare { grid-column: span 2; grid-row: span 2; }
}

@media (prefers-reduced-motion: reduce) {
  .mz:hover img { transform: none; }
}

/* ---------- 13. Pași ---------- */
.proces { background: var(--paper-2); }

.pasi { list-style: none; display: grid; gap: 1.5rem; margin-top: 2.5rem; counter-reset: none; }

.pas {
  position: relative;
  padding-left: 4rem;
}
.pas-n {
  position: absolute; left: 0; top: 0;
  width: 46px; height: 46px;
  display: grid; place-items: center;
  border-radius: 50%;
  border: 1.5px solid var(--green-700);
  color: var(--green-700);
  background: var(--paper);
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 700;
}
.pas h3 { font-size: 1.22rem; margin-bottom: .4rem; padding-top: .55rem; }
.pas p  { color: var(--muted); font-size: .9625rem; margin: 0; }

@media (min-width: 780px) { .pasi { grid-template-columns: repeat(2, 1fr); gap: 2.5rem 3rem; } }

/* ---------- 14. Ghid + acordeon ---------- */
.ghid-wrap { display: grid; gap: 2.5rem; }
.ghid-copy .section-lede { margin-bottom: 0; }

@media (min-width: 940px) {
  .ghid-wrap { grid-template-columns: .85fr 1.15fr; gap: 4.5rem; align-items: start; }
  .ghid-copy { position: sticky; top: 110px; }
}

.acc {
  border-bottom: 1px solid var(--border);
}
.acc summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.15rem 0;
  min-height: 48px;
  cursor: pointer;
  list-style: none;
  font-family: var(--font-display);
  font-size: 1.115rem;
  font-weight: 600;
  color: var(--ink);
  transition: color .18s var(--ease);
}
.acc summary::-webkit-details-marker { display: none; }
.acc summary:hover { color: var(--green-700); }

/* Semnul +/− desenat din două linii */
.acc summary::after {
  content: "";
  flex: none;
  width: 15px; height: 15px;
  background:
    linear-gradient(var(--gold-deep), var(--gold-deep)) center/15px 1.5px no-repeat,
    linear-gradient(var(--gold-deep), var(--gold-deep)) center/1.5px 15px no-repeat;
  transition: transform .28s var(--ease);
}
.acc[open] summary::after {
  transform: rotate(135deg);
  background:
    linear-gradient(var(--gold-deep), var(--gold-deep)) center/15px 1.5px no-repeat;
}

.acc-body { padding-bottom: 1.3rem; }
.acc-body p { color: var(--muted); font-size: .9875rem; margin: 0; max-width: 66ch; }

.faq { background: var(--paper-2); }

/* ---------- 15. Contact ---------- */
.contact-wrap { display: grid; gap: 3rem; }

.contact-actions { display: flex; flex-wrap: wrap; gap: .9rem; }

.contact-card {
  background: rgba(250, 246, 236, .05);
  border: 1px solid rgba(250, 246, 236, .16);
  border-radius: var(--radius-lg);
  padding: clamp(1.6rem, 4vw, 2.25rem);
}
.contact-card h3 {
  font-size: 1.3rem;
  color: var(--paper);
  margin-bottom: 1.4rem;
  padding-bottom: 1.1rem;
  border-bottom: 1px solid rgba(250, 246, 236, .16);
}
.contact-dl { margin: 0; display: grid; gap: 1.1rem; }
.contact-dl dt {
  font-size: .68rem;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--gold-soft);
  font-weight: 600;
  margin-bottom: .22rem;
}
.contact-dl dd { margin: 0; color: rgba(250, 246, 236, .9); font-size: 1rem; }
/* Linkuri de contact: ținte de atingere de 44px, nu doar text de 20px */
.contact-dl a {
  color: var(--paper);
  text-decoration-color: rgba(250, 246, 236, .4);
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  touch-action: manipulation;
}
.contact-dl a:hover { color: var(--gold-soft); }

@media (min-width: 940px) {
  .contact-wrap { grid-template-columns: 1.1fr .9fr; gap: 4.5rem; align-items: start; }
}

/* --- Harta ---
   Stă în coloana din stânga, sub butoane, ca să fie la același nivel cu fișa de
   contact din dreapta. Pe toată lățimea părea desprinsă de restul secțiunii. */
.harta-wrap { margin-top: clamp(2.25rem, 5vw, 3rem); }
.harta-titlu {
  font-size: 1.18rem;
  color: var(--paper);
  margin-bottom: .9rem;
}
.harta {
  width: 100%;
  /* pe o singură coloană, coloana e lată; fără plafon harta ar deveni uriașă */
  max-width: 620px;
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid rgba(250, 246, 236, .16);
  background: rgba(250, 246, 236, .05);
  /* proporție fixă => înălțimea e rezervată din start și pagina nu sare la încărcare */
  aspect-ratio: 4 / 3;
}
.harta iframe { width: 100%; height: 100%; border: 0; display: block; }

.harta-nota { margin-top: .8rem; font-size: .9rem; }
.harta-nota a { font-weight: 600; }

@media (min-width: 940px) {
  /* în două coloane, harta umple coloana din stânga */
  .harta { max-width: none; aspect-ratio: 3 / 2; }
}

/* ---------- 16. Footer ---------- */
.site-footer {
  background: var(--ink);
  color: rgba(250, 246, 236, .68);
  padding-block: 2.75rem;
  font-size: .9rem;
}
.footer-brand {
  font-family: var(--font-display);
  font-size: 1.12rem;
  font-weight: 600;
  color: var(--paper);
  margin-bottom: .25rem;
}
.footer-meta { margin-bottom: 1.25rem; }
.footer-copy { font-size: .82rem; color: rgba(250, 246, 236, .45); margin: 0; }

/* ---------- 17. Bară fixă pe mobil ---------- */
.mobile-bar {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 120;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: var(--border-dark);
  padding-bottom: env(safe-area-inset-bottom);  /* nu intră sub bara de gesturi */
  box-shadow: 0 -6px 24px rgba(26, 36, 25, .22);
}
.mb-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  min-height: 58px;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  touch-action: manipulation;
}
.mb-btn svg { width: 19px; height: 19px; }
.mb-call { background: var(--green-700); color: #fff; }
.mb-call:active { background: var(--green-600); color: #fff; }
.mb-wa { background: var(--wa); color: #fff; }
.mb-wa:active { background: #17703D; color: #fff; }

/* Bara acoperă conținutul de jos → rezervăm spațiu */
@media (max-width: 899px) {
  body { padding-bottom: 58px; }
}
@media (min-width: 900px) {
  .mobile-bar { display: none; }
}

/* ---------- 18. Marcaje temporare (se șterg la final) ---------- */
.todo {
  background: repeating-linear-gradient(45deg,
    rgba(193, 129, 31, .16) 0 6px, rgba(193, 129, 31, .07) 6px 12px);
  border-bottom: 1.5px dashed var(--gold);
  padding: 0 .3em;
  border-radius: 2px;
}
.todo-block {
  outline: 1.5px dashed rgba(232, 200, 122, .5);
  outline-offset: 10px;
}

/* ---------- 19. Preferințe de mișcare ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .tag:hover, .btn:hover { transform: none; }
  .gal-item:hover img { transform: none; }
}

/* ---------- 20. Apariție la derulare ---------- */
.reveal {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity .45s var(--ease), transform .45s var(--ease);
}
.reveal.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
}

/* ---------- 21. Tipar ---------- */
@media print {
  .site-header, .mobile-bar, .hero-actions, .contact-actions { display: none !important; }
  body { background: #fff; color: #000; padding-bottom: 0; }
  .dark, .season { background: #fff !important; color: #000 !important; }
  .dark .section-title, .dark h3, .season-title, .trust-item h3 { color: #000 !important; }
}