/* ==========================================================================
   D-SMART — dsmart.gr
   Ανθρακί #232527 + γαλάζιο σήματος #8CD2F0
   ========================================================================== */

:root{
  --graphite:#232527;
  --graphite-2:#2E3134;
  --night:#141618;
  --slate:#3C3C3C;
  --ink:#1A1C1D;
  --signal:#8CD2F0;
  --signal-soft:#A9DEF4;
  --signal-deep:#0B6E96;
  --paper:#F4F6F7;
  --white:#FFFFFF;
  --line:#DCE2E5;
  --line-dark:#3D4245;
  --muted:#666D71;
  --muted-dark:#AEB7BB;

  --wrap:1180px;
  --gap:clamp(1.25rem, 3vw, 2.25rem);
  --radius:14px;
  --radius-lg:20px;

  --shadow-sm:0 2px 10px -6px rgba(20,22,24,.35);
  --shadow-md:0 18px 40px -26px rgba(20,22,24,.55);
  --shadow-lg:0 30px 70px -40px rgba(20,22,24,.7);

  --font-display:"Fira Sans Condensed", "Arial Narrow", Arial, sans-serif;
  --font-body:"Commissioner", "Helvetica Neue", Arial, sans-serif;

  --header-h:74px;
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:calc(var(--header-h) + 12px)}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} }

body{
  margin:0;
  background:var(--paper);
  color:var(--slate);
  font-family:var(--font-body);
  font-size:1.0625rem;
  line-height:1.65;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{max-width:100%; height:auto; display:block}
figure{margin:0}

a{color:var(--signal-deep); text-decoration:none}
a:hover{text-decoration:underline}

h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-0.01em;
  color:var(--ink);
  margin:0 0 .5em;
  text-wrap:balance;
}
h1{font-size:clamp(2.1rem, 5.2vw, 3.6rem); font-weight:800}
h2{font-size:clamp(1.7rem, 3.6vw, 2.55rem)}
h3{font-size:1.2rem; letter-spacing:0}
p{margin:0 0 1rem; text-wrap:pretty}

:focus-visible{outline:3px solid var(--signal-deep); outline-offset:3px; border-radius:4px}
.section--dark :focus-visible,.hero :focus-visible{outline-color:var(--signal)}

.wrap{width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:clamp(1rem,4vw,2rem)}

.eyebrow{
  font-family:var(--font-display);
  font-size:.8125rem;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--signal-deep);
  margin:0 0 .85rem;
}
.eyebrow--light{color:var(--signal)}

.lede{font-size:1.15rem; color:var(--muted); max-width:62ch}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  font-family:var(--font-display); font-weight:600; font-size:1.0625rem;
  letter-spacing:.01em;
  padding:.8rem 1.5rem; border-radius:999px; border:2px solid transparent;
  text-decoration:none; cursor:pointer;
  transition:background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}
.btn:hover{text-decoration:none; transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn--primary{background:var(--signal); color:var(--ink); border-color:var(--signal)}
.btn--primary:hover{background:var(--signal-soft); border-color:var(--signal-soft)}
.btn--ghost{background:transparent; color:var(--white); border-color:rgba(255,255,255,.42)}
.btn--ghost:hover{border-color:var(--signal); color:var(--signal)}
.btn--dark{background:var(--graphite); color:var(--white); border-color:var(--graphite)}
.btn--dark:hover{background:var(--ink); border-color:var(--ink)}
@media (prefers-reduced-motion: reduce){ .btn:hover{transform:none} }

/* ---------- Δείκτης κύλισης ---------- */
.progress{
  position:fixed; top:0; left:0; height:3px; width:100%;
  transform:scaleX(0); transform-origin:0 50%;
  background:linear-gradient(90deg, var(--signal-deep), var(--signal));
  z-index:70; pointer-events:none;
}

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:60;
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(1.6) blur(12px);
  border-bottom:1px solid var(--line);
  transition:box-shadow .25s ease, background-color .25s ease;
}
.site-header.is-stuck{box-shadow:0 10px 30px -22px rgba(20,22,24,.8)}
.site-header__inner{display:flex; align-items:center; gap:1rem; min-height:var(--header-h)}
.brand{display:flex; align-items:center; gap:.7rem; text-decoration:none; margin-inline-end:auto}
.brand:hover{text-decoration:none}
.brand img{width:42px; height:42px; border-radius:9px}
.brand__name{font-family:var(--font-display); font-weight:700; font-size:1.3rem; letter-spacing:.06em; color:var(--ink)}
.brand__tag{display:block; font-family:var(--font-body); font-size:.7rem; font-weight:500; letter-spacing:.09em; text-transform:uppercase; color:var(--muted); margin-top:-2px}

