/*
 * ATN FLUID & CENTERED LAYOUT 1.0.0
 * Only geometry, fluid widths, spacing, layout, and responsive typography.
 * Intentionally contains NO loading overlays, animation states, transition
 * classes, JS, or rules on html/body visibility.
 * Works with ATN Homepage 2026 v1.4.8 and ATN Global Header v1.10.3.
 */

/* A közös vizuális tengely PC-n és mobilon is a képernyő középvonala. */
body.atn-hp2026-active {
  --atn-fluid-gutter: clamp(16px, 4.5vw, 96px);
  --atn-fluid-usable: calc(100% - (2 * var(--atn-fluid-gutter)));
}

/* Globális fejléc: szélessége követi a nézetet, nem marad 1460px-be szorítva.
   Az átmeneti logó nem ebben a fejlécben található, és nem érintjük. */
#atngh-root.atngh-root .atngh-header {
  width: calc(100% - (2 * clamp(16px, 4.5vw, 96px))) !important;
  max-width: none !important;
  min-width: 0;
  margin-inline: auto !important;
}

/* Főoldal: EGYETLEN középre igazított, valóban fluid szélességi rendszer.
   A 1320px / 1460px fix felső határok szándékosan megszűnnek. */
body.atn-hp2026-active .atn-hp {
  width: 100%;
  max-width: 100%;
  margin-inline: auto;
  min-width: 0;
}
body.atn-hp2026-active .atn-hp .atn-hp-shell,
body.atn-hp2026-active .atn-hp .atn-hp-topbar,
body.atn-hp2026-active .atn-hp .atn-hp-slide-inner,
body.atn-hp2026-active .atn-hp .atn-hp-slider-controls {
  width: var(--atn-fluid-usable) !important;
  max-width: none !important;
  min-width: 0;
  margin-left: auto !important;
  margin-right: auto !important;
}
body.atn-hp2026-active .atn-hp .atn-hp-shell > *,
body.atn-hp2026-active .atn-hp .atn-hp-intro-grid > *,
body.atn-hp2026-active .atn-hp .atn-hp-flow-grid > *,
body.atn-hp2026-active .atn-hp .atn-hp-trust-grid > *,
body.atn-hp2026-active .atn-hp .atn-hp-product-grid > *,
body.atn-hp2026-active .atn-hp .atn-hp-article-grid > * {
  min-width: 0;
}

/* Fejléc és navigáció egyazon vízszintes középvonalon; mobilmenü marad. */
body.atn-hp2026-active .atn-hp .atn-hp-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(12px, 1.3vw, 28px);
}
body.atn-hp2026-active .atn-hp .atn-hp-nav-panel { margin-left: auto; }
body.atn-hp2026-active .atn-hp .atn-hp-nav {
  justify-content: flex-end;
  gap: clamp(1px, .3vw, 9px);
}

/* A dia teljes szélességű marad, de a tartalom ugyanarra a középtengelyre ül. */
body.atn-hp2026-active .atn-hp .atn-hp-native-slider {
  height: clamp(540px, 42vw, 710px);
}
body.atn-hp2026-active .atn-hp .atn-hp-native-slide h2 {
  max-width: min(100%, 920px);
  font-size: clamp(38px, 3.8vw, 72px) !important;
}
body.atn-hp2026-active .atn-hp .atn-hp-native-slide.is-long-title h2 {
  font-size: clamp(34px, 3.35vw, 62px) !important;
}
body.atn-hp2026-active .atn-hp .atn-hp-native-slide p {
  max-width: min(100%, 760px);
}

