/* ============================================================
   ΕΚΘΕΡΜ — CODENAME: ΑΞΟΝΑΣ
   Σύστημα: 12-col grid · κλίμακα 4px · τυπογραφική κλίμακα 1.25
   Άξονες: col-line 1 · col-line 8 · col-line 13 (split 7/5)
   ============================================================ */

/* --- 1. TOKENS ------------------------------------------- */
:root{
  /* palette */
  --black:#0B0C0E;
  --ink:#16181C;
  --body:#4A5058;
  --muted:#6A7280;
  --line:#E4E7EC;
  --white:#FFFFFF;
  --paper:#F7F8FA;
  --blue:#1B4FD8;
  --blue-d:#1540B4;
  --blue-l:#5B8CFF;
  --on-black-2:rgba(255,255,255,.72);
  --on-black-line:rgba(255,255,255,.16);

  /* spacing — 4px scale, ΜΟΝΟ αυτά */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px;
  --s6:32px; --s7:48px; --s8:64px; --s9:96px; --s10:128px;

  /* type — ratio 1.25 */
  --t-xs:.8rem; --t-sm:.875rem; --t-base:1rem; --t-lg:1.25rem;
  --t-xl:1.563rem; --t-2xl:1.953rem; --t-3xl:2.441rem; --t-4xl:3.052rem;

  /* grid */
  --wrap:1280px;
  --gut:var(--s5);
  --pad:var(--s6);

  /* rhythm */
  --sec-y:var(--s10);
  --hdr-h:72px;

  --tap:44px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* --- 2. RESET & BASE ------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body,h1,h2,h3,h4,p,ul,ol,li,figure,dl,dd,fieldset,legend{margin:0;padding:0}
ul,ol{list-style:none}
img,svg{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
body{
  font-family:"Commissioner","Manrope",system-ui,sans-serif;
  font-size:var(--t-base);
  line-height:1.7;
  color:var(--body);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3,h4,.mono,.num,button,.btn,nav a,.lbl,.logo{
  font-family:"Manrope","Commissioner",system-ui,sans-serif;
}
h1,h2,h3,h4{color:var(--ink);text-wrap:balance}
p{max-width:68ch}
a{color:inherit;text-decoration:none}
strong{font-weight:600;color:var(--ink)}
::selection{background:var(--blue);color:var(--white)}

:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:4px}
.on-black :focus-visible{outline-color:var(--blue-l)}

.skip{
  position:absolute;left:var(--s4);top:calc(var(--s4) * -6);z-index:1200;
  background:var(--black);color:var(--white);padding:var(--s3) var(--s4);
  border-radius:4px;font:700 var(--t-sm)/1.5 "Manrope",sans-serif;
  transition:top .16s var(--ease);
}
.skip:focus{top:var(--s4)}

.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* --- 3. TYPE SCALE --------------------------------------- */
h1{font-size:var(--t-4xl);font-weight:800;letter-spacing:-.035em;line-height:1.06;max-width:17ch}
h2{font-size:var(--t-3xl);font-weight:800;letter-spacing:-.03em;line-height:1.12;max-width:20ch}
h3{font-size:var(--t-lg);font-weight:700;letter-spacing:-.01em;line-height:1.2}
h4{font-size:var(--t-base);font-weight:700;letter-spacing:-.005em;line-height:1.5}

.lbl{
  display:block;font-size:var(--t-xs);font-weight:700;line-height:1.5;
  text-transform:uppercase;letter-spacing:.12em;color:var(--blue);
}
.on-black .lbl{color:var(--blue-l)}

.deck{font-size:var(--t-lg);line-height:1.5;color:var(--body);max-width:44ch}
.lead{font-size:var(--t-base);line-height:1.7;color:var(--body)}
.small{font-size:var(--t-sm);line-height:1.6;color:var(--muted)}
.xs{font-size:var(--t-xs);line-height:1.6;color:var(--muted)}

.num,.price,.tnum{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}

/* Η ΤΙΜΗ — σταθερό μοτίβο παντού */
.price{font-family:"Manrope",sans-serif;font-weight:800;color:var(--ink);letter-spacing:-.02em;white-space:nowrap}
.price--t{white-space:normal;text-wrap:balance}
.price .from{
  display:inline-block;font-size:var(--t-xs);font-weight:700;line-height:1.5;
  text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-inline-end:var(--s2);
  vertical-align:baseline;
}
.price .unit{font-size:var(--t-sm);font-weight:700;color:var(--muted);margin-inline-start:var(--s1)}
.on-black .price{color:var(--white)}
.on-black .price .from,.on-black .price .unit{color:var(--on-black-2)}

/* --- 4. GRID SYSTEM -------------------------------------- */
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--pad)}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gut)}

/* Οι άξονες: 1 / 8 / 13 */
.c1-7{grid-column:1 / 8}
.c8-12{grid-column:8 / 13}
.c1-6{grid-column:1 / 7}
.c1-5{grid-column:1 / 6}
.c1-12{grid-column:1 / 13}
.c1-8{grid-column:1 / 9}
.c9-12{grid-column:9 / 13}
.c1-4{grid-column:span 3}

section{position:relative}
.sec{padding-block:var(--sec-y)}
.sec--paper{background:var(--paper)}
.sec--black{background:var(--black);color:var(--on-black-2)}
.sec--black h1,.sec--black h2,.sec--black h3,.sec--black h4{color:var(--white)}

/* Ανατομία section: label → τίτλος (αριστερά, άξονας 1) · deck (άξονας 8) */
.sec-head{margin-block-end:var(--s8)}
/* sec_head που μπαίνει απευθείας στο section (χωρίς .wrap) παίρνει το ίδιο πλάτος/gutter */
.sec>.sec-head{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--pad)}
.sec-head .lbl{margin-block-end:var(--s5)}
.sec-head .deck{margin-block-start:var(--s5)}
.sec-head--tight{margin-block-end:var(--s7)}

.rule{border:0;border-top:1px solid var(--line);margin:0}
.on-black .rule,.sec--black .rule{border-top-color:var(--on-black-line)}

/* --- 5. BUTTONS ------------------------------------------ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);
  min-height:48px;padding:var(--s3) var(--s5);border-radius:4px;border:1px solid transparent;
  font-size:var(--t-sm);font-weight:700;letter-spacing:-.005em;line-height:1.5;
  cursor:pointer;background:none;text-align:center;
  transition:background-color .16s var(--ease),border-color .16s var(--ease),color .16s var(--ease);
}
.btn--blue{background:var(--blue);color:var(--white);border-color:var(--blue)}
.btn--blue:hover{background:var(--blue-d);border-color:var(--blue-d)}
.btn--out{border-color:var(--ink);color:var(--ink)}
.btn--out:hover{background:var(--ink);color:var(--white)}
.on-black .btn--out{border-color:var(--on-black-line);color:var(--white)}
.on-black .btn--out:hover{background:var(--white);color:var(--black)}
.btn--ghost{color:var(--blue);padding-inline:0;min-height:44px}
.btn--ghost:hover{color:var(--blue-d)}
.btn--block{display:flex;width:100%}
.btn--sm{min-height:44px;padding:var(--s2) var(--s4)}

.lnk{
  display:inline-flex;align-items:center;gap:var(--s2);min-height:44px;
  font-family:"Manrope",sans-serif;font-size:var(--t-sm);font-weight:700;color:var(--blue);
  transition:color .16s var(--ease);
}
.lnk:hover{color:var(--blue-d)}
.on-black .lnk{color:var(--blue-l)}
.on-black .lnk:hover{color:var(--white)}
.lnk .ic{width:16px;height:16px}

/* --- 6. ICONS -------------------------------------------- */
.ic{
  width:24px;height:24px;flex:none;
  fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;
  color:var(--blue);
}
.on-black .ic,.sec--black .ic{color:var(--blue-l)}

/* --- 7. PANELS (μόνο 4 περιπτώσεις) ---------------------- */
.panel{background:var(--white);border:1px solid var(--line);border-radius:6px;padding:var(--s6)}
.panel--blue{border-color:var(--blue)}
.panel--black{background:var(--black);border-color:var(--black);color:var(--on-black-2)}
.pk .panel{display:flex;flex-direction:column}
.pk .panel .btn{margin-block-start:auto}
.pk-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s4)}
.badge{
  display:inline-block;padding:var(--s1) var(--s2);border-radius:4px;
  background:var(--blue);color:var(--white);
  font:700 var(--t-xs)/1.5 "Manrope",sans-serif;text-transform:uppercase;letter-spacing:.12em;
}

/* --- 8. ROW ARCHETYPE A: λίστα με τιμή δεξιά ------------- */
.rows{border-top:1px solid var(--line)}
.on-black .rows,.sec--black .rows{border-top-color:var(--on-black-line)}
.row{
  display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gut);
  padding-block:var(--s5);border-bottom:1px solid var(--line);align-items:start;
}
.sec--black .row{border-bottom-color:var(--on-black-line)}
.row__main{grid-column:1 / 9;display:grid;grid-template-columns:24px 1fr;gap:var(--s4);align-items:start}
.row__val{grid-column:9 / 13;text-align:end;padding-block-start:var(--s1)}
.row__name{font-size:var(--t-lg);font-weight:700;line-height:1.2;letter-spacing:-.01em;color:var(--ink)}
.row__desc{margin-block-start:var(--s3);font-size:var(--t-sm);line-height:1.6;color:var(--body);max-width:60ch}
.row__val .price{font-size:var(--t-lg)}

.items--2{display:grid;grid-template-columns:1fr}
/* --- 9. ROW ARCHETYPE B: marker + περιεχόμενο ------------ */
.items{border-top:1px solid var(--line)}
.item{
  display:grid;grid-template-columns:24px 1fr;gap:var(--s4);
  padding-block:var(--s5);border-bottom:1px solid var(--line);align-items:start;
}
.item__mark{
  font-family:"Manrope",sans-serif;font-size:var(--t-xs);font-weight:700;line-height:1.5;
  letter-spacing:.12em;color:var(--blue);font-variant-numeric:tabular-nums;
  padding-block-start:var(--s1);
}
.item__t{font-size:var(--t-base);font-weight:700;line-height:1.5;color:var(--ink)}
.item__d{margin-block-start:var(--s2);font-size:var(--t-sm);line-height:1.6;color:var(--body)}
.sec--black .items,.sec--black .item{border-color:var(--on-black-line)}
.sec--black .item__t{color:var(--white)}
.sec--black .item__d{color:var(--on-black-2)}

