/* ============================================
   ΘΟΔΩΡΗΣ ΤΣΙΜΙΚΛΗΣ — ΛΟΓΙΣΤΙΚΟ ΓΡΑΦΕΙΟ
   Χρώματα, διάταξη, αποστάσεις
   ============================================ */

:root{
  --navy:#0e2a47;
  --navy-dark:#081b2f;
  --gold:#c9a227;
  --gold-light:#e3c463;
  --ink:#1a2330;
  --muted:#5b6b7c;
  --line:#e2e8f0;
  --bg:#f6f8fb;
  --white:#ffffff;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  color:var(--ink);background:var(--bg);line-height:1.65;-webkit-font-smoothing:antialiased;
}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
a{color:inherit;text-decoration:none}

/* ---------- HEADER ---------- */
.site-header{background:var(--navy);color:#fff;border-bottom:4px solid var(--gold)}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  gap:32px;padding:22px 0;flex-wrap:wrap;
}
.brand{display:flex;align-items:center;gap:16px}
.brand svg{flex-shrink:0}
.brand-text h1{font-size:1.55rem;font-weight:800;letter-spacing:-.5px;line-height:1.15}
.brand-text .sub{
  font-size:.72rem;letter-spacing:2.6px;text-transform:uppercase;
  color:var(--gold-light);font-weight:600;margin-top:4px;
}

/* ---------- ΠΛΑΙΣΙΟ ΣΤΟΙΧΕΙΩΝ (δεξιά) ---------- */
.info-card{
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.16);
  border-left:4px solid var(--gold);
  border-radius:10px;padding:16px 22px;min-width:290px;
  backdrop-filter:blur(4px);
}
.info-row{display:flex;align-items:flex-start;gap:11px;font-size:.93rem}
.info-row + .info-row{margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.12)}
.info-row .ic{color:var(--gold-light);flex-shrink:0;margin-top:3px}
.info-row .lbl{
  display:block;font-size:.65rem;letter-spacing:1.6px;text-transform:uppercase;
  color:rgba(255,255,255,.55);font-weight:600;margin-bottom:1px;
}
.info-row .val{font-weight:600;color:#fff}
.info-row a.val:hover{color:var(--gold-light)}

/* ---------- ΚΕΝΤΡΙΚΗ ΕΙΚΟΝΑ ---------- */
.hero{padding:56px 0 20px;text-align:center}
.hero-figure{
  position:relative;border-radius:16px;overflow:hidden;
  box-shadow:0 24px 60px -22px rgba(14,42,71,.55);
  max-width:1000px;margin:0 auto;
}
.hero-figure svg{display:block;width:100%;height:auto}
.hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,27,47,.15) 0%,rgba(8,27,47,.72) 55%,rgba(8,27,47,.92) 100%);
  display:flex;align-items:flex-end;justify-content:center;
  padding:40px 30px;
}
.hero-overlay h2{
  color:#fff;font-size:clamp(1.35rem,3.2vw,2.2rem);font-weight:800;
  line-height:1.3;max-width:820px;letter-spacing:-.4px;
  text-shadow:0 2px 18px rgba(0,0,0,.45);
}
.hero-overlay h2 .hl{
  color:var(--gold-light);
  border-bottom:3px solid var(--gold);padding-bottom:2px;
}

/* ---------- ΔΕΥΤΕΡΗ ΓΡΑΜΜΗ ---------- */
.subline{padding:44px 0 10px;text-align:center}
.subline .rule{width:62px;height:3px;background:var(--gold);border-radius:2px;margin:0 auto 22px}
.subline p{
  font-size:clamp(1.05rem,2.1vw,1.42rem);font-weight:600;color:var(--navy);
  max-width:820px;margin:0 auto;line-height:1.5;
}
.cta{
  display:inline-block;margin-top:26px;background:var(--gold);color:var(--navy-dark);
  font-weight:700;padding:14px 32px;border-radius:8px;font-size:1rem;
  box-shadow:0 8px 20px -8px rgba(201,162,39,.8);transition:.2s;
}
.cta:hover{background:var(--gold-light);transform:translateY(-2px)}

/* ---------- ΥΠΗΡΕΣΙΕΣ ---------- */
.services{padding:56px 0 66px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px}
.card{
  background:var(--white);border:1px solid var(--line);border-radius:12px;
  padding:28px 24px;transition:.22s;
}
.card:hover{transform:translateY(-4px);box-shadow:0 16px 34px -18px rgba(14,42,71,.4);border-color:#cfd9e4}
.card .badge{
  width:44px;height:44px;border-radius:10px;background:rgba(201,162,39,.13);
  display:flex;align-items:center;justify-content:center;margin-bottom:14px;color:var(--navy);
}
.card h3{font-size:1.06rem;font-weight:700;color:var(--navy);margin-bottom:7px}
.card p{font-size:.93rem;color:var(--muted)}

/* ---------- FOOTER ---------- */
.site-footer{background:var(--navy-dark);color:#fff;padding:52px 0 26px;border-top:4px solid var(--gold)}
.foot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:34px}
.foot-brand{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.foot-brand h4{font-size:1.15rem;font-weight:800}
.foot-brand .sub{font-size:.66rem;letter-spacing:2.2px;text-transform:uppercase;color:var(--gold-light);font-weight:600}
.foot-col h5{
  font-size:.72rem;letter-spacing:2px;text-transform:uppercase;
  color:var(--gold-light);font-weight:700;margin-bottom:14px;
}
.foot-col p, .foot-col a{font-size:.94rem;color:rgba(255,255,255,.82);display:block;margin-bottom:9px}
.foot-col a:hover{color:var(--gold-light)}
.foot-note{font-size:.86rem;color:rgba(255,255,255,.6);max-width:330px}
.copyright{
  margin-top:38px;padding-top:20px;border-top:1px solid rgba(255,255,255,.12);
  text-align:center;font-size:.82rem;color:rgba(255,255,255,.55);
}

/* ---------- ΚΙΝΗΤΑ ---------- */
@media (max-width:860px){
  .header-inner{justify-content:center;text-align:center;flex-direction:column}
  .info-card{width:100%;text-align:left}
  .hero{padding:34px 0 10px}
  .hero-overlay{
    padding:24px 18px;
    background:linear-gradient(180deg,rgba(8,27,47,.25) 0%,rgba(8,27,47,.85) 45%,rgba(8,27,47,.95) 100%);
  }
  .services{padding:40px 0 50px}
}