/* ==========================================================================
   re-forma.lt · maketas „Lapas“ · assets/css/pages/index.css
   Savininkas: P1 (Pradžia + 404). Tik išdėstymas (tinklelio pozicijos, sekcijų
   ritmas) su tokenais – komponentų išvaizda yra style.css (F). Naujų spalvų ir
   šriftų nėra; permatomumai – color-mix() iš --rf-page-bg.
   Spec: _brief/dizaino-kryptis.md 7.1, 7.11. Lūžiai: 640 · 760 · 1000 · 1100 · 1280.
   ========================================================================== */

/* ==========================================================================
   CLS (10.7/11) – vietinis apėjimas, prašymas F – _brief/build/F-P1.md
   Naršyklė nupiešia pirmą kadrą PRIEŠ `defer` skriptus, todėl main.js įterpiama
   mock juosta + antraštė (112 px) ir index.js scena stumdė turinį (CLS 0,58–1,0).
   Vietos žymės rezervuoja aukštį, kol jas pakeičia sugeneruotas HTML
   (include <div> pakeičiamas visas; tuščias konteineris – :empty).
   ========================================================================== */
div[data-rf-include="mockbar"]{ display:block; height:var(--rf-mockbar-h); background:var(--rf-ink); }
div[data-rf-include="header"]{ display:block; height:var(--rf-header-h); }
/* Pirmo ekrano H1 nematomas, kol neišskaidytas (C3 laukia fonts.ready iki 1,5 s) – be dvigubo mirktelėjimo */
@media (prefers-reduced-motion:no-preference){
  html.rf-js:not(.rf-rm) :is(#hero-title, #h-404)[data-split]:not(.rf-split-done){ opacity:0; }
}

/* ==========================================================================
   PRADŽIA
   ========================================================================== */

/* ---------- 1 · Hero (5.13 – komponento CSS style.css) ---------- */
.rf-home-hero .rf-hero__aside .rf-lead{ max-width:34rem; }
.rf-home-hero #hero-title{ text-wrap:balance; }                     /* be trumpos vidurinės eilutės 1000–1099 (žodžių skaidymas – po išdėstymo) */
@media (min-width:1000px){
  /* Spaudas užlipa ant scenos −72 px (7.1/1, 5.13): margin skaičiuojamas nuo 10 stulp. pradžios, kuri jau po tarpo
     (style.css −72 px → faktiškai ~43 px). Vietinis apėjimas, prašymas F – _brief/build/F-P1.md */
  .rf-home-hero .rf-zoomslider > .rf-titleblock{ margin-left:calc(-72px - var(--rf-gap)); }
}
@media (min-width:1280px){
  /* „Žemyn“ toje pačioje eilėje kaip „Toliau“ miniatiūra (apačios lygiu) – be tuščios juostos po scena */
  .rf-home-hero .rf-hero__down{ display:flex; width:max-content; margin-top:-44px; align-items:flex-end; padding-bottom:4px; }   /* flex – be eilutės dėžės poslinkio */
}
/* Scenos vieta iki RFX.zoomslider(): matmuo (17 + 14 px) + scena 4:3 + kompaktiškas spaudas (~444 px);
   ≥ 1000 – matmuo + 9 stulp. scena 16:9 (+ „Toliau“ juosta). Procentai – nuo konteinerio pločio. */
.rf-hero__stagewrap:empty::before{ content:""; display:block; padding-top:calc(75% + 31px + 444px); }
@media (min-width:1000px){
  .rf-hero__stagewrap:empty::before{ padding-top:min(calc(42.1875% - .140625 * var(--rf-gap) + 31px + 120px), calc(585px + 151px)); }
}

/* ---------- 2 · Studija (7.1/2): 5 stulp. lipnus tekstas + 7 stulp. koliažas ---------- */
.rf-studio{ padding-top:calc(var(--rf-section-y) * .55); padding-bottom:calc(var(--rf-section-y) * .6); overflow-x:clip; }   /* clip – lankai niekada nesukuria horizontalaus slinkimo (sticky veikia) */
.rf-studio__grid{ row-gap:clamp(48px, 9vw, 72px); align-items:start; }
.rf-studio__text{ display:flex; flex-direction:column; align-items:flex-start; gap:20px; align-self:start; }
.rf-studio__title{
  font-size:var(--rf-fs-quote); line-height:1.16;                   /* ilgas [E] sakinys – ramesnis H2 dydis (26 → 40) */
}
.rf-studio__p{ color:var(--rf-graphite); max-width:var(--rf-w-text); }
.rf-studio__legend{ align-self:stretch; margin-top:8px; }
.rf-studio__text > .rf-link{ margin-top:4px; }
.rf-studio__media{ position:relative; isolation:isolate; }
.rf-studio__media > .rf-cascade{ position:relative; z-index:1; }
.rf-studio__arcs{                                                    /* 3 mosto lankai už koliažo (2.7/1) */
  position:absolute; z-index:0; right:calc(-.5 * var(--rf-gutter)); top:-10%; width:min(62%, 330px); height:auto;   /* < 1000: lieka paraštėje (be horizontalaus slinkimo 640–999) */
}
@media (max-width:999.98px){                                         /* mob.: koliažas 1,1:1 (7.1 „390 px tvarka“); sluoksniai mažiau persidengia – butas (Pav. 2) matomas */
  .rf-studio .rf-cascade__layer--rear{ width:78%; }
  .rf-studio .rf-cascade__layer--front{ width:60%; top:26%; }
  .rf-studio .rf-cascade__layer--mid{ width:62%; }
}
@media (min-width:1000px){
  .rf-studio{ padding-top:calc(var(--rf-section-y) * .3); }
  .rf-studio__text{ grid-column:1 / span 5; padding-right:clamp(0px, 3vw, 48px); padding-top:8px; }
  .rf-studio__text[data-sticky]{ top:calc(var(--rf-header-offset) + 40px); }
  .rf-studio__media{ grid-column:6 / span 7; }
  .rf-studio__arcs{ right:-2%; top:-6%; width:min(52%, 400px); }
  /* Lipnus tekstas turi kur „važiuoti“: koliažas = teksto aukštis + 160 px (index.js rašo --p1-studio-text), 620–820 px */
  .rf-studio .rf-cascade{ height:clamp(620px, calc(var(--p1-studio-text, 460px) + 160px), 820px); }
  .rf-studio .rf-cascade__layer--rear{ width:62%; }
  .rf-studio .rf-cascade__layer--front{ width:52%; top:30%; }
  .rf-studio .rf-cascade__layer--mid{ width:50%; }
}
@media (min-width:1000px) and (max-width:1279.98px){                 /* siauras 5 stulp. tekstas – žemesnis; platesni sluoksniai */
  .rf-studio__text{ padding-right:0; }
  .rf-studio__title{ font-size:min(var(--rf-fs-quote), 3.1vw); }
  .rf-studio .rf-cascade__layer--rear{ width:74%; }
  .rf-studio .rf-cascade__layer--front{ width:64%; top:34%; }
  .rf-studio .rf-cascade__layer--mid{ width:62%; }
}

/* Mosto lankų piešimas: vector-effect:non-scaling-stroke + pathLength="1" Chromium'e nupiešia tik
   ~1/mastelio lanko dalį, kai SVG padidintas > 1× (lankai lieka nebaigti). Vietinis apėjimas
   (prašymas F – _brief/build/F-P1.md): be non-scaling-stroke; linija ~1,1–1,2 px.
   Taikoma ir CTA include'ui šiuose dviejuose puslapiuose. */
.rf-studio__arcs :is(path,circle,line),
.rf-404__arcs :is(path,circle,line),
.rf-cta__arcs :is(path,circle,line){ vector-effect:none; }

/* ---------- 3 · Skaičiai (5.16) ---------- */
.rf-home-stats{ padding-top:calc(var(--rf-section-y) * .5); padding-bottom:calc(var(--rf-section-y) * .8); }

/* ---------- 4 · Rinktiniai (5.14 – komponento CSS style.css) ---------- */
.rf-home-featured{ padding-bottom:calc(var(--rf-section-y) + 24px); }

/* ---------- 5 · Veiklos kryptys (7.1/5): plano juosta + 3 užlipančios kortelės ---------- */
.rf-directions{ position:relative; padding-bottom:calc(var(--rf-section-y) * .75); }
.rf-directions__band{ position:relative; min-height:50vh; display:flex; flex-direction:column; }
.rf-directions__plan{ filter:grayscale(1) contrast(.92); }          /* kliento planas – pilkas faktūros sluoksnis */
.rf-directions__plan img{ mix-blend-mode:multiply; }
.rf-directions__band::before{                                         /* popieriaus šydas po tekstu (skaitomumas ant plano) */
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(to bottom, var(--rf-page-bg) 0%, color-mix(in srgb, var(--rf-page-bg) 82%, transparent) 38%, transparent 78%);
}
@media (min-width:1000px){
  .rf-directions__band::before{
    background:                                                       /* + trumpas viršaus perėjimas – be kieto krašto po smėlio sekcija */
      linear-gradient(to bottom, var(--rf-page-bg) 0%, var(--rf-page-bg) 3%, color-mix(in srgb, var(--rf-page-bg) 72%, transparent) 10%, transparent 22%),
      linear-gradient(to right, var(--rf-page-bg) 0%, color-mix(in srgb, var(--rf-page-bg) 86%, transparent) 34%, transparent 64%);
  }
}
.rf-directions__band::after{                                          /* gradientas į popierių apačioje (7.1/5) */
  content:""; position:absolute; left:0; right:0; bottom:0; height:55%; z-index:1; pointer-events:none;
  background:linear-gradient(to bottom, transparent, var(--rf-page-bg) 92%);
}
.rf-directions__intro{
  position:relative; z-index:2; display:flex; flex-direction:column; gap:18px;
  padding-top:calc(var(--rf-section-y) * .7); padding-bottom:96px;
}
.rf-directions__intro .rf-lead{ color:var(--rf-ink); max-width:36rem; }
.rf-directions__cards{ position:relative; z-index:3; margin-top:-48px; row-gap:24px; }
@media (min-width:760px){
  .rf-directions__cards > *{ grid-column-end:span 8; }
}
@media (max-width:759.98px){ .rf-directions__cards .rf-direction > .rf-frame{ max-width:none; } }   /* 640–759: be tuščio lapo dešinėje */
@media (min-width:760px) and (max-width:999.98px){                   /* planšetė: kortelė per visą plotį – vaizdas kairėje, tekstas dešinėje */
  .rf-directions__cards .rf-direction{
    display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); grid-template-rows:auto auto 1fr;
    column-gap:clamp(24px, 3.2vw, 32px); align-items:start;
  }
  .rf-directions__cards .rf-direction > .rf-frame{ grid-column:1; grid-row:1 / span 3; margin-bottom:0; max-width:none; }
  .rf-directions__cards .rf-direction > :not(.rf-frame){ grid-column:2; }
  .rf-directions__cards .rf-direction__cats{ align-self:start; }
}
@media (min-width:1000px){
  .rf-directions__band{ min-height:min(70vh, 720px); }
  .rf-directions__intro{ padding-bottom:150px; }
  .rf-directions__intro > *{ max-width:calc((100% - 11 * var(--rf-gap)) / 12 * 6 + 5 * var(--rf-gap)); }
  .rf-directions__cards{ margin-top:-100px; row-gap:var(--rf-gap); }
  .rf-directions__cards > .rf-col-4{ grid-column-end:span 4; }
}