/* --- 10. HEADER ------------------------------------------ */
.hdr{
  position:sticky;top:0;z-index:900;background:var(--white);
  border-bottom:1px solid transparent;
  transition:border-color .16s var(--ease),box-shadow .16s var(--ease);
}
.hdr.is-stuck{border-bottom-color:var(--line)}
.hdr__in{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:var(--s5);
  min-height:var(--hdr-h);transition:min-height .16s var(--ease);
}
.hdr.is-stuck .hdr__in{min-height:64px}
.logo{display:inline-flex;flex-direction:column;justify-content:center;gap:var(--s1);min-height:44px}
.logo__w{font-size:var(--t-lg);font-weight:800;letter-spacing:.02em;color:var(--ink);line-height:1.1}
.logo__s{font-size:var(--t-xs);font-weight:500;letter-spacing:.02em;color:var(--muted);line-height:1.2;white-space:nowrap;font-family:"Commissioner",sans-serif}
.nav{display:flex;align-items:center;justify-content:center;gap:var(--s4);min-width:0}
.nav a{white-space:nowrap}
.nav a{
  display:inline-flex;align-items:center;min-height:44px;
  font-size:var(--t-sm);font-weight:700;color:var(--ink);letter-spacing:-.005em;
  transition:color .16s var(--ease);
}
.nav a:hover{color:var(--blue)}
.hdr__act{display:flex;align-items:center;gap:var(--s4)}
.hdr__act .btn{white-space:nowrap;padding-inline:var(--s4)}
.tel{
  display:inline-flex;align-items:center;gap:var(--s2);
  height:var(--tap);line-height:var(--tap);
  font-family:"Manrope",sans-serif;font-size:var(--t-sm);font-weight:700;color:var(--ink);
  white-space:nowrap;font-variant-numeric:tabular-nums;transition:color .16s var(--ease);
}
.tel span{line-height:var(--tap)}
.tel:hover{color:var(--blue)}
.tel .ic{width:18px;height:18px}
.menu-toggle{display:none}

/* --- 11. DRAWER (mobile) --------------------------------- */
.bd{
  position:fixed;inset:0;z-index:999;background:rgba(11,12,14,.5);
  backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);
  opacity:0;visibility:hidden;transition:opacity .2s var(--ease),visibility .2s var(--ease);
}
body.nav-open .bd{opacity:1;visibility:visible}
#mobile-nav{
  position:fixed;inset-block:0;inset-inline-start:0;z-index:1000;
  width:clamp(260px,62vw,340px);background:var(--white);
  border-inline-end:1px solid var(--line);
  transform:translateX(-101%);visibility:hidden;
  transition:transform .26s var(--ease),visibility .26s var(--ease);
  display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;
  padding:var(--s5) var(--s5) calc(var(--s7) + env(safe-area-inset-bottom));
  padding-inline-start:calc(var(--s5) + env(safe-area-inset-left));
}
body.nav-open #mobile-nav{transform:translateX(0);visibility:visible}
#mobile-nav .mn-top{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);margin-block-end:var(--s5)}
#mobile-nav .mn-close{
  display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;
  margin-inline-end:calc(var(--s3) * -1);border:0;background:none;cursor:pointer;color:var(--ink);border-radius:4px;
}
#mobile-nav a.mn-l{
  display:flex;align-items:center;min-height:48px;
  border-bottom:1px solid var(--line);
  font-family:"Manrope",sans-serif;font-size:var(--t-base);font-weight:700;color:var(--ink);
}
#mobile-nav a.mn-l:first-of-type{border-top:1px solid var(--line)}
#mobile-nav .mn-act{margin-block-start:var(--s5);display:grid;gap:var(--s3)}

/* --- 12. HERO -------------------------------------------- */
.hero{padding-block:var(--s9) var(--s8)}
.hero h1{margin-block:var(--s5) var(--s5)}
.hero__sub{max-width:52ch;margin-block-end:var(--s6)}
.hero__cta{display:flex;flex-wrap:wrap;gap:var(--s3)}

.pp{border:1px solid var(--line);border-radius:6px;background:var(--white);position:relative}
.pp__top{padding:var(--s5) var(--s5) var(--s5)}
.pp__val{display:flex;align-items:baseline;gap:var(--s2);margin-block:var(--s4) var(--s2)}
.pp__n{font-family:"Manrope",sans-serif;font-size:var(--t-4xl);font-weight:800;line-height:1;letter-spacing:-.035em;color:var(--blue);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
.pp__u{font-size:var(--t-sm);font-weight:700;color:var(--muted);font-family:"Manrope",sans-serif}
.pp__upd{display:flex;align-items:center;gap:var(--s2)}
.pp__upd .ic{width:16px;height:16px;color:var(--muted)}
.pp__calc{padding:var(--s5)}
.pp__f{display:grid;grid-template-columns:1fr auto;gap:var(--s3);align-items:end}
.pp__sum{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s4);padding-block:var(--s4) var(--s5)}
.pp__sum .price{font-size:var(--t-xl)}

.trust{margin-block-start:var(--s8)}
.trust-grid{padding-block-start:var(--s6)}
.trust__i{display:grid;grid-template-columns:24px 1fr;gap:var(--s3);align-items:start}
.trust__t{font-family:"Manrope",sans-serif;font-size:var(--t-sm);font-weight:700;line-height:1.5;color:var(--ink)}
.trust__d{font-size:var(--t-xs);line-height:1.6;color:var(--muted);margin-block-start:var(--s1)}

/* --- 13. ΜΑΥΡΗ ΖΩΝΗ — 14 ΥΠΗΡΕΣΙΕΣ ---------------------- */
.idx{columns:3;column-gap:var(--gut);border-top:1px solid var(--on-black-line)}
.idx li{break-inside:avoid}
.idx a{
  display:grid;grid-template-columns:auto 1fr;gap:var(--s3);align-items:baseline;
  min-height:48px;padding-block:var(--s3);border-bottom:1px solid var(--on-black-line);
  font-family:"Manrope",sans-serif;font-size:var(--t-sm);font-weight:700;line-height:1.4;
  color:var(--on-black-2);transition:color .16s var(--ease);
}
.idx a:hover{color:var(--white)}
.idx b{font-size:var(--t-xs);font-weight:700;letter-spacing:.12em;color:var(--blue-l);font-variant-numeric:tabular-nums}
.yrs{display:flex;align-items:baseline;gap:var(--s4);margin-block:var(--s5);max-width:none;font-size:var(--t-lg);letter-spacing:0}
.yrs__t{font-family:"Manrope",sans-serif;font-size:var(--t-lg);font-weight:700;letter-spacing:-.01em;color:var(--ink)}
.stmt{font-size:var(--t-2xl);font-weight:800;line-height:1.2;letter-spacing:-.03em;color:var(--white);max-width:18ch}
.stmt .dot{color:var(--blue-l)}

/* --- 14. ΟΜΑΔΕΣ ΥΠΗΡΕΣΙΩΝ (details) ---------------------- */
.grp{border-top:1px solid var(--line)}
.grp+.grp{margin-block-start:var(--s8)}
.grp>summary{
  display:flex;align-items:center;justify-content:space-between;gap:var(--s4);
  list-style:none;min-height:48px;padding-block:var(--s4);cursor:pointer;
}
.grp>summary::-webkit-details-marker{display:none}
.grp__t{font-family:"Manrope",sans-serif;font-size:var(--t-base);font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink)}
.grp__c{font-family:"Manrope",sans-serif;font-size:var(--t-xs);font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums;letter-spacing:.12em}
.grp-pm{display:none}

/* --- 15. ΦΟΡΜΑ ------------------------------------------- */
.form__tot{
  display:flex;align-items:baseline;justify-content:space-between;gap:var(--s4);
  padding-block-end:var(--s5);border-bottom:1px solid var(--line);margin-block-end:var(--s5);
}
.form__tot .price{font-size:var(--t-2xl);color:var(--blue)}
.fgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s4)}
.f{display:flex;flex-direction:column;gap:var(--s2)}
.f--full{grid-column:1 / -1}
.f label{font-family:"Manrope",sans-serif;font-size:var(--t-xs);font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);line-height:1.5}
.f label .req{color:var(--blue)}
.f input,.f select,.f textarea{
  width:100%;min-height:48px;padding:var(--s3) var(--s4);
  font-family:"Commissioner",sans-serif;font-size:16px;line-height:1.5;color:var(--ink);
  background:var(--white);border:1px solid var(--line);border-radius:4px;
  transition:border-color .16s var(--ease);
}
.f textarea{min-height:96px;resize:vertical}
.f select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236A7280' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--s4) center;padding-inline-end:var(--s8)}
.f input:hover,.f select:hover,.f textarea:hover{border-color:var(--muted)}
.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--blue)}
.f [aria-invalid="true"]{border-color:var(--blue-d)}
.err{display:none;font-size:var(--t-xs);line-height:1.5;color:var(--blue-d);font-weight:500}
.f.is-bad .err{display:block}
.more>summary{
  display:flex;align-items:center;gap:var(--s2);list-style:none;min-height:44px;cursor:pointer;
  font-family:"Manrope",sans-serif;font-size:var(--t-sm);font-weight:700;color:var(--blue);
}
.more>summary::-webkit-details-marker{display:none}
.more[open]>summary .ic{transform:rotate(45deg)}
.more>summary .ic{width:16px;height:16px;transition:transform .16s var(--ease)}
.ok{display:none;gap:var(--s3);padding:var(--s4);border:1px solid var(--blue);border-radius:4px;background:var(--white);font-size:var(--t-sm);line-height:1.6;color:var(--ink)}
.ok.is-on{display:grid;grid-template-columns:24px 1fr;align-items:start}

/* --- 16. CHIPS ------------------------------------------- */
.chips{display:flex;flex-wrap:wrap;gap:var(--s2)}
.chip{
  display:inline-flex;align-items:center;min-height:44px;padding:var(--s2) var(--s4);
  border:1px solid var(--on-black-line);border-radius:4px;
  font-family:"Manrope",sans-serif;font-size:var(--t-sm);font-weight:700;color:var(--white);
}

/* --- 17. ΠΙΝΑΚΑΣ ΤΙΜΩΝ ----------------------------------- */
.tbl{width:100%;border-collapse:collapse;text-align:start}
.tbl caption{text-align:start;font-size:var(--t-xs);font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--blue);font-family:"Manrope",sans-serif;padding-block-end:var(--s4)}
.tbl th{
  font-family:"Manrope",sans-serif;font-size:var(--t-xs);font-weight:700;text-transform:uppercase;
  letter-spacing:.12em;color:var(--muted);line-height:1.5;padding-block:var(--s3);
  border-bottom:1px solid var(--line);text-align:start;
}
.tbl th:last-child{text-align:end}
.tbl td{padding-block:var(--s4);border-bottom:1px solid var(--line);font-size:var(--t-sm);line-height:1.5;color:var(--ink);vertical-align:baseline}
.tbl td:last-child{text-align:end;white-space:nowrap}
.tbl td .price{font-size:var(--t-base)}

/* --- 18. ΒΗΜΑΤΑ ------------------------------------------ */
.step{border-top:1px solid var(--line);padding-block-start:var(--s4)}
.step__n{font-family:"Manrope",sans-serif;font-size:var(--t-3xl);font-weight:800;line-height:1;letter-spacing:-.03em;color:var(--blue);font-variant-numeric:tabular-nums;display:block;margin-block-end:var(--s4)}
.step__t{font-family:"Manrope",sans-serif;font-size:var(--t-base);font-weight:700;line-height:1.5;color:var(--ink)}
.step__d{margin-block-start:var(--s2);font-size:var(--t-sm);line-height:1.6;color:var(--body)}