/* Hero: két kiegyensúlyozott oszlop, majd középre rendezett mobilos átrendeződés. */
body.atn-hp2026-active .atn-hp .atn-hp-intro-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  align-items: center;
  gap: clamp(24px, 4.2vw, 94px);
}
body.atn-hp2026-active .atn-hp .atn-hp-intro-copy {
  width: 100%;
  max-width: 880px;
}
body.atn-hp2026-active .atn-hp .atn-hp-intro h1 {
  max-width: min(100%, 900px);
  font-size: clamp(42px, 4vw, 80px) !important;
}
body.atn-hp2026-active .atn-hp .atn-hp-intro .atn-hp-lead {
  max-width: 710px;
  font-size: clamp(17px, 1.15vw, 22px) !important;
}
body.atn-hp2026-active .atn-hp .atn-hp-orbit {
  width: min(100%, 520px);
  max-width: 520px;
  margin-inline: auto !important;
}

/* Minden fő tartalmi szekció és kártyarendszer: azonos margók, rugalmas közök. */
body.atn-hp2026-active .atn-hp .atn-hp-section {
  padding-block: clamp(46px, 4.2vw, 96px);
}
body.atn-hp2026-active .atn-hp .atn-hp-service-ribbon-wrap { padding-block: 12px; }
body.atn-hp2026-active .atn-hp .atn-hp-service-grid { gap: clamp(12px, 1.05vw, 24px); }
body.atn-hp2026-active .atn-hp .atn-hp-flow-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 1.5vw, 30px);
}
body.atn-hp2026-active .atn-hp .atn-hp-trust-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(26px, 4vw, 88px);
}
body.atn-hp2026-active .atn-hp .atn-hp-trust-stats {
  width: 100%;
  justify-self: center;
}
body.atn-hp2026-active .atn-hp .atn-hp-product-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(14px, 1.5vw, 30px);
}
body.atn-hp2026-active .atn-hp .atn-hp-article-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 1.4vw, 28px);
}
body.atn-hp2026-active .atn-hp .atn-hp-partner-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(10px, 1vw, 24px);
}
body.atn-hp2026-active .atn-hp .atn-hp-product,
body.atn-hp2026-active .atn-hp .atn-hp-article,
body.atn-hp2026-active .atn-hp .atn-hp-flow-card,
body.atn-hp2026-active .atn-hp .atn-hp-service-card,
body.atn-hp2026-active .atn-hp .atn-hp-partner-name { max-width: 100%; }
body.atn-hp2026-active .atn-hp .atn-hp-product p { max-width: 68ch; }
body.atn-hp2026-active .atn-hp .atn-hp-article-image { height: auto; aspect-ratio: 16 / 9; }
body.atn-hp2026-active .atn-hp .atn-hp-article-image img { display: block; }
body.atn-hp2026-active .atn-hp .atn-hp-section-head { gap: clamp(16px, 2vw, 44px); }
body.atn-hp2026-active .atn-hp .atn-hp-cta-panel {
  width: 100%;
  margin-inline: auto;
  gap: clamp(22px, 3vw, 64px);
}

