/* ============================================================
   RADONJIĆ MED — MOBILNI SLOJ
   Sopstvena tipografska skala i razmaci, ne smanjeni desktop.
   Referenca 390 px; provereno i na 360 i na 430.
   Učitava se POSLE style.css i pages.css.
   ============================================================ */

@media (max-width: 760px) {

  /* ---------- 1. tipografija za mali ekran ---------- */
  :root{
    --gut: 20px;
    --cut-x: 16px;
    --cut-y: 28px;
  }
  body{ font-size:1.02rem; line-height:1.6; }

  /* naslovi dobijaju svoje veličine i svoje prelome, ne skalirani desktop */
  .hero__h1{ font-size:clamp(3rem, 15.5vw, 4.2rem); line-height:.92; letter-spacing:-.035em; }
  .h2, .ihero__h1, .phero__h1, .mhero__h1, .ghero__h1, .whero__h1,
  .khero__h1, .fhero__h1, .nhero__h1, .e404__h1{
    font-size:clamp(1.85rem, 8.4vw, 2.6rem); line-height:1.06; letter-spacing:-.03em;
  }
  .h3, .hslab__h{ font-size:clamp(1.35rem, 6vw, 1.9rem); line-height:1.12; }
  .lede{ font-size:1.02rem; line-height:1.58; max-width:34ch; }
  .eyebrow{ font-size:.68rem; letter-spacing:.14em; margin-bottom:1rem; }
  p{ overflow-wrap:break-word; }
  /* duge složenice u ru/en ne smeju da probiju kutiju */
  h1, h2, h3, .hslab__h, .next__t, .kway__v{ overflow-wrap:break-word; hyphens:auto; }

  /* ---------- 2. razmaci ---------- */
  section{ scroll-margin-top:calc(var(--nav-h) + 8px); }
  .index, .five, .howto, .mosaic, .figures, .toy, .where, .flora, .work,
  .cost, .why, .builder, .corp, .when, .market, .order-sec, .faq, .story,
  .note, .mship, .mstory, .wfor, .calc, .family, .gteaser, .social{
    padding-top:clamp(2.6rem, 9vw, 3.6rem);
    padding-bottom:clamp(2.6rem, 9vw, 3.6rem);
  }

  /* ---------- 3. sticky buy bar nikad ne pokriva kraj sekcije ---------- */
  body{ padding-bottom:calc(64px + env(safe-area-inset-bottom)); }
  .buybar{
    padding:.6rem var(--gut) calc(.6rem + env(safe-area-inset-bottom));
    gap:.6rem;
  }
  .buybar__name{ font-size:.95rem; }
  .buybar__price{ font-size:.9rem; }
  .buybar .btn{ min-height:44px; }
  .foot{ padding-bottom:calc(3rem + env(safe-area-inset-bottom)); }

  /* ---------- 4. dodirne mete >= 44 px ---------- */
  .burger{ width:44px; height:44px; }
  .lang__i{ min-height:44px; min-width:44px; }
  .nav__brand{ min-height:44px; }
  .btn{ min-height:48px; padding:1em 1.5em; }
  .btn--sm{ min-height:44px; padding:.8em 1.2em; }
  .acc__b{ min-height:52px; padding:1.1rem 0; }
  .idx{ min-height:60px; }
  .foot__col nav a, .navpanel__nav a{ min-height:44px; display:flex; align-items:center; }
  .direct__list li, .ord__list li{ min-height:40px; }
  .tcell{ min-width:44px; }
  .link{ display:inline-block; padding-block:.35em; }

  /* ---------- 5. hero ---------- */
  .hero{ min-height:auto; padding:calc(var(--nav-h) + 1.5rem) 0 2.5rem; }
  .hero__inner{ gap:1.25rem; }
  .hero__fig .hexframe{ width:min(74vw, 300px); }
  .hero__promise{ font-size:1rem; max-width:34ch; }
  .hero__cta{ gap:.9rem; }
  .hero__cta .btn{ width:100%; }

  /* ---------- 6. planina: silueta i mapa ---------- */
  .phero{ min-height:auto; padding-bottom:0; }
  .ridge{ margin-top:-1.5rem; }
  .rmark{ transform:scale(1.9); }
  .ridge__peak text{ font-size:26px; }
  .ridge__line{ stroke-width:4; }
  .mtn{ padding-top:2.5rem; }
  .mtn__sites{ gap:1.2rem 1rem; }
  .mtn__sites li{ padding:.8rem 0 0; }
  .mtn__sites span{ font-size:1.05rem; }
  .map__nm{ font-size:19px; }
  .map__alt{ font-size:14px; }
  .map__lab, .map__dist text, .map__peak text, .map__scale text{ font-size:15px; }
  .map__vil text{ font-size:20px; }

  /* skruber: horizontalno, veliki palac */
  .scrub{ gap:1.5rem; }
  .scrub__range{ height:52px; }
  .scrub__range::-webkit-slider-thumb{ width:44px; height:50px; margin-top:-21px; }
  .scrub__range::-moz-range-thumb{ width:44px; height:50px; }
  .scrub__big{ font-size:clamp(2.6rem,14vw,3.6rem); }
  .scrub__dl > div{ grid-template-columns:6.5rem 1fr; gap:.7rem; }

  /* ---------- 7. horizontalne trake: snap + virenje sledeće + momentum ---------- */
  .coll__viewport, .year__vp{
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x mandatory;
    scroll-padding-left:var(--gut);
    /* poslednja kartica ne sme da se zalepi za ivicu */
    padding-right:calc(var(--gut) + 2.5rem);
  }
  .mon, .cell{
    scroll-snap-align:start;
    /* sledeća kartica viri ~18% da se vidi da ima još */
    width:clamp(230px, 78vw, 300px);
  }
  .year::after{ width:36px; }
  .year__prog{ margin-top:1.1rem; }
  .year__prog i{ height:4px; }

  /* ---------- 8. saće: manje ćelija, veće ćelije ---------- */
  .comb--toy{ margin-inline:auto; }
  .tcell__in{ font-size:.72rem; }
  .toy__grid{ gap:1.8rem; }

  /* ---------- 9. mreže se slažu ---------- */
  .index__grid, .five__grid, .howto__grid, .mstory__grid, .work__grid,
  .why__grid, .corp__grid, .market__grid, .ord__grid, .builder__grid,
  .gwhat__grid, .wfor__grid, .calc__grid, .taste__in, .mship__grid,
  .story__grid, .note__grid, .faq__grid, .gteaser__in, .ghero__grid,
  .whero__grid, .nhero__in{ grid-template-columns:1fr; }
  .five__grid{ grid-template-columns:repeat(2,1fr); gap:.5rem; }
  .fcard a{ min-height:170px; padding:1rem .9rem; }
  .fcard h3{ font-size:1.35rem; }
  .counts{ grid-template-columns:repeat(2,1fr); gap:1.5rem 1rem; }
  .count__v{ font-size:clamp(2.4rem,13vw,3.4rem); }
  .cost__row{ grid-template-columns:repeat(2,1fr); gap:1.4rem; }
  .kways{ grid-template-columns:1fr; }
  .flora__grid{ grid-template-columns:1fr; }
  .folks{ grid-template-columns:repeat(2,1fr); }
  .folk:nth-child(even){ margin-top:0; }
  .band{ grid-template-columns:repeat(2,1fr); }
  .mship__grid{ gap:1.6rem; }

  /* ---------- 10. strana sorte ---------- */
  .mhero{ padding-top:calc(var(--nav-h) + .5rem); }
  .mhero__txt{ padding:1.6rem var(--gut) 2rem; }
  .mhero__idx b{ font-size:2.4rem; }
  .mhero__fig{ padding:0 var(--gut) 2rem; }
  .mhero__frame{ aspect-ratio:4/3; }
  .mhero__chip{ display:none; }
  .mbuy{ max-width:none; }
  .mbuy__foot{ flex-wrap:wrap; gap:.7rem; }
  .mbuy__foot .btn{ flex:1 1 auto; }

  /* ---------- 11. kontakt ---------- */
  .kway a{ padding:1.1rem; }
  .kway__v{ font-size:1.15rem; }
  .order{ padding:1.4rem var(--gut); }
  .field input, .field textarea{ font-size:16px; } /* iOS ne zumira na 16px */
  .wait__form input{ font-size:16px; }
  .calc__ctl select{ font-size:16px; min-height:48px; }

  /* ---------- 12. poklon ---------- */
  .triad{ --jw:min(34vw,124px); }
  .triad__j b{ font-size:.72rem; }
  .triad__j i{ font-size:.55rem; }
  .builder__pick{ grid-template-columns:repeat(2,1fr); }
  .builder__pick button{ min-height:88px; }

  /* ---------- 13. podnožje ---------- */
  .foot__grid{ grid-template-columns:1fr 1fr; gap:1.6rem 1rem; }
  .refrain--outline{ font-size:clamp(2rem,11vw,3rem); }
  .foot__base{ flex-direction:column; align-items:flex-start; gap:.5rem; }

  /* ---------- 14. korpa ---------- */
  .navkorpa svg{ width:23px; height:23px; }
  .qty__b{ width:44px; height:44px; }
  .mbuy__rows li{ grid-template-columns:auto 1fr auto; }
  .kgrid{ grid-template-columns:1fr; }
  /* račun ide ISPOD spiska na telefonu, ne lepi se */
  .ksum{ position:static; }
  /* red korpe: naziv gore preko cele širine, kontrole ispod */
  .kli{ grid-template-columns:auto minmax(0,1fr) auto;
    grid-template-areas:"dot ime x" ". qty cena"; gap:.5rem .7rem; padding:.9rem 1rem; }
  .kli__dot{ grid-area:dot; }
  .kli__t{ grid-area:ime; }
  .kli .qty{ grid-area:qty; justify-self:start; }
  .kli__c{ grid-area:cena; }
  .kli__x{ grid-area:x; width:40px; height:40px; opacity:.55; }
  .korder__l li{ grid-template-columns:auto minmax(0,1fr) auto;
    grid-template-areas:"i ime cena" ". kol kol"; gap:.25rem .7rem; }
  .korder__l i{ grid-area:i; }
  .korder__l span{ grid-area:ime; }
  .korder__c{ grid-area:cena; }
  .korder__q{ grid-area:kol; }
  .ktoast{ bottom:calc(74px + env(safe-area-inset-bottom)); font-size:.7rem; }

  /* ---------- 15. unutar saća: ne pinujemo na telefonu ---------- */
  .inside__pin{ height:auto; padding:3.5rem 0; }
  .inside__comb{ opacity:.35; }
  .refrain--xl{ font-size:clamp(2.4rem,13vw,3.6rem); }
}