/* --- 19. ΕΠΙΚΟΙΝΩΝΙΑ ------------------------------------- */
.cts{border-top:1px solid var(--line)}
.ct{display:grid;grid-template-columns:24px 1fr;gap:var(--s4);padding-block:var(--s4);border-bottom:1px solid var(--line);align-items:start}
.ct__l{font-family:"Manrope",sans-serif;font-size:var(--t-xs);font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);line-height:1.5}
.ct__v{font-size:var(--t-base);line-height:1.5;color:var(--ink);margin-block-start:var(--s1);word-break:break-word}
a.ct__v{display:inline-flex;align-items:center;min-height:var(--tap)}
a.ct__v:hover{color:var(--blue)}
.ct__v a{display:inline-flex;align-items:center;min-height:var(--tap)}

/* --- 20. FOOTER ------------------------------------------ */
.ft{background:var(--black);color:var(--on-black-2);padding-block:var(--s9) var(--s6)}
.ft h4{color:var(--white);font-size:var(--t-xs);font-weight:700;text-transform:uppercase;letter-spacing:.12em;margin-block-end:var(--s4)}
.ft a{display:inline-flex;align-items:center;min-height:var(--tap);font-size:var(--t-sm);line-height:1.5;color:var(--on-black-2);overflow-wrap:break-word;transition:color .16s var(--ease)}
.ft a:hover{color:var(--white)}
.cf0{grid-column:1 / 5}
.cf1{grid-column:5 / 8}
.cf2{grid-column:8 / 11}
.cf3{grid-column:11 / 13}
.ft__logo{font-family:"Manrope",sans-serif;font-size:var(--t-lg);font-weight:800;letter-spacing:.02em;color:var(--white)}
.ft__bot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s4);margin-block-start:var(--s7);padding-block-start:var(--s5);border-top:1px solid var(--on-black-line)}
.ft__cr{font-size:var(--t-xs);color:rgba(255,255,255,.62);line-height:1.6}
.ft__by{font-size:11px;line-height:1.6;letter-spacing:.05em;color:rgba(255,255,255,.62)}

/* --- 21. FLOAT ------------------------------------------- */
.float{
  display:none;position:fixed;z-index:880;
  inset-block-end:calc(var(--s4) + env(safe-area-inset-bottom));
  inset-inline-end:calc(var(--s4) + env(safe-area-inset-right));
  align-items:center;gap:var(--s2);min-height:48px;padding:var(--s3) var(--s4);
  background:var(--black);color:var(--white);border-radius:4px;
  font-family:"Manrope",sans-serif;font-size:var(--t-sm);font-weight:700;white-space:nowrap;
  font-variant-numeric:tabular-nums;
  transition:opacity .2s var(--ease),transform .2s var(--ease);
}
.float .ic{width:18px;height:18px;color:var(--white)}
.float.is-off{opacity:0;transform:translateY(14px);pointer-events:none}

/* --- 22. MOTION ------------------------------------------ */
.rv{opacity:0;transform:translateY(14px);transition:opacity .34s var(--ease),transform .34s var(--ease)}
.rv.in{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}
  .rv{opacity:1!important;transform:none!important}
}

/* --- 23. RESPONSIVE -------------------------------------- */

/* Desktop: οι ομάδες υπηρεσιών πάντα ανοιχτές — CSS ΜΟΝΟ */
@media (min-width:861px){
  .grp::details-content{content-visibility:visible!important;block-size:auto!important;overflow:visible!important;opacity:1!important}
  .grp>.grp-body{display:block!important}
  .grp>summary{pointer-events:none;cursor:default}
  .grp .grp-pm{display:none!important}
}

/* 1281+ : πλήρες nav */
@media (max-width:1280px){
  .nav a[data-lvl="3"]{display:none}
}
@media (max-width:1024px){
  .nav a[data-lvl="2"]{display:none}
}
@media (max-width:1100px){
  :root{--sec-y:var(--s9);--wrap:1024px}
  .logo__s{display:none}
  h1{font-size:var(--t-3xl)}
  .stmt{font-size:var(--t-xl)}
  .idx{columns:2}
}

/* --- MOBILE / TABLET ≤860 -------------------------------- */
@media (max-width:860px){
  :root{
    --sec-y:var(--s5);
    --gut:var(--s4);
    --pad:var(--s4);
    --hdr-h:64px;
  }
  body{padding-block-end:calc(var(--s8) + var(--s3))}

  /* grid → 1 στήλη, ίδιοι άξονες σε στοίβα */
  .c1-7,.c8-12,.c1-6,.c1-5,.c1-8,.c9-12,.c1-4{grid-column:1 / -1}

  h1{font-size:var(--t-3xl);max-width:none}
  h2{font-size:var(--t-xl);max-width:none}
  .deck{font-size:var(--t-base)}
  .stmt{font-size:var(--t-xl);max-width:none}
  .sec-head{margin-block-end:var(--s6)}
  .sec-head .lbl{margin-block-end:var(--s4)}
  .sec-head .deck{margin-block-start:var(--s4)}

  /* header: burger ΑΡΙΣΤΕΡΑ · λογότυπο ΚΕΝΤΡΟ · τηλέφωνο ΔΕΞΙΑ */
  .hdr__in{grid-template-columns:44px 1fr auto;gap:var(--s3);min-height:var(--hdr-h)}
  .hdr.is-stuck .hdr__in{min-height:var(--hdr-h)}
  .menu-toggle{
    display:inline-flex;align-items:center;justify-content:center;
    width:44px;height:44px;margin-inline-start:calc(var(--s3) * -1);
    border:0;background:none;cursor:pointer;color:var(--ink);border-radius:4px;
  }
  .nav{display:none}
  .logo{align-items:center;text-align:center}
  .hdr__act .btn{display:none}
  .hdr__act{gap:0}
  .tel{font-size:var(--t-sm)}

  /* hero: h1 → CTA → price panel */
  .hero{padding-block:var(--s6) var(--s7)}
  .hero h1{margin-block:var(--s4) var(--s4)}
  .hero__sub{margin-block-end:var(--s5)}
  .hero__cta{display:grid;grid-template-columns:1fr;gap:var(--s3)}
  .hero__cta .btn{width:100%}
  .hero .pp{margin-block-start:var(--s6)}
  .pp__top,.pp__calc{padding:var(--s4)}
  .trust{margin-block-start:var(--s6)}
  .trust-grid{grid-template-columns:repeat(2,1fr);gap:var(--s4);padding-block-start:var(--s4)}
  .trust-grid>*,.steps>*{grid-column:auto!important}
  .trust__i{grid-template-columns:20px 1fr;gap:var(--s2)}
  .trust__i .ic{width:20px;height:20px}

  /* μαύρη ζώνη: 1 στήλη, πυκνή */
  .idx{columns:1}
  .idx a{min-height:40px;padding-block:var(--s2);font-size:var(--t-sm)}

  /* ομάδες υπηρεσιών: accordion */
  .grp+.grp{margin-block-start:var(--s5)}
  .grp>summary{padding-block:var(--s3);min-height:48px;border-bottom:1px solid var(--line)}
  .grp[open]>summary{border-bottom-color:transparent}
  .grp-pm{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;flex:none}
  .grp[open] .grp-pm .v{display:none}
  .grp__t{font-size:var(--t-sm)}

  /* rows → όνομα / τιμή σε μία γραμμή */
  .row{grid-template-columns:1fr auto;gap:var(--s3);padding-block:var(--s4);align-items:baseline}
  .row__main{grid-column:1;grid-template-columns:20px 1fr;gap:var(--s3)}
  .row__main .ic{width:20px;height:20px}
  .row__val{grid-column:2;text-align:end;padding-block-start:0}
  .row__name{font-size:var(--t-base);line-height:1.25}
  .row__desc{margin-block-start:var(--s2);font-size:var(--t-xs)}
  .row__val .price{font-size:var(--t-sm)}
  .item{padding-block:var(--s4);gap:var(--s3)}

  /* φόρμα */
  .fgrid{grid-template-columns:1fr;gap:var(--s3)}
  .panel{padding:var(--s5)}
  .form__tot .price{font-size:var(--t-xl)}

  /* τιμοκατάλογος */
  .tbl td,.tbl th{font-size:.9rem}
  .tbl td{padding-block:var(--s3)}
  .tbl tr{min-height:44px}
  .tbl td:first-child{padding-inline-end:var(--s3)}

  /* chips + βήματα */
  .chip{font-size:.82rem;padding:var(--s2) var(--s3);min-height:44px}
  .steps{grid-template-columns:repeat(2,1fr)!important;gap:var(--s5) var(--s4)}
  .step__n{font-size:var(--t-xl);margin-block-end:var(--s2)}
  .step__t{font-size:var(--t-sm)}
  .step__d{font-size:var(--t-xs)}

  /* κοινόχρηστα / πακέτα */
  .tiles{gap:var(--s4)}
  .ft{padding-block:var(--s7) var(--s5)}
  .ft__bot{margin-block-start:var(--s6)}

  /* ---- ΠΥΚΝΩΣΗ ΚΑΘΕΤΟΥ ΡΥΘΜΟΥ (≈60% του desktop) ---- */
  .sec-head,.sec-head--tight{margin-block-end:var(--s5)}
  .items,.rows,.cts{border-top-width:1px}
  .item{padding-block:var(--s3)}
  .item__d{margin-block-start:var(--s1);font-size:var(--t-xs)}
  .row{padding-block:var(--s3)}
  .row__desc{margin-block-start:var(--s1)}
  .ct{padding-block:var(--s3)}
  .ct__v{font-size:var(--t-sm)}
  .panel{padding:var(--s4)}
  .f{gap:var(--s1)}
  .form__tot{padding-block-end:var(--s4);margin-block-end:var(--s4)}
  .deck{font-size:var(--t-base)}
  .lead{font-size:var(--t-sm)}
  .chips{gap:var(--s1)}

  /* πακέτα τιμών 2-up */
  .pk{grid-template-columns:repeat(2,1fr);gap:var(--s3)}
  .pk>div{grid-column:auto!important}
  .pk .panel{padding:var(--s4)}
  .pk h3{font-size:var(--t-base);margin-block:var(--s3) var(--s2)!important}
  .pk .price{font-size:var(--t-xl)!important}
  .pk .small{display:none}
  .pk .btn{margin-block-start:var(--s4)!important}
  .pk .badge{font-size:11px;letter-spacing:.05em}

  /* footer */
  .cf0{grid-column:1 / -1;margin-block-end:var(--s4)}
  .cf1,.cf2,.cf3{grid-column:span 4}
  .ft h4{margin-block-end:var(--s2)}
  .ft a{min-height:var(--tap)}
  .ft{padding-block:var(--s6) var(--s4)}

  /* ---- ΠΥΚΝΩΣΗ Β' ΓΥΡΟΣ ---- */
  .items--2{grid-template-columns:repeat(2,1fr);column-gap:var(--s4)}
  .cts--2{display:grid;grid-template-columns:repeat(2,1fr);column-gap:var(--s4)}
  .sec--black .item__d,.panel .item__d{line-height:1.5}
  h2{font-size:var(--t-lg)}
  .sec-head h2{font-size:var(--t-xl)}
  .idx a{min-height:var(--tap)}
  .item__d,.row__desc,.small,.xs{line-height:1.5}
  .trust__d{display:none}
  .pk-head{flex-direction:column;align-items:flex-start;gap:var(--s2)}
  .fgrid{grid-template-columns:repeat(2,1fr)}
  .tbl td{padding-block:var(--s2);line-height:1.4}
  .tbl tbody td{height:var(--tap)}
  .pp__calc{padding-block:var(--s3) var(--s4)}
  .pp__sum{padding-block:var(--s3) var(--s4)}
  .hero h1{margin-block:var(--s3) var(--s3)}
  .hero__sub{margin-block-end:var(--s4)}
  .step__d{line-height:1.5}
  .stmt{line-height:1.25}

  /* ---- ΠΥΚΝΩΣΗ Γ' ΓΥΡΟΣ ---- */
  .item{padding-block:var(--s2)}
  .row{padding-block:var(--s2)}
  .ct{padding-block:var(--s2)}
  .idx a{padding-block:var(--s1)}
  .sec-head,.sec-head--tight{margin-block-end:var(--s4)}
  .sec-head .lbl{margin-block-end:var(--s3)}
  .sec-head .deck{margin-block-start:var(--s3)}
  .grp+.grp{margin-block-start:var(--s4)}
  .grp>summary{padding-block:var(--s2)}
  .stmt{font-size:var(--t-lg)}
  .hero{padding-block:var(--s5) var(--s5)}
  .trust{margin-block-start:var(--s5)}
  .pp__top{padding-block:var(--s4) var(--s3)}
  .pp__val{margin-block:var(--s3) var(--s1)}
  .tbl caption{padding-block-end:var(--s2)}
  .items--2 .item__d{display:none}
  .steps{gap:var(--s4)}
  .step{padding-block-start:var(--s3)}
  .chip{min-height:var(--tap);padding-block:var(--s1)}

  .tbl td{padding-block:var(--s1);line-height:1.35}
  .hero .pp{margin-block-start:var(--s3)}
  .pp__sum{padding-block:var(--s2) var(--s3)}
  .sec-head h2{margin-block-start:0}
  .naval-head .deck{margin-block-start:var(--s2)!important}

  .float{display:inline-flex}
}

