/* Web Solution – egyedi stílusok a Bootstrap 5 fölé */
:root {
  --ws-ink: #26222A;
  --ws-muted: #4D4752;
  --ws-bg: #F7F7F5;
  --ws-band: #ECECE8;
  --ws-line: #E2E2DC;
  --ws-teal: #2BA59B;
  --ws-teal-dark: #17736C;
  --ws-lime: #8CC63F;
  --ws-lime-ink: #1C2A12;
  --ws-aubergine: #3A2E3D;
  --ws-aubergine-2: #463949;
  --ws-aubergine-line: #5A4C5E;
  --ws-on-dark: #DCD5DE;
  --ws-gradient: linear-gradient(135deg, var(--ws-teal), var(--ws-lime));

  --bs-body-font-family: 'Open Sans', system-ui, sans-serif;
  --bs-body-color: var(--ws-ink);
  --bs-body-bg: var(--ws-bg);
  --bs-link-color-rgb: 23, 115, 108;
  --bs-link-hover-color-rgb: 15, 85, 80;
}

body { font-size: 1.0625rem; line-height: 1.6; overflow-x: hidden; }

.font-display,
h1, h2, h3, .h1, .h2, .h3 {
  font-family: 'Oswald', sans-serif;
  font-weight: 500;
  text-transform: uppercase;
}

.eyebrow {
  font-size: .8125rem; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--ws-teal-dark);
}
.text-ws-muted { color: var(--ws-muted); }
.text-ws-teal { color: var(--ws-teal-dark); }

