/* WisDom RM — σελίδα «Φιλοσοφία» (17/10/2026).
   Εκδοτική σελίδα: μεγάλη τυπογραφία, λίγα κουτιά, γραμμές αντί για κάρτες.
   Τέσσερις κινήσεις: όραμα → αλυσίδα → τρεις δεσμεύσεις → ανάσα. */

.fl{position:relative;z-index:1}
.fl-in{max-width:1080px;margin:0 auto}
.fl .gold{color:var(--gold2)}
.fl .lime{color:var(--lime2)}
.fl strong{color:var(--cream);font-weight:500}
.fl strong.gold{color:var(--gold2)}

.fl-eyebrow{
  font-family:var(--font-m);font-size:10px;letter-spacing:3px;color:var(--gold);text-transform:uppercase;
  display:flex;align-items:center;gap:12px;margin-bottom:18px;
}
.fl-eyebrow::before{content:'';width:28px;height:1px;background:var(--gold)}
.fl-lead{font-size:clamp(15px,1.6vw,17.5px);line-height:1.7;color:var(--slate);max-width:62ch}

/* ── 1 · όραμα: η πρόταση της αποστολής είναι ο τίτλος της σελίδας ── */
.fl-hero{
  position:relative;display:flex;align-items:center;min-height:calc(86vh - 64px);
  padding:clamp(56px,10vh,120px) clamp(20px,5vw,40px) clamp(56px,9vh,104px);
  background:
    radial-gradient(110% 60% at 50% 118%,rgba(232,180,85,.20),rgba(201,150,58,.06) 42%,transparent 66%),
    radial-gradient(80% 50% at 85% -10%,rgba(46,78,128,.22),transparent 60%);
  border-bottom:1px solid rgba(201,150,58,.10);
}
.fl-hero .fl-in{width:100%}
.fl-h1{
  font-family:var(--font-d);font-weight:500;color:#fff;letter-spacing:-.3px;line-height:1.08;
  font-size:clamp(34px,5.2vw,66px);max-width:21ch;margin-bottom:28px;text-wrap:balance;
}
.fl-hero .fl-lead{font-size:clamp(15px,1.7vw,18.5px)}

/* ── ενότητες ── */
.fl-sec{padding:clamp(72px,12vh,140px) clamp(20px,5vw,40px)}
.fl-sec + .fl-sec{padding-top:0}
.fl-h2{
  font-family:var(--font-d);font-weight:500;color:#fff;line-height:1.1;
  font-size:clamp(28px,3.9vw,46px);max-width:22ch;margin-bottom:18px;
}