@media (max-width:560px){
  h1{font-size:var(--t-2xl)}
  .row__val .price{white-space:normal}
  .pp__n{font-size:var(--t-3xl)}
  .stmt{font-size:var(--t-lg)}
  .step__n{font-size:var(--t-lg)}
}

@media (max-width:380px){
  .trust-grid{grid-template-columns:1fr}
  .cf1,.cf2{grid-column:span 6}
  .cf3{grid-column:1 / -1}
  .pk{grid-template-columns:1fr}
  .items--2{grid-template-columns:1fr}
  .logo__w{font-size:var(--t-base)}
}

@media (min-width:861px){
  #mobile-nav,.bd,.menu-toggle{display:none!important}
}

/* --- MOBILE COMPACTION PASS (post-review) --- */
@media (max-width:860px){
  :root{ --sec-y:40px; --s7:36px; --s8:44px; --s9:56px; --s10:72px; }
  .hero{padding-block:var(--s6) var(--s7)}
  .srow,.ct,.tbl td{padding-block:14px}
  .srow p,.ct p{margin-block-start:4px;line-height:1.5}
  .grp>summary{min-height:48px;padding-block:12px}
  .blist li{padding-block:12px}
  h2{margin-block-end:var(--s3)}
  .sec>.lead,.sec>p{margin-block-end:var(--s5)}
}

/* ============================================================
   ΜΕΡΟΣ Β' — ΠΟΛΥΣΕΛΙΔΟ (multi-page layer)
   Ίδια tokens, ίδιο grid, ίδια hairline γλώσσα με το E.html.
   Ό,τι ακολουθεί είναι ΠΡΟΣΘΗΚΗ, όχι αντικατάσταση.
   ============================================================ */

/* --- 24. SPRITE & HIDDEN ---------------------------------- */
[hidden]{display:none!important}
.sprite{display:none!important}
.ic use{fill:none;stroke:currentColor}

/* --- 25. ΤΡΕΧΟΥΣΑ ΣΕΛΙΔΑ ΣΤΟ NAV -------------------------- */
.nav a[aria-current="page"]{color:var(--blue)}
#mobile-nav a.mn-l[aria-current="page"]{color:var(--blue)}
#mobile-nav a.mn-l[aria-current="page"]::after{
  content:"";width:6px;height:6px;border-radius:50%;background:var(--blue);
  margin-inline-start:var(--s2);flex:none;
}

/* --- 26. BREADCRUMB -------------------------------------- */
.bc{padding-block:var(--s5) 0}
.bc ol{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2)}
.bc li{display:flex;align-items:center;gap:var(--s2)}
.bc li+li::before{content:"/";color:var(--line);font-family:"Manrope",sans-serif}
.bc a,.bc span{
  font-family:"Manrope",sans-serif;font-size:var(--t-xs);font-weight:700;
  letter-spacing:.06em;line-height:1.5;color:var(--muted);
}
.bc a{display:inline-flex;align-items:center;min-height:32px;transition:color .16s var(--ease)}
.bc a:hover{color:var(--blue)}
.bc [aria-current="page"]{color:var(--ink)}
.on-black .bc a,.sec--black .bc a{color:var(--on-black-2)}
.on-black .bc [aria-current="page"]{color:var(--white)}
.on-black .bc li+li::before{color:var(--on-black-line)}

/* --- 27. ΕΣΩΤΕΡΙΚΟ HERO (σελίδες εκτός home) -------------- */
.phero{padding-block:var(--s7) var(--s8)}
.phero .lbl{margin-block-end:var(--s5)}
.phero h1{margin-block-end:var(--s5)}
.phero .deck{margin-block-end:0}
.phero__price{
  display:flex;flex-direction:column;gap:var(--s2);
  padding:var(--s5);border:1px solid var(--line);border-radius:6px;background:var(--white);
}
.phero__price .price{font-size:var(--t-2xl)}
.phero__price .xs{margin:0}
.phero__cta{display:flex;flex-wrap:wrap;gap:var(--s3);margin-block-start:var(--s6)}

/* --- 28. ΟΜΑΔΕΣ ΩΣ ΠΛΑΚΙΔΙΑ (σύνοψη home) ---------------- */
.gtile{display:flex;flex-direction:column;height:100%}
.gtile__h{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s4)}
.gtile ul{margin-block-start:var(--s4);border-top:1px solid var(--line)}
.gtile li a{
  display:grid;grid-template-columns:auto 1fr auto;gap:var(--s3);align-items:baseline;
  min-height:44px;padding-block:var(--s2);border-bottom:1px solid var(--line);
  font-family:"Manrope",sans-serif;font-size:var(--t-sm);font-weight:700;line-height:1.4;color:var(--ink);
  transition:color .16s var(--ease);
}
.gtile li a:hover{color:var(--blue)}
.gtile li b{font-size:var(--t-xs);font-weight:700;letter-spacing:.12em;color:var(--blue);font-variant-numeric:tabular-nums}
.gtile li em{font-style:normal;font-size:var(--t-xs);font-weight:700;color:var(--muted);white-space:nowrap}
.gtile .lnk{margin-block-start:auto;padding-block-start:var(--s4)}

/* --- 29. ΑΛΛΕΣ ΥΠΗΡΕΣΙΕΣ (cross-links) ------------------- */
.xlinks{border-top:1px solid var(--line)}
.xlinks a{
  display:grid;grid-template-columns:24px 1fr 24px;gap:var(--s4);align-items:center;
  min-height:56px;padding-block:var(--s4);border-bottom:1px solid var(--line);
  font-family:"Manrope",sans-serif;font-size:var(--t-base);font-weight:700;line-height:1.3;
  color:var(--ink);transition:color .16s var(--ease);
}
.xlinks a:hover{color:var(--blue)}
.xlinks a .ic:last-child{color:var(--muted)}
.xlinks a:hover .ic:last-child{color:var(--blue)}
.sec--black .xlinks,.sec--black .xlinks a{border-color:var(--on-black-line)}
.sec--black .xlinks a{color:var(--white)}

/* --- 30. ΚΕΙΜΕΝΟ ΝΟΜΙΚΩΝ ΣΕΛΙΔΩΝ ------------------------ */
.prose{max-width:72ch}
.prose h2{font-size:var(--t-xl);margin-block:var(--s7) var(--s4)}
.prose h2:first-child{margin-block-start:0}
.prose h3{margin-block:var(--s5) var(--s3)}
.prose p{margin-block-end:var(--s4)}
.prose p:last-child{margin-block-end:0}
.prose ul{margin-block-end:var(--s4);border-top:1px solid var(--line)}
.prose ul li{
  padding-block:var(--s3);border-bottom:1px solid var(--line);
  font-size:var(--t-sm);line-height:1.6;color:var(--body);
}
.prose ul li strong{display:block;color:var(--ink);font-family:"Manrope",sans-serif;font-size:var(--t-sm)}
.prose a:not(.btn):not(.lnk){color:var(--blue);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.prose dl{border-top:1px solid var(--line)}
.prose dt{
  font-family:"Manrope",sans-serif;font-size:var(--t-xs);font-weight:700;text-transform:uppercase;
  letter-spacing:.12em;color:var(--muted);padding-block-start:var(--s4);
}
.prose dd{font-size:var(--t-sm);line-height:1.6;color:var(--ink);padding-block:var(--s1) var(--s4);border-bottom:1px solid var(--line)}

/* --- 31. 404 --------------------------------------------- */
.e404{padding-block:var(--s9) var(--s10)}
.e404__n{
  font-family:"Manrope",sans-serif;font-size:var(--t-4xl);font-weight:800;line-height:1;
  letter-spacing:-.035em;color:var(--blue);font-variant-numeric:tabular-nums;display:block;
  margin-block-end:var(--s5);
}

/* --- 32. FX — ΚΛΑΣΕΙΣ SHORTCODE (fuel-ops-ext) ------------
   Τις παράγει το plugin· το στύλισμα ζει εδώ, στο ίδιο ύφος
   με το .pp / .f / .err / .ok του E.html.
   -------------------------------------------------------- */
.fx-price{
  font-family:"Manrope",sans-serif;font-weight:800;color:var(--ink);
  letter-spacing:-.02em;white-space:nowrap;font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
}
.on-black .fx-price,.sec--black .fx-price{color:var(--white)}
.fx-price .fx-unit{font-size:var(--t-sm);font-weight:700;color:var(--muted);margin-inline-start:var(--s1)}

.fx-price-panel{border:1px solid var(--line);border-radius:6px;background:var(--white);position:relative}
.fx-price-panel .fx-pp-top{padding:var(--s5)}
.fx-price-panel .fx-pp-val{display:flex;align-items:baseline;gap:var(--s2);margin-block:var(--s4) var(--s2)}
.fx-price-panel .fx-pp-n{
  font-family:"Manrope",sans-serif;font-size:var(--t-4xl);font-weight:800;line-height:1;
  letter-spacing:-.035em;color:var(--blue);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;
}
.fx-price-panel .fx-pp-u{font-family:"Manrope",sans-serif;font-size:var(--t-sm);font-weight:700;color:var(--muted)}
.fx-price-panel .fx-pp-upd{display:flex;align-items:center;gap:var(--s2);font-size:var(--t-xs);line-height:1.6;color:var(--muted)}
.fx-price-panel .fx-pp-upd .ic{width:16px;height:16px;color:var(--muted)}
.fx-price-panel hr{border:0;border-top:1px solid var(--line);margin:0}
.fx-price-panel--dark{background:var(--black);border-color:var(--on-black-line);color:var(--on-black-2)}
.fx-price-panel--dark .fx-pp-n{color:var(--blue-l)}
.fx-price-panel--dark .fx-pp-u,.fx-price-panel--dark .fx-pp-upd,.fx-price-panel--dark .fx-pp-upd .ic{color:var(--on-black-2)}
.fx-price-panel--dark hr{border-top-color:var(--on-black-line)}
.fx-price-panel--dark .fx-field input{background:var(--black);color:var(--white);border-color:var(--on-black-line)}

.fx-calc{padding:var(--s5)}
.fx-calc .fx-calc-row{display:grid;grid-template-columns:1fr auto;gap:var(--s3);align-items:end}
.fx-calc .fx-sum{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s4);padding-block:var(--s4) var(--s5)}
.fx-calc .fx-sum-l{
  font-family:"Manrope",sans-serif;font-size:var(--t-xs);font-weight:700;
  text-transform:uppercase;letter-spacing:.12em;color:var(--muted);line-height:1.5;
}
.fx-calc .fx-sum .fx-price{font-size:var(--t-xl)}