/* Tablet: a modulok és az oldaltengely egyformán alkalmazkodnak. */
@media (max-width: 1100px) {
  body.atn-hp2026-active { --atn-fluid-gutter: clamp(18px, 4vw, 44px); }
  body.atn-hp2026-active .atn-hp .atn-hp-intro-grid,
  body.atn-hp2026-active .atn-hp .atn-hp-trust-grid { grid-template-columns: 1fr; }
  body.atn-hp2026-active .atn-hp .atn-hp-intro-copy {
    width: 100%; max-width: 840px; margin-inline: auto;
  }
  body.atn-hp2026-active .atn-hp .atn-hp-orbit { margin-inline: auto !important; }
  body.atn-hp2026-active .atn-hp .atn-hp-trust-heading { width: 100%; max-width: 840px; margin-inline: auto; }
  body.atn-hp2026-active .atn-hp .atn-hp-flow-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.atn-hp2026-active .atn-hp .atn-hp-flow-graphic { grid-column: 1 / -1; }
  body.atn-hp2026-active .atn-hp .atn-hp-service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: visible; scroll-snap-type: none;
  }
  body.atn-hp2026-active .atn-hp .atn-hp-article-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.atn-hp2026-active .atn-hp .atn-hp-product-grid { grid-template-columns: 1fr; }
}
@media (max-width: 740px) {
  body.atn-hp2026-active { --atn-fluid-gutter: clamp(16px, 4.5vw, 24px); }
  body.atn-hp2026-active .atn-hp .atn-hp-native-slider {
    height: clamp(520px, calc(100svh - 70px), 670px);
    min-height: 520px;
  }
  body.atn-hp2026-active .atn-hp .atn-hp-slide-inner {
    padding-top: 30px;
    padding-bottom: 90px;
    text-align: center;
  }
  body.atn-hp2026-active .atn-hp .atn-hp-slide-label { justify-content: center; }
  body.atn-hp2026-active .atn-hp .atn-hp-native-slide h2 {
    max-width: 100%;
    font-size: clamp(27px, 7.8vw, 42px) !important;
    margin-inline: auto !important;
  }
  body.atn-hp2026-active .atn-hp .atn-hp-native-slide.is-long-title h2 { font-size: clamp(25px, 6.8vw, 36px) !important; }
  body.atn-hp2026-active .atn-hp .atn-hp-native-slide p { margin-inline: auto !important; }
  body.atn-hp2026-active .atn-hp .atn-hp-slider-controls { gap: 5px; }
  body.atn-hp2026-active .atn-hp .atn-hp-intro { padding-block: 44px 58px; }
  body.atn-hp2026-active .atn-hp .atn-hp-intro-grid { gap: 12px; }
  body.atn-hp2026-active .atn-hp .atn-hp-intro-copy,
  body.atn-hp2026-active .atn-hp .atn-hp-trust-heading { text-align: center; }
  body.atn-hp2026-active .atn-hp .atn-hp-intro h1 {
    max-width: 100%; font-size: clamp(33px, 8.5vw, 50px) !important;
  }
  body.atn-hp2026-active .atn-hp .atn-hp-lead,
  body.atn-hp2026-active .atn-hp .atn-hp-trust-heading p { margin-inline: auto !important; }
  body.atn-hp2026-active .atn-hp .atn-hp-actions,
  body.atn-hp2026-active .atn-hp .atn-hp-trust-chips { justify-content: center; }
  body.atn-hp2026-active .atn-hp .atn-hp-trust-heading .atn-hp-text-link { display: inline-flex; }
  body.atn-hp2026-active .atn-hp .atn-hp-section-head { flex-wrap: wrap; justify-content: center; text-align: center; }
  body.atn-hp2026-active .atn-hp .atn-hp-section-head > * { width: 100%; }
  body.atn-hp2026-active .atn-hp .atn-hp-article-grid { grid-template-columns: 1fr; }
  body.atn-hp2026-active .atn-hp .atn-hp-partner-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.atn-hp2026-active .atn-hp .atn-hp-cta-panel { flex-direction: column; align-items: center; text-align: center; }
  body.atn-hp2026-active .atn-hp .atn-hp-product { min-width: 0; }
  body.atn-hp2026-active .atn-hp .atn-hp-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #atngh-root.atngh-root .atngh-header { width: calc(100% - 32px) !important; }
}
@media (max-width: 520px) {
  body.atn-hp2026-active .atn-hp .atn-hp-service-grid,
  body.atn-hp2026-active .atn-hp .atn-hp-flow-grid,
  body.atn-hp2026-active .atn-hp .atn-hp-partner-grid,
  body.atn-hp2026-active .atn-hp .atn-hp-product-grid { grid-template-columns: 1fr; }
  body.atn-hp2026-active .atn-hp .atn-hp-service-grid { gap: 10px; }
  body.atn-hp2026-active .atn-hp .atn-hp-service-card { min-height: 94px; }
  body.atn-hp2026-active .atn-hp .atn-hp-native-slide h2 { font-size: clamp(27px, 8vw, 36px) !important; }
  body.atn-hp2026-active .atn-hp .atn-hp-slide-inner { padding-bottom: 96px; }
  body.atn-hp2026-active .atn-hp .atn-hp-section { padding-block: 40px; }
  body.atn-hp2026-active .atn-hp .atn-hp-cta-panel { padding-inline: 22px; }
  body.atn-hp2026-active .atn-hp .atn-hp-section-head h2 { overflow-wrap: anywhere; }
}
@media (max-width: 360px) {
  body.atn-hp2026-active { --atn-fluid-gutter: 14px; }
  body.atn-hp2026-active .atn-hp .atn-hp-native-slide h2 { font-size: 26px !important; }
  body.atn-hp2026-active .atn-hp .atn-hp-brand-text small { font-size: 8px; }
}