/* Gombok */
.btn-ws {
  font-family: 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: .06em;
  font-weight: 500; border-radius: 4px; min-height: 52px; padding: 0 1.75rem;
  display: inline-flex; align-items: center; justify-content: center;
}
.btn-ws-primary { background: var(--ws-lime); color: var(--ws-lime-ink); border: 2px solid var(--ws-lime); }
.btn-ws-primary:hover, .btn-ws-primary:focus-visible { background: #7AB32F; border-color: #7AB32F; color: var(--ws-lime-ink); }
.btn-ws-outline { background: transparent; color: var(--ws-ink); border: 2px solid var(--ws-ink); }
.btn-ws-outline:hover, .btn-ws-outline:focus-visible { background: var(--ws-ink); color: #fff; }
.btn-ws-dark { background: var(--ws-ink); color: #fff; border: 0; }
.btn-ws-dark:hover, .btn-ws-dark:focus-visible { background: #000; color: #fff; }
.btn-ws-sm { min-height: 44px; padding: 0 1.25rem; }

/* Navigáció */
.ws-navbar { background: #fff; border-bottom: 1px solid var(--ws-line); }
.ws-brand { color: var(--ws-ink); font-size: 1.625rem; letter-spacing: -.01em; }
.ws-brand:hover { color: var(--ws-ink); }
.ws-logo-svg { flex: 0 0 auto; display: block; }
.ws-tld { font-weight: 400; color: var(--ws-teal-dark); }
.ws-logo-mark {
  width: 40px; height: 40px; border-radius: 50%; background: var(--ws-gradient);
  display: inline-flex; align-items: center; justify-content: center;
  font-family: 'Oswald', sans-serif; font-weight: 600; font-size: 17px; color: #fff;
}
.ws-navbar .nav-link {
  font-family: 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: .04em;
  color: var(--ws-ink); padding-left: 1rem !important; padding-right: 1rem !important;
}
.ws-navbar .nav-link:hover { color: var(--ws-teal-dark); }

/* Hero */
.ws-hero { position: relative; overflow: hidden; background: var(--ws-bg); }
.ws-hero .container { position: relative; z-index: 1; }
.ws-hero h1 { font-size: clamp(3rem, 7vw, 5.25rem); line-height: 1.02; max-width: 640px; }
.ws-hero-sub { font-family: 'Oswald', sans-serif; font-size: 1.375rem; text-transform: uppercase; letter-spacing: .06em; color: var(--ws-teal-dark); }
.ws-hero-text { max-width: 540px; font-size: 1.125rem; color: var(--ws-muted); }
.ws-ring { position: absolute; border-radius: 50%; pointer-events: none; }
.ws-ring-outline { right: -180px; top: -120px; width: 720px; height: 720px; border: 18px solid var(--ws-teal); opacity: .18; }
.ws-ring-fill { right: -90px; top: -30px; width: 540px; height: 540px; background: var(--ws-gradient); }
.ws-ring-hole { right: 70px; top: 130px; width: 220px; height: 220px; background: var(--ws-bg); }
@media (max-width: 991.98px) {
  .ws-ring-outline { right: -360px; top: -260px; }
  .ws-ring-fill { right: -300px; top: -200px; opacity: .35; }
  .ws-ring-hole { right: -140px; top: -40px; }
}
/* Ferde sáv */
.ws-band { background: var(--ws-band); clip-path: polygon(0 60px, 100% 0, 100% calc(100% - 60px), 0 100%); padding: 150px 0 160px; }
.ws-band-flat { background: var(--ws-band); }

/* Szolgáltatás kártyák */
.ws-service {
  display: flex; flex-direction: column; gap: .875rem; height: 100%;
  padding: 2rem; border-radius: 6px; background: #fff; color: var(--ws-ink);
  border-top: 4px solid var(--ws-teal); text-decoration: none;
  box-shadow: 0 8px 24px rgba(38,34,42,.06); transition: transform .2s ease, box-shadow .2s ease;
}
.ws-service.lime { border-top-color: var(--ws-lime); }
.ws-service:hover { color: var(--ws-ink); transform: translateY(-3px); box-shadow: 0 14px 32px rgba(38,34,42,.10); }
.ws-service h3 { font-size: 1.5rem; margin: 0; }
.ws-service p { margin: 0; color: var(--ws-muted); font-size: 1rem; }
.ws-more { margin-top: auto; font-family: 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: .08em; font-size: .9375rem; color: var(--ws-teal-dark); }
.ws-service-cta { background: var(--ws-aubergine); color: #fff; border-top: 0; justify-content: space-between; }
.ws-service-cta:hover { color: #fff; }
.ws-service-cta h3 { font-size: 1.875rem; line-height: 1.15; }
.ws-service-cta p { color: var(--ws-on-dark); }
.ws-service-cta .ws-more { color: var(--ws-lime); }

/* Csomagok */
.ws-plan { display: flex; flex-direction: column; gap: 1rem; height: 100%; padding: 1.75rem; border-radius: 6px; background: #fff; border: 1px solid var(--ws-line); }
.ws-plan.featured { border: 2px solid var(--ws-lime); box-shadow: 0 12px 30px rgba(38,34,42,.10); }
.ws-plan h3 { font-size: 1.5rem; margin: 0; }
.ws-price { font-family: 'Oswald', sans-serif; font-size: 2.125rem; font-weight: 500; }
.ws-price small { font-family: 'Open Sans', sans-serif; font-size: .9375rem; font-weight: 400; color: var(--ws-muted); }
.ws-plan ul { margin: 0; padding-left: 1.125rem; color: var(--ws-muted); font-size: .9375rem; }
.ws-plan ul li + li { margin-top: .375rem; }
.ws-plan .btn-ws { margin-top: auto; min-height: 48px; }
.ws-badge { font-size: .75rem; font-weight: 700; padding: 4px 10px; border-radius: 999px; background: var(--ws-lime); color: var(--ws-lime-ink); }

/* Csomagok szekció – szöveges oldalsáv a kártyák mellett */
.ws-plans-note { position: sticky; top: 96px; max-width: 360px; padding-left: 1.5rem; border-left: 3px solid var(--ws-teal); }
.ws-plans-note p { font-size: 1.0625rem; line-height: 1.7; color: var(--ws-muted); margin: 0; }
.ws-plans-note p + p { margin-top: 1em; }

/* Referenciák */
.ws-refs { background: var(--ws-line); border: 1px solid var(--ws-line); border-radius: 6px; overflow: hidden; gap: 1px; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.ws-ref { display: flex; flex-direction: column; justify-content: space-between; gap: 1rem; padding: 1.5rem; background: #fff; color: var(--ws-ink); text-decoration: none; min-height: 200px; }
.ws-ref:hover { color: var(--ws-ink); background: #FBFBF9; }
.ws-ref-logo { height: 88px; border-radius: 4px; background: #F2F2EE; display: flex; align-items: center; justify-content: center; font-size: .8125rem; color: #6E6873; }
.ws-ref-logo img { max-width: 80%; max-height: 64px; object-fit: contain; }
.ws-ref-name { font-family: 'Oswald', sans-serif; font-weight: 500; font-size: 1.1875rem; text-transform: uppercase; }
.ws-ref-tags { font-size: .875rem; color: var(--ws-muted); }
.ws-ref-tags p { margin: 0; }

/* Kapcsolat + lábléc */
.ws-contact { background: var(--ws-aubergine); color: #fff; margin-top: -60px; clip-path: polygon(0 0, 100% 60px, 100% 100%, 0 100%); }
.ws-contact h2 { font-size: clamp(2.5rem, 5vw, 3.5rem); }
.ws-contact .lead-text { color: var(--ws-on-dark); max-width: 400px; }
.ws-contact-link { display: flex; align-items: center; gap: .75rem; min-height: 44px; color: #fff; text-decoration: none; font-family: 'Oswald', sans-serif; font-size: 1.5rem; }
.ws-contact-link:hover { color: var(--ws-lime); }
.ws-contact .form-label { font-size: .875rem; font-weight: 600; color: var(--ws-on-dark); }
.ws-contact .form-control { min-height: 48px; border-radius: 4px; border: 1px solid var(--ws-aubergine-line); background: var(--ws-aubergine-2); color: #fff; }
.ws-contact .form-control:focus { border-color: var(--ws-lime); box-shadow: 0 0 0 .2rem rgba(140,198,63,.3); background: var(--ws-aubergine-2); color: #fff; }
.ws-contact .small-note { font-size: .875rem; color: var(--ws-on-dark); }
.ws-contact .small-note a { color: #B9E08A; }
.ws-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ws-form-alert { margin-bottom: 1.25rem; padding: .875rem 1.125rem; border-radius: 6px; font-size: .9375rem; }
.ws-form-alert-ok { background: rgba(140,198,63,.16); border: 1px solid rgba(140,198,63,.4); color: #DCF2C2; }
.ws-form-alert-error { background: rgba(217,83,79,.16); border: 1px solid rgba(217,83,79,.45); color: #F6CFCD; }
.ws-form-alert-error a { color: #fff; text-decoration-thickness: 1px; }
.ws-footer { border-top: 1px solid #4E4152; font-size: .875rem; color: #BFB5C2; }
.ws-footer a { color: var(--ws-on-dark); }
.ws-footer-mark { width: 32px; height: 32px; border-radius: 50%; border: 2px solid #BFB5C2; display: inline-flex; align-items: center; justify-content: center; font-family: 'Oswald', sans-serif; font-size: 13px; color: #fff; }

.section-title { font-size: clamp(2.25rem, 4.5vw, 3.25rem); line-height: 1.05; }

@media (prefers-reduced-motion: reduce) {
  .ws-service { transition: none; }
  .ws-service:hover { transform: none; }
}

/* ---------- Tartalmi oldal (oldal.html) ---------- */
.ws-page-head { background: var(--ws-band); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 50px), 0 100%); padding: 56px 0 110px; }
.ws-page-head h1 { font-size: clamp(2.25rem, 5vw, 3.75rem); line-height: 1.05; margin: 0; max-width: 820px; }
.ws-page-head .breadcrumb { font-size: .875rem; margin-bottom: 1.25rem; }
.ws-page-head .breadcrumb a { color: var(--ws-teal-dark); text-decoration: none; }
.ws-page-head .breadcrumb-item.active { color: var(--ws-muted); }
.ws-page-lead { max-width: 720px; font-size: 1.1875rem; color: var(--ws-muted); margin: 1.25rem 0 0; }
.ws-page-meta { font-size: .875rem; color: var(--ws-muted); margin-top: 1rem; }

.ws-prose { max-width: 720px; font-size: 1.0625rem; line-height: 1.75; color: var(--ws-ink); }
.ws-prose > * + * { margin-top: 1.25em; }
.ws-prose p { margin-bottom: 0; }
.ws-prose h2 { font-size: 2rem; line-height: 1.15; margin-top: 2.2em; margin-bottom: 0; scroll-margin-top: 96px; }
.ws-prose h3 { font-size: 1.375rem; line-height: 1.25; margin-top: 1.8em; margin-bottom: 0; scroll-margin-top: 96px; }
.ws-prose h2:first-child { margin-top: 0; }
.ws-prose a { text-decoration-thickness: 1px; text-underline-offset: 3px; }
.ws-prose ul, .ws-prose ol { padding-left: 1.4em; margin-bottom: 0; }
.ws-prose li + li { margin-top: .4em; }
.ws-prose li::marker { color: var(--ws-teal-dark); }
.ws-prose blockquote { margin-left: 0; margin-right: 0; padding: 1.25rem 1.5rem; background: #fff; border-radius: 6px; box-shadow: 0 8px 24px rgba(38,34,42,.06); font-size: 1.1875rem; }
.ws-prose blockquote p { margin: 0; }
.ws-prose figure { margin-left: 0; margin-right: 0; }
.ws-prose figure img { width: 100%; height: auto; border-radius: 6px; display: block; }
.ws-prose figcaption { font-size: .875rem; color: var(--ws-muted); margin-top: .5rem; }
.ws-img-placeholder { aspect-ratio: 16 / 9; border-radius: 6px; background: #ECECE8; display: flex; align-items: center; justify-content: center; color: #6E6873; font-size: .875rem; }
.ws-prose .table-wrap { overflow-x: auto; background: #fff; border: 1px solid var(--ws-line); border-radius: 6px; }
.ws-prose table { width: 100%; border-collapse: collapse; font-size: .9375rem; }
.ws-prose th, .ws-prose td { padding: .75rem 1rem; border-bottom: 1px solid var(--ws-line); text-align: left; vertical-align: top; }
.ws-prose th { font-weight: 700; background: #F7F7F5; }
.ws-prose tr:last-child td { border-bottom: 0; }
.ws-prose code { color: var(--ws-teal-dark); background: #EEF4EC; padding: .1em .35em; border-radius: 4px; font-size: .9em; }
.ws-prose hr { border: 0; border-top: 1px solid var(--ws-line); opacity: 1; margin: 2.5em 0; }
.ws-callout { padding: 1.25rem 1.5rem; border-radius: 6px; background: #F1F7EA; border: 1px solid #D6E9BF; }
.ws-callout strong { display: block; font-family: 'Oswald', sans-serif; font-weight: 500; text-transform: uppercase; letter-spacing: .04em; margin-bottom: .25rem; }

.ws-toc { position: sticky; top: 96px; font-size: .9375rem; }
.ws-toc-title { font-size: .8125rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ws-teal-dark); margin-bottom: .75rem; }
.ws-toc .nav-link { color: var(--ws-muted); padding: .35rem 0 .35rem .875rem; border-left: 2px solid var(--ws-line); }
.ws-toc .nav-link:hover { color: var(--ws-ink); }
.ws-toc .nav-link.active { color: var(--ws-ink); font-weight: 600; border-left-color: var(--ws-lime); background: none; }
.ws-aside-cta { margin-top: 2rem; padding: 1.5rem; border-radius: 6px; background: var(--ws-aubergine); color: #fff; }
.ws-aside-cta p { color: var(--ws-on-dark); font-size: .9375rem; }