html,body{max-width:100%;overflow-x:clip}
body{min-width:0}
.site-header{position:sticky;top:0;z-index:1000;width:100%}
.site-header .navigation-section{position:relative;top:auto}
.site-main{display:block;width:100%;min-width:0}
.site-main>section>[class*="centered"],.site-main>section>[class*="container"],.site-main>section>[class*="inner"]{box-sizing:border-box}
.site-main>section>[class*="centered"]{padding-top:12px;padding-bottom:12px}
img{max-width:100%}
svg{max-width:100%}
a,button,input,select,textarea{min-width:0}
button{touch-action:manipulation}
.navigation-link-active{position:relative}
.navigation-link-active::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:2px;background:var(--color-accent)}
.navigation-mobile-overlay{overscroll-behavior:contain}
.navigation-hamburger,.navigation-close{border-radius:10px}
.navigation-hamburger:focus-visible,.navigation-close:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--color-accent);outline-offset:3px}
.velu-footer-contact-item.is-static{cursor:default}
.legal-page{background:var(--color-surface);color:var(--color-on-surface)}
.legal-hero{padding:72px 0 48px;background:var(--color-deep-green);color:#fff}
.legal-hero .legal-wrap{max-width:var(--content-max-width);margin:0 auto;padding:0 var(--spacing-2xl)}
.legal-hero h1{color:#fff;max-width:900px;margin:0 0 18px;font-family:var(--font-family-heading);font-size:52px;line-height:1.12}
.legal-hero p{max-width:800px;font-size:18px;opacity:.9}
.legal-content{padding:64px 0 88px}
.legal-wrap{max-width:960px;margin:0 auto;padding:0 var(--spacing-2xl);box-sizing:border-box}
.legal-intro{padding:24px;border-left:4px solid var(--color-accent);background:var(--color-surface-tint);margin-bottom:36px}
.legal-content h2{font-family:var(--font-family-heading);font-size:30px;line-height:1.25;margin:40px 0 14px;color:var(--color-on-surface)}
.legal-content h3{font-family:var(--font-family-heading);font-size:22px;line-height:1.3;margin:28px 0 10px}
.legal-content p,.legal-content li{font-size:16px;line-height:1.75;color:var(--color-on-surface-secondary)}
.legal-content p{margin:0 0 14px}
.legal-content ul,.legal-content ol{padding-left:24px;margin:0 0 18px}
.legal-meta{display:flex;gap:18px;flex-wrap:wrap;margin-top:22px;font-size:14px}
.legal-meta span{padding:8px 12px;background:rgba(255,255,255,.12);border-radius:999px}
.legal-back{display:inline-flex;margin-top:36px}
.site-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);z-index:5000;background:#27251F;color:#fff;padding:14px 20px;border-radius:12px;box-shadow:0 14px 36px rgba(0,0,0,.22);opacity:0;pointer-events:none;transition:.2s ease;max-width:min(92vw,520px);text-align:center}
.site-toast.is-visible{opacity:1;transform:translateX(-50%) translateY(0)}
.form-error-summary{display:none;color:#7e1f1f;background:#fff1ef;border:1px solid #e2b5ae;padding:12px 14px;border-radius:8px;margin-bottom:16px}
.form-error-summary.is-visible{display:block}
@media(max-width:767px){
  .site-main>section>[class*="centered"]{padding-top:18px;padding-bottom:18px}
  .site-main h1,.site-main h2,.site-main h3,.site-main .hero-title,.site-main .section-title,.site-main .section-subtitle{text-align:center}
  .site-main h1,.site-main .hero-title{font-size:34px!important;line-height:1.18!important}
  .site-main h2,.site-main .section-title{font-size:28px!important;line-height:1.22!important}
  .site-main h3,.site-main .section-subtitle{font-size:21px!important;line-height:1.28!important}
  form{width:100%!important;max-width:100%!important}
  form input,form textarea,form select,form button{width:100%;max-width:100%;box-sizing:border-box}
  form [class*="grid"],form [class*="row"],form [class*="columns"],form [class*="fields"],form [class*="d-flex"]{display:flex!important;flex-direction:column!important;grid-template-columns:1fr!important;width:100%!important}
  form .form-check,form [class*="checkbox"],form [class*="consent"]{align-items:flex-start!important}
  form input[type="checkbox"]{width:auto!important;flex:0 0 auto}
  .legal-hero{padding:52px 0 36px}
  .legal-hero .legal-wrap,.legal-wrap{padding-left:20px;padding-right:20px}
  .legal-hero h1{font-size:36px!important;text-align:center}
  .legal-hero p{text-align:center;font-size:16px}
  .legal-content{padding:44px 0 64px}
  .legal-content h2{font-size:26px!important;text-align:center;margin-top:34px}
  .legal-content h3{font-size:20px!important;text-align:center}
  .legal-intro{padding:18px}
  .navigation-mobile-link{font-size:24px}
}
@media(max-width:390px){
  .navigation-centered{padding-left:14px!important;padding-right:14px!important}
  .logo-brand-name{font-size:16px!important}
  .logo-tagline{font-size:9px!important}
  .site-main h1,.site-main .hero-title{font-size:30px!important}
  .site-main h2,.site-main .section-title{font-size:25px!important}
  .btn{white-space:normal;line-height:1.3;min-height:48px}
}

.skip-link{position:fixed;left:12px;top:12px;z-index:9999;transform:translateY(-150%);background:#fff;color:#111;padding:10px 14px;border-radius:8px}.skip-link:focus{transform:none}
.contact-static{cursor:default}

/* Final overflow corrections found during viewport audit */
.aj-nd-kcsomagok-centered {
  width: 100%;
  max-width: var(--content-max-width);
  box-sizing: border-box;
}

.workshop-rail-wrapper {
  left: auto;
  right: auto;
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  box-sizing: border-box;
}

.workshop-rail {
  box-sizing: border-box;
}

@media (max-width: 767px) {
  .workshop-rail-pills {
    flex-wrap: wrap;
    justify-content: flex-end;
  }
}

/* Treat 768px-class tablets as compact navigation to prevent header collision. */
@media (max-width: 800px) {
  .navigation-centered {
    padding-left: var(--spacing-lg);
    padding-right: var(--spacing-lg);
  }
  .navigation-bar {
    justify-content: space-between;
  }
  .navigation-left-cluster,
  .navigation-right-cluster {
    display: none;
  }
  .navigation-logo-anchor {
    left: 0;
    position: relative;
    transform: none;
  }
  .navigation-hamburger {
    display: flex;
  }
  .navigation-checkbox:checked ~ .navigation-mobile-overlay {
    display: flex;
  }
}

/* Keep the event selection carousel inside its own scroll port. */
.selections-rail-container,
.selections-rail-track {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
.selections-rail-track {
  contain: paint;
}

/* Final narrow-viewport corrections from rendered QA */
.outreach-cta > [class*="centered"] {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
.outreach-cta .outreach-wrapper,
.outreach-cta .services-html---szolg-ltat-sok-outreach-wrapper,
.outreach-cta .outreach-header,
.outreach-cta .outreach-header-row,
.outreach-cta .outreach-footer,
.outreach-cta .outreach-bottom-row,
.outreach-cta .outreach-copy,
.outreach-cta .services-html---szolg-ltat-sok-outreach-copy,
.outreach-cta .outreach-actions,
.outreach-cta .outreach-action-group {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.corporate-contact-container,
.corporate-contact-info,
.corporate-form-wrapper {
  min-width: 0;
  box-sizing: border-box;
}

.process-steps-container,
.process-steps-grid,
.process-step-card {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

@media (max-width: 767px) {
  .outreach-cta > [class*="centered"] {
    padding-left: var(--spacing-lg) !important;
    padding-right: var(--spacing-lg) !important;
  }
  .outreach-cta .outreach-header,
  .outreach-cta .outreach-header-row,
  .outreach-cta .outreach-footer,
  .outreach-cta .outreach-bottom-row,
  .outreach-cta .outreach-copy,
  .outreach-cta .services-html---szolg-ltat-sok-outreach-copy,
  .outreach-cta .outreach-actions,
  .outreach-cta .outreach-action-group {
    width: 100%;
  }
  .outreach-cta .outreach-footer,
  .outreach-cta .outreach-bottom-row,
  .outreach-cta .outreach-actions,
  .outreach-cta .outreach-action-group {
    align-items: center;
    flex-direction: column;
  }
  .outreach-cta .outreach-header,
  .outreach-cta .outreach-header-row,
  .outreach-cta .outreach-copy,
  .outreach-cta .services-html---szolg-ltat-sok-outreach-copy {
    text-align: center;
  }
  .outreach-cta .btn,
  .outreach-cta a {
    max-width: 100%;
  }
  .outreach-cta .outreach-actions .btn,
  .outreach-cta .outreach-action-group .btn {
    width: 100%;
  }
  .outreach-cta .outreach-actions > a,
  .outreach-cta .outreach-action-group > a {
    width: 100%;
  }
  .corporate-contact-info,
  .corporate-form-wrapper {
    width: 100%;
    max-width: 100%;
  }
  .corporate-contact-heading,
  .corporate-contact-info p,
  .corporate-contact-details {
    max-width: 100%;
  }
  .rendezv-nyekhez-process-steps {
    padding-left: var(--spacing-lg);
    padding-right: var(--spacing-lg);
  }
  .process-step-card {
    width: 100%;
    flex-basis: 100%;
  }
}

/* Small-desktop/tablet CTA fit: keep the desktop look where space allows,
   but stack the about-page CTA before the action group can clip. */
@media (max-width: 1100px) {
  #values-cta .outreach-footer {
    width: 100%;
    min-width: 0;
    align-items: flex-start;
    flex-direction: column;
  }
  #values-cta .outreach-copy,
  #values-cta .outreach-actions {
    width: 100%;
    max-width: 100%;
  }
  #values-cta .outreach-actions {
    justify-content: flex-start;
  }
}

/* Remaining rendered edge cases */
@media (max-width: 479px) {
  .services-html---szolg-ltat-sok-process-grid {
    width: 100%;
    min-width: 0;
  }
  .services-html---szolg-ltat-sok-process-card {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    flex: 0 0 100%;
  }
  .cta-action-group {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }
  .cta-action-group > a,
  .cta-action-group .btn {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
}

@media (max-width: 800px) {
  #kapcsolat-cta .outreach-bottom-row,
  #kapcsolat-cta .outreach-action-group {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    align-items: center;
    flex-direction: column;
  }
  #kapcsolat-cta .outreach-action-group > a,
  #kapcsolat-cta .outreach-action-group .btn {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
}

/* Corporate contact form: keep text and placeholders readable on the dark panel. */
.corporate-form .corporate-input {
  color: #ffffff;
  caret-color: #ffffff;
}
.corporate-form .corporate-input::placeholder {
  color: rgba(255, 255, 255, 0.66);
  opacity: 1;
}

/* =========================================================
   Visual QA round 2 — global header and balanced desktop grids
   ========================================================= */

/* The original centered logo was absolutely positioned and physically
   overlapped the navigation at every desktop width. Keep the same centered
   visual concept, but make the logo a real flex item and give the header
   enough horizontal room. */
@media (min-width: 1240px) {
  .navigation-centered {
    width: 100%;
    max-width: 1400px;
    padding-left: 32px;
    padding-right: 32px;
    box-sizing: border-box;
  }

  .navigation-bar {
    gap: 16px;
  }

  .navigation-bar > .navigation-logo-anchor {
    position: static;
    left: auto;
    transform: none;
    flex: 0 0 auto;
  }

  .navigation-left-cluster,
  .navigation-right-cluster {
    flex: 1 1 0;
    min-width: 0;
    gap: 24px;
  }
}

/* Tablet and compact-desktop navigation: use the burger before the six
   desktop controls can collide. This includes 1024/1180 class screens. */
@media (max-width: 1239px) {
  .navigation-centered {
    width: 100%;
    padding-left: 28px;
    padding-right: 28px;
    box-sizing: border-box;
  }

  .navigation-bar {
    justify-content: space-between;
  }

  .navigation-left-cluster,
  .navigation-right-cluster {
    display: none;
  }

  .navigation-logo-anchor {
    left: auto;
    position: relative;
    transform: none;
  }

  .navigation-hamburger {
    display: flex;
    flex: 0 0 44px;
  }

  .navigation-checkbox:checked ~ .navigation-mobile-overlay {
    display: flex;
  }
}

@media (max-width: 479px) {
  .navigation-centered {
    padding-left: 14px;
    padding-right: 14px;
  }
}

/* Contact info cards: 4-up on wide screens instead of an awkward 3 + 1 row. */
@media (min-width: 1100px) {
  .contact-info-grid {
    flex-wrap: nowrap;
  }

  .contact-info-card {
    flex: 1 1 0;
    width: 0;
    min-width: 0;
    max-width: none;
  }
}

/* Four-step process sections must not produce a stretched orphan card. */
@media (min-width: 1100px) {
  .contacts-html---kapcsolat-process-card,
  .services-html---szolg-ltat-sok-process-card {
    flex: 0 0 calc((100% - (var(--spacing-xl) * 3)) / 4);
    width: calc((100% - (var(--spacing-xl) * 3)) / 4);
    min-width: 0;
    max-width: none;
  }

  .services-html---szolg-ltat-sok-process-grid {
    gap: var(--spacing-xl);
  }
}

@media (min-width: 768px) and (max-width: 1099px) {
  .contacts-html---kapcsolat-process-card,
  .services-html---szolg-ltat-sok-process-card {
    flex: 0 0 calc((100% - var(--spacing-lg)) / 2);
    width: calc((100% - var(--spacing-lg)) / 2);
    min-width: 0;
    max-width: none;
  }
}

/* Purchases carousel: show complete cards instead of clipping the third card
   on wide screens. */
@media (min-width: 1200px) {
  .purchases-carousel-wrapper {
    padding-left: 56px;
    padding-right: 56px;
  }

  .purchase-item {
    flex: 0 0 calc((100% - (var(--spacing-lg) * 2)) / 3);
    width: calc((100% - (var(--spacing-lg) * 2)) / 3);
    min-width: 0;
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .purchase-item {
    flex: 0 0 calc((100% - var(--spacing-lg)) / 2);
    width: calc((100% - var(--spacing-lg)) / 2);
    min-width: 0;
  }
}

/* Sticky header must not cover cross-page or in-page anchor targets. */
html {
  scroll-padding-top: 96px;
}

.site-main [id] {
  scroll-margin-top: 96px;
}

@media (max-width: 1239px) {
  html {
    scroll-padding-top: 92px;
  }

  .site-main [id] {
    scroll-margin-top: 92px;
  }
}


/* =========================================================
   Visual QA round 3 — contrast, carousel controls and polish
   ========================================================= */

/* Workshop hero: page-specific generated CSS forced the H1 to white over a
   light scrim. Restore a dark, high-contrast editorial treatment. */
.mhelyltogats-krs-ui-hero-title-elm,
.m-helyl-togat-s-k-r-s-hero-title,
.workshop-hero-title {
  color: var(--color-on-surface) !important;
  text-shadow: none !important;
}
.workshop-hero-scrim {
  background: linear-gradient(
    to right,
    rgba(255, 253, 247, 0.98) 0%,
    rgba(255, 253, 247, 0.94) 34%,
    rgba(255, 253, 247, 0.72) 52%,
    rgba(255, 253, 247, 0.12) 82%
  ) !important;
}

/* Carousel controls must retain a square hit area; global button rules must
   not collapse the circular control around its SVG. */
.carousel-control {
  width: 48px !important;
  min-width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  flex: 0 0 48px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box;
}
.carousel-control svg {
  width: 24px !important;
  height: 24px !important;
  flex: 0 0 24px;
}

/* Keep purchase cards visually complete inside the scroll viewport. */
.purchases-carousel-track {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  scroll-padding-left: 2px;
  scroll-padding-right: 2px;
}
.purchase-item {
  box-sizing: border-box;
}

/* More robust compact-header alignment. */
@media (max-width: 1239px) {
  .navigation-bar { min-height: 72px; }
  .navigation-logo-anchor { min-width: 0; max-width: calc(100% - 68px); }
  .navigation-logo { min-width: 0; }
  .logo-text { min-width: 0; }
}

@media (max-width: 767px) {
  .workshop-hero-scrim {
    background: linear-gradient(
      to top,
      rgba(255,253,247,0.98) 10%,
      rgba(255,253,247,0.88) 58%,
      rgba(255,253,247,0.54) 100%
    ) !important;
  }
}


/* Purchase action controls: keep the reload icon visible and centered. */
.purchase-actions .action-group .btn-secondary {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  flex: 0 0 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #ffffff !important;
}
.purchase-actions .action-group .btn-secondary svg {
  width: 18px !important;
  height: 18px !important;
  display: block !important;
  flex: 0 0 18px !important;
  color: inherit !important;
}

/* Final visual polish: the home hero's secondary CTA was wrapping into three
   short lines on desktop because the generated content column was too narrow
   for both actions. Give the action row enough real width without changing
   the mobile stacked composition. */
@media (min-width: 768px) {
  .hero-campaign-content {
    max-width: 680px;
  }
  .f-oldal-hero-link {
    white-space: nowrap;
    flex: 0 0 auto;
  }
}

/* About hero mobile repair: generated absolute background styles became a
   large empty in-flow block when switched to position:relative. Put content
   first, then show the image as a normal responsive media block. */
@media (max-width: 767px) {
  .about-hero {
    padding-top: var(--spacing-2xl);
    padding-bottom: var(--spacing-2xl);
  }
  .about-hero-wrapper {
    display: flex;
    flex-direction: column;
  }
  .about-hero-content {
    order: 1;
    width: 100%;
  }
  .about-hero-bg {
    order: 2;
    position: relative;
    right: auto;
    bottom: auto;
    width: 100%;
    height: auto;
    margin-top: var(--spacing-xl);
  }
  .about-hero-img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 360px;
    object-fit: cover;
    object-position: center;
    border-radius: var(--border-radius-xl);
  }
}