/* ---------- 6 · Swedbank juosta (5.22) + miestų tinklelis ---------- */
.rf-home-band{ padding-bottom:var(--rf-section-y); }
.rf-home-band__title{ font-size:clamp(1.75rem, 1.35rem + 1.3vw, 2.5rem); }
.rf-home-band .rf-band__card > p:not([class]){ color:var(--rf-graphite); max-width:var(--rf-w-text); }
.rf-home-band .rf-band__card > .rf-band__cap{ margin-top:var(--rf-tb-pad); }
.rf-home-band__cities{ margin-top:40px; }
.rf-home-band__list{ padding:16px 0 18px; border-top:1px solid var(--rf-line-ui); border-bottom:1px solid var(--rf-line); }
.rf-home-band__more{ margin-top:14px; color:var(--rf-graphite); }
.rf-home-band__ru{ margin-top:6px; color:var(--rf-graphite); }
.rf-home-band__cities > .rf-link{ margin-top:22px; display:inline-block; }
@media (min-width:1000px){
  .rf-home-band__content{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); column-gap:var(--rf-gap); align-items:start; }
  .rf-home-band .rf-band__card{ grid-column:1 / span 5; width:auto; min-width:0; }
  .rf-home-band__cities{ grid-column:7 / span 6; margin-top:0; padding-top:calc(120px + clamp(32px, 3vw, 48px)); }
  /* 6 stulpelių laukas: iki 5 miestų stulpelių, bet ne siauresnių nei ilgiausias vardas („Druskininkai“,
     12 ženklų × 0,6 em) – 1 440 px → 5, 1 280 → 4, 1 024 → 3 (style.css „columns:5“ karpė žodžius) */
  .rf-home-band__list{ columns:7.5em 5; }
}