.fx-form{display:block}
.fx-form .fx-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s4)}
.fx-field{display:flex;flex-direction:column;gap:var(--s2)}
.fx-field--full{grid-column:1 / -1}
.fx-field label{
  font-family:"Manrope",sans-serif;font-size:var(--t-xs);font-weight:700;text-transform:uppercase;
  letter-spacing:.12em;color:var(--muted);line-height:1.5;
}
.fx-field label .fx-req{color:var(--blue)}
.fx-field input,.fx-field select,.fx-field textarea{
  width:100%;min-height:48px;padding:var(--s3) var(--s4);
  font-family:"Commissioner",sans-serif;font-size:16px;line-height:1.5;color:var(--ink);
  background:var(--white);border:1px solid var(--line);border-radius:4px;
  transition:border-color .16s var(--ease);
}
.fx-field textarea{min-height:96px;resize:vertical}
.fx-field select{
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236A7280' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right var(--s4) center;padding-inline-end:var(--s8);
}
.fx-field input:hover,.fx-field select:hover,.fx-field textarea:hover{border-color:var(--muted)}
.fx-field input:focus,.fx-field select:focus,.fx-field textarea:focus{border-color:var(--blue)}
.fx-field [aria-invalid="true"]{border-color:var(--blue-d)}
.fx-err{display:none;font-size:var(--t-xs);line-height:1.5;color:var(--blue-d);font-weight:500}
.fx-field.is-bad .fx-err,.fx-err.is-on{display:block}
.fx-form .fx-tot{
  display:flex;align-items:baseline;justify-content:space-between;gap:var(--s4);
  padding-block-end:var(--s5);border-bottom:1px solid var(--line);margin-block-end:var(--s5);
}
.fx-form .fx-tot .fx-price{font-size:var(--t-2xl);color:var(--blue)}
.fx-form .fx-gdpr{font-size:var(--t-xs);line-height:1.6;color:var(--muted);margin-block-start:var(--s3)}
.fx-form .fx-gdpr a{color:var(--blue);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.fx-ok{
  display:none;gap:var(--s3);padding:var(--s4);margin-block-start:var(--s4);
  border:1px solid var(--blue);border-radius:4px;background:var(--white);
  font-size:var(--t-sm);line-height:1.6;color:var(--ink);
}
.fx-ok.is-on{display:grid;grid-template-columns:24px 1fr;align-items:start}
.panel--black .fx-field input,.panel--black .fx-field select,.panel--black .fx-field textarea{
  background:var(--black);color:var(--white);border-color:var(--on-black-line);
}
.panel--black .fx-field label{color:var(--on-black-2)}

/* --- 33. ΓΡΑΜΜΗ GDPR ΣΕ ΚΑΘΕ ΦΟΡΜΑ ---------------------- */
.gdpr{font-size:var(--t-xs);line-height:1.6;color:var(--muted);margin-block-start:var(--s4)}
.gdpr a{color:var(--blue);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.on-black .gdpr,.panel--black .gdpr{color:var(--on-black-2)}
.on-black .gdpr a,.panel--black .gdpr a{color:var(--blue-l)}

/* --- 34. ΔΙΟΡΘΩΣΕΙΣ ΡΥΘΜΟΥ ------------------------------- */
.sec--top{padding-block-start:var(--s7)}
.stack{display:grid;gap:var(--s5)}
.mt5{margin-block-start:var(--s5)}
.mt6{margin-block-start:var(--s6)}
.mb5{margin-block-end:var(--s5)}
.tiles>*{min-width:0}

/* --- 35. MOBILE (≤860) — ΠΡΟΣΘΗΚΕΣ ----------------------- */
@media (max-width:860px){
  body{padding-block-end:76px}
  .wrap{
    padding-inline:calc(var(--pad) + env(safe-area-inset-left)) calc(var(--pad) + env(safe-area-inset-right));
  }
  #mobile-nav{max-block-size:100svh}
  .hero--home{min-block-size:calc(100svh - var(--hdr-h))}

  .bc{padding-block:var(--s4) 0}
  .phero{padding-block:var(--s5) var(--s5)}
  .phero .lbl{margin-block-end:var(--s3)}
  .phero h1{margin-block-end:var(--s3)}
  .phero__price{padding:var(--s4);margin-block-start:var(--s4)}
  .phero__price .price{font-size:var(--t-xl)}
  .phero__cta{margin-block-start:var(--s4);display:grid;grid-template-columns:1fr;gap:var(--s3)}
  .phero__cta .btn{width:100%}

  .gtile ul{margin-block-start:var(--s3)}
  .gtile li a{min-height:var(--tap);padding-block:var(--s1)}
  .gtile .lnk{padding-block-start:var(--s2)}

  .xlinks a{min-height:var(--tap);padding-block:var(--s2);font-size:var(--t-sm);grid-template-columns:20px 1fr 20px;gap:var(--s3)}
  .xlinks a .ic{width:20px;height:20px}

  .prose h2{font-size:var(--t-lg);margin-block:var(--s6) var(--s3)}
  .prose p{margin-block-end:var(--s3)}
  .prose ul li{padding-block:var(--s2)}
  .prose dd{padding-block:var(--s1) var(--s3)}

  .e404{padding-block:var(--s7) var(--s8)}

  .fx-price-panel .fx-pp-top,.fx-calc{padding:var(--s4)}
  .fx-price-panel .fx-pp-n{font-size:var(--t-3xl)}
  .fx-calc .fx-sum{padding-block:var(--s2) var(--s3)}
  .fx-form .fx-grid{grid-template-columns:repeat(2,1fr);gap:var(--s3)}
  .fx-field{gap:var(--s1)}
  .fx-form .fx-tot{padding-block-end:var(--s4);margin-block-end:var(--s4)}
  .fx-form .fx-tot .fx-price{font-size:var(--t-xl)}
}
@media (max-width:380px){
  .fx-form .fx-grid{grid-template-columns:1fr}
}

/* --- 36. HOME: η λίστα των 14 σε 2 στήλες στο mobile ------ */
@media (max-width:860px){
  .idx--2{columns:2;column-gap:var(--s4)}
  .idx--2 a{grid-template-columns:auto 1fr;gap:var(--s2);font-size:.82rem;line-height:1.3}
  .idx--2 a b{font-size:10px;letter-spacing:.08em}
}
@media (max-width:380px){
  .idx--2{columns:1}
}

/* --- 37. ΤΡΙΤΗΜΟΡΙΟ (3 πλακίδια ανά σειρά) + mobile utilities --- */
.c1-3{grid-column:span 4}
@media (max-width:860px){
  .c1-3{grid-column:1 / -1}
  .m-hide{display:none}
  .gtile .small{display:none}
  .gtile__h h3{font-size:var(--t-base)}
}

/* --- 38. ΠΥΚΝΩΣΗ Δ' ΓΥΡΟΣ (mobile) -----------------------
   --sec-y πίσω στην κλίμακα των 4px (32px = --s6) και πυκνά
   πλακίδια ομάδων: η home κρατιέται κάτω από 10 οθόνες.
   -------------------------------------------------------- */
@media (max-width:860px){
  :root{--sec-y:32px}
  .tiles .gtile{padding:var(--s3) var(--s4)}
  .gtile__h{align-items:center}
  .gtile .price{font-size:var(--t-base)}
  .gtile>p{margin-block-start:var(--s2)!important}
  .gtile .lnk{min-height:40px;padding-block-start:var(--s1)}
}

/* --- 39. ΔΙΟΡΘΩΣΕΙΣ QA (post-verify) ---------------------- */
/* 1. scroll-lock όσο το drawer είναι ανοιχτό — έλειπε από το E.html */
body.nav-open{overflow:hidden}
html:has(body.nav-open){overflow:hidden}

/* 2. tap targets ≥44px σε αυτόνομους συνδέσμους
      (οι inline σύνδεσμοι μέσα σε παράγραφο εξαιρούνται — WCAG 2.5.8) */
.bc a{min-height:var(--tap)}
.rows .row__name a{display:inline-flex;align-items:center;min-block-size:var(--tap)}
@media (max-width:860px){
  .gtile .lnk{min-height:var(--tap);padding-block-start:var(--s1)}
}
.a-tap{display:inline-flex;align-items:center;min-block-size:var(--tap)}

/* --- 40. ΕΝΣΩΜΑΤΩΣΗ ΤΟΥ PANEL ΤΟΥ SHORTCODE ---------------
   Το plugin βγάζει τα στοιχεία κάτω από το <hr> ως απευθείας
   παιδιά του .fx-pp — τους δίνουμε το padding του .pp__calc,
   ώστε να μην ακουμπούν το περίγραμμα.
   -------------------------------------------------------- */
.fx-pp>.xs{padding:var(--s4) var(--s5) 0}
.fx-pp>.btn{width:auto;margin:var(--s4) var(--s5) var(--s5)}
.fx-pp>form,.fx-pp>.fx-calc{padding:var(--s5)}
.fx-pp--dark{background:var(--black);border-color:var(--on-black-line);color:var(--on-black-2)}
.fx-pp--dark .pp__n{color:var(--blue-l)}
.fx-pp--dark .pp__u,.fx-pp--dark .xs{color:var(--on-black-2)}
@media (max-width:860px){
  .fx-pp>.xs{padding:var(--s3) var(--s4) 0}
  .fx-pp>.btn{margin:var(--s3) var(--s4) var(--s4)}
  .fx-pp>form,.fx-pp>.fx-calc{padding:var(--s4)}
}

/* --- 24. ΤΟ ΚΤΙΡΙΟ ΠΟΥ ΑΝΟΙΓΕΙ ---------------------------- */
/* Ισομετρικό exploded view: 5 πλάκες-κατόψεις σε 3D. Με JS (.is-live) γίνεται
   sticky scroll-story· χωρίς JS / reduced motion μένει στατικό + όλες οι λίστες. */
.xp{
  --a:var(--blue-l); --ln:rgba(255,255,255,.5); --fn:rgba(255,255,255,.2);
  --pl:340px; position:relative; color:var(--on-black-2)
}
.xp__stick{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--gut);align-items:center;position:relative}
.xp__stage{position:relative;height:620px;display:grid;place-items:center;overflow:visible}
.xp__iso{
  --gap:84px; position:relative;width:var(--pl);height:var(--pl);transform-style:preserve-3d;
  transform:scale(var(--sc,1)) rotateX(var(--rx,58deg)) rotateZ(var(--rz,-42deg));
  margin-top:calc(var(--gap) * 2.6 * var(--sc,1))
}
.xp__layer{
  position:absolute;inset:0;transform-style:preserve-3d;
  --z:calc((4 - var(--i)) * var(--gap) + var(--lift,0px));
  transform:translateZ(var(--z));
  border:1px solid var(--ln);background:rgba(11,12,14,.86);
  transition:transform .55s var(--ease),opacity .4s var(--ease),border-color .3s var(--ease),background .3s var(--ease)
}
.xp__layer::before,.xp__layer::after{content:"";position:absolute;background:rgba(255,255,255,.07);border:1px solid var(--fn)}
.xp__layer::before{left:-1px;right:-1px;bottom:-1px;height:10px;transform-origin:bottom;transform:rotateX(90deg)}
.xp__layer::after{left:-1px;top:-1px;bottom:-1px;width:10px;transform-origin:left;transform:rotateY(90deg)}
.xp__layer.is-on{--lift:44px;border-color:var(--a);background:rgba(20,32,70,.92)}
.xp__layer.is-on::before,.xp__layer.is-on::after{background:rgba(91,140,255,.35);border-color:var(--a)}
.xp:has(.xp__layer.is-on) .xp__layer:not(.is-on){opacity:.38}

.xp__plan{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.xp__plan *{fill:none;stroke:var(--fn);stroke-width:1;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
.xp__plan .p-l{stroke:var(--ln)}
.xp__plan .p-a{stroke:var(--a);stroke-width:1.6}
.xp__plan .p-dash{stroke-dasharray:4 5}
.xp__plan .p-flow{stroke-dasharray:6 7;animation:xp-flow 1.2s linear infinite}
.xp__plan .p-riser{fill:var(--a)}
.xp__plan .p-sea{animation:xp-drift 6s ease-in-out infinite alternate}
.xp__layer.is-on .p-l{stroke:rgba(255,255,255,.85)}
.xp__layer.is-on .p-f{stroke:rgba(255,255,255,.35)}
.xp__plan .p-m{transform-box:fill-box;transform-origin:center;transition:transform .25s var(--ease)}
.xp__plan .p-m circle{fill:var(--black);stroke:var(--a);stroke-width:1.4}
.xp__plan .p-m text{fill:var(--a);stroke:none;font:800 12px/1 "Manrope",sans-serif}
.xp__layer.is-on .p-m circle,.xp__plan .p-m.on circle{fill:var(--a)}
.xp__layer.is-on .p-m text,.xp__plan .p-m.on text{fill:var(--white)}
.xp__plan .p-m.on{transform:scale(1.35)}

.xp__riser{
  position:absolute;left:71.25%;top:43.75%;width:3px;margin-left:-1.5px;
  height:calc(var(--gap) * 3);transform-origin:top;transform:rotateX(90deg);
  background:repeating-linear-gradient(to bottom,var(--a) 0 7px,transparent 7px 13px);
  animation:xp-rise 1s linear infinite
}
@keyframes xp-flow{to{stroke-dashoffset:-26}}
@keyframes xp-drift{to{transform:translateX(-24px)}}
@keyframes xp-rise{to{background-position:0 -13px}}

/* πάνελ */
.xp__panels{display:grid;gap:var(--s8)}
.xp__lvl{
  font:800 clamp(3rem,6.4vw,5.6rem)/.95 "Manrope",sans-serif;letter-spacing:-.04em;
  color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.34);margin-block-end:var(--s5);white-space:nowrap
}
.xp__k{font:700 var(--t-xs)/1.4 "Manrope",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--a)}
.xp__h{font-size:var(--t-3xl);font-weight:800;letter-spacing:-.03em;line-height:1.1;color:var(--white);margin-block:var(--s2) var(--s3)}
.xp__line{max-width:40ch;color:var(--on-black-2)}
.xp__list{margin-block-start:var(--s5);border-top:1px solid var(--on-black-line)}
.xp__list a{
  display:grid;grid-template-columns:2.6ch minmax(0,1fr) auto;gap:var(--s3);align-items:center;
  min-height:56px;padding-block:var(--s3);border-bottom:1px solid var(--on-black-line);
  color:var(--white);font:700 var(--t-base)/1.3 "Manrope",sans-serif;transition:color .18s var(--ease)
}
.xp__list b{color:var(--a);font-size:var(--t-xs);letter-spacing:.08em;font-variant-numeric:tabular-nums}
.xp__list em{display:block;margin-top:2px;font:400 var(--t-sm)/1.4 "Commissioner",sans-serif;font-style:normal;color:var(--on-black-2)}
.xp__list .ic{width:18px;height:18px;color:var(--a);opacity:0;transform:translateX(-6px);transition:opacity .18s var(--ease),transform .18s var(--ease)}
.xp__list a:hover,.xp__list a.on,.xp__list a[aria-current]{color:var(--a)}
.xp__list a:hover .ic,.xp__list a.on .ic,.xp__list a:focus-visible .ic,.xp__list a[aria-current] .ic{opacity:1;transform:none}

/* rail επιπέδων */
.xp__rail{position:absolute;left:0;top:50%;transform:translateY(-50%);display:grid;gap:var(--s1)}
.xp__rail button{
  display:flex;align-items:center;gap:var(--s3);min-height:var(--tap);padding:0;border:0;background:none;cursor:pointer;
  color:rgba(255,255,255,.4);font:700 var(--t-xs)/1 "Manrope",sans-serif;letter-spacing:.12em;text-transform:uppercase;transition:color .2s var(--ease)
}
.xp__rail button::before{content:"";width:16px;height:1px;background:currentColor;transition:width .25s var(--ease),background .25s var(--ease)}
.xp__rail button span{color:inherit}
.xp__rail button:hover{color:var(--white)}
.xp__rail button.is-on{color:var(--white)}
.xp__rail button.is-on::before{width:32px;background:var(--a)}

/* LIVE: sticky scroll-story */
.xp.is-live{height:560vh}
.xp.is-live .xp__stick{position:sticky;top:var(--hdr-h);height:calc(100vh - var(--hdr-h));height:calc(100svh - var(--hdr-h))}
.xp.is-live .xp__stage{height:100%;padding-left:180px}
.xp.is-live .xp__panels{display:block;position:relative;min-height:540px}
.xp.is-live .xp__panel{
  position:absolute;left:0;right:0;top:50%;
  opacity:0;visibility:hidden;transform:translateY(calc(-50% + 28px));
  transition:opacity .45s var(--ease),transform .45s var(--ease),visibility 0s linear .45s
}
.xp.is-live .xp__panel.is-on{opacity:1;visibility:visible;transform:translateY(-50%);transition-delay:0s}

@media (max-width:1100px){ .xp__rail{display:none} .xp.is-live .xp__stage{padding-left:0} }
@media (max-width:860px){
  .xp__stick{grid-template-columns:1fr;gap:var(--s5)}
  .xp__stage{height:420px}
  .xp__lvl{display:none}
  .xp__h{font-size:var(--t-2xl)}
  .xp.is-live .xp__stick{grid-template-rows:minmax(0,46fr) minmax(0,54fr);gap:0;align-items:stretch}
  .xp.is-live .xp__panels{min-height:0}
  .xp.is-live .xp__panel{top:0;transform:translateY(20px)}
  .xp.is-live .xp__panel.is-on{transform:none}
  .xp.is-live .xp__line{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:var(--t-sm)}
  .xp.is-live .xp__list{margin-block-start:var(--s3)}
  .xp.is-live .xp__list a{min-height:var(--tap);padding-block:var(--s2);font-size:var(--t-sm)}
  .xp.is-live .xp__list em{font-size:var(--t-xs)}
}

/* --- 25. HERO ΑΡΧΙΚΗΣ — σκούρο, με το exploded κτίριο ---- */
/* Φόντο ίδιο με το φόντο της εικόνας (#101014) ώστε να μη φαίνονται άκρες.
   Desktop: η εικόνα απόλυτα δεξιά, πίσω από το κείμενο με fade αριστερά/κάτω.
   Mobile: μπαίνει στη ροή, ανάμεσα στο κείμενο και στα trust. */
.hero--dark{position:relative;isolation:isolate;overflow:hidden;background:#101014;color:var(--on-black-2)}
.hero--dark h1{color:var(--white)}
.hero--dark .deck{color:var(--on-black-2)}
.hero--dark .trust__t{color:var(--white)}
.hero--dark .trust__d{color:var(--on-black-2)}
.hero__vis{position:absolute;inset:0;z-index:-1;pointer-events:none}
.hero__vis::after{content:"";position:absolute;inset:auto 0 0 0;height:16%;background:linear-gradient(to top,#101014 18%,rgba(16,16,20,0))}
.hero__vis picture{display:contents}
.hero__vis img,.hero__vis video{
  position:absolute;top:var(--s6);right:max(0px,calc((100% - var(--wrap)) / 2));
  height:min(calc(100% - var(--s10) - var(--s6)),820px);width:auto;max-width:none;object-fit:contain;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 16%,#000 96%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 6%,#000 94%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to right,transparent 0,#000 16%,#000 96%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 6%,#000 94%,transparent 100%);
  mask-composite:intersect;
  animation:hero-float 8s ease-in-out infinite alternate
}
.hero__vis video{animation:none}
@keyframes hero-float{to{transform:translateY(-12px)}}
.hero--dark .wrap{position:relative}

.hprice{
  display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s5);flex-wrap:wrap;
  max-width:500px;margin-block-start:var(--s7);padding:var(--s5);
  border:1px solid var(--on-black-line);border-radius:6px;
  background:rgba(16,16,20,.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)
}
.hprice__v{display:flex;align-items:baseline;gap:var(--s2);margin-block:var(--s3) var(--s1)}
.hprice .pp__n{color:var(--blue-l)}
.hprice .pp__u,.hprice .xs{color:var(--on-black-2)}

@media (min-width:861px){
  .hero--dark{padding-block:var(--s9) var(--s8)}
}
@media (max-width:1100px) and (min-width:861px){
  .hero__vis img,.hero__vis video{right:-12%;opacity:.7}
}
@media (max-width:860px){
  .hero__vis{position:relative;inset:auto;z-index:auto;grid-column:1 / -1;margin-block:var(--s5) calc(var(--s7) * -1)}
  .hero__vis::after{height:22%}
  .hero__vis img,.hero__vis video{
    position:static;display:block;width:100%;height:auto;max-width:560px;margin-inline:auto;
    transform:none;animation:none
  }
  .hprice{max-width:none;margin-block-start:var(--s5);padding:var(--s4)}
}

/* --- 26. ΜΕΝΟΥ ΥΠΗΡΕΣΙΩΝ (dropdown, όπως στο ektherm.gr) --- */
/* Desktop: mega-menu σε hover / πληκτρολόγιο (focus-within). Κλείνει με Esc (site.js).
   Mobile drawer: <details> με τις 14 υπηρεσίες ανά ομάδα. */
.nav{align-self:stretch}
.nav__dd{display:flex;align-items:center;align-self:stretch}
.nav__t{gap:var(--s1)}
.nav__chev{width:16px;height:16px;transition:transform .2s var(--ease)}
.dd{
  position:absolute;left:0;right:0;top:100%;z-index:950;
  background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  box-shadow:0 24px 48px -24px rgba(11,12,14,.28);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .18s var(--ease),transform .18s var(--ease),visibility 0s linear .18s
}
.nav__dd:hover .dd,.nav__dd:focus-within .dd{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.nav__dd:hover .nav__chev,.nav__dd:focus-within .nav__chev{transform:rotate(180deg)}
.nav__dd.is-shut .dd{opacity:0;visibility:hidden}
.dd__in{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,.9fr);gap:var(--s6);padding-block:var(--s6) var(--s5)}
.dd__g{font:700 var(--t-xs)/1.4 "Manrope",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding-block-end:var(--s3);border-bottom:1px solid var(--line)}
.dd__col ul{display:grid}
.nav .dd__col a,.dd__col a{
  display:grid;grid-template-columns:2.4ch 1fr;gap:var(--s2);align-items:baseline;min-height:40px;
  padding-block:var(--s2);white-space:normal;
  font:600 var(--t-sm)/1.35 "Manrope",sans-serif;color:var(--ink)
}
.dd__col a b{font-size:var(--t-xs);font-weight:700;letter-spacing:.06em;color:var(--blue);font-variant-numeric:tabular-nums}
.dd__col a:hover,.dd__col a[aria-current]{color:var(--blue)}
.dd__feat{display:flex;flex-direction:column;gap:var(--s2);padding:var(--s5);border-radius:6px;background:var(--black);color:var(--on-black-2)}
.dd__feat .btn{margin-block-start:auto}
.nav .dd__feat .btn,.nav .dd__feat .btn:hover{color:var(--white);min-height:var(--tap);justify-content:center}
.dd__price{display:flex;align-items:baseline;gap:var(--s2);font:800 var(--t-3xl)/1 "Manrope",sans-serif;letter-spacing:-.035em;color:var(--blue-l);font-variant-numeric:tabular-nums}
.dd__price small{font:700 var(--t-sm)/1 "Manrope",sans-serif;letter-spacing:0;color:var(--on-black-2)}
.dd__more{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:var(--s2) var(--s6);padding-block-start:var(--s4);border-top:1px solid var(--line)}
.nav .dd__more a,.dd__more a{display:inline-flex;align-items:center;gap:var(--s2);min-height:44px;font:700 var(--t-sm)/1 "Manrope",sans-serif;color:var(--blue)}
.dd__more .ic{width:16px;height:16px}
.dd__more a[aria-current]{color:var(--ink)}
@media (max-width:1280px){ .nav__dd[data-lvl="3"]{display:none} }

/* drawer */
#mobile-nav .mn-dd{border-bottom:1px solid var(--line)}
#mobile-nav .mn-dd>summary{
  display:flex;align-items:center;justify-content:space-between;min-height:48px;cursor:pointer;list-style:none;
  font-family:"Manrope",sans-serif;font-size:var(--t-base);font-weight:700;color:var(--ink)
}
#mobile-nav .mn-dd>summary::-webkit-details-marker{display:none}
#mobile-nav .mn-dd .grp-pm{display:inline-flex}
#mobile-nav .mn-dd .grp-pm{transition:transform .2s var(--ease);color:var(--blue)}
#mobile-nav .mn-dd[open] .grp-pm{transform:rotate(45deg)}
#mobile-nav .mn-dd__b{padding-block:var(--s2) var(--s4)}
#mobile-nav .mn-dd__b .dd__g{margin-block-start:var(--s3);padding-block-end:var(--s2)}
#mobile-nav .mn-dd__b a{min-height:44px}
#mobile-nav .dd__more{flex-direction:column;gap:0;padding-block-start:var(--s2);margin-block-start:var(--s3)}

/* --- 27. BLOG ------------------------------------------- */
.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gut)}
.blog-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.post-card{
  position:relative;display:flex;flex-direction:column;gap:var(--s3);padding:var(--s6);
  border:1px solid var(--line);border-radius:6px;background:var(--white);
  transition:border-color .2s var(--ease)
}
.post-card:hover{border-color:var(--blue)}
.post-card time{color:var(--muted)}
.post-card__t{font-size:var(--t-lg);font-weight:800;line-height:1.25;letter-spacing:-.015em;color:var(--ink)}
.post-card__t a::after{content:"";position:absolute;inset:0}
.post-card .lnk{margin-block-start:auto}
.post-card--now{background:var(--black);border-color:var(--black);color:var(--on-black-2)}
.post-card--now .post-card__t{color:var(--white)}
.post-card--now .xs{color:var(--on-black-2)}
.prose p{font-size:var(--t-lg);line-height:1.7;color:var(--body)}
.prose p+p{margin-block-start:var(--s5)}
@media (max-width:1024px){ .blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:860px){
  .dd{display:none}
  .blog-grid,.blog-grid--2{grid-template-columns:1fr}
  .post-card{padding:var(--s5)}
  .prose p{font-size:var(--t-base)}
}

