/* ==========================================================================
   FŐOLDAL — csak az, ami tényleg EZÉ az egy oldalé.
   Minden más a css/style.css-ből jön; ez a lap csak felülír, nem másol.

   Ezt a fájlt KIZÁRÓLAG az index.html tölti be, ezért minden itteni szabály
   automatikusan a főoldalra korlátozódik — az aloldalak nem látják.
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. Az Effra megérkezett — a Figtree-kompenzációk visszavonva

   Iparág-pillek: a helyettesítő Figtree ~4px-cel szélesebb volt ugyanazon a
   szövegen, ezért a pill vízszintes belső margója 20 → 14px-re szűkült, hogy
   az „Étterem, szálloda, vendéglátás" és az „Ipar, logisztika, mezőgazdaság"
   egy sorban maradjon. Effrával mind az öt felirat MÉRVE egysoros a tervbeli
   20px paddinggal is (301px pill, 216px szövegtér, a leghosszabb 212px), így
   a szűkítés kikerült — a pill visszakapta a Figma szerinti belső margóját.
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   1. Sormagasság-javítás, ami mindenhol érvényes

   A .stat__value sora 80px-es alapszövegből és 50px-es <em>/<span> elemekből
   áll, mindkettő ugyanazt a 100px-es hosszúság-line-height-ot örökli. Két
   eltérő betűméretű inline doboz azonos line-height mellett más-más
   fél-leadinget kap, a sordoboz uniója így 109px lett 100 helyett — statisztika-
   dobozonként +9px, a rácson át +18px az oldal magasságában. A kisebb elemek
   saját, arányos sormagassággal a strut alá kerülnek, a sor 100px marad.
   -------------------------------------------------------------------------- */
.stat__value em,
.stat__plus { line-height: 1; }

/* --------------------------------------------------------------------------
   2. Elsődleges gomb — a terv szerinti szélesség és igazítás

   A Figmában a gomb NEM a szöveghez zsugorodik: a felirat a gomb közepén ül,
   a körös nyíl pedig jobbra kifutva, a szövegtől függetlenül.
     hero „Tovább"                 x 82 → 274  (193 × 46), nyíl jobb szélétől 14px
     „Összes megtekintése"         x 617 → 824 (207 × 46), nyíl nincs
   A korábbi tartalomszélességű gomb 136px volt, 57px-cel keskenyebb a tervnél.
   -------------------------------------------------------------------------- */
.btn--primary { position: relative; justify-content: center; }
.hero .btn--primary { width: 193px; padding-inline: 21px; }
.hero .btn--primary .btn__arrow { position: absolute; right: 14px; }
.section--products .btn--primary { min-width: 207px; padding-inline: 21px; }

/* --------------------------------------------------------------------------
   3. Geometria a terv 1440px-es artboardján

   Minden itteni érték a Figma `321:2` (Home A1) koordinátáiból jön, és csak a
   tervrajz saját szélességtartományában érvényes. 1200px alatt a lap már saját
   reszponzív elrendezésre vált (a style.css töréspontjai), azt nem szabad a
   desktop-pixelekkel felülírni — ezért fut az egész blokk min-width: 1201px-en.
   -------------------------------------------------------------------------- */