/* ---------- 7 · Kaip dirbame (5.18 --stack) ---------- */
.rf-home-process .rf-stack__sheet > .rf-frame{ width:100%; }
/* Šūsnies šešėliai nesikaupia: pilną gilų sluoksnį turi tik priekinis lapas; nustumiamo lapo gilus sluoksnis
   blėsta su --rf-recede (JS rašo per slinkimą; box-shadow be transition – 10.7/14), lieka ~d1.
   4 × d3 po paskutiniu lapu buvo tamsi ~120 px juosta (rgb 115,107,96). Vietinis apėjimas, prašymas F – F-P1.md */
@media (min-width:1000px) and (prefers-reduced-motion:no-preference){
  .rf-home-process .rf-stack__sheet{
    box-shadow:
      0 1px 1px rgb(43 35 25 / .05),
      0 16px 32px -20px rgb(43 35 25 / .24),
      0 56px 96px -56px rgb(43 35 25 / calc(.34 * (1 - var(--rf-recede, 0))));
  }
}

/* ---------- 8 · Klientai (5.19–5.20): 5 stulp. tekstas + 7 stulp. juosta, nuoroda apačioje ---------- */
.rf-home-clients{ padding-top:calc(var(--rf-section-y) * .75); padding-bottom:calc(var(--rf-section-y) * .55); }
.rf-home-clients__grid{ row-gap:32px; align-items:start; }
.rf-home-clients__text{ display:flex; flex-direction:column; align-items:flex-start; gap:18px; }
.rf-home-clients__logos{ min-width:0; }
.rf-home-clients__logos .rf-marquee__track{ border-top:1px solid var(--rf-line); border-bottom:1px solid var(--rf-line); }   /* „lentynėlė“ logotipams */
.rf-home-clients__more{ margin:0; }
@media (min-width:1000px){
  .rf-home-clients__grid{ row-gap:28px; }
  .rf-home-clients__text{ grid-column:1 / span 5; grid-row:1; padding-right:clamp(0px, 3vw, 48px); }
  .rf-home-clients__logos{ grid-column:6 / span 7; grid-row:1 / span 2; align-self:center; }
  .rf-home-clients__more{ grid-column:1 / span 5; grid-row:2; }
}

