/* UpLevel — shared design system
   Fonts: Space Grotesk (headings) + DM Sans (body)
   Brand: yellow -> lime -> green chevron gradient, ink near-black, warm paper */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600&display=swap');

:root {
  --ink: #0F1511;
  --paper: #FAFAF5;
  --surface: #FFFFFF;
  --muted: #5B6A5E;
  --line: #E7E9E1;
  --yellow: #EDE21C;
  --lime: #B7D634;
  --green: #74C043;
  --green-600: #5AA531;
  --dark: #14331F;
  --grad: linear-gradient(100deg, var(--yellow) 0%, var(--lime) 48%, var(--green) 100%);
}

* { -webkit-font-smoothing: antialiased; }
html { scroll-behavior: smooth; }
body {
  background: var(--paper);
  color: var(--ink);
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 17px;
  line-height: 1.65;
}
h1,h2,h3,h4 { font-family: 'Space Grotesk', system-ui, sans-serif; letter-spacing: -0.02em; line-height: 1.08; }

/* ---- Brand helpers ---- */
.font-head { font-family: 'Space Grotesk', system-ui, sans-serif; }
.grad-text {
  background: var(--grad);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.grad-bg { background: var(--grad); }
.grad-rule { height: 4px; border-radius: 99px; background: var(--grad); }

/* Wordmark */
.wordmark { font-family:'Space Grotesk',sans-serif; font-weight:700; letter-spacing:-0.01em; }
.wordmark .lv { letter-spacing: 0.06em; }

/* Chevron motif */
.chev { display:inline-flex; gap:3px; align-items:center; }
.chev svg { display:block; }

/* Buttons */
.btn { display:inline-flex; align-items:center; gap:.55rem; font-family:'Space Grotesk',sans-serif;
  font-weight:600; border-radius:14px; padding:.85rem 1.4rem; transition:transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease;
  cursor:pointer; line-height:1; }
.btn-primary { color:#0F1511; background: var(--grad); box-shadow: 0 8px 24px rgba(116,192,67,.28); }
.btn-primary:hover { box-shadow: 0 12px 34px rgba(116,192,67,.42); transform: translateY(-2px); }
.btn-ghost { color:var(--ink); background:transparent; border:1.5px solid var(--line); }
.btn-ghost:hover { border-color:var(--green); color:var(--green-600); }
.btn-dark { color:#F3F7EE; background:var(--dark); }
.btn-dark:hover { transform:translateY(-2px); box-shadow:0 12px 30px rgba(20,51,31,.35); }

/* Cards */
.card { background:var(--surface); border:1px solid var(--line); border-radius:22px;
  box-shadow: 0 2px 6px rgba(15,21,17,.03), 0 14px 34px rgba(15,21,17,.05);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.card-hover:hover { transform: translateY(-4px); box-shadow: 0 10px 24px rgba(15,21,17,.06), 0 26px 60px rgba(15,21,17,.09); border-color:#D9E3CC; }

/* Eyebrow label */
.eyebrow { display:inline-flex; align-items:center; gap:.5rem; font-family:'Space Grotesk',sans-serif;
  font-weight:600; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--green-600); }

/* Section pad */
.section { padding: clamp(4rem, 8vw, 7rem) 0; }
.container { width:100%; max-width:1180px; margin:0 auto; padding:0 24px; }

/* Nav */
.nav-link { position:relative; font-weight:500; color:var(--ink); padding:.35rem 0; transition:color .2s ease; }
.nav-link:hover { color:var(--green-600); }
.nav-link.active { color:var(--green-600); }
.nav-link.active::after, .nav-link:hover::after {
  content:''; position:absolute; left:0; right:0; bottom:-2px; height:2px; border-radius:2px; background:var(--grad); }

/* Glucose curve animation */
.glucose-path { stroke-dasharray: 1200; stroke-dashoffset: 1200; animation: draw 2.6s ease forwards; }
.glucose-dot { opacity:0; animation: pop .4s ease forwards; }
@keyframes draw { to { stroke-dashoffset: 0; } }
@keyframes pop { to { opacity:1; } }

.reveal { opacity:0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.reveal.in { opacity:1; transform:none; }

.float { animation: floaty 6s ease-in-out infinite; }
@keyframes floaty { 0%,100%{ transform: translateY(0);} 50%{ transform: translateY(-10px);} }

/* Marquee for press logos */
.marquee { overflow:hidden; }
.marquee__track { display:flex; gap:3.5rem; width:max-content; animation: slide 28s linear infinite; }
@keyframes slide { to { transform: translateX(-50%); } }

/* Accordion */
.acc-panel { max-height:0; overflow:hidden; transition:max-height .35s ease; }
.acc-item.open .acc-panel { max-height: 460px; }
.acc-item.open .acc-icon { transform: rotate(45deg); }
.acc-icon { transition: transform .3s ease; }

details summary::-webkit-details-marker { display:none; }

@media (max-width: 767px){
  body { font-size:16px; }
}

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


/* ---- form fields (kapcsolat) ---- */
.fld { width:100%; background:var(--paper); border:1.5px solid var(--line); border-radius:12px; padding:.75rem 1rem;
  font-family:'DM Sans',sans-serif; font-size:15px; color:var(--ink); transition:border-color .2s ease, box-shadow .2s ease; }
.fld:focus { outline:none; border-color:var(--green); box-shadow:0 0 0 4px rgba(116,192,67,.14); }
.fld::placeholder { color:#9AA79A; }
/* ---- check marks (szolgaltatasok) ---- */
.chk { flex:none; width:22px; height:22px; border-radius:7px; background:var(--grad); position:relative; }
.chk::after { content:''; position:absolute; left:7px; top:4px; width:6px; height:11px; border:solid #14331F; border-width:0 2.5px 2.5px 0; transform:rotate(45deg); }
.yes { display:inline-block; width:20px; height:20px; border-radius:50%; background:var(--grad); position:relative; }
.yes::after { content:''; position:absolute; left:6.5px; top:3.5px; width:5px; height:9px; border:solid #14331F; border-width:0 2px 2px 0; transform:rotate(45deg); }