@media (min-width: 1201px) {

  /* --- Tipográfia -------------------------------------------------------- */
  /* A terv szekciócíme 50px/41.82px (a Figma „Auto" sormagassága Effrával).
     A 1.05-ös arány 52.5px-et adott: a felirat 5px-cel lejjebb ült a saját
     dobozában, és minden cím alatti rés 11px-cel nagyobb lett. Hat h2 az
     oldalon → 64px halmozott csúszás. */
  .h2 { line-height: 41.82px; }

  /* --- Bevezető ---------------------------------------------------------- */
  /* A terven a bevezető 1057px széles és HÁROM sor (126px). A teljes 1274px-es
     tartalomoszlopban két sorra tört, ami 42px-et vett el az oldal elejéből. */
  .section--intro .lead-xl { max-width: 1058px; }

  /* --- CTA sáv ----------------------------------------------------------- */
  /* Figma: 24px betű, 23.94px sormagasság → a kétsoros felirat 48px, a sáv
     20+48+20 = 88 ≈ 89px. A 30px-es sormagassággal a szöveg 60px lett, a sáv
     100px — 11px-cel magasabb a tervnél. */
  .cta-band__text { line-height: 24px; }

  /* --- Az ORWAK számokban ------------------------------------------------ */
  /* A terven a négy adatdoboz NEM tölti ki az 1058px-es hasábot: a bal oszlop
     x=191, a jobb x=624 (osztásköz 433), a blokk 733px széles. Az 1fr 1fr rács
     a jobb oszlopot 786-ra tolta, 162px-cel a terv mellé. */
  .stats { grid-template-columns: repeat(2, 301px); column-gap: 132px; }

  /* Az ikonok magassága a terven dobozonként más (55 / 43 / 51 / 47), a fix
     55px a két alsó dobozt 4, illetve 8px-cel magasabbra húzta. */
  .stat:nth-child(3) .stat__icon { height: 51px; }
  .stat:nth-child(4) .stat__icon { height: 47px; }

  /* --- Videó sáv --------------------------------------------------------- */
  /* A terven a videó a halvány cím ALÁ lóg: a cím 3687→3789, a kép 3779-en
     kezdődik — 10px átfedés. A 14px-es alsó margó helyett tehát −10px. */
  .video-band__main .ghost-title { margin-bottom: -10px; }

  /* --- Új ORWAK projektek ------------------------------------------------ */
  /* A szürke sáv 4535-ön kezdődik, a cím 4608-on: 73px belső margó (43 helyett).
     A sáv alja 5434 — ebből jön a 86px alsó belső margó. */
  .section--projects { padding-top: 73px; }

  /* A bevezető Figma-doboza FIX 63px magas (327:897), és a szöveg benne
     FÜGGŐLEGESEN KÖZÉPEN áll (a Figma `justify-center`-t ad rá). A 63 nem
     többszöröse a 25px-es sormagasságnak, tehát nem a szöveg magassága, hanem
     a tervező által rajzolt doboz. Ezt a dobozt kell leképezni, nem a
     pillanatnyi sortörést: így a rákövetkező rés akkor is stimmel, ha a szöveg
     két helyett három sorra tördel. Doboz alja 4733, a képsáv teteje 4793 → 60. */
  .projects__lead {
    min-height: 63px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .projects { margin-top: 60px; padding-bottom: 86px; }

  /* --- Legnépszerűbb termékek -------------------------------------------- */
  /* Ugyanaz a fix doboz, mint a projekt-bevezetőnél: 91px (327:1026), a szöveg
     függőlegesen középen. 91 sem többszöröse a 25-nek.

     Ez a blokk volt az oldal EGYETLEN halmozódó geometriai hibája. A Figma
     renderjén a bekezdés NÉGY sor, nálunk Effrával három — de nem a mi
     tördelésünk rossz: ez az egy szövegréteg a tervben `Inter:Light`-ra van
     állítva (a testvér 327:897 helyesen `Effra:Light`), és az Inter szélesebb.
     A réteg TÍPUSSPECIFIKÁCIÓJA 18px / 25px / 0.2px Light — pontosan az, ami
     nálunk is van —, tehát a három sor a helyes Effra-tördelés, a négy sor a
     terv betűhelyettesítési műterméke.
     Ezért NEM a betűméretet igazítjuk, hanem a dobozt képezzük le: 91px magas
     doboz, benne középre zárt szöveg. A doboz alja így 5705, a pillek 5741-en
     állnak → a rés a style.css-beli 36px, ahogy a terv is mondja. A korábbi
     27px-es felülírás a négysoros (Inter/Figtree-kori) rendereléshez készült,
     Effrával 25px-et lopott az oldalból, és onnantól MINDEN szekció feljebb
     csúszott. Ezért kikerült. */
  .bestsellers__lead {
    min-height: 91px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  /* A nyilak alatt a terven nincs további tér: a következő szekció margója
     adja a 75px-et. A 30px-es padding ezt 105-re tolta. */
  .products { padding-bottom: 0; }

  /* --- Blog -------------------------------------------------------------- */
  /* A terven mindhárom bejegyzés címdoboza fix 80px (a tartalom 2 vagy 3 sor),
     így a dátum-cím-kivonat-Tovább sorok kártyánként egy vonalban futnak.
     Ettől lesz a kártya 587px és a fehér panel 727px magas. */
  .post__title { min-height: 80px; }
  .post__excerpt { margin-top: 9px; height: 124px; }
  .post__more { margin-top: 17px; }

  /* --- Kapcsolat --------------------------------------------------------- */
  /* A cím doboza 8171→8271, az első mezőfelirat 8322 — 51px, nem 60. */
  .contact__grid { margin-top: 51px; }
}