.nav{display:flex; align-items:center; gap:.35rem}
.nav a{
  font-family:var(--font-display); font-weight:600; font-size:1.0625rem;
  color:var(--slate); padding:.45rem .8rem; border-radius:8px;
  transition:background-color .16s ease, color .16s ease;
}
.nav a:hover{background:var(--paper); color:var(--ink); text-decoration:none}
.nav a[aria-current="page"]{color:var(--signal-deep); box-shadow:inset 0 -2px 0 var(--signal)}

.nav a.header-call{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:var(--font-display); font-weight:700; font-size:1.05rem;
  background:var(--graphite); color:var(--white);
  padding:.55rem 1.1rem; border-radius:999px; margin-inline-start:.5rem;
}
.nav a.header-call:hover{background:var(--signal); color:var(--ink); text-decoration:none}

.nav-toggle{display:none; background:none; border:1px solid var(--line); border-radius:9px; padding:.5rem .65rem; cursor:pointer}
.nav-toggle span{display:block; width:20px; height:2px; background:var(--slate); margin:4px 0; transition:transform .22s ease, opacity .22s ease}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

@media (max-width:900px){
  .nav-toggle{display:block; margin-inline-start:auto}
  .nav{
    position:absolute; inset-inline:0; top:100%;
    flex-direction:column; align-items:stretch; gap:0;
    background:var(--white); border-bottom:1px solid var(--line);
    padding:.5rem clamp(1rem,4vw,2rem) 1.1rem;
    display:none; box-shadow:var(--shadow-md);
  }
  .nav.is-open{display:flex}
  .nav a{padding:.75rem .25rem; border-radius:0; border-bottom:1px solid var(--line)}
  .nav a.header-call{margin:.8rem 0 0; justify-content:center; border-bottom:0}
}

/* ==========================================================================
   HERO — εναλλασσόμενες εικόνες
   ========================================================================== */
.hero{
  position:relative;
  background:var(--night);
  color:var(--white);
  overflow:hidden;
  isolation:isolate;
}
.hero__bg{position:absolute; inset:0; z-index:0}
.hero__slide{
  position:absolute; inset:0;
  background-position:62% center;
  background-size:cover;
  background-repeat:no-repeat;
  opacity:0;
  transform:scale(1.06);
  transition:opacity 1.4s ease;
  will-change:opacity, transform;
}
.hero__slide.is-active{opacity:1; animation:kenburns 9s linear forwards}
@keyframes kenburns{ from{transform:scale(1.005)} to{transform:scale(1.075)} }

