/* ============================================================
   home-slider.css — Slider της ΑΡΧΙΚΗΣ (homepage_banner_fdn, kind=2).

   Προέρχεται αυτούσιο από τα slider-demos (fb-1-swipe / fb-1-swipe-full).
   ΟΛΟΙ οι κανόνες είναι scoped κάτω από .hp-slider ώστε τα global resets
   (*, html, body) και οι γενικές κλάσεις (.btn, .eyebrow …) να ΜΗΝ
   «διαρρέουν» στο υπόλοιπο site (π.χ. το footer έχει επίσης .btn).

   Variants:
     .hp-slider--split  -> Κείμενο + Slider   (slider_kind = 1)
     .hp-slider--full   -> μόνο Slider         (slider_kind = 2)

   Σημ.: το full demo ήταν position:fixed;inset:0 (standalone fullscreen).
   Εδώ μπαίνει σαν κανονικό section (height:100vh) για να συνυπάρχει με
   τα υπόλοιπα banners της σελίδας.
   ============================================================ */
.hp-slider{
  --ink:#242833;--ink-soft:#3C5754;--teal:#12B5AC;--teal-deep:#0B807A;
  --paper:#F5F8F7;--white:#fff;--coral:#FF6A4D;--line:rgba(14,43,40,.12);
  font-family:'TT Norms Pro',system-ui,sans-serif;color:var(--ink);
  -webkit-font-smoothing:antialiased;
}
.hp-slider *{margin:0;padding:0;box-sizing:border-box}

