:root{
  --c-bg:#ffffff;
  --c-text:#1a1a1a;
  --c-muted:#5a5a5a;

  --c-primary:#6b8f3f;
  --c-primary-700:#4f6b2d;
  --c-secondary:#f5f3ea;

  --c-border:#e6e6e6;
  --c-focus:#1a73e8;

  --r-sm:6px;
  --r-md:10px;

  --s-2:.5rem;
  --s-3:.75rem;
  --s-4:1rem;
  --s-6:1.5rem;
  --s-8:2rem;
  --s-12:3rem;

  --shadow-sm:0 4px 12px rgba(0,0,0,.08);
}

/* Base */
*,
*::before,
*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  line-height:1.6;
  color:var(--c-text);
  background:var(--c-bg);
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation:none !important;
    transition:none !important;
    scroll-behavior:auto !important;
  }
}

/* Focus */
:focus-visible{
  outline:3px solid var(--c-focus);
  outline-offset:3px;
}

/* Skip link */
.skip-link{
  position:absolute;
  left:-9999px;
  top:auto;
}
.skip-link:focus{
  left:var(--s-4);
  top:var(--s-4);
  background:#fff;
  padding:var(--s-2) var(--s-3);
  border-radius:var(--r-sm);
  box-shadow:var(--shadow-sm);
  z-index:9999;
}

/* Layout */
.site{ min-height:100vh; display:flex; flex-direction:column; }
.main{ flex:1; }

/* ✅ ΑΥΤΟ ΣΕ ΕΚΑΙΓΕ: min() + calc() */
.container{
  width: min(1200px, calc(100% - 2rem));
  margin-inline:auto;
}

/* Header */
.header{
  border-bottom:1px solid var(--c-border);
  background:#fff;
}
.header__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--s-4);
  padding:var(--s-4) 0;
}
.brand{
  text-decoration:none;
  color:inherit;
  font-weight:700;
}
.nav{
  display:flex;
  gap:var(--s-4);
  flex-wrap:wrap;
}
.nav__link{
  text-decoration:none;
  color:var(--c-text);
  padding:var(--s-2) var(--s-3);
  border-radius:var(--r-sm);
}
.nav__link:hover{ background:var(--c-secondary); }
.nav__cta{
  background:var(--c-primary);
  color:#fff;
}
.nav__cta:hover{ background:var(--c-primary-700); }

/* Hero */
.hero{
  padding:var(--s-12) 0;
  background:linear-gradient(180deg, #fff, var(--c-secondary));
}
.hero__inner{
  display:grid;
  grid-template-columns:1.2fr 0.8fr;
  gap:var(--s-8);
  align-items:center;
}
.hero h1{
  font-size:clamp(1.8rem, 3vw, 2.4rem);
  line-height:1.2;
  margin:0 0 var(--s-4);
}
.hero__lead{
  color:var(--c-muted);
  margin:0 0 var(--s-6);
}
.hero__actions{
  display:flex;
  gap:var(--s-3);
  flex-wrap:wrap;
}
.hero__badges{
  list-style:none;
  padding:0;
  margin:var(--s-6) 0 0;
  display:flex;
  gap:var(--s-3);
  flex-wrap:wrap;
}
.hero__badges li{
  background:#fff;
  border:1px solid var(--c-border);
  padding:var(--s-2) var(--s-3);
  border-radius:var(--r-sm);
}

/* Optional hero image */
.hero__media img{
  max-width:100%;
  height:auto;
  display:block;
  border-radius:var(--r-md);
  box-shadow:var(--shadow-sm);
}

/* Sections */
.section{ padding:var(--s-12) 0; }
.steps{ padding-left:1.2rem; }

/* Grid */
.grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:var(--s-6);
}

/* Cards */
.card{
  border:1px solid var(--c-border);
  border-radius:var(--r-md);
  padding:var(--s-6);
  background:#fff;
}
.card h3{ margin:0 0 var(--s-2); }

/* Buttons */
.btn{
  display:inline-block;
  text-decoration:none;
  border:none;
  cursor:pointer;
  font:inherit;
  padding:var(--s-3) var(--s-6);
  border-radius:var(--r-sm);
  background:var(--c-secondary);
  color:var(--c-text);
}
.btn:hover{ background:#ece9dd; }

.btn--primary{
  background:var(--c-primary);
  color:#fff;
}
.btn--primary:hover{ background:var(--c-primary-700); }

.btn--secondary{
  background:#fff;
  border:1px solid var(--c-border);
}

.btn--small{
  padding:var(--s-2) var(--s-4);
}

/* Forms */
.form{ max-width:560px; }
.field{
  display:flex;
  flex-direction:column;
  gap:var(--s-2);
  margin-bottom:var(--s-4);
}
input, textarea{
  font:inherit;
  padding:var(--s-3);
  border-radius:var(--r-sm);
  border:1px solid var(--c-border);
}
input:focus, textarea:focus{
  border-color:var(--c-focus);
}

/* FAQ */
.faq details{
  border:1px solid var(--c-border);
  border-radius:var(--r-sm);
  padding:var(--s-4);
  margin-bottom:var(--s-3);
}
.faq summary{ cursor:pointer; font-weight:600; }

/* Footer */
.footer{
  border-top:1px solid var(--c-border);
  background:#fafafa;
}
.footer__inner{
  display:flex;
  justify-content:space-between;
  gap:var(--s-4);
  padding:var(--s-6) 0;
}
.footer a{
  color:inherit;
  text-decoration:none;
}
.footer a:hover{ text-decoration:underline; }

/* Responsive */
@media (max-width: 768px){
  .hero__inner{ grid-template-columns:1fr; }
}