.hero__scrim{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(97deg, rgba(16,18,19,.97) 0%, rgba(16,18,19,.90) 42%, rgba(16,18,19,.34) 100%),
    linear-gradient(to top, rgba(16,18,19,.85) 0%, rgba(16,18,19,0) 45%);
}
.hero__inner{position:relative; z-index:2; padding-block:clamp(3.5rem, 9vw, 6.5rem)}
.hero h1{color:var(--white); max-width:16ch; margin-bottom:.6rem}
.hero__sub{color:#C7CFD3; font-size:1.15rem; max-width:44ch; margin-bottom:2.4rem}

/* «ζωντανή» ένδειξη δίπλα στο eyebrow */
.live-dot{
  display:inline-block; width:8px; height:8px; border-radius:50%;
  background:var(--signal); margin-inline-end:.55rem; vertical-align:middle;
  box-shadow:0 0 0 0 rgba(140,210,240,.7);
  animation:pulse 2.4s ease-out infinite;
}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(140,210,240,.6)}
  70%{box-shadow:0 0 0 12px rgba(140,210,240,0)}
  100%{box-shadow:0 0 0 0 rgba(140,210,240,0)}
}

/* Το τηλέφωνο είναι το μεγαλύτερο στοιχείο της σελίδας */
.hero__phone{
  display:inline-block; text-decoration:none; color:var(--white);
  border-bottom:3px solid rgba(140,210,240,.35);
  padding-bottom:.15rem;
  transition:border-color .2s ease;
}
.hero__phone:hover{border-color:var(--signal); text-decoration:none}
.hero__phone-label{
  display:block; font-family:var(--font-display); font-size:.8125rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase; color:var(--signal); margin-bottom:.1rem;
}
.hero__phone-num{
  display:block; font-family:var(--font-display); font-weight:800;
  font-size:clamp(2.8rem, 9vw, 5.4rem); line-height:.95; letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;
}
.hero__phone2{
  display:block; margin-top:1rem; font-family:var(--font-display); font-weight:600;
  font-size:1.25rem; color:#C7CFD3; text-decoration:none; letter-spacing:.02em;
}
.hero__phone2:hover{color:var(--signal); text-decoration:none}
.hero__actions{display:flex; flex-wrap:wrap; gap:.75rem; margin-top:2.4rem}

/* Λεζάντα + χειριστήρια slideshow */
.hero__ticker{
  position:relative; z-index:2;
  border-top:1px solid rgba(255,255,255,.14);
  padding-block:1rem 1.15rem;
  display:flex; align-items:center; gap:1.25rem; flex-wrap:wrap;
}
.hero__caption{
  font-family:var(--font-display); font-weight:600; font-size:1.02rem;
  color:#C7CFD3; letter-spacing:.02em; margin:0; min-height:1.4em;
  transition:opacity .4s ease;
}
.hero__caption.is-fading{opacity:0}
.hero__dots{display:flex; gap:.5rem; margin-inline-start:auto; padding:0; list-style:none}
.hero__dots button{
  width:34px; height:4px; border:0; padding:0; cursor:pointer; border-radius:99px;
  background:rgba(255,255,255,.25); transition:background-color .25s ease;
}
.hero__dots button[aria-current="true"]{background:var(--signal)}
.hero__dots button:hover{background:rgba(255,255,255,.55)}

@media (max-width:760px){
  .hero__ticker{padding-block:.9rem 1.4rem; gap:.75rem}
  .hero__caption{font-size:.95rem; flex:1 1 100%}
  .hero__dots{margin-inline-start:0}
}

@media (prefers-reduced-motion: reduce){
  .hero__slide.is-active{animation:none; transform:none}
  .hero__slide{transition:none}
  .live-dot{animation:none}
}

/* ---------- Credentials strip ---------- */
.creds{background:var(--graphite-2); color:#C7CFD3; border-top:1px solid var(--line-dark)}
.creds__list{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(230px,1fr));
  gap:1px; background:var(--line-dark); list-style:none; margin:0; padding:0;
}
.creds__list li{background:var(--graphite-2); padding:1.15rem clamp(1rem,4vw,2rem); font-size:.98rem}
.creds__list strong{display:block; font-family:var(--font-display); font-size:1.05rem; color:var(--white); letter-spacing:.01em}