/* --- 28. PHERO ΜΕ ΦΩΤΟΓΡΑΦΙΑ (υπηρεσίες + hub) ----------- */
/* Η stock φωτογραφία γίνεται «δική μας»: γεμίζει τα δεξιά 62% του τίτλου,
   σβήνει σε μαύρο προς το κείμενο, ψυχρό grade + λεπτό μπλε πέπλο,
   αργό zoom-out στο φόρτωμα. Η τιμή κάθεται από πάνω σε γυάλινη κάρτα. */
.phero--img{
  position:relative;isolation:isolate;overflow:hidden;
  display:flex;flex-direction:column;min-height:min(80vh,660px);
  background:var(--black);color:var(--on-black-2);padding-block-end:var(--s9)
}
.phero--img>.wrap:last-child{margin-block-start:auto;padding-block-start:var(--s8)}
.phero--img .grid{align-items:end}
.phero--img h1{color:var(--white)}
.phero--img .deck,.phero--img .lead{color:var(--on-black-2)}
.phero--img .lbl{color:var(--blue-l)}
.phero__media{position:absolute;inset:0 0 0 auto;width:64%;z-index:-1;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 38%);mask-image:linear-gradient(90deg,transparent 0,#000 38%)}
.phero__media picture{display:contents}
.phero__media img{
  width:100%;height:100%;object-fit:cover;
  filter:saturate(.8) contrast(1.05) brightness(.95);
  animation:ph-zoom 14s cubic-bezier(.2,.6,.2,1) both
}
.phero__media::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(11,12,14,.5) 0%,rgba(11,12,14,.12) 45%,rgba(11,12,14,0) 100%),
    linear-gradient(0deg,rgba(11,12,14,.85) 0%,rgba(11,12,14,0) 38%),
    linear-gradient(180deg,rgba(11,12,14,.45) 0%,rgba(11,12,14,0) 20%),
    linear-gradient(90deg,rgba(27,79,216,0),rgba(27,79,216,.12))
}
@keyframes ph-zoom{from{transform:scale(1.08)}to{transform:scale(1)}}
.phero--img .phero__side{align-self:end}
.phero--img .phero__price,.phero--img .fx-pp{
  background:rgba(11,12,14,.62);border-color:rgba(255,255,255,.18);color:var(--on-black-2);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)
}
.phero--img .phero__price .price{color:var(--white)}
.phero--img .phero__price .from,.phero--img .phero__price .xs{color:var(--on-black-2)}
.phero--img .grid>.c8-12:not(.phero__side){
  padding:var(--s5);border:1px solid rgba(255,255,255,.14);border-radius:6px;
  background:rgba(11,12,14,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)
}
.phero--img .bc{position:relative}
@media (max-width:860px){
  .phero--img{min-height:0;padding-block:0 var(--s7)}
  .phero__media{inset:0 0 auto 0;width:100%;height:340px;-webkit-mask-image:none;mask-image:none}
  .phero__media::after{
    background:linear-gradient(180deg,rgba(11,12,14,.6) 0%,rgba(11,12,14,.1) 30%,rgba(11,12,14,.55) 70%,var(--black) 100%),rgba(27,79,216,.10)
  }
  .phero--img>.wrap:last-child{padding-block-start:170px}
  .phero--img .phero__side,.phero--img .grid>.c8-12{margin-block-start:var(--s5)}
}