/* ---------- 9 · Žurnalas (5.25): 3 / 2 / 1 stulp. ---------- */
.rf-home-journal{ padding-top:calc(var(--rf-section-y) * .5); }
.rf-home-journal__grid{ display:grid; grid-template-columns:minmax(0,1fr); gap:48px var(--rf-gap); align-items:start; }
@media (min-width:640px){ .rf-home-journal__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (min-width:1000px){ .rf-home-journal__grid{ grid-template-columns:repeat(3, minmax(0,1fr)); } }


/* ==========================================================================
   404 (7.11)
   ========================================================================== */
.rf-404{ min-height:60vh; display:flex; align-items:center; padding-top:clamp(40px, 7vw, 112px); }
.rf-404 > .rf-container{ flex:1 1 auto; }
.rf-404__grid{ row-gap:48px; align-items:center; }
.rf-404__text{ display:flex; flex-direction:column; align-items:flex-start; gap:20px; }
.rf-404__title{ font-size:var(--rf-fs-h1); }
.rf-404__text .rf-lead{ max-width:40rem; }                         /* 1 eilutė ir su atsarginiu šriftu (be CLS keičiant šriftą) */
.rf-404__cta{ margin-top:8px; }
.rf-404__art{                                                       /* 2.7/1 lankai (viewBox 350×360, centras 10;350) + ženklas tame pačiame centre */
  --s:clamp(72px, 22vw, 120px);
  position:relative; aspect-ratio:350 / 360; width:min(78%, 300px); justify-self:start; margin-left:calc(.27 * var(--s));
}
.rf-404__arcs{ position:absolute; inset:0; width:100%; height:100%; }
.rf-404__mark{                                                      /* ženklo lanko centras (8,5; 25 iš 32) = lankų centras */
  position:absolute; width:var(--s); left:calc(2.857% - .2656 * var(--s)); top:calc(97.22% - .78125 * var(--s));
}
.rf-404__mark .rf-mark{ width:100%; height:auto; }
@media (min-width:1000px){
  .rf-404__text{ grid-column:1 / span 7; }
  .rf-404__art{ --s:120px; grid-column:8 / span 5; justify-self:center; width:min(100%, 440px); margin-left:0; }
}
.rf-404-featured__title{ margin-bottom:var(--rf-head-gap); }
.rf-404-featured__grid{ display:grid; grid-template-columns:minmax(0,1fr); gap:48px var(--rf-gap); align-items:start; }
@media (min-width:640px){ .rf-404-featured__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (min-width:1000px){ .rf-404-featured__grid{ grid-template-columns:repeat(3, minmax(0,1fr)); column-gap:clamp(24px, 3vw, 48px); } }
/* 404: dvi smėlio juostos iš eilės (rinktiniai + CTA) – skiriama plaukine linija */
body[data-page="404"] .rf-cta{ border-top:1px solid var(--rf-line); }