/* ---------- Sections ---------- */
.section{padding-block:clamp(3.25rem, 7vw, 5.5rem)}
.section--dark{background:var(--graphite); color:#C7CFD3}
.section--night{background:var(--night); color:#C7CFD3}
.section--dark h1,.section--dark h2,.section--dark h3,
.section--night h1,.section--night h2,.section--night h3{color:var(--white)}
.section--tint{background:var(--white)}
.section__head{max-width:60ch; margin-bottom:clamp(2rem,4vw,3rem)}
.section__head p{color:var(--muted)}
.section--dark .section__head p,.section--night .section__head p{color:var(--muted-dark)}
.section__head--row{max-width:none; display:flex; align-items:flex-end; justify-content:space-between; gap:1.5rem; flex-wrap:wrap}
.section__head--row > div{max-width:56ch}

/* ---------- Card grid ---------- */
.grid{display:grid; gap:var(--gap)}
.grid--3{grid-template-columns:repeat(auto-fit, minmax(290px, 1fr))}
.grid--2{grid-template-columns:repeat(auto-fit, minmax(340px, 1fr))}

.card{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.6rem 1.5rem;
  border-top:3px solid var(--signal);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.card h3{margin-bottom:.45rem}
.card p{margin:0; color:var(--muted); font-size:.99rem}
.card:hover{transform:translateY(-3px); box-shadow:var(--shadow-md)}
.section--tint .card{background:var(--paper)}

.card__icon{width:30px; height:30px; margin-bottom:.9rem; color:var(--signal-deep)}
.card__icon svg{width:100%; height:100%; display:block}

@media (prefers-reduced-motion: reduce){ .card:hover{transform:none} }

/* ==========================================================================
   Carousel — λύσεις ανά χώρο
   ========================================================================== */
.rail{position:relative}
.rail__track{
  display:grid; grid-auto-flow:column; grid-auto-columns:minmax(272px, 32%);
  gap:1.1rem; overflow-x:auto; scroll-snap-type:x mandatory;
  padding-block:.35rem 1.25rem; margin-inline:calc(-1 * clamp(1rem,4vw,2rem));
  padding-inline:clamp(1rem,4vw,2rem);
  scrollbar-width:none; -ms-overflow-style:none;
  overscroll-behavior-x:contain;
}
.rail__track::-webkit-scrollbar{display:none}
.rail__track{cursor:grab; touch-action:pan-x}
.rail__track.is-grabbing{cursor:grabbing}
.rail__track:focus-visible{outline-offset:-3px}
@media (max-width:720px){ .rail__track{grid-auto-columns:minmax(240px, 78%)} }

.tile{
  position:relative; scroll-snap-align:start;
  border-radius:var(--radius-lg); overflow:hidden;
  aspect-ratio:4/5; display:block; color:var(--white);
  background:var(--graphite); isolation:isolate;
}
.tile img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform .6s cubic-bezier(.2,.7,.3,1);
}
.tile::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(14,16,17,.92) 6%, rgba(14,16,17,.22) 52%, rgba(14,16,17,.05) 100%);
}
.tile__body{position:absolute; inset-inline:0; bottom:0; z-index:2; padding:1.25rem 1.25rem 1.35rem}
.tile__body h3{color:var(--white); font-size:1.32rem; margin:0 0 .3rem}
.tile__body p{margin:0; font-size:.94rem; color:#C7CFD3; line-height:1.5}
.tile:hover img{transform:scale(1.06)}
@media (prefers-reduced-motion: reduce){ .tile:hover img{transform:none} }

.rail__nav{display:flex; gap:.5rem}
.rail__btn{
  width:44px; height:44px; border-radius:50%; cursor:pointer;
  border:1px solid var(--line); background:var(--white); color:var(--ink);
  display:inline-flex; align-items:center; justify-content:center;
  transition:background-color .18s ease, color .18s ease, border-color .18s ease, opacity .18s ease;
}
.rail__btn svg{width:20px; height:20px}
.rail__btn:hover{background:var(--graphite); color:var(--white); border-color:var(--graphite)}
.rail__btn[disabled]{opacity:.35; cursor:default}
.rail__btn[disabled]:hover{background:var(--white); color:var(--ink); border-color:var(--line)}
.section--dark .rail__btn,.section--night .rail__btn{background:transparent; color:var(--white); border-color:rgba(255,255,255,.3)}
.section--dark .rail__btn:hover,.section--night .rail__btn:hover{background:var(--signal); color:var(--ink); border-color:var(--signal)}

/* ==========================================================================
   Marquee συσκευών
   ========================================================================== */
.marquee{
  position:relative; overflow-x:auto; overflow-y:hidden;
  scrollbar-width:none; -ms-overflow-style:none;
  overscroll-behavior-x:contain;
  cursor:grab; touch-action:pan-x;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
}
.marquee::-webkit-scrollbar{display:none}
.marquee.is-grabbing{cursor:grabbing}
.marquee__track{display:flex; width:max-content}
.marquee__item{
  width:250px; flex:0 0 auto; margin-inline-end:1rem; border-radius:var(--radius); overflow:hidden;
  background:var(--graphite-2); border:1px solid var(--line-dark);
}
.marquee__item img{width:100%; aspect-ratio:16/10; object-fit:cover}
.marquee__title{
  font-family:var(--font-display); font-size:.9rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--signal);
  margin-bottom:1.1rem;
}
.marquee-wrap{
  margin-top:clamp(2.5rem,5vw,3.75rem);
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; flex-wrap:wrap;
}
.marquee-wrap .marquee__title{margin-bottom:0}
.marquee__item span{
  display:block; font-family:var(--font-display); font-weight:600; font-size:.97rem;
  color:#C7CFD3; padding:.7rem .9rem .8rem;
}
@media (prefers-reduced-motion: reduce){
  .marquee{cursor:default}
  .marquee__track{flex-wrap:wrap; width:auto; justify-content:center; gap:1rem}
  .marquee__item{margin-inline-end:0}
}