/* Nagy monitorok: ne csak a kártya legyen szélesebb, a benne lévő szöveg is arányosan nőjön. */
@media (min-width: 1800px) {
  body.atn-hp2026-active .atn-hp .atn-hp-section-head h2,
  body.atn-hp2026-active .atn-hp .atn-hp-trust-heading h2 {
    font-size: clamp(48px, 2.7vw, 82px) !important;
  }
  body.atn-hp2026-active .atn-hp .atn-hp-flow-card,
  body.atn-hp2026-active .atn-hp .atn-hp-product {
    padding: clamp(26px, 1.75vw, 58px);
  }
  body.atn-hp2026-active .atn-hp .atn-hp-article-body {
    padding: clamp(24px, 1.45vw, 46px);
  }
  body.atn-hp2026-active .atn-hp .atn-hp-service-copy strong {
    font-size: clamp(16px, 1.02vw, 26px);
  }
  body.atn-hp2026-active .atn-hp .atn-hp-flow-card h3,
  body.atn-hp2026-active .atn-hp .atn-hp-article h3 {
    font-size: clamp(21px, 1.18vw, 36px) !important;
  }
  body.atn-hp2026-active .atn-hp .atn-hp-flow-card p,
  body.atn-hp2026-active .atn-hp .atn-hp-article-body > p,
  body.atn-hp2026-active .atn-hp .atn-hp-product p,
  body.atn-hp2026-active .atn-hp .atn-hp-partner-intro {
    font-size: clamp(16px, .94vw, 25px) !important;
    line-height: 1.6 !important;
  }
  body.atn-hp2026-active .atn-hp .atn-hp-partner-name {
    font-size: clamp(16px, .9vw, 25px);
    min-height: clamp(82px, 5vw, 146px);
  }
  body.atn-hp2026-active .atn-hp .atn-hp-article-read,
  body.atn-hp2026-active .atn-hp .atn-hp-text-link {
    font-size: clamp(14px, .78vw, 22px) !important;
  }
  body.atn-hp2026-active .atn-hp .atn-hp-cta-panel {
    padding: clamp(40px, 2.4vw, 75px);
    min-height: clamp(230px, 15vw, 390px);
  }
}

/* ================================================================
 * V1.0.1 - SLIDER ONLY / DESKTOP CONTENT WIDTH CORRECTION
 * The Global Header 1.10.3 inline CSS applies a more-specific 1320px
 * !important cap to these TWO slider children above 1170px.
 * This rule only cancels that cap. The slider remains full-bleed;
 * text and navigation align to the existing homepage fluid gutter.
 * No header, logo, transition, animation, other section or mobile rules.
 * ================================================================ */
@media (min-width: 1171px) {
  body.atn-hp2026-active #atn-hp-main.atn-hp .atn-hp-slider .atn-hp-native-slide .atn-hp-slide-inner.atn-hp-shell,
  body.atn-hp2026-active #atn-hp-main.atn-hp .atn-hp-slider .atn-hp-native-slider .atn-hp-slider-controls.atn-hp-shell {
    width: calc(100% - (2 * var(--atn-fluid-gutter, clamp(16px, 4.5vw, 96px)))) !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}