/* ── 2 · η αλυσίδα: τρεις κρίκοι πάνω σε μία γραμμή ── */
.fl-chain{
  list-style:none;position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(20px,3vw,44px);margin:clamp(44px,7vh,72px) 0 0;
}
/* η γραμμή που ενώνει τους κρίκους: χρυσό (άνθρωπος) → λάιμ (τεχνολογία) → χρυσό */
.fl-chain::before{
  content:'';position:absolute;left:6px;right:6px;top:30px;height:1px;
  background:linear-gradient(90deg,rgba(232,180,85,.75),rgba(156,214,90,.7) 50%,rgba(232,180,85,.75));
}
.fl-link{position:relative;padding-top:0}
.fl-role{
  display:block;font-family:var(--font-m);font-size:10.5px;letter-spacing:2.6px;text-transform:uppercase;
  color:var(--gold2);margin-bottom:24px;line-height:14px;
}
/* ο κόμβος πάνω στη γραμμή */
.fl-link::before{
  content:'';position:absolute;left:0;top:25px;width:11px;height:11px;border-radius:50%;
  background:var(--navy);border:1.5px solid var(--gold2);box-shadow:0 0 14px rgba(232,180,85,.35);
}
.fl-link.is-tech .fl-role{color:var(--lime2)}
.fl-link.is-tech::before{border-color:var(--lime2);box-shadow:0 0 14px rgba(156,214,90,.35)}
.fl-what{display:block;padding-top:14px;font-family:var(--font-d);font-size:clamp(22px,2.4vw,29px);line-height:1.2;color:#fff}
.fl-what em{font-style:italic;color:var(--gold2)}
.fl-link.is-tech .fl-what em{color:var(--lime2)}
.fl-close{
  margin-top:clamp(44px,7vh,68px);padding-top:28px;border-top:1px solid rgba(255,255,255,.07);
  font-size:clamp(15px,1.6vw,17px);line-height:1.75;color:var(--slate);max-width:66ch;
}

/* ── 3 · οι τρεις δεσμεύσεις: γραμμές, όχι κάρτες ── */
.fl-vows{margin-top:clamp(28px,5vh,48px)}
.fl-vow{
  display:grid;grid-template-columns:minmax(200px,300px) minmax(0,1fr);gap:clamp(20px,4vw,56px);
  padding:clamp(28px,4.5vh,42px) 0;border-top:1px solid rgba(201,150,58,.16);
}
.fl-vow:last-child{border-bottom:1px solid rgba(201,150,58,.16)}
.fl-vow-k{font-family:var(--font-m);font-size:10.5px;letter-spacing:2px;text-transform:uppercase;color:var(--slate);line-height:1.6}
.fl-vow-n{display:block;font-family:var(--font-d);font-size:44px;font-weight:500;letter-spacing:0;line-height:1;color:var(--gold2);margin-bottom:12px;text-transform:none}
.fl-vow h3{font-family:var(--font-d);font-size:clamp(23px,2.5vw,30px);font-weight:500;line-height:1.2;color:#fff;margin:0 0 12px}
.fl-vow p{font-size:15.5px;line-height:1.75;color:var(--slate);max-width:62ch;margin:0}

/* ── 4 · η ανάσα και η έξοδος ── */
.fl-breath{text-align:center;padding:clamp(80px,16vh,180px) clamp(20px,5vw,40px) clamp(88px,15vh,160px);
  background:radial-gradient(90% 60% at 50% 100%,rgba(232,180,85,.14),transparent 70%)}
.fl-rule{display:block;width:46px;height:1px;margin:0 auto 40px;background:linear-gradient(90deg,transparent,var(--gold2),transparent)}
.fl-breath-line{font-family:var(--font-d);font-weight:500;color:#fff;margin:0;font-size:clamp(38px,7.2vw,92px);line-height:1.04;letter-spacing:-.5px}
.fl-breath-line .accent{background:linear-gradient(120deg,var(--gold3),var(--gold2) 55%,var(--gold));
  -webkit-background-clip:text;background-clip:text;color:transparent}
.fl-breath-sub{margin-top:clamp(20px,4vh,34px);font-family:var(--font-d);font-style:italic;font-size:clamp(16px,1.9vw,21px);color:var(--slate)}
.fl-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:clamp(40px,7vh,64px)}
/* ⚠ flex + gap: το κείμενο κουμπιού ΠΑΝΤΑ σε ένα <span> (βλ. .ent-btn) */
.fl-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;height:50px;padding:0 26px;
  border-radius:var(--r);font-family:var(--font-b);font-size:15px;font-weight:700;letter-spacing:.005em;
  text-decoration:none;white-space:nowrap;transition:transform .2s var(--ease),box-shadow .2s var(--ease),background .2s;
}
.fl-btn svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s var(--ease)}
.fl-btn--gold{color:var(--navy);background:linear-gradient(135deg,var(--gold2),var(--gold));border:1px solid var(--gold2);box-shadow:0 8px 22px rgba(201,150,58,.24)}
.fl-btn--gold:hover{transform:translateY(-1px);background:linear-gradient(135deg,var(--gold3),var(--gold2));box-shadow:0 12px 30px rgba(201,150,58,.36)}
.fl-btn--line{color:var(--gold2);background:rgba(201,150,58,.06);border:1px solid var(--gold)}
.fl-btn--line:hover{transform:translateY(-1px);background:rgba(201,150,58,.14)}
.fl-btn--line:hover svg{transform:translateX(3px)}
.fl-btn:focus-visible{outline:2px solid var(--gold2);outline-offset:3px}

/* ── εμφάνιση κατά την κύλιση (ίδια με την αρχική) ── */
[data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
[data-reveal].in{opacity:1;transform:none}
[data-reveal][data-d="1"]{transition-delay:.08s}
[data-reveal][data-d="2"]{transition-delay:.16s}

/* ── κινητό: η αλυσίδα γίνεται κάθετη, οι δεσμεύσεις στοιβάζονται ── */
@media(max-width:820px){
  .fl-hero{min-height:0}
  .fl-chain{grid-template-columns:1fr;gap:30px;padding-left:30px}
  .fl-chain::before{left:5px;right:auto;top:8px;bottom:8px;width:1px;height:auto;
    background:linear-gradient(180deg,rgba(232,180,85,.75),rgba(156,214,90,.7) 50%,rgba(232,180,85,.75))}
  .fl-link::before{left:-30px;top:2px}
  .fl-role{margin-bottom:6px}
  .fl-what{padding-top:0}
  .fl-vow{grid-template-columns:1fr;gap:14px}
  .fl-vow-k{display:flex;align-items:baseline;gap:14px}
  .fl-vow-n{display:inline;font-size:34px;margin:0}
}
@media(max-width:480px){
  .fl-btn{width:100%}
}
@media (prefers-reduced-motion: reduce){
  [data-reveal]{opacity:1;transform:none;transition:none}
  .fl-btn,.fl-btn svg{transition:none}
}