/* ---------- vrlo uski telefoni (360) ---------- */
@media (max-width: 380px) {
  :root{ --gut:16px; }
  .hero__h1{ font-size:14.5vw; }
  .five__grid{ grid-template-columns:1fr; }
  .counts{ grid-template-columns:1fr; }
  .cost__row{ grid-template-columns:1fr; }
  .folks{ grid-template-columns:1fr; }
  .builder__pick{ grid-template-columns:1fr; }
  .foot__grid{ grid-template-columns:1fr; }
  .band{ grid-template-columns:1fr; }
}

/* ---------- veći telefoni (430) ---------- */
@media (min-width: 400px) and (max-width: 760px) {
  .hero__fig .hexframe{ width:min(68vw, 320px); }
  .five__grid{ gap:.6rem; }
}

/* ============================================================
   16. MOBILNO: čitljivost i dodir
   Nalazi iz revizije na 360/390/430 — svaka stavka je izmerena,
   ne procenjena.
   ============================================================ */
@media (max-width: 760px) {

  /* --- zaglavlje mora da stane sa korpom u njemu --- */
  .nav{ gap:.5rem; }
  .navkorpa{ min-width:44px; min-height:44px; justify-content:center; padding:0; }
  .burger{ margin-left:0; }

  /* --- dodirne mete --- */
  .foot__a{ display:inline-block; padding-block:.45rem; }
  .link{ padding-block:.55em; }
  .field--check{ min-height:44px; align-items:center; }
  .field--check input{ width:24px; height:24px; flex:none; }
  .korder__h a{ padding:.5rem 0 .5rem .8rem; }
  .kli__x{ width:44px; height:44px; }

  /* --- najmanja slova: mono natpisi ispod 11 px se ne čitaju --- */
  .lang__i{ font-size:.8rem; }
  .eur{ font-size:.74rem; }
  .next__k, .fcard__m, .kway__k, .ksum__t, .ksum__free, .card__l, .card__y,
  .taste__cols dt, .mhero__strip li, .korder__q, .korder__l em, .kli__t i,
  .ord__list li, .mbuy__rows span, .count__k, .tt__row em, .foot__trust li,
  .ksum__fine, .qty__n, .scrub__dl dt{ font-size:.76rem; }
  .triad{ --jw:min(38vw,140px); }
  .triad__j b{ font-size:.74rem; }
  .triad__j i{ font-size:.66rem; }
}

/* na uskim telefonima natpis uz znak nema gde — ostaje samo pčela */
@media (max-width: 560px) {
  .nav__word{ display:none; }
}

/* poslednji sloj: mono mikronatpisi koji su ostali ispod 11,4 px */
@media (max-width: 760px) {
  .tt__axis span{ font-size:.72rem; }
  .triad__j i{ font-size:.72rem; }
  .fband__l li span, .fband__h span{ font-size:.74rem; }
  .builder__pick button span, .builder__pick button .num,
  .builder__sum span{ font-size:.74rem; }
  .ord__card b, .mship__c b,
  .korder__h b, .korder__t span, .korder__d span{ font-size:.75rem; }
  .navkorpa b, .navpanel__n, .tag, .bar__s,
  .cost__c span, .calc__tot span, .calc__per span, .calc__tot .eur,
  .ksum__tot span, .foot__col > b, .hslab__meta li{ font-size:.75rem; }
}

@media (max-width: 760px){ .link{ padding-block:.7em; } }

@media (max-width: 760px){ .loader__since{ font-size:.74rem; letter-spacing:.28em; } }