/* --- 29. ΣΕΛΙΔΑ ΥΠΗΡΕΣΙΑΣ — δομή σε δύο τόνους ----------- */
/* Ρυθμός: σκούρο hero → λευκή λωρίδα στοιχείων που «πατάει» στο hero →
   λευκό «τι περιλαμβάνει» → paper «πώς δουλεύουμε» → σκούρο αίτημα με
   duotone φωτογραφία → λευκές σχετικές υπηρεσίες → σκούρο footer. */
.c7-12{grid-column:7 / 13}

/* hero: αφήνει χώρο κάτω για τη λωρίδα */
.phero--svc.phero--img{padding-block-end:calc(var(--s9) + 56px)}

/* 2 · λωρίδα στοιχείων */
.facts-wrap{position:relative;z-index:2;margin-block-start:-56px}
.facts{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  background:var(--white);border:1px solid var(--line);border-radius:8px;
  box-shadow:0 24px 48px -28px rgba(11,12,14,.35)
}
.fact{display:flex;flex-direction:column;gap:var(--s2);padding:var(--s5) var(--s6)}
.fact+.fact{border-inline-start:1px solid var(--line)}
.fact .price{font-size:var(--t-xl)}
.fact__v{font:800 var(--t-lg)/1.25 "Manrope",sans-serif;letter-spacing:-.015em;color:var(--ink)}
.fact .xs{margin:0;color:var(--muted)}
.fact .xs a{color:var(--blue);font-weight:700}

/* 3 · τι περιλαμβάνει */
.incl-sec{padding-block-start:var(--s9)}
.incl__head{position:sticky;top:calc(var(--hdr-h) + var(--s6))}
.incl__head h2{margin-block:var(--s4) var(--s4)}
.incl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s4)}
.incl__i{
  display:flex;flex-direction:column;gap:var(--s4);min-height:148px;padding:var(--s5);
  border:1px solid var(--line);border-radius:8px;background:var(--white);
  transition:border-color .2s var(--ease),transform .2s var(--ease)
}
.incl__i:hover{border-color:var(--blue);transform:translateY(-2px)}
.incl__n{font:800 var(--t-sm)/1 "Manrope",sans-serif;letter-spacing:.08em;color:var(--blue)}
.incl__i p{font:700 var(--t-base)/1.45 "Manrope",sans-serif;color:var(--ink);margin-block-start:auto}
.incl__i:last-child:nth-child(odd){grid-column:1 / -1;min-height:0}