/* ==========================================================================
   Βήματα διαδικασίας
   ========================================================================== */
.steps{list-style:none; margin:0; padding:0; display:grid; gap:1.25rem; counter-reset:step}
@media (min-width:820px){ .steps{grid-template-columns:repeat(4,1fr); gap:0} }
.steps li{position:relative; padding-top:2.6rem; counter-increment:step}
@media (min-width:820px){ .steps li{padding-inline-end:1.75rem} }
.steps li::before{
  content:counter(step,decimal-leading-zero);
  position:absolute; top:0; left:0;
  font-family:var(--font-display); font-weight:800; font-size:1.05rem;
  color:var(--signal-deep); letter-spacing:.06em;
}
.steps li::after{
  content:""; position:absolute; top:.55rem; left:2.4rem; right:0; height:1px;
  background:var(--line);
}
.steps li:last-child::after{display:none}
@media (max-width:819px){ .steps li::after{display:none} }
.steps h3{font-size:1.12rem; margin-bottom:.3rem}
.steps p{margin:0; color:var(--muted); font-size:.98rem}
.section--dark .steps li::before{color:var(--signal)}
.section--dark .steps li::after{background:var(--line-dark)}
.section--dark .steps p{color:var(--muted-dark)}

/* ---------- Media band (εικόνα + κείμενο) ---------- */
.band{display:grid; gap:clamp(1.75rem,4vw,3.5rem); align-items:center; grid-template-columns:1fr}
@media (min-width:860px){ .band{grid-template-columns:1.05fr .95fr} }
.band--flip .band__media{order:-1}
@media (max-width:859px){ .band--flip .band__media{order:0} }
.band__media img{border-radius:var(--radius); box-shadow:var(--shadow-md)}
.ajax-badge{max-width:280px; margin-bottom:1.5rem}

