/* Grillandia – fejléc: „Egyedi tervező” gomb + telefonos „Egyedi / 3D” gombok – 2026-10-19 (csak HU)
   Asztalon: a Konfigurátor gomb mellé kerül egy ugyanolyan stílusú gomb.
   Telefonon (≤1100 px, egy soros sötét fejléc): a telefon ikon kikerült; helyette az Egyedi tervező ikon (ráhúzásra kiírja a nevét)
   és a „3D” gomb áll, az e-mail és a nyelvválasztó mellett – ugyanabban a stílusban, mint a többi fejlécikon. */

/* --- asztali + sticky: két gomb egymás mellett --- */
.konfigurator-btn-box { display: flex; align-items: center; gap: 10px; }
.konfigurator-btn-box .btn-title { white-space: nowrap; }
/* a fehér sáv rácsa: a menü a lehető legközelebb marad a középhez, de a két gomb szélessége (max-content) soha nem szorítja össze a menüt */
@media only screen and (min-width: 1101px) {
    .home-header-alt .header-upper .nav-outer { grid-template-columns: minmax(0, 1fr) auto minmax(max-content, 1fr); column-gap: 28px; }
    .home-header-alt .header-upper .nav-outer .konfigurator-btn-box { justify-self: end; }
}
/* 1101–1300 px: a téma itt blokkra állítja a gombdobozt → flexre vissza; a menü és a gombok kompaktabbak, hogy a menü ne törjön két sorba */
@media only screen and (min-width: 1101px) and (max-width: 1300px) {
    .home-header-alt .header-upper .nav-outer { column-gap: 16px; }
    .home-header-alt .header-upper .nav-outer .konfigurator-btn-box { display: flex !important; gap: 6px; }
    .home-header-alt .header-upper .nav-outer .konfigurator-btn-box .btn-title { padding: 8px 12px; font-size: 14px; }
    .home-header-alt .header-upper .main-menu .navigation > li { margin-right: 16px; }
    .home-header-alt .header-upper .main-menu .navigation > li:last-child { margin-right: 0; }
    .home-header-alt .header-upper .main-menu .navigation > li > a { font-size: 14px; }
}
/* sticky fejléc 1101–1365 px (logóval együtt): kompakt menü + két kompakt gomb, egy sorban */
@media only screen and (min-width: 1101px) and (max-width: 1365px) {
    .home-header-alt .sticky-header .header-upper .nav-outer { gap: 14px; }
    .home-header-alt .sticky-header .header-upper .nav-outer .konfigurator-btn-box { display: flex !important; gap: 6px; }
    .home-header-alt .sticky-header .header-upper .nav-outer .konfigurator-btn-box .btn-title { padding: 6px 11px; font-size: 13px; }
    .home-header-alt .sticky-header .main-menu .navigation { white-space: nowrap; }
    .home-header-alt .sticky-header .main-menu .navigation > li { margin-right: 14px; }
    .home-header-alt .sticky-header .main-menu .navigation > li:last-child { margin-right: 0; }
    .home-header-alt .sticky-header .main-menu .navigation > li > a { font-size: 13px; }
}
/* sticky fejléc 1366–1400 px: a két gomb kicsit kompaktabb */
@media only screen and (min-width: 1366px) and (max-width: 1400px) {
    .home-header-alt .sticky-header .header-upper .nav-outer .konfigurator-btn-box { display: flex !important; gap: 8px; }
}

/* --- nyitott hamburger menü: a két gomb egymás alatt; az Egyedi tervező a kitöltött (fő) gomb, a Konfigurátor a körvonalas --- */
.mobile-konfigurator-box { display: grid; gap: 10px; }
.home-header-alt .mobile-konfigurator-box .theme-btn.btn-style-four.is-outline { background-color: transparent; background-image: none; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.55); }
.home-header-alt .mobile-konfigurator-box .theme-btn.btn-style-four.is-outline .btn-title { color: #fff; }
.home-header-alt .mobile-konfigurator-box .theme-btn.btn-style-four.is-outline:hover,
.home-header-alt .mobile-konfigurator-box .theme-btn.btn-style-four.is-outline:focus-visible { background-color: #B87333; box-shadow: inset 0 0 0 1.5px #B87333; }
.home-header-alt .mobile-konfigurator-box .theme-btn.btn-style-four.is-outline:hover .btn-title,
.home-header-alt .mobile-konfigurator-box .theme-btn.btn-style-four.is-outline:focus-visible .btn-title { color: #2c1608; }

/* --- telefonos fejléc (≤1100 px) --- */
@media only screen and (max-width: 1100px) {
    .home-header-alt .header-top .home-header-mobile-icons { gap: 6px; }
    .home-header-alt .header-top .home-header-mobile-icon.home-header-mobile-3d {
        font-size: 13px; font-weight: 700; letter-spacing: .02em; text-decoration: none;
    }
    .home-header-alt .header-top .home-header-mobile-egyedi { text-decoration: none; }
    .home-header-alt .header-top .home-header-mobile-egyedi .hh-ic { display: block; width: 22px; height: 22px; }
    /* a logó annyira kicsinyedik, amennyire a sor igényli (4 ikon + hamburger) */
    .home-header-alt .header-top .logo-box .logo img { width: clamp(90px, calc(100vw - 262px), 150px); height: auto; }
    /* név-buborék ráhúzásra / billentyűzetes fókuszra (érintőképernyőn nincs ráhúzás: ott koppintásra a cél oldal nyílik) */
    .home-header-alt .header-top .home-header-mobile-icon[data-tip] { position: relative; }
    .home-header-alt .header-top .home-header-mobile-icon[data-tip]::after {
        content: attr(data-tip); position: absolute; top: calc(100% + 8px); right: 0; z-index: 5;
        background: #fff; color: #212121; font: 600 12px/1 "Fira Sans", sans-serif; letter-spacing: 0;
        padding: 7px 10px; border-radius: 6px; white-space: nowrap; pointer-events: none;
        box-shadow: 0 4px 14px rgba(0,0,0,.28); opacity: 0; transform: translateY(-3px);
        transition: opacity .18s ease, transform .18s ease;
    }
    .home-header-alt .header-top .home-header-mobile-icon[data-tip]:focus-visible::after { opacity: 1; transform: none; }
    .home-header-alt .header-top .home-header-mobile-icon:focus-visible { outline: 2px solid #B87333; outline-offset: 2px; }
}
@media only screen and (max-width: 1100px) and (hover: hover) {
    .home-header-alt .header-top .home-header-mobile-icon[data-tip]:hover::after { opacity: 1; transform: none; }
}
@media only screen and (max-width: 360px) {
    .home-header-alt .header-top .home-header-mobile-icons { gap: 4px; }
    .home-header-alt .header-top .logo-box .logo img { width: clamp(80px, calc(100vw - 232px), 125px); }
}
@media (prefers-reduced-motion: reduce) {
    .home-header-alt .header-top .home-header-mobile-icon[data-tip]::after { transition: none; }
}