/* 4 · πώς δουλεύουμε — γραμμή με 4 σταθμούς */
.steps-line{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gut);position:relative}
.steps-line::before{content:"";position:absolute;left:0;right:0;top:22px;height:1px;background:var(--line)}
.sl{position:relative;padding-block-start:0}
.sl__n{
  position:relative;display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;
  background:var(--white);border:1px solid var(--blue);color:var(--blue);
  font:800 var(--t-sm)/1 "Manrope",sans-serif;margin-block-end:var(--s5)
}
.sl:first-child .sl__n{background:var(--blue);color:var(--white)}
.sl__t{font-size:var(--t-lg);margin-block-end:var(--s2)}

/* 5 · αίτημα: σκούρο + duotone φωτογραφία που σβήνει */
.rq{position:relative;isolation:isolate;overflow:hidden;background:var(--black);color:var(--on-black-2)}
.rq__bg{
  position:absolute;inset:0 0 0 30%;z-index:-1;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 45%);mask-image:linear-gradient(90deg,transparent 0,#000 45%)
}
.rq__bg picture{display:contents}
.rq__bg img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.15) brightness(.55)}
.rq__bg::after{content:"";position:absolute;inset:0;background:#1B4FD8;mix-blend-mode:color;opacity:.85}
.rq__bg::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,var(--black),rgba(11,12,14,0) 30%,rgba(11,12,14,0) 70%,var(--black))}
.rq h2{color:var(--white);margin-block:var(--s4) var(--s4)}
.rq .lead{color:var(--on-black-2)}
.rq__info{align-self:center}
.rq__list{margin-block-start:var(--s6);border-top:1px solid var(--on-black-line)}
.rq__list li{display:grid;grid-template-columns:24px 1fr;gap:var(--s4);align-items:start;padding-block:var(--s4);border-bottom:1px solid var(--on-black-line)}
.rq__list .ic{color:var(--blue-l);width:20px;height:20px;margin-top:2px}
.rq__list .xs{display:block;color:var(--on-black-2);text-transform:uppercase;letter-spacing:.12em;font-weight:700;font-family:"Manrope",sans-serif}
.rq__list a,.rq__list span:not(.xs){color:var(--white);font:700 var(--t-base)/1.5 "Manrope",sans-serif;word-break:break-word}
.rq__list a:hover{color:var(--blue-l)}
.rq__form{background:var(--white);color:var(--body);border-radius:8px;padding:var(--s6);box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
.rq__form>.panel{border:0;padding:0;background:none}
.rq__form>.panel>.lbl{display:none}
.rq__form .gdpr{margin-block-start:var(--s4);color:var(--muted)}
.rq__form .gdpr a{color:var(--blue)}
/* μη-πετρέλαιο: χωρίς λίτρα / εκτιμώμενο σύνολο */
.rq__form--svc .f:has([data-fx="order-litres"]),.rq__form--svc .form__tot{display:none}

/* 6 · σχετικές υπηρεσίες — κάρτες με φωτογραφία */
.rel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gut)}
.card{
  position:relative;display:flex;flex-direction:column;overflow:hidden;
  border:1px solid var(--line);border-radius:8px;background:var(--white);
  transition:border-color .2s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease)
}
.card:hover{border-color:var(--blue);transform:translateY(-3px);box-shadow:0 24px 40px -28px rgba(11,12,14,.4)}
.card__img{position:relative;display:block;aspect-ratio:16 / 10;overflow:hidden;background:var(--black)}
.card__img img{width:100%;height:100%;object-fit:cover;filter:saturate(.8) contrast(1.04);transition:transform .6s var(--ease)}
.card__img::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(255,255,255,1) 0%,rgba(255,255,255,0) 45%)}
.card:hover .card__img img{transform:scale(1.05)}
.card__b{display:flex;flex-direction:column;gap:var(--s3);padding:0 var(--s5) var(--s5);margin-block-start:calc(var(--s6) * -1);position:relative}
.card__t{font-size:var(--t-lg);line-height:1.3}
.card__p .price{font-size:var(--t-base)}
.card .lnk{margin-block-start:auto}

@media (max-width:1024px){
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fact:nth-child(3){border-inline-start:0}
  .fact:nth-child(n+3){border-block-start:1px solid var(--line)}
  .steps-line{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:var(--s7)}
  .steps-line::before{display:none}
  .rel{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  .phero--svc.phero--img{padding-block-end:calc(var(--s7) + 40px)}
  .facts-wrap{margin-block-start:-40px}
  .fact{padding:var(--s4)}
  .fact .price,.fact__v{font-size:var(--t-base)}
  .c7-12{grid-column:1 / -1}
  .incl__head{position:static;margin-block-end:var(--s5)}
  .incl{grid-template-columns:1fr}
  .incl__i{min-height:0}
  .rq__bg{inset:0;-webkit-mask-image:linear-gradient(180deg,#000,transparent 70%);mask-image:linear-gradient(180deg,#000,transparent 70%);opacity:.6}
  .rq__form{padding:var(--s4);margin-block-start:var(--s6)}
  .rel{grid-template-columns:1fr}
}
@media (max-width:560px){
  .steps-line{grid-template-columns:1fr}
}

/* --- 30. ΠΛΗΡΩΜΕΣ ΚΟΙΝΟΧΡΗΣΤΩΝ — δύο είσοδοι ------------- */
.enoikos-sec{padding-block-start:var(--s9)}
.enoikos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s4)}
.enoikos__c{
  display:flex;flex-direction:column;gap:var(--s3);padding:var(--s6);
  border:1px solid var(--line);border-radius:8px;background:var(--white);
  transition:border-color .2s var(--ease),transform .2s var(--ease),box-shadow .2s var(--ease)
}
.enoikos__c:hover{border-color:var(--blue);transform:translateY(-3px);box-shadow:0 24px 40px -28px rgba(11,12,14,.4)}
.enoikos__c--main{background:var(--black);border-color:var(--black);color:var(--on-black-2)}
.enoikos__c--main .lbl{color:var(--blue-l)}
.enoikos__c--main .enoikos__t{color:var(--white)}
.enoikos__c--main .enoikos__u{color:rgba(255,255,255,.5)}
.enoikos__t{font:800 var(--t-xl)/1.2 "Manrope",sans-serif;letter-spacing:-.02em;color:var(--ink)}
.enoikos__d{font-size:var(--t-sm);line-height:1.6}
.enoikos__u{font-size:var(--t-xs);color:var(--muted);word-break:break-all}
.enoikos__c .btn{margin-block-start:auto;justify-content:center}
.enoikos__c--main .btn--blue{background:var(--blue)}
@media (max-width:860px){
  .enoikos{grid-template-columns:1fr}
  .enoikos__c{padding:var(--s5)}
}

/* --- 31. ΚΑΡΤΕΣ ΑΝΤΙ ΓΙΑ ΛΕΠΤΕΣ ΓΡΑΜΜΕΣ + feature εικόνα ---- */
/* Οι λίστες σε μεγάλο πλάτος (.items--2) γίνονται πλέγμα από κάρτες —
   γεμίζουν το πλάτος αντί να αφήνουν λευκό δεξιά. */
.items--2{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:var(--s4);border-top:0}
.items--2 .item{
  display:flex;flex-direction:column;align-items:flex-start;gap:var(--s4);min-height:128px;
  padding:var(--s5);border:1px solid var(--line);border-radius:8px;background:var(--white);
  transition:border-color .2s var(--ease),transform .2s var(--ease)
}
.items--2 .item:hover{border-color:var(--blue);transform:translateY(-2px)}
.items--2 .item>div{margin-block-start:auto}
.sec--black .items--2 .item,.on-black .items--2 .item{background:rgba(255,255,255,.03);border-color:var(--on-black-line)}
.feat__img{display:block;overflow:hidden;border-radius:8px;aspect-ratio:4 / 3;background:var(--black)}
.feat__img img{width:100%;height:100%;object-fit:cover;filter:saturate(.85) contrast(1.04)}
@media (max-width:860px){
  .items--2{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3)}
  .items--2 .item{min-height:0;padding:var(--s4)}
  .feat .c8-12{margin-block-start:var(--s5)}
}
@media (max-width:560px){
  .items--2{grid-template-columns:1fr}
}

/* --- 32. ΛΕΠΤΟΜΕΡΕΙΕΣ ΡΥΘΜΟΥ ------------------------------ */
/* γυάλινο πλαίσιο μόνο όταν η στήλη δεν έχει ήδη δικό της panel τιμής */
.phero--img .grid>.c8-12:has(.phero__price,.fx-pp){padding:0;border:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none}
/* footer μετά από σκούρο section: λεπτή γραμμή ώστε να μη «λιώνουν» μαζί */
.ft{border-top:1px solid var(--on-black-line)}
/* blog: 2×2 με φωτογραφίες */
.blog-grid:not(.blog-grid--2){grid-template-columns:repeat(2,minmax(0,1fr))}
.post-card--img{padding:0;overflow:hidden}
.post-card--img>*:not(.card__img){margin-inline:var(--s6)}
.post-card--img>time{margin-block-start:calc(var(--s5) * -1);position:relative}
.post-card--img>.lnk{margin-block-end:var(--s6)}
.post-card--img .card__img{aspect-ratio:21 / 9}
.post-card--now{justify-content:center}
@media (max-width:860px){
  .blog-grid:not(.blog-grid--2){grid-template-columns:1fr}
  .post-card--img>*:not(.card__img){margin-inline:var(--s5)}
  .post-card--img>.lnk{margin-block-end:var(--s5)}
}
/* κάρτες: πλήρες πλάτος → όσες στήλες χωράνε· μισή στήλη → 2 στήλες, η μονή τελευταία πιάνει όλη τη σειρά */
.items--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.wrap>.items--2{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.items--2:not(.wrap>.items--2)>.item:last-child:nth-child(odd){grid-column:1 / -1;min-height:0}
/* φόρμα: μία κάρτα */
.formcard{background:var(--white);border:1px solid var(--line);border-radius:8px;padding:var(--s6)}
.formcard__h{margin-block:var(--s3) var(--s4)}
.formcard>.panel,.rq__form>.panel{border:0;padding:0;background:none;border-radius:0}
.formcard>.panel>.lbl{display:none}
.formcard .gdpr{margin-block-start:var(--s4);color:var(--muted)}
/* blog «Σήμερα» */
.now__l{display:grid;gap:var(--s3);margin-block:var(--s5) var(--s6);padding-block-start:var(--s5);border-top:1px solid var(--on-black-line)}
.now__l li{display:grid;grid-template-columns:20px 1fr;gap:var(--s3);align-items:start;font-size:var(--t-sm);color:var(--on-black-2)}
.now__l .ic{width:20px;height:20px;color:var(--blue-l)}
@media (max-width:560px){
  .items--2,.wrap>.items--2{grid-template-columns:1fr}
  .formcard{padding:var(--s4)}
}

/* --- 33. ΛΟΓΟΤΥΠΟ (εικόνα) ------------------------------- */
/* Το header κρατά το αρχικό του ύψος (72px)· το λογότυπο χωράει μέσα με αέρα. */
.logo{flex-direction:row;align-items:center}
.logo picture{display:block}
.logo__img{display:block;height:56px;width:auto;transition:height .16s var(--ease)}
.hdr.is-stuck .logo__img{height:50px}
@media (max-width:1100px){
  .logo{justify-self:center}
  .logo__img,.hdr.is-stuck .logo__img{height:50px}
}
@media (max-width:380px){
  .logo__img,.hdr.is-stuck .logo__img{height:44px}
}