/* λίστα με τικ */
.ticks{list-style:none; margin:0 0 1.75rem; padding:0; display:grid; gap:.7rem}
.ticks li{position:relative; padding-inline-start:1.9rem; font-size:1.02rem}
.ticks li::before{
  content:""; position:absolute; left:0; top:.55em;
  width:11px; height:6px; border-inline-start:2px solid var(--signal);
  border-block-end:2px solid var(--signal); transform:rotate(-45deg);
}

/* ---------- Bitcoin band ---------- */
.bitcoin{background:var(--signal); color:var(--ink)}
.bitcoin h2{color:var(--ink)}
.bitcoin .eyebrow{color:#0A5372}
.bitcoin__inner{display:grid; gap:1.5rem; align-items:center; grid-template-columns:1fr}
@media (min-width:820px){ .bitcoin__inner{grid-template-columns:auto 1fr; gap:2.5rem} }
.bitcoin__mark{
  font-family:var(--font-display); font-weight:800; font-size:clamp(4rem,12vw,7rem);
  line-height:1; color:var(--ink); opacity:.9;
}
.bitcoin p{color:#14343F; margin:0; max-width:58ch}

/* ---------- Λίστα υπηρεσιών με εικόνες ---------- */
.svc{display:grid; gap:1.6rem; grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.svc__item{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; transition:transform .2s ease, box-shadow .2s ease;
}
.svc__item:hover{transform:translateY(-3px); box-shadow:var(--shadow-md)}
.svc__item img{aspect-ratio:16/10; object-fit:cover; width:100%}
.svc__body{padding:1.35rem 1.4rem 1.6rem}
.svc__body h3{margin-bottom:.4rem}
.svc__body p{margin:0; color:var(--muted); font-size:.99rem}
@media (prefers-reduced-motion: reduce){ .svc__item:hover{transform:none} }

/* ---------- Πιστοποιητικά ---------- */
.certs{display:grid; gap:1.1rem; grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}
.certs img{
  border:1px solid var(--line); border-radius:10px; background:var(--white);
  transition:transform .2s ease, box-shadow .2s ease;
}
.certs a:hover img{transform:scale(1.03); box-shadow:var(--shadow-md)}
@media (prefers-reduced-motion: reduce){ .certs a:hover img{transform:none} }

/* ---------- Επικοινωνία ---------- */
.contact-grid{display:grid; gap:clamp(2rem,5vw,3.5rem); grid-template-columns:1fr}
@media (min-width:900px){ .contact-grid{grid-template-columns:.9fr 1.1fr} }

.contact-list{list-style:none; margin:0 0 2rem; padding:0}
.contact-list li{padding:1rem 0; border-bottom:1px solid var(--line)}
.contact-list li:first-child{padding-top:0}
.contact-list span{
  display:block; font-size:.78rem; font-weight:600; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted); margin-bottom:.2rem;
}
.contact-list a,.contact-list strong{
  font-family:var(--font-display); font-weight:700; font-size:1.35rem; color:var(--ink);
  font-variant-numeric:tabular-nums; letter-spacing:.01em;
}
.contact-list a:hover{color:var(--signal-deep)}

.form{background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:clamp(1.4rem,3vw,2.2rem); box-shadow:var(--shadow-sm)}
.field{margin-bottom:1.1rem}
.field label{display:block; font-weight:600; font-size:.92rem; margin-bottom:.35rem; color:var(--ink)}
.field input,.field textarea{
  width:100%; font-family:inherit; font-size:1rem; color:var(--ink);
  padding:.75rem .9rem; border:1px solid var(--line); border-radius:9px; background:var(--paper);
  transition:border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}
.field input:focus,.field textarea:focus{border-color:var(--signal-deep); background:var(--white); outline:none; box-shadow:0 0 0 3px rgba(11,110,150,.15)}
.field textarea{min-height:150px; resize:vertical}
.hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.form__note{font-size:.85rem; color:var(--muted); margin:.9rem 0 0}

.alert{padding:.9rem 1.1rem; border-radius:10px; margin-bottom:1.4rem; font-size:.97rem}
.alert--ok{background:#E4F5EA; border:1px solid #B4E0C4; color:#1C5733}
.alert--err{background:#FDEBEB; border:1px solid #F2C2C2; color:#8A2020}

.map{border:0; width:100%; height:340px; border-radius:var(--radius); display:block; filter:grayscale(.25)}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink); color:#9AA3A7; padding-block:3rem 2rem; font-size:.95rem}
.site-footer a{color:#C7CFD3}
.site-footer a:hover{color:var(--signal)}
.footer-grid{display:grid; gap:2rem; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); margin-bottom:2.25rem}
.site-footer h4{font-size:.8rem; letter-spacing:.16em; text-transform:uppercase; color:var(--signal); margin-bottom:.9rem}
.site-footer ul{list-style:none; margin:0; padding:0}
.site-footer li{margin-bottom:.45rem}
.footer-bottom{border-top:1px solid #2C3033; padding-top:1.4rem; display:flex; flex-wrap:wrap; gap:.75rem 1.5rem; justify-content:space-between; font-size:.87rem}

/* ---------- Κινητό: σταθερή μπάρα κλήσης ---------- */
.call-bar{
  position:fixed; inset-inline:0; bottom:0; z-index:65;
  display:none; gap:1px; background:var(--line-dark);
}
.call-bar a{
  flex:1; text-align:center; padding:.95rem .5rem;
  font-family:var(--font-display); font-weight:700; font-size:1.02rem;
  background:var(--graphite); color:var(--white); text-decoration:none;
}
.call-bar a.is-accent{background:var(--signal); color:var(--ink)}
@media (max-width:760px){
  .call-bar{display:flex}
  body{padding-bottom:56px}
}

/* ---------- Reveal ---------- */
.reveal{opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s cubic-bezier(.2,.7,.3,1)}
.reveal.is-in{opacity:1; transform:none}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1; transform:none; transition:none}
}

/* βοηθητικά */
.center{text-align:center}
.mt-lg{margin-top:1.75rem}
.stack-actions{display:flex; flex-wrap:wrap; gap:.75rem}
.stack-actions--center{justify-content:center}
.visually-hidden{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0}

/* ==========================================================================
   Κεφαλίδα εσωτερικής σελίδας
   ========================================================================== */
.pagehead{
  position:relative; background:var(--night); color:#C7CFD3;
  overflow:hidden; isolation:isolate;
}
.pagehead::before{
  content:""; position:absolute; inset:0; z-index:-2;
  background-position:center; background-size:cover; background-repeat:no-repeat;
  transform:scale(1.02);
}
.pagehead::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(100deg, rgba(16,18,19,.97) 0%, rgba(16,18,19,.90) 45%, rgba(16,18,19,.45) 100%);
}
.pagehead h1{color:var(--white); max-width:20ch}
.pagehead .lede{color:var(--muted-dark)}
.pagehead__inner{padding-block:clamp(2.75rem, 7vw, 4.75rem)}
.pagehead--services::before{background-image:url("img/hero-5.jpg")}
.pagehead--company::before{background-image:url("img/hero-2.jpg")}
.pagehead--contact::before{background-image:url("img/hero-4.jpg"); background-position:60% center}

/* ==========================================================================
   Co-branded αφίσες Ajax × D-SMART
   ========================================================================== */
.poster{
  scroll-snap-align:start; display:block; border-radius:var(--radius-lg);
  overflow:hidden; background:#000; border:1px solid var(--line-dark);
  transition:transform .25s cubic-bezier(.2,.7,.3,1), border-color .25s ease;
}
.poster img{width:100%; aspect-ratio:4/5; object-fit:cover; display:block}
.poster:hover{transform:translateY(-4px); border-color:var(--signal)}
@media (prefers-reduced-motion: reduce){ .poster:hover{transform:none} }

/* λογότυπο στο footer */
.footer-logo{
  width:72px; height:72px; border-radius:12px; margin-bottom:1.1rem;
}