/* ---- SPLIT: μισό κείμενο / μισό slider ---- */
.hp-slider--split{display:grid;grid-template-columns:1.02fr 1fr;min-height:100vh;min-height:100svh;background:#fff}
.hp-slider--split .hp-sl-text{position:relative;display:flex;flex-direction:column;justify-content:center;padding:clamp(40px,6vw,96px);z-index:2}
.hp-slider .eyebrow{display:inline-flex;align-items:center;gap:10px;width:max-content;background:var(--white);border:none;border-radius:999px;margin-left:-2px;padding:9px 16px 9px 0;font-weight:600;font-size:12.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-soft);opacity:0;transform:translateY(14px);animation:hpSlUp .7s ease .1s forwards}
.hp-slider .eyebrow .dot{width:8px;height:8px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 4px rgba(255,106,77,.18)}
.hp-slider .hp-sl-text h1{font-weight:800;font-size:clamp(42px,5.4vw,84px);line-height:.98;letter-spacing:-.03em;margin:22px 0 0}
.hp-slider .hp-sl-text h1 .ln{display:block;overflow:hidden;padding-bottom:.04em}
.hp-slider .hp-sl-text h1 .ln i{display:block;font-style:normal;transform:translateY(112%);animation:hpSlRise .95s cubic-bezier(.22,1,.36,1) forwards}
.hp-slider .hp-sl-text h1 .ln:nth-child(1) i{animation-delay:.18s}
.hp-slider .hp-sl-text h1 .ln:nth-child(2) i{animation-delay:.30s}
.hp-slider .hp-sl-text h1 .ln:nth-child(3) i{animation-delay:.42s}
.hp-slider .hp-sl-text h1 .ln:nth-child(4) i{animation-delay:.54s}
.hp-slider .hp-sl-text h1 .ln:nth-child(5) i{animation-delay:.66s}
.hp-slider .hp-sl-text h1 .ln:nth-child(6) i{animation-delay:.78s}
/* kind=2 -> πράσινα (teal gradient)· kind=1 -> κανονικά (ink) */
.hp-slider .hp-sl-text h1 .ln-teal i{background:linear-gradient(100deg,var(--teal),var(--teal-deep));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hp-slider .sub{max-width:520px;margin:26px 0 0;font-size:clamp(15px,1.3vw,18px);line-height:1.6;color:var(--ink-soft);opacity:0;transform:translateY(16px);animation:hpSlUp .8s ease .6s forwards}
.hp-slider .cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px;opacity:0;transform:translateY(16px);animation:hpSlUp .8s ease .75s forwards}
.hp-slider .btn{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:15px;padding:16px 28px;border-radius:999px;text-decoration:none;cursor:pointer;transition:transform .25s,box-shadow .25s,background .25s,color .25s,border-color .25s;border:1.5px solid transparent}
.hp-slider .btn .arr{transition:transform .25s}
.hp-slider .btn-primary{background:var(--teal-deep);color:#fff;box-shadow:0 14px 30px -14px rgba(18,181,172,.8)}  /* teal-deep: WCAG AA (λευκό/teal = 2.55, ανεπαρκές) */
.hp-slider .btn-primary:hover{background:#075E59;transform:translateY(-3px)}
.hp-slider .btn-primary:hover .arr{transform:translateX(5px)}
.hp-slider .btn-ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.hp-slider .btn-ghost:hover{border-color:var(--teal);color:var(--teal-deep);background:var(--white);transform:translateY(-3px)}
@keyframes hpSlUp{to{opacity:1;transform:none}}
@keyframes hpSlRise{to{transform:translateY(0)}}

/* ---- STAGE (κοινό για split & full) ---- */
.hp-slider .hp-sl-stage{position:relative;overflow:hidden;background:#08201d}
.hp-slider--full{display:block;background:#08201d}
.hp-slider--full .hp-sl-stage{height:100vh;height:100svh}
/* LCP poster: server-rendered hero του 1ου slide, κάτω από τον track (τον σκεπάζει το slide 0) */
.hp-slider .hp-hero-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0}
.hp-slider .fb-track{position:relative;z-index:1;display:flex;height:100%;will-change:transform;transition:transform .6s cubic-bezier(.22,1,.36,1);cursor:grab}
.hp-slider .fb-track.drag{transition:none;cursor:grabbing}
.hp-slider .fb-slide{flex:0 0 100%;height:100%;position:relative;overflow:hidden;color:#fff}
.hp-slider .fb-slide .bg{position:absolute;inset:0;transform:scale(1.06);transition:transform 7s linear;background-size:cover;background-position:center;background-repeat:no-repeat}
.hp-slider .fb-slide video.bg{width:100%;height:100%;object-fit:cover;display:block}
.hp-slider .fb-slide.on .bg{transform:scale(1.16)}
.hp-slider .fb-slide .fb-link{position:absolute;inset:0;z-index:2}   /* πάνω από media/veil, κάτω από dots/badge (z-index:3) */
.hp-slider .fb-slide .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,32,29,0) 40%,rgba(8,32,29,.7))}
.hp-slider .fb-slide .mono{position:absolute;top:38px;left:clamp(30px,4vw,56px);font-weight:800;font-size:clamp(90px,11vw,150px);line-height:1;letter-spacing:-.05em;color:rgba(255,255,255,.15)}
.hp-slider .fb-cap{position:absolute;left:clamp(30px,4vw,56px);right:clamp(30px,4vw,56px);bottom:96px}
.hp-slider .fb-cap .tag{display:inline-block;font-weight:600;font-size:12px;letter-spacing:.1em;text-transform:uppercase;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.24);backdrop-filter:blur(6px);padding:6px 13px;border-radius:999px;margin-bottom:14px}
.hp-slider .fb-cap .fb-cap-h{font-weight:800;font-size:clamp(28px,3.4vw,46px);letter-spacing:-.02em}
.hp-slider .fb-badge{position:absolute;top:34px;right:34px;background:rgba(255,255,255,.92);color:var(--ink);border-radius:14px;padding:12px 16px;text-align:right;backdrop-filter:blur(8px);z-index:3}
.hp-slider .fb-badge b{display:block;font-weight:800;font-size:20px;letter-spacing:-.02em}
.hp-slider .fb-badge span{font-size:11px;color:var(--ink-soft)}
.hp-slider .fb-dots{position:absolute;left:clamp(30px,4vw,56px);bottom:36px;display:flex;gap:2px;z-index:3}
/* target ≥24×24 (WCAG) — το ορατό dot μένει μικρό μέσω ::before */
.hp-slider .fb-dots button{width:24px;height:24px;display:grid;place-items:center;border:none;background:transparent;cursor:pointer;padding:0}
.hp-slider .fb-dots button::before{content:"";width:9px;height:9px;border-radius:999px;background:rgba(255,255,255,.45);transition:.3s}
.hp-slider .fb-dots button.on::before{width:28px;background:#fff;border-radius:6px}
.hp-slider .ap-prog{position:absolute;left:0;right:0;bottom:0;height:5px;background:rgba(255,255,255,.28);z-index:6}
.hp-slider .ap-prog i{display:block;height:100%;width:0;background:var(--teal)}

/* full-bleed: μεγαλύτερα μεγέθη (όπως στο fb-1-swipe-full) */
.hp-slider--full .fb-slide .mono{top:clamp(30px,5vw,60px);left:clamp(30px,5vw,72px);font-size:clamp(90px,13vw,200px)}
.hp-slider--full .fb-cap{left:clamp(30px,5vw,72px);right:clamp(30px,5vw,72px);bottom:clamp(96px,12vh,140px)}
.hp-slider--full .fb-cap .fb-cap-h{font-size:clamp(30px,5vw,72px)}
.hp-slider--full .fb-badge{top:clamp(24px,3vw,40px);right:clamp(24px,3vw,40px)}
.hp-slider--full .fb-dots{left:clamp(30px,5vw,72px)}

/* responsive (split): slider πάνω, κείμενο κάτω — breakpoint 991 (βασικό του site) */
@media (max-width:991px){
  .hp-slider--split{grid-template-columns:1fr}
  .hp-slider--split .hp-sl-text{padding:96px 24px 40px;text-align:center;align-items:center}
  .hp-slider--split .eyebrow,.hp-slider--split .cta{justify-content:center}
  .hp-slider--split .hp-sl-stage{height:66vh;order:-1}
}