:root {
  --background: #ffffff;           /* biele pozadie */
  --text: #2e2e2e;                 /* tmavosivý text – kontrastný, nie tvrdý */
  --text20: #6b6b6b;               /* sekundárny text */
  --primary: #A6A6A6;              /* zlatohnedá – hlavná farba */
  --primary10: rgba(166, 166, 166, 0.1);
  --primary20: rgba(166, 166, 166, 0.2);
  --primary40: rgba(166, 166, 166, 0.4);
  --secondary: #c4c4c4;            /* svetlejšia verzia – jemný kontrast */
  --secondary20: rgba(196, 196, 196, 0.2);
  --accent: #8a8a8a;               /* doplnková – svetlejšie zlato */
  --accent20: rgba(138, 138, 138, 0.2);
  --highlight: #efefef;            /* veľmi svetlý odtieň pre bloky */
  --whitetext: #ffffff;            /* biely text na tmavšom pozadí */
}


    body {
        font-family: "Quicksand", sans-serif;
        background-color: var(--background);
        color: var(--text);
        margin: 0;
        padding: 0;
        padding-top: 70px;
    }

    .container-fixed-width {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 15px;
    }

    .main-section {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        position: relative;
    }

    .text-content {
        z-index: 1;
    }

    .text-content h1 {
        font-size: 4rem;
        line-height: 1.2;
    }

    .highlight-magic {
      display:block;
      font-size: clamp(2rem, 4vw, 3.5rem); /* min, fluid, max */
      font-weight: 700;
      letter-spacing: .03em;
      color:#fff;
    }

    .highlight {
      display:block;
      font-size: clamp(1.4rem, 3vw, 2.2rem);
      font-weight: 400;
      color:#fff;
    }

    .text-content h1 span {
      text-shadow:0 2px 6px rgba(0,0,0,.4);
    }

    .text-content .highlight-secondary {
        color: var(--text);
        white-space: nowrap;
    }

    .text-content p {
        color: var(--whitetext);
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.50);
    }    

    .btn-section {
        margin-top: 20px;
    }

    .btn-primary-custom {
        background-color: var(--secondary);
        border-color: var(--secondary);
        color: white;
        padding: 10px 20px;
        border-radius: 30px;
        margin-right: 10px;
        text-transform: uppercase;
        font-weight: 600;
    }

    .btn-secondary-custom {
        background-color: var(--primary);
        border-color: var(--primary);
        color: white;
        padding: 10px 20px;
        text-transform: uppercase;
        font-weight: 600;
        transition: transform 0.3s ease, box-shadow 0.3s ease; /* Pridané pre plynulý efekt */
    }

    .btn-secondary-custom:hover {
        transform: translateY(-5px);
        background-color: var(--primary);
        border-color: var(--primary);
        color: white;
        box-shadow: 0 20px 80px -10px var(--primary);

    } 

    .btn-secondary-custom:active {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: white !important;
    } 
    

    .btn-primary-custom-form {
        background-color: var(--secondary);
        border-color: var(--secondary);
        color: white;
        padding: 10px 20px;
        border-radius: 30px;
        margin-right: 10px;
        text-transform: uppercase;
        font-weight: 600;
    }

    .btn-secondary-custom-form {
        background-color: var(--primary);
        border-color: var(--primary);
        color: white;
        padding: 10px 20px;
        text-transform: uppercase;
        font-weight: 600;
        transition: transform 0.3s ease, box-shadow 0.3s ease; /* Pridané pre plynulý efekt */
    }

    .btn-secondary-custom-form:hover {
        transform: translateY(-5px); /* Posunutie tlačidla mierne hore */
        background-color: var(--primary);
        border-color: var(--primary);
        color: white;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

    } 

    .btn-secondary-custom-form:active {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        color: white !important;
    } 


    .btn-secondary-custom-price {
        background-color: var(--accent); /* Zmena farby pozadia na --accent */
        border-color: var(--accent); /* Zmena farby okraja na --accent */
        color: var(--background);
        padding: 10px 20px;
        text-transform: uppercase;
        font-weight: 600;
        transition: transform 0.3s ease, box-shadow 0.3s ease; /* Pridané pre plynulý efekt */
    }

    .btn-secondary-custom-price:hover {
        transform: translateY(-5px); /* Posunutie tlačidla mierne hore */
        background-color: var(--accent); /* Zmena farby pozadia na --accent */
        border-color: var(--accent); /* Zmena farby okraja na --accent */
        color: var(--background);
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Tieň pre hover efekt */
    }

    .btn-secondary-custom-price:active {
        background-color: var(--accent) !important; /* Zmena farby pozadia na --accent */
        border-color: var(--accent) !important; /* Zmena farby okraja na --accent */
        color: var(--background) !important;
    }

    .btn-section .btn-secondary-custom:active {
        background-color: var(--primary);
        border-color: var(--primary);
        color: white;
    }

    .grid-content img {
        max-width: 88%;
        height: auto;
        padding-left: 100px;
        margin-left: 60px;
    }

    .section-header {
        position: relative; /* Potrebné pre absolútne umiestnenie ikon */
        text-align: center; /* Zarovnanie nadpisu na stred */
    }

    .section-header .section-title {
        padding-bottom: 30px;
        font-size: 2.5rem;
        font-weight: 600;
        color: var(--text);
        z-index: 2;
        font-weight: bold;
    }

    .services-section {
        max-width: 1200px;
        margin-top: 50px;
        margin-bottom: 50px;
        margin-left: auto;
        margin-right: auto;
        padding: 0 15px;
    }

    .tab {
        cursor: pointer;
        margin-bottom: 10px;
        transition: background-color 0.3s ease;
    }

    .tab.open .tab-header {
        transform: scale(1.01);
    }  

    .tab-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        background-color: var(--secondary20);
        border-radius: 10px;
        padding: 15px 20px;
        color: var(--text20);
        font-weight: bold;
        font-size: 1.3rem;
        transition: transform 0.2s ease;

    }     

    .tab-header:hover {
        transform: scale(1.01);
    }

    .tab-content {
        background-color: var(--background);
        color: var(--text);
        padding: 0 20px;
        border-radius: 10px;
        display: none;
        overflow: hidden;
    }

    .tab.open .tab-content {
        display: block;
        padding: 20px;
    }

    .tab .icon {
        transition: transform 0.3s ease;
    }

    .tab.open .icon {
        transform: rotate(45deg); /* Otočíme ikonku pre aktívny stav */
    }

    .team-section {
        padding-bottom: 20px;
        background-color: var(--background);
    }

    .team-grid {
        display: flex;
        justify-content: space-around;
        flex-wrap: wrap;
        gap: 30px;
    }

    .team-card {
        background-color: var(--secondary);
        border-radius: 10px;
        padding: 20px;
        width: 270px;
        text-align: center;
        color: var(--text);
        transition: transform 0.3s ease;
        box-shadow: 0 0 15px #00000056;
    }

    .team-card:hover {
        transform: scale(1.05);
    }

    .team-image img {
        width: 100px;
        height: 100px;
        border-radius: 50%;
        border: 2px solid #D9EBF2;
        margin-bottom: 15px;
    }

    .team-info h3 {
        font-size: 1.5rem;
        margin: 0;
        color: var(--text);
    }

    .team-info p {
        font-size: 1rem;
        color: var(--text);
        opacity: 0.8;
    }        

    .section-contact {
        padding-bottom: 50px;
    }

    .contact-form {
        display: flex;
        flex-direction: column;
        gap: 15px;
    }

    .contact-form-row {
        display: flex;
        justify-content: space-between;
        gap: 20px;
    }

    .contact-form input,
    .contact-form textarea {
        width: 100%;
        padding: 10px;
        background-color: var(--secondary10);
        border: 1px solid var(--secondary10);
        border-radius: 5px;
        color: #545454;
        font-weight: 600;
    }

    .contact-form input::placeholder,
    .contact-form textarea::placeholder {
        color: #545454;
    }

    .contact-form input:focus,
    .contact-form textarea:focus {
        outline: none;
        border-color: var(--secondary10);
    }

    .contact-form textarea {
        resize: none;
    }
   

    .error-message {
        color: red;
        font-size: 0.9rem;
        margin-right: 10px;
    }

    .text-end {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        gap: 10px;
    }

    .btn-primary-custom {
        padding: 10px 20px;
        border-radius: 5px;
        background-color: var(--primary);
        color: white;
        text-transform: uppercase;
        font-weight: 600;
        cursor: pointer;
        border: none;
    }

    .btn-primary-custom:hover {
        background-color: var(--accent);
    }
   
    .contact-form input:-webkit-autofill,
    .contact-form input:-webkit-autofill:hover,
    .contact-form input:-webkit-autofill:focus,
    .contact-form textarea:-webkit-autofill,
    .contact-form textarea:-webkit-autofill:hover,
    .contact-form textarea:-webkit-autofill:focus {
        /* pozadie autofill */
        box-shadow: 0 0 0 1000px var(--secondary10) inset !important;
        border: 1px solid var(--secondary10) !important;
        border-radius: 5px !important;
    
        /* text */
        -webkit-text-fill-color: #545454 !important;
        font-weight: 600 !important;
        font-size: 1rem !important;
    
        /* hack na zrušenie default žltého pozadia */
        transition: background-color 5000s ease-in-out 0s;
    }
    
    .error-message {
        color: var(--accent);
        margin-right: 10px;
        padding-top: 3px;
        opacity: 0;
        transition: opacity 0.5s ease-in-out;
    }

    .contact-map {
        display: flex;
        justify-content: space-between;
        align-items: center; /* Zarovná všetko na stred vertikálne */
        background-color: var(--background);
        padding-top: 20px;;
    }

    .contact-map .map-image img {
        width: 100%;
        max-width: 600px;
        height: auto;
        border-radius: 10px;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);        
    }

    .contact-map .contact-info {
        color: var(--text);
        font-size: 1.1rem;
        line-height: 1.5;
        padding-left: 30px;
        display: flex;
        flex-direction: column;
        justify-content: center; /* Vertikálne zarovná kontaktne údaje */
    }

    .contact-map .contact-info i {
        margin-right: 10px;
        color: var(--primary);
    }

    .contact-map .divider {
        width: 2px; /* Viditeľnejšia šírka */
        background-color: rgba(84, 84, 84, 0.2);
        height: 400px; /* Nastavená pevná výška */
        opacity: 0.5;
        margin: 0 30px; /* Umožní zarovnanie vertikálne na stred */
    }

    .section-header h2 {
        font-size: 2.5rem;
        color: var(--text);
        text-align: center;
        font-weight: bold;
    }      

    .bigfont {
            font-size: 27px;
            font-weight: 600;
    }        

    /* Footer */
    footer {
      background: linear-gradient(180deg, #cfc5b3 0%, #b8a98e 100%); /* jemný taupe–aurum tón */
      color: #2f2f2f;
      padding: 40px 20px;
      font-size: 14px;
      gap: 2em;
      border-radius: 10px;
      max-width: 1200px;
      margin: 50px auto 30px;
    }


    .footer-container {
    display: flex;
    justify-content: space-between;
    align-items: center; /* vertical center */
    flex-wrap: wrap;
    }

    .footer-section {
    flex: 1;
    min-width: 200px;
    padding: 10px;
    color: var(--whitetext);
    }

    .footer-section.logo-section {
    display: flex;
    align-items: center;   /* vertical center */
    justify-content: center;
    text-align: center;
    }

    .footer-logo {
    width: 180px;
    display: block;        /* removes baseline gap */
    }

    .footer-section h4 { font-size: 18px; font-weight: 600; }
    .footer-section h5 { font-size: 16px; margin-bottom: 15px; font-weight: 600; }

    .footer-section ul { list-style: none; padding: 0; }
    .footer-section ul li { margin-bottom: 10px; }
    .footer-section ul li a {
    color: var(--whitetext);
    text-decoration: none;
    position: relative;
    padding-bottom: 2px;
    }
    .footer-section ul li a::after {
    content: '';
    position: absolute; left: 0; bottom: 0;
    width: 0%; height: 1px;
    background-color: var(--whitetext);
    transition: width .3s ease-in-out;
    }
    .footer-section ul li a:hover::after { width: 100%; }

    .footer-bottom {
    text-align: center;
    padding-top: 20px;
    border-top: 1px solid rgb(237 237 237 / 17%);
    margin-top: 40px;
    }

    .footer-bottom p { margin: 5px 0; color: var(--whitetext); }
    .footer-bottom span { color: var(--whitetext); }

    .footer-bottom a,
    .footer-link {
    color: #FF5757; /* brand red */
    text-decoration: none;
    position: relative;
    padding-bottom: 2px;
    }
    .footer-link::after,
    .footer-bottom a::after {
    content: '';
    position: absolute; left: 0; bottom: 0;
    width: 0%; height: 1px;
    background-color: #FF5757;
    transition: width .3s ease-in-out;
    }
    .footer-link:hover::after,
    .footer-bottom a:hover::after { width: 100%; }

    .social-icons {
    margin-top: 8px;
    font-size: 20px;
    }
    .social-icons a {
    color: #FF5757;                /* brand red */
    margin: 0 8px;
    }
    .social-icons a:hover { opacity: .85; }

    /* Mobile */
    @media (max-width: 768px) {
    .footer-container {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 10px;
    }
    .footer-section { flex: 1 1 100%; }
    .footer-section.logo-section { margin-bottom: 10px; }
    }
    

    /* Header */
    header {
        background-color: #fbfbfb;
        padding: 15px 0;
        display: flex;
        justify-content: center;
        box-shadow: 0 2px 14px rgba(15, 12, 49, .06);
        position: fixed; /* Pridáme pevné umiestnenie */
        top: 0; /* Zabezpečíme, že bude vždy na vrchu */
        width: 100%; /* Nech pokrýva celú šírku */
        z-index: 1000; /* Nastavíme vyššiu hodnotu z-indexu, aby bola nad ostatnými elementmi */
    }

    .navbar {
        display: flex;
        justify-content: space-between;
        align-items: center;
        max-width: 1200px; /* Maximálna šírka */
        width: 100%; /* Plná šírka pre responzívnosť */
        padding: 0 15px; /* Vnútorné odsadenie */
    }

    .navbar-logo {
        width: 180px;
        height: auto;
    }

    .navbar-menu {
        list-style: none;
        display: flex;
        gap: 30px;
        margin-top: 15px; /* Nastavte si požadovanú hodnotu */
        padding: 0; /* Zabezpečte, aby nedochádzalo k zbytočnému vnútornému odsadeniu */
    }

    .navbar-menu li {
        display: inline;
    }
    
    .navbar-menu li a {
        color: #5b5c5b;
        text-decoration: none;
        font-size: 1rem;
        position: relative;
        padding-bottom: 2px;
    }
    
    .navbar-menu li a::after {
        content: '';
        position: absolute;
        left: 0;
        bottom: 0;
        width: 0%;
        height: 1px;
        background-color: #5b5c5b;
        transition: width 0.3s ease-in-out;
    }
    
    .navbar-menu li a:hover::after {
        width: 100%;
    }
    

    /* Hamburger */
    .hamburger {
        display: none;
        flex-direction: column;
        cursor: pointer;
        gap: 5px;
    }

    .hamburger div {
        width: 25px;
        height: 3px;
        background-color: var(--text);
    }        

    .team-content {
        display: flex;
        align-items: center; /* Vertikálne centrovanie */
        justify-content: center; /* Horizontálne centrovanie celej sekcie */
        gap: 100px; /* Medzera medzi obrázkom a kartou */
    }

    .team-image-left img {
        max-width: 256px; /* Nastavte požadovanú šírku */
        height: auto;
    }

    .team-grid {
        display: flex;
        justify-content: center; /* Centrovanie karty */
    }

    .map-image img {
        width: 100%;
        max-width: 600px;
        height: auto;
        border-radius: 10px;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
        transition: transform 0.3s ease-in-out; /* plynulý prechod */
    }
    
    .map-image:hover img {
        transform: scale(1.03); /* mierne zväčšenie */
    }
    
    [id] {
        scroll-margin-top: 110px;
      }

    /* RESPONSIVE */
    /* MOBILE */    
    @media (max-width: 768px) {
        body {
            padding-top: 75px;
        }   

        .section-contact .text-end {
            display: flex;
            flex-direction: column;
            align-items: center;    
            gap: 8px;
        }
        
        .section-contact .error-message {
            min-height: 30px; 
            text-align: center; 
        }
        
        .section-contact .text-end button {
            order: 0;
        }
        
        .section-contact .text-end .error-message {
            order: 1;
            margin: 0; 
        }          

        .main-section {
            flex-direction: column;
            justify-content: center;
            align-items: flex-start;
            text-align: left;
            top: 14px;
            height: auto;
            position: relative;
            border-radius: 15px;
            padding: 20px;
        }

        .text-content {
            max-width: 100%;
            z-index: 1;
            position: relative;
        }

        .text-content h1 {
            font-size: 2.8rem;
            line-height: 1.3;
        }

        .text-content p {
            font-size: 1.1rem;
        }

        .grid-content {
            display: none;
        }

        .btn-primary-custom, .btn-secondary-custom {
            width: 100%;
            margin: 10px 0;
        }

        .contact-form-row {
            flex-direction: column; 
        }

        .mobile-image {
            position: fixed;
            bottom: 0;
            left: 52%;
            width: 50%;
            opacity: 0.05;
            z-index: 0;
            top: 81px;
            pointer-events: none; 
        }

        .tab-header {
            width: 100%; 
            box-sizing: border-box; 
        }
        
        .contact-map {
            flex-direction: column;
            align-items: center;
        }

        .contact-map .map-image {
            width: 100%;
            margin-bottom: 20px;
            z-index: 9;            
        }

        .contact-map .divider {
            display: none; 
        }

        .contact-map .contact-info {
            text-align: center; 
            padding-left: 0;
        }   
        
        .pmobile {
            font-size: 15px;
        }      
        
        .bigfont{
            font-size: 22px;
        }           

        .btn-secondary-custom-price {
            width: 100%; 
            text-align: center; 
            margin: 10px 0;
        }     
        
        .footer {
            margin-left: 20px;
            margin-right: 20px;
        }

        .footer-logo {
            padding-top: 0px;
        }            

        .footer-container {
            flex-direction: column;
            align-items: center;
            text-align: center;
        }

        .footer-section {
            flex: 1 1 100%;
            margin: 10px 0;
        }

        .footer-section.logo-section {
            margin-bottom: 20px;
        }

        .footer-bottom {
            font-size: 12px;
        }     
        
        .navbar-menu {
            display: none;
            flex-direction: column;
            width: 100%;
            position: absolute;
            top: 60px;
            left: 0;
            background-color: #e9f7f3;
            padding: 10px 0;
            border-bottom: 1px solid #d4f0e8;
            z-index: 999;
        }

        .navbar-menu.active {
            display: flex;
            top: 48px;
        }

        .navbar-menu li {
            text-align: center;
            padding: 10px 0;
        }

        .hamburger {
            display: flex;
        }       
        
        .team-image-left {
            display: none;
        }            
    }

    @media (min-width: 769px) {
        .mobile-image {
            display: none;
        }
    }

    /* RESPONSIVE */
    /* IPAD/TABLET */  
    @media only screen 
    and (orientation: portrait) 
    and (width: 820px) 
    and (height: 1106px) 
    and (resolution: 2dppx) {
    
    .bigfont {
      font-size: 22px;
    }

    .navbar-menu {
    display: contents;
    }   
  }

@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (-webkit-min-device-pixel-ratio: 1.5)
  and (orientation: portrait) {
    .navbar-menu {
        display: contents;
    }    
    .contact-form-row {
        padding-bottom: 15px;
    }    

    .benefits-divider {
        margin-right: 15px;
        margin-left: 15px;
    }

  /* Po otvorení tabu sa .service-item stane stĺpcom */
  .tab.open .service-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch;
    gap: 0 !important;
  }

  /* Obrázok 100% šírka a fixná výška 300px */
  .tab.open .service-item img {
    width: 100% !important;
    height: 300px !important;
    object-fit: cover !important;
    border-radius: 10px !important;
  }

  /* Divider teraz horizontálne po celej šírke */
  .tab.open .service-item .service-divider-vertical {
    width: 100% !important;
    height: 2px;
    margin: 15px auto; 
    background-color: rgba(84,84,84,0.2);
  }

  /* Text zaberie celú šírku a dostane padding */
  .tab.open .service-item .service-text {
    width: 100% !important;
    padding: 20px 0 0;
  }

}


.hero-swiper-section {
    position: relative;
    width: 100%;
    height: 70vh;
    overflow: hidden;
}

/* SLIDER */
.hero-swiper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.hero-swiper .swiper-wrapper,
.hero-swiper .swiper-slide {
    height: 100%;
}

.hero-swiper .swiper-slide {
    background-size: cover;
    background-position: center;
}

/* Vylepšený gradient pre hero sekciu */
.hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: none;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  background: linear-gradient(rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.14) 40%, rgba(0, 0, 0, 0.7) 100%);
}

.hero-overlay .container-fixed-width {
  width:100%;
  max-width:1200px;
  padding:0 16px;
}

.hero-overlay .text-content {
  width:100%;
  pointer-events:auto;
  transform:translateY(0); /* istota že nemá offset */
}

.hero-overlay .text-content,
.hero-overlay .btn-section a {
  pointer-events: auto;
}

header .navbar {
  display: flex;
  align-items: center;
}

.header-divider {
  width: 1px;
  height: 40px;
  background-color: rgba(84,84,84,0.2);
  margin: 0 20px;
}

.header-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.header-item {
  display: flex;
  align-items: center;
  font-size: 0.9rem;
  color: var(--text);
}

.header-item i {
  margin-right: 6px;
  color: var(--primary);
  font-size: 1rem;
}

.header-phone a {
  color: var(--background);
  text-decoration: none;
}

.header-phone a:hover {
  text-decoration: underline;
}

.tab-content .service-item {
  display: flex;
  align-items: stretch; 
  gap: 20px;
  padding: 20px 0;
}


.tab-content .service-item img {
  width: 200px;
  height: auto;
  border-radius: 10px;
  object-fit: cover;
}


.tab-content .service-divider-vertical {
  width: 2px;
  background-color: rgba(84,84,84,0.2);
}

.tab-content .service-text {
  flex: 1;
  align-content: center;
}



@media (max-width: 768px) {
  .navbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding: 0 15px;
  }

  .logo {
    order: 0;
  }

  .hamburger {
    order: 1;
  }

 .hero-swiper-section {
    height: 90vh;
} 

  .header-info {
    order: 2;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 10px 15px 0;
  }
  
  .header-divider {
    order: 2;
    align-self: stretch;
    margin: 0 15px;
  }
}

@media (max-width: 768px) {
  .service-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 16px;
  }

    .tab-content .service-item img {
        width: 100%;
    }  

  .service-divider-vertical {
    display: none;
  }

  .service-text {
    width: 100%;
    padding: 0 15px;
  }

  .service-text p,
  .service-text ol,
  .service-text ul,
  .service-text h4 {
    text-align: left;
  }
}

.benefits-section {
  padding-top: 60px;
  padding-bottom: 60px;
}

.benefits-swiper {
  position: relative;
}

.benefits-item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 15px;
}

.benefits-icon {
  width: 64px;
  height: 64px;
  flex-shrink: 0;
}

.benefits-divider {
  width: 2px;
  height: 80px;
  background-color: var(--secondary20);
  flex-shrink: 0;
  border-radius: 1px;
}

.benefits-text {
  flex: 1;
}

.benefits-text h3 {
  margin: 0;
  font-size: 1.2rem;
  color: var(--text);
  margin-bottom: 8px;
}

.benefits-text p {
  margin: 0;
  font-size: 1rem;
  color: var(--text);
  line-height: 1.4;
}

.benefits-swiper:hover {
  cursor: grab;
}

@media (max-width: 768px) {
  .benefits-item {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 12px;
  }
  .benefits-divider {
    width: 60px;
    height: 2px;
    margin: 0 auto;
  }
  .benefits-text {
    width: 100%;
    padding: 0 15px;
  }
  .benefits-text h3,
  .benefits-text p {
    text-align: center;
  }
}

/* Dropdown (select) */
.contact-form select#service {
  width: 100%;
  padding: 10px;
  background-color: var(--secondary10);
  border: 1px solid var(--secondary10);
  border-radius: 5px;
  color: #545454;
  font-weight: 600;
  font-family: "Quicksand", sans-serif;
  appearance: none; 
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23545454' d='M2 5L0 0h4z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 15px center;
  background-size: 10px;
  margin-top: 0; 
}

.contact-form select#service:focus {
  outline: none;
  border-color: var(--secondary10);
  box-shadow: 0 0 0 2px var(--whitetext);
}

@media (max-width: 768px) {
  .contact-form select#service {
    font-size: 1rem;
  }
}

/* --- FIX pre osekávanie log --- */
.insurance-section { 
  padding-top: 48px;
  padding-bottom: 0px;
  padding-left: 0;
  padding-right: 0;
 }

/* nechaj tento slider pretiecť mimo kontajner, aby hover nebol zrezaný */
.insurance-section .container-fixed-width { overflow: visible; } /* only here */

.insurance-section .section-title {
  color: #2e2e2e; /* teplá tmavohnedá – rovnaká ako v službách */
  font-weight: 700;
  position: relative;
  display: inline-block;
  letter-spacing: .02em;
}

.insurance-section .section-title::after {
  content: "";
  display: block;
  width: 60px;
  height: 2px;
  background-color: #A6A6A6; /* hlavná zlatá */
  margin: 10px auto 0;
  border-radius: 1px;
  opacity: .9;
}

.insurance-swiper { 
  max-width: 1000px;
  margin: 0 auto;
  overflow: visible; /* override Swiper's hidden */
  padding: 0 12px;   /* kvapka priestoru vľavo/vpravo -> neoreže posledné logo */
}

/* pridaj „vzduch“ okolo loga, aby posun hore nemal šancu naraziť na hranu */
.insurance-swiper .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 18px; /* top padding chráni hover posun */
}

.insurance-logo {
  max-height: 40px;
  width: auto;
  object-fit: contain; /* keep inside slide */
  opacity: 0.9;
  transition: transform .2s ease, filter .2s ease, opacity .2s ease;
}

.insurance-logo:hover {
  transform: translateY(-2px); /* tiny lift without clip */
  filter: grayscale(0%);
  opacity: 1;
}

/* desktop/tablet */
@media (min-width: 768px) {
  .insurance-pagination { display: none; }
  .insurance-logo { max-height: 40px; }
}

/* mobile */
@media (max-width: 767px) {
  .insurance-logo { max-height: 40px; }
}

.insurance-swiper .swiper-pagination {
  position: static !important; 
  margin-top: 20px; 
}

@media (max-width: 767px) {
  .insurance-swiper.swiper-horizontal > .swiper-pagination-bullets,
  .insurance-swiper .swiper-pagination-bullets.swiper-pagination-horizontal {
    bottom: -4px !important; /* posuň dolu */
  }
}

/* Dôvera logo – mierne väčšie */
.dovera-logo {
  max-height: 35px; /* zvýšené oproti ostatným 56–60px */
}

@media (max-width: 767px) {
  .dovera-logo {
    max-height: 35px; /* na mobile ešte o čosi väčšie pre čitateľnosť */
  }
}

/* brand primary = #FF5757 */
.btn-primary { background-color: #FF5757; border-color: #FF5757; }
.btn-primary:hover { background-color: #e24e4e; border-color: #e24e4e; }

/* GDPR modal text links only (exclude .btn) */
#gdprModal .modal-body a:not(.btn) {
  color: #FF5757;
  text-decoration: none;
  position: relative; /* animation base */
  transition: color 0.3s ease;
}

#gdprModal .modal-body a:not(.btn)::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 0;
  height: 1px;
  background-color: #FF5757;
  transition: width 0.3s ease;
}

#gdprModal .modal-body a:not(.btn):hover::after {
  width: 100%;
}

/* ensure buttons stay buttons */
#gdprModal .btn { 
  color: #fff; 
  text-decoration: none;
  position: static; /* no underline base */
}
#gdprModal .btn::after { content: none !important; }

/* GDPR modal - secondary (light) button fix */
#gdprModal .btn-light {
  background-color: #f2f2f2;
  color: #545454;
  border: 1px solid #e0e0e0;
  transition: all 0.3s ease;
}

#gdprModal .btn-light:hover {
  background-color: #e6e6e6;
  color: #000;
}

.footer .social-icons a::after {
  content: none !important;
}

.footer .social-icons a:hover::after {
  content: none !important;
}

/* Footer - fix for social icons hover (no color or opacity change) */
.footer .social-icons a {
  color: #FF5757 !important; /* zachová červenú */
  opacity: 1 !important;     /* plná viditeľnosť */
  transition: none !important; /* vypne efekt */
}

.footer .social-icons a:hover {
  color: #FF5757 !important;
  opacity: 1 !important;
}

#gdprModal .btn-primary:active,
#gdprModal .btn-primary:focus {
  background-color: #e24e4e !important; /* rovnaká ako hover */
  border-color: #e24e4e !important;
  box-shadow: none !important; /* odstráni modrý Bootstrap ring */
}

/* Mobile sticky header */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  background:#A6A6A6;box-shadow:0 2px 14px rgba(15,12,49,.06)
}
.navbar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px}
.navbar-logo{width:180px;height:auto}
.header-info{display:flex;align-items:center;gap:18px}
.header-item{display:flex;align-items:center;gap:6px;color:var(--background);font-size:.95rem}
.header-item i{color:var(--background)}
.hamburger-btn{width:38px;height:32px;display:inline-flex;flex-direction:column;justify-content:space-between;background:transparent;border:0;padding:4px;cursor:pointer}
.hamburger-btn span{display:block;height:3px;width:100%;background:var(--background);border-radius:2px}

/* Slide-in menu */
.menu-overlay{position:fixed;inset:0;background:rgba(0,0,0,.35);opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;z-index:999}
.menu-overlay.show{opacity:1;visibility:visible}
.menu-panel {
  position: fixed;
  top: 0;
  right: 0; 
  left: auto;
  height: 100vh;
  width: min(340px, 90vw);
  backdrop-filter: blur(12px);           /* efekt rozmazania */
  -webkit-backdrop-filter: blur(12px);   /* podpora Safari */
  background: rgba(166, 166, 166, 0.10);
  color: #fff;
  transform: translateX(100%);
  transition: transform .35s ease;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  padding: 18px 22px;
}
.menu-panel.open {
  transform: translateX(0);
}

.menu-close{align-self:flex-end;background:transparent;border:0;color:#fff;font-size:22px;cursor:pointer}
.menu-list{list-style:none;margin:20px 0;padding:0}
.menu-list a {
  position: relative;
  color: #fff;
  text-decoration: none;
  font-size: 28px;
  font-weight: 600;
  transition: color 0.3s ease;
}

.menu-list a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px;
  width: 0;
  height: 2px;
  background-color: #8a8a8a; /* jemne svetlejšia zlatá než #A6A6A6 */
  transition: width 0.3s ease;
}

.menu-list a:hover {
  color: #efefef; /* voliteľné – jemne zohriaty tón pri hoveri */
}

.menu-list a:hover::after {
  width: 100%;
}
.menu-meta{margin-top:auto}
.menu-meta-item{display:flex;align-items:center;gap:10px;color:#fff;margin:8px 0}
.menu-meta-item a{color:#fff;text-decoration:none}

/* Hero (single background with Ken Burns) */
.hero-swiper-section{position:relative;width:100%;height:70vh;overflow:hidden}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1);animation:kenburns 10s ease-in-out both}
@keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.08)}}

/* Hero overlay + content */
.hero-overlay .container-fixed-width{display:flex;align-items:center;height:100%}
.hero-overlay .text-content,.hero-overlay .btn-section a{pointer-events:auto}
.hero-overlay .text-content h1{text-align:center}
.hero-overlay .btn-section{display:flex;justify-content:center}

/* Hero top bar (desktop/tablet only) */
.hero-topbar{position:absolute;top:0;left:0;right:0;z-index:3;padding:22px 0}
.hero-topbar .container-fixed-width{display:flex;align-items:center;justify-content:space-between}
.hero-logo img{width:100px;height:auto;filter:drop-shadow(0 2px 6px rgba(0,0,0,.15))}
.hero-topbar .hamburger-btn{width:40px;height:34px;border:0}
.hero-topbar .hamburger-btn span{background:#fff;margin:4px 0}

/* Hero bottom info */
.hero-bottom{
  position:absolute;
  left:0;right:0;bottom:0;
  z-index:3;
  padding:18px 0 26px;
}
.hero-bottom-grid{
  display:grid;
  gap:18px;
  grid-template-columns:repeat(4,1fr);
}
.hero-info-item{
  display:flex;
  align-items:center;
  gap:14px;
  color:#fff;
}
.hero-info-item i{font-size:30px;opacity:.95}
.hero-info-item a,.hero-info-item span{
  color:#fff;
  text-decoration:none;
  font-weight:600;
}
.hero-info-label{
  font-size:.78rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  opacity:.85;
}

/* tablet: zcentrovanie celého bloku ikon */
@media (min-width: 768px) and (max-width: 1199px){
  .hero-bottom-grid{
    display:flex;            /* prepni z gridu na flex */
    flex-wrap:wrap;
    justify-content:center;  /* vycentruj celý blok */
    gap:18px 28px;
  }
  .hero-info-item{
    flex:0 1 320px;          /* šírka jedného boxu ~2 v riadku */
  }
}

/* mobile – skry celý blok */
@media (max-width:767.98px){
  .hero-bottom{display:none!important;}
}

/* Responsive */
@media (max-width:1200px){.hero-bottom-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:992px){.navbar-logo{width:190px}}
@media (max-width:992px) and (min-width:768px){
  .hero-info-item i{font-size:20px}
  .hero-info-item a,.hero-info-item span{font-size:.95rem}
}
@media (max-width:768px){
  body{padding-top:75px}
  .header-info{width:100%;justify-content:space-between}
  .hero-swiper-section{height:90vh}
}

/* reset – nech nie je default 8px okraj */
html, body { margin: 0; }

/* padding-top len na mobile */
@media (max-width: 767.98px){
  body { padding-top: 75px; }
}
@media (min-width: 768px){
  body { padding-top: 0 !important; }
}

/* nech header na desktope vôbec netvorí “biely pás” */
@media (min-width: 768px){
  .site-header{
    display: contents;      /* zruší box headera, overlay/panel ostanú funkčné */
    background: transparent;
    box-shadow: none;
    height: 0;
  }
  .site-header .navbar{ display: none; }  /* skry len samotný bar */
}

/* istota – hero musí začínať od vrchu bez medzier */
.hero-swiper-section{ margin-top: 0; }

/* MOBILE: nech sa "AURUM ZUBNÁ KLINIKA" zalomí */
@media (max-width: 767.98px){
  /* zúžime textový blok, aby mal kde lámať riadok */
  .hero-overlay .text-content{
    padding: 0 16px;
  }
  .hero-overlay .text-content h1{
    max-width: 320px;   /* kľúčové – prinúti zalomenie */
    margin: 0 auto;
    line-height: 1.2;
    text-align: center;
  }

  /* zrušíme akýkoľvek predchádzajúci nowrap */
  .highlight-magic{
    display: block;
    white-space: normal !important;
    word-break: normal;
    overflow-wrap: anywhere;     /* keby bolo treba, vie lámať aj dlhšie slová */
    font-size: clamp(3.5rem, 4vw, 3.5rem);
  }

  .highlight{
    display: block;
    font-size: clamp(16px, 4.6vw, 20px);
    line-height: 1.35;
  }

  /* tlačidlo už nie je fixné, drží sa pod textom */
  .btn-section{ position: static; margin-top: 20px; }
}

/* 1) Default: desktopový topbar v hero je skrytý */
.hero-topbar{ display:none; }

/* 2) Zobraz ho iba od tabletu vyššie */
@media (min-width:768px){
  .hero-topbar{ display:block; }
}

/* 3) Mobile: header nech je sticky (nie fixed) a bez paddingu body */
@media (max-width:767.98px){
  .site-header{
    position: sticky;
    top: 0;
    z-index: 1000;
  }
  body{ padding-top:0 !important; }

  /* 4) Istota: hero-topbar na mobile úplne vypnúť (aj pri overscrolle) */
  .hero-topbar, .hero-topbar *{ display:none !important; }
}

/* 5) Zamedz jemnému „pretiahnutiu“ obsahu pri pull-to-refresh
      (kde je podporované – Chrome/Android, iOS 15+) */
html, body{
  background:var(--background);
  overscroll-behavior-y: contain;
}

/* 6) Hero musí začínať od vrchu bez medzier */
.hero-swiper-section{ margin-top:0; }

/* mobile: posuň text v hero sekcii vyššie */
@media (max-width: 767.98px){
  .hero-overlay .text-content{
    transform: translateY(5%); /* vyššie o ~8 % výšky hero sekcie */
  }
}

/* Off-canvas panel – plná výška, vlastný scroll, nad headerom */
.menu-panel{
  z-index: 3000;                           /* nad .site-header */
  height: 100dvh;                          /* lepšie ako 100vh na mobile */
  max-height: 100dvh;
  overflow-y: auto;                        /* panel sa môže scrollovať */
  -webkit-overflow-scrolling: touch;       /* plynulý scroll v iOS */
  padding-top:  calc(18px + env(safe-area-inset-top));
  padding-bottom: calc(18px + env(safe-area-inset-bottom));
}

/* voliteľne: nech je zoznam kompaktnejší a nezaberá zbytočnú výšku */
.menu-list{ margin: 16px 0; }
.menu-list li{ margin: 14px 0; }

/* overlay musí tiež prekrývať header */
.menu-overlay{ z-index: 2500; }


/* palette */
:root{
  --gold:#A6A6A6;
  --gold-300:#8a8a8a;
  --gold-100:#f3e8d2;
}

/* Services – grid + equal height */
.services-grid .services-cards{
  display:grid;
  gap:24px;
  grid-template-columns:repeat(4,1fr);
  align-items:stretch;
}
.service-card{
  background:#fff;
  border:1px solid rgba(166,166,166,.18);
  border-radius:14px;
  box-shadow:0 8px 28px rgba(166,166,166,.08);
  display:flex;
  flex-direction:column;
  padding:14px;
  min-height:320px;
  cursor:pointer;
  outline:0;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.service-card:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 50px rgba(166,166,166,.18);
  border-color:rgba(166,166,166,.35);
}
.service-card:focus{
  border-color:rgba(166,166,166,.45);
}

/* Media */
.service-card .service-media{position:relative;border-radius:12px;overflow:hidden}
.service-card img{
  width:100%;height:170px;object-fit:cover;
  transform:scale(1);
  transition:transform .35s ease;
}
.service-card:hover img{transform:scale(1.06)}

/* Titles & text */
.service-card h3{
  margin:12px 0 6px;
  font-size:1.15rem;
  font-weight:700;
  color:var(--text);
  position:relative;
  transition:color .25s ease;
}
.service-card h3::after{
  content:"";
  position:absolute;left:0;bottom:-6px;
  width:0;height:2px;background:var(--gold);
  border-radius:1px;
  transition:width .25s ease;
}
.service-card:hover h3{color:var(--gold)}
.service-card:hover h3::after{width:46px}
.service-card p{margin:0;color:var(--text20);font-size:.98rem}

/* Section title */
.services-section .section-title{
  color:#2e2e2e;
  font-weight:700;
  position:relative;
  display:inline-block;
  letter-spacing:.02em;
}
.services-section .section-title::after{
  content:"";
  display:block;
  width:60px;height:2px;
  background-color:var(--gold);
  margin:10px auto 0;
  border-radius:1px;
  opacity:.9;
}

/* Modal */
.service-modal .modal-content{
  border:0;border-radius:16px;overflow:hidden;position:relative;
}
.service-modal .modal-body{padding:20px}
.service-title{margin:8px 0 16px;position:relative}
.service-title::after{
  content:"";display:block;width:64px;height:2px;background:var(--gold);margin-top:10px;border-radius:1px;
}
.service-hero{
  width:100%;height:36vh;min-height:220px;
  background-size:cover;background-position:center;
}
.service-close{
  position:absolute;top:10px;right:10px;z-index:2;
}
.service-close:hover{opacity:.9}
.service-close:focus,
.service-close:active{outline:none !important;box-shadow:none !important}

/* CTA v modale */
.btn.btn-secondary-custom{background:var(--gold);border-color:var(--gold)}
.btn.btn-secondary-custom:hover{
  background:var(--gold-300);border-color:var(--gold-300);
  box-shadow:0 10px 25px -10px rgba(166,166,166,.45);
}

/* Responsive */
@media (max-width:1199px){
  .services-grid .services-cards{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:767px){
  .services-grid .services-cards{grid-template-columns:1fr 1fr;gap:14px}
  .service-card{min-height:290px}
  .service-card img{height:140px}
  .service-modal .modal-dialog{margin:0 12px}
}
@media (max-width:420px){
  .services-grid .services-cards{grid-template-columns:1fr}
}


#menu-btn {
  width: 36px;
  overflow: hidden;
}

#menu-checkbox {
  display: none;
}

#menu-label {
  position: relative;
  display: block;
  height: 29px;
  cursor: pointer;
}

#menu-label:before,
#menu-label:after,
#menu-bar {
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #fff;
}

#menu-label:before,
#menu-label:after {
  content: "";
  transition: 0.4s cubic-bezier(0.68, -0.55, 0.27, 1.55) left;
}

#menu-label:before {
  top: 0;
}

#menu-label:after {
  top: 12px;
}

#menu-bar {
  top: 24px;
}

#menu-bar:before {
  content: "MENU";
  position: absolute;
  top: 5px;
  right: 0;
  left: 0;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
}

#menu-checkbox:checked + #menu-label:before {
  left: -39px;
}

#menu-checkbox:checked + #menu-label:after {
  left: 39px;
}

#menu-checkbox:checked + #menu-label #menu-bar:before {
  animation: moveUpThenDown 0.8s ease 0.2s forwards,
    shakeWhileMovingUp 0.8s ease 0.2s forwards,
    shakeWhileMovingDown 0.2s ease 0.8s forwards;
}

@keyframes moveUpThenDown {
  0% {
    top: 0;
  }
  50% {
    top: -27px;
  }
  100% {
    top: -18px;
  }
}

@keyframes shakeWhileMovingUp {
  0% {
    transform: rotateZ(0);
  }
  25% {
    transform: rotateZ(-10deg);
  }
  50% {
    transform: rotateZ(0deg);
  }
  75% {
    transform: rotateZ(10deg);
  }
  100% {
    transform: rotateZ(0);
  }
}

@keyframes shakeWhileMovingDown {
  0% {
    transform: rotateZ(0);
  }
  80% {
    transform: rotateZ(3deg);
  }
  90% {
    transform: rotateZ(-3deg);
  }
  100% {
    transform: rotateZ(0);
  }
}

.btn {
  font-size: 16px;
  font-weight: 600;
  background-color: #A6A6A6; /* hlavná zlatohnedá */
  padding: 24px 24px 24px 32px;
  display: flex;
  align-items: center;
  border-radius: 99px;
  position: relative;
  transition: all 0.5s cubic-bezier(.77, 0, .175, 1);

  .text {
    color: #fff; /* biely text pre kontrast */
    line-height: 1;
    position: relative;
    z-index: 5;
    margin-right: 32px;
  }

  svg {
    display: inline-block;
    position: relative;
    z-index: 5;
    transform: rotate(0deg) translateX(0);
    transform-origin: left;
    transition: all 0.5s cubic-bezier(.77, 0, .175, 1);
  }

  &::before {
    content: '';
    background-color: #8a8a8a; /* svetlejšia zlatá – accent */
    width: 32px;
    height: 32px;
    display: block;
    position: absolute;
    z-index: 1;
    border-radius: 99px;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
    transition: all 0.5s cubic-bezier(.77, 0, .175, 1);
  }

  &.light {
    background-color: #efefef; /* veľmi svetlá zlatá verzia */
    color: #3c3c3c;

    &::before {
      background-color: #A6A6A6; /* hlavná farba ako kontrast */
    }

    .text {
      color: #3c3c3c;
    }
  }
}

.btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 25px -10px rgba(166, 166, 166, 0.45); /* zlatý tieň */
  background-color: #8a8a8a; /* svetlejšia zlatá pre jemný prechod */
}

.btn svg {
  transform-origin: center; /* zmena bodu otáčania */
  transition: transform 0.5s cubic-bezier(.77, 0, .175, 1);
}

.btn:hover svg {
  transform: rotate(45deg) translateX(0); /* už sa neposúva doľava */
}

.btn:hover::before {
  background-color: #A6A6A6; /* tmavšia farba pre kontrast kruhu */
  width: 32px; /* ponecháme pôvodnú veľkosť */
  height: 32px;
  right: 16px;
}

.btn.light:hover {
  background-color: #d9d9d9; /* zohriaty krémový tón */
  box-shadow: 0 8px 20px -8px rgba(166, 166, 166, 0.35);
}

.aurumbtn-secondary{
  font-size:16px;
  font-weight:600;
  padding:22px 32px;
  display:inline-flex;
  align-items:center;
  gap:28px;
  border-radius:99px;
  border:2px solid #A6A6A6;
  color:#A6A6A6;
  background:
    linear-gradient(90deg,#A6A6A6 0 0) no-repeat, /* fill layer */
    #ffffff;                                     /* base */
  background-size:0% 100%;
  transition:background-size .35s ease,color .35s ease,box-shadow .35s ease,transform .35s ease;
  text-decoration:none;
  cursor:pointer;
}

.aurumbtn-secondary svg{
  fill:currentColor;
  transform-origin:center;
  transition:transform .35s ease;
}

.aurumbtn-secondary:hover{
  background-size:100% 100%;
  color:#fff;
  box-shadow:0 10px 25px -10px rgba(166,166,166,.45);
  transform:translateY(-2px);
}

.aurumbtn-secondary:hover svg{ transform:rotate(45deg); }

.aurumbtn-secondary:focus{
  outline:0;
  box-shadow:0 0 0 3px rgba(166,166,166,.22);
}

.aurumbtn-secondary:active{
  transform:translateY(0);
  box-shadow:0 6px 18px -10px rgba(166,166,166,.35);
}

/* CONTACT – kompaktne, jednotný vzhľad */
.section-contact *{ box-sizing:border-box; }

.section-contact :is(input,textarea,select){
  flex:1;
  font-family:"Quicksand",sans-serif;
  font-size:16px;
  line-height:1.35;
  font-weight:600;
  height:48px;
  padding:14px 16px;
  color:var(--text);
  background:#fff;
  border:1px solid rgba(166,166,166,.22);
  border-radius:14px;
  box-shadow:0 8px 28px rgba(166,166,166,.08);
  transition:border-color .2s, box-shadow .2s, background-color .2s, color .2s;
}

.section-contact textarea{
  min-height:140px; height:auto; resize:none;
}

.section-contact :is(input,textarea)::placeholder{
  color:var(--text20); font-weight:500;
}

.section-contact :is(input,textarea,select):hover{
  border-color:rgba(166,166,166,.34);
  box-shadow:0 10px 34px rgba(166,166,166,.12);
}

.section-contact :is(input,textarea,select):focus{
  outline:none;
  border-color:rgba(166,166,166,.5);
  box-shadow:0 0 0 3px rgba(166,166,166,.18), 0 10px 30px rgba(166,166,166,.12);
  background:#fff; color:var(--text);
}

/* SELECT – jednotný dizajn, vlastná šípka, prebitie Bootstrapu */
.section-contact select{
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  background-color:#fff !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24'%3E%3Cpath fill='%23A6A6A6' d='M7 10l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  background-size:18px;
  padding-right:46px !important;
  border-radius:14px !important;
  border:1px solid rgba(166,166,166,.22) !important;
}

/* Rozloženie */
.section-contact .contact-form{ max-width:1000px; margin:0 auto; display:flex; flex-direction:column; gap:16px; }
.section-contact .contact-form-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:768px){ .section-contact .contact-form-row{ grid-template-columns:1fr; } }

/* AUTOFILL – Chrome/Safari */
.section-contact :is(input,textarea,select):-webkit-autofill,
.section-contact :is(input,textarea,select):-webkit-autofill:hover,
.section-contact :is(input,textarea,select):-webkit-autofill:focus{
  -webkit-text-fill-color:var(--text) !important;
  caret-color:var(--text) !important;
  box-shadow:0 0 0 1000px #fff inset, 0 8px 28px rgba(166,166,166,.08) !important;
  border:1px solid rgba(166,166,166,.22) !important;
  border-radius:14px !important;
  font-family:"Quicksand",sans-serif !important;
  font-size:16px !important;
  line-height:1.35 !important;
  font-weight:600 !important;
}

/* AUTOFILL – Firefox */
.section-contact :is(input,textarea,select):-moz-autofill{
  background:#fff !important; color:var(--text) !important;
  box-shadow:0 0 0 1000px #fff inset, 0 8px 28px rgba(166,166,166,.08) !important;
  border:1px solid rgba(166,166,166,.22) !important; border-radius:14px !important;
  font-family:"Quicksand",sans-serif !important; font-size:16px !important; line-height:1.35 !important; font-weight:600 !important;
}

/* AUTOFILL – nové pseudo */
@supports selector(:autofill){
  .section-contact :is(input,textarea,select):autofill{
    background:#fff !important; color:var(--text) !important;
    box-shadow:0 0 0 1000px #fff inset, 0 8px 28px rgba(166,166,166,.08) !important;
    border:1px solid rgba(166,166,166,.22) !important; border-radius:14px !important;
    font-family:"Quicksand",sans-serif !important; font-size:16px !important; line-height:1.35 !important; font-weight:600 !important;
  }
}

/* Custom Select - cross-platform dropdown */
.custom-select-wrapper{position:relative;display:block;user-select:none;flex:1;min-width:0}
.custom-select-wrapper select{
  position:absolute;opacity:0;width:0;height:0;pointer-events:none;
}
.custom-select-ui{
  position:relative;display:flex;align-items:center;width:100%;
  border:1px solid rgba(166,166,166,.22);
  border-radius:14px;background:#fff;color:var(--text20);
  box-shadow:0 8px 28px rgba(166,166,166,.08);
  transition:border-color .25s ease, box-shadow .25s ease;
  cursor:pointer;min-height:48px;
}
.custom-select-ui:hover{
  border-color:rgba(166,166,166,.34);
  box-shadow:0 10px 34px rgba(166,166,166,.12);
}
.custom-select-ui.opened{
  border-color:rgba(166,166,166,.5);
  box-shadow:0 0 0 3px rgba(166,166,166,.15), 0 10px 30px rgba(166,166,166,.12);
  border-radius:14px 14px 4px 4px;
}
.custom-select-ui.has-value{color:var(--text)}
.custom-select-trigger{
  display:flex;align-items:center;justify-content:space-between;width:100%;
  padding:13px 44px 13px 16px;
  font:500 16px "Quicksand",sans-serif;line-height:1.35;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.custom-select-arrow{
  position:absolute;right:14px;top:50%;width:20px;height:20px;
  transform:translateY(-50%);
  transition:transform .25s ease;
  pointer-events:none;
  display:flex;align-items:center;justify-content:center;
}
.custom-select-arrow svg{width:18px;height:18px}
.custom-select-ui.opened .custom-select-arrow{
  transform:translateY(-50%) rotate(180deg);
}
.custom-options{
  position:absolute;left:-1px;right:-1px;top:calc(100% + 2px);z-index:50;
  background:#fff;
  border:1px solid rgba(166,166,166,.22);
  border-radius:0 0 14px 14px;
  box-shadow:0 18px 50px rgba(0,0,0,.1);
  overflow:hidden;
  opacity:0;visibility:hidden;
  transform:translateY(-4px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
  max-height:260px;overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
.custom-select-ui.opened .custom-options{
  opacity:1;visibility:visible;transform:translateY(0);
}
.custom-option{
  padding:13px 16px;
  font:600 15px "Quicksand",sans-serif;
  color:var(--text20);
  border-bottom:1px solid rgba(166,166,166,.08);
  cursor:pointer;
  transition:background .15s ease, color .15s ease;
}
.custom-option:last-child{border-bottom:0}
.custom-option:hover{background:rgba(166,166,166,.08);color:var(--text)}
.custom-option.selected{background:rgba(166,166,166,.1);color:var(--text);font-weight:700}
.custom-select-ui:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(166,166,166,.18)}
.custom-options::-webkit-scrollbar{width:5px}
.custom-options::-webkit-scrollbar-track{background:transparent}
.custom-options::-webkit-scrollbar-thumb{background:rgba(166,166,166,.3);border-radius:4px}
.custom-options::-webkit-scrollbar-thumb:hover{background:rgba(166,166,166,.5)}
@media (max-width:768px){
  .custom-option{padding:14px 16px;font-size:16px}
  .custom-options{max-height:220px}
}

/* Aurum button – elegantný zlatý efekt */
/* Aurum button – bez gradientu */
.btn-aurum {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 38px;
  font-family: "Quicksand", sans-serif;
  font-weight: 700;
  font-size: 16px;
  text-decoration: none;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #fff;
  border: none;
  border-radius: 40px;
  background: #A6A6A6; /* čistá zlatohnedá bez gradientu */
  box-shadow: 0 6px 18px rgba(166,166,166,.25);
  cursor: pointer;
  transition: all 0.4s ease;
  overflow: hidden;
}

.btn-aurum:hover {
  background: #b8b8b8; /* jemne svetlejší odtieň pri hoveri */
  box-shadow: 0 10px 26px rgba(166,166,166,.35);
  transform: translateY(-2px);
}

.btn-aurum:active {
  transform: scale(.97);
  box-shadow: 0 4px 10px rgba(166,166,166,.25);
}

/* svetlá varianta */
.btn-aurum.light {
  background: #f5f5f5;
  color: var(--primary);
  box-shadow: 0 6px 18px rgba(166,166,166,.15);
}

.btn-aurum.light:hover {
  background: #e8e8e8;
  box-shadow: 0 10px 26px rgba(166,166,166,.25);
}

/* základ – desktop */
.btn-wrap {
  text-align: right;
}

/* tablet + mobil – na stred */
@media (max-width: 1024px) {
  .btn-wrap {
    text-align: center;
  }
}

/* Service sheet – side panel */
.service-sheet{
  --bs-offcanvas-width: min(720px, 94vw);
  background:#fff;
  box-shadow: -14px 0 44px rgba(15,12,49,.12);
}
.offcanvas-backdrop.show{
  background: rgba(10,8,20,.35);
  backdrop-filter: blur(4px);
}
.service-sheet .offcanvas-header{
  padding: 18px 20px;
  border-bottom: 1px solid rgba(166,166,166,.12);
}
.service-sheet .offcanvas-body{ padding: 20px }
.service-hero{
  width:100%;height:220px;
  background-size:cover;background-position:center;
}
@media (max-width:768px){
  .service-hero{height:180px}
}

/* typografia obsahu */
.service-title{ margin:0; font-weight:800; color:var(--text) }
.service-body .rich h4{ margin:18px 0 10px; font-weight:700; color:var(--text) }
.service-body .rich p{ color:var(--text); opacity:.92 }
.service-body .rich ul{ padding-left:18px; margin:8px 0 16px }
.service-body .rich li+li{ margin-top:6px }

/* Backdrop bez blur, len stmavenie */
.offcanvas-backdrop.show{
  background: rgba(10,8,20,.45);
  backdrop-filter: none;
}

/* Žiadny border na ľavej strane pri offcanvas-end */
.service-sheet.offcanvas-end{
  border-left: 0 !important;
}

/* Zjednotenie štýlu nadpisu v sekcii Objednajte sa */
.section-contact .section-title {
  color: #2e2e2e;
  font-weight: 700;
  position: relative;
  display: inline-block;
  letter-spacing: .02em;
}

.section-contact .section-title::after {
  content: "";
  display: block;
  width: 60px;
  height: 2px;
  background: #A6A6A6;
  margin: 10px auto 0;
  border-radius: 1px;
  opacity: .9;
}

/* Zjednotenie štýlu nadpisov v sekciách Objednajte sa a Tu nás nájdete */
.section-contact .section-title,
#contact .section-header h2 {
  color: #2e2e2e;
  font-weight: 700;
  position: relative;
  display: inline-block;
  letter-spacing: .02em;
}

.section-contact .section-title::after,
#contact .section-header h2::after {
  content: "";
  display: block;
  width: 60px;
  height: 2px;
  background: #A6A6A6;
  margin: 10px auto 0;
  border-radius: 1px;
  opacity: .9;
}

/* Hero – smooth underline for links (except .btn) */
.hero-overlay a:not(.btn),
.hero-bottom a{
  position: relative;
  text-decoration: none;
  color: #fff;
}

.hero-overlay a:not(.btn)::after,
.hero-bottom a::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 0;
  height: 1px;
  background-color: #fff;
  transition: width .3s ease;
}

.hero-overlay a:not(.btn):hover::after,
.hero-overlay a:not(.btn):focus-visible::after,
.hero-bottom a:hover::after,
.hero-bottom a:focus-visible::after{
  width: 100%;
}

/* === AURUM FOOTER === */
.aurum-footer{
  position:relative;
  background:
    linear-gradient(180deg, rgba(243,236,224,.96) 0%, rgba(235,224,208,.96) 100%),
    url('/images/footer-bg.webp') center/cover no-repeat;
  color:#3b352b;
  border-radius:14px;
  margin:50px auto 30px;
  overflow:hidden;
}
.aurum-footer::before{
  content:"";
  position:absolute;inset:0 0 auto 0;height:8px;
  background:linear-gradient(90deg,transparent 0%, var(--primary) 15%, var(--accent) 50%, var(--primary) 85%, transparent 100%);
  opacity:.25;
}
.aurum-footer__wrap{
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr 1fr;
  gap:42px;
  padding:38px 18px 24px;
  max-width:1100px;
}
.aurum-footer__brand{display:flex;flex-direction:column;gap:10px}
.aurum-footer__logo{max-width:200px;height:auto;opacity:.95}
.aurum-footer__tag{margin:0;color:#6b6b6b;font-weight:600}
.aurum-footer h5{
  margin:0 0 14px;font-weight:800;color:#3b352b;letter-spacing:.02em
}
.aurum-footer__list{list-style:none;margin:0;padding:0}
.aurum-footer__list li+li{margin-top:10px}
.aurum-footer a{
  color:#4c4438;text-decoration:none;position:relative;padding-bottom:2px;transition:color .25s ease
}
.aurum-footer a::after{
  content:"";position:absolute;left:0;bottom:-2px;width:0;height:1px;background:var(--primary);transition:width .25s ease
}
.aurum-footer a:hover{color:var(--primary)}
.aurum-footer a:hover::after{width:100%}
.aurum-footer__social{display:flex;gap:10px}
.aurum-footer .soc{
  display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:50%;
  background:rgba(255,255,255,.6);
  color:#4c4438;
  box-shadow:0 6px 18px rgba(0,0,0,.08);
  transition:transform .2s ease, background .25s ease, color .25s ease
}
.aurum-footer .soc:hover{
  transform:translateY(-2px);
  text-decoration: none;
  background:var(--primary10);
  color:var(--primary)
}
.aurum-footer__bottom{
  border-top:1px solid rgba(166,166,166,.3);
  backdrop-filter:blur(1px);
}
.aurum-footer__bottom-inner{
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;padding:14px 18px;color:#6b6b6b;font-weight:600
}
.aurum-footer__link{color:#4c4438}
.aurum-footer__link:hover{color:var(--primary)}
@media (max-width:992px){
  .aurum-footer__wrap{grid-template-columns:1fr 1fr;gap:28px}
}
@media (max-width:640px){
  .aurum-footer{border-radius:10px}
  .aurum-footer__wrap{grid-template-columns:1fr;gap:22px;padding:26px 16px 18px}
  .aurum-footer__bottom-inner{flex-direction:column;text-align:center}
}

/* Disable underline effect on social icons */
.aurum-footer .soc { padding-bottom: 0; }
.aurum-footer .soc::after { content: none !important; }

/* Center brand block & logo on mobile */
@media (max-width:640px){
  .aurum-footer__brand{ align-items: center; text-align: center; }
  .aurum-footer__logo{ margin-left: auto; margin-right: auto; }
}

/* GDPR – slide-in panel sprava + vzhľad ako service-sheet */
#gdprModal .modal-dialog{
  position: fixed;
  inset: 0 0 0 auto;           /* vpravo, plná výška */
  margin: 0;
  max-width: min(720px, 94vw);
  height: 100dvh;
  transform: translateX(100%); /* Å¡tart mimo obrazovky */
  transition: transform .35s ease;
}
#gdprModal.show .modal-dialog{ transform: translateX(0); }

#gdprModal .modal-content{
  height: 100%;
  border: 0;
  border-radius: 14px 0 0 14px;
  box-shadow: -14px 0 44px rgba(15,12,49,.12);
}

#gdprModal .modal-header{
  padding: 18px 20px;
  border-bottom: 1px solid rgba(166,166,166,.12); /* zlato jemne */
}

#gdprModal .modal-body{ padding: 20px; }
#gdprModal .modal-title{
  margin:0; font-weight:800; color:var(--text);
}
#gdprModal .modal-footer{
  padding: 16px 20px;
  border-top: 1px solid rgba(166,166,166,.12);
}

/* Backdrop: rovnaká intenzita ako service-sheet */
.modal-backdrop.show{
  background: rgba(10,8,20,.45);
  backdrop-filter: none;
}

/* Linky v texte: zachovaj jemné podčiarknutie na hover (už je) */
#gdprModal .modal-body a:not(.btn){
  color: var(--primary); text-decoration:none; position:relative; transition:color .3s ease;
}
#gdprModal .modal-body a:not(.btn)::after{
  content:""; position:absolute; left:0; bottom:-2px; width:0; height:1px;
  background-color: var(--primary); transition: width .3s ease;
}
#gdprModal .modal-body a:not(.btn):hover::after{ width:100%; }

/* Tlačidlá – zlaď s AURUM štýlom */
#gdprModal .btn-primary{
  /* zlato – rovnaký gradient ako .btn-aurum */
  background: linear-gradient(135deg, #A6A6A6 0%, #d6b372 50%, #A6A6A6 100%);
  background-size: 200% 200%;
  border: none;
  color: #fff;
  font-weight: 700;
  padding: 10px 18px;
  border-radius: 40px;
  box-shadow: 0 6px 18px rgba(166,166,166,.25);
  transition: all .4s ease;
}
#gdprModal .btn-primary:hover{
  background-position: 100% 0;
  box-shadow: 0 10px 26px rgba(166,166,166,.35);
  transform: translateY(-2px);
}
#gdprModal .btn-primary:focus,
#gdprModal .btn-primary:active{
  background-position: 100% 0;
  box-shadow: 0 4px 10px rgba(166,166,166,.25);
}

/* Sekundárne (svetlé) tlačidlo */
#gdprModal .btn-light{
  background-color:#f2f2f2; color:#545454; border:1px solid #e0e0e0;
  font-weight:700; padding:10px 16px; border-radius:40px; transition:all .3s ease;
}
#gdprModal .btn-light:hover{ background-color:#e6e6e6; color:#000; }

/* Istota: žiadne neželané podčiarkovanie na .btn vo vnútri modalu */
#gdprModal .btn{ text-decoration:none; position:static; }
#gdprModal .btn::after{ content:none !important; }

/* Bez zaoblenia na ľavej hrane */
#gdprModal .modal-content{ border-radius: 14px 0 0 14px; }
#gdprModal.show .modal-content{ border-radius: 0; }

/* GDPR – fix kruhových efektov na tlačidlách */
#gdprModal .btn {
  position: relative;
  overflow: hidden;
  z-index: 1;
}

#gdprModal .btn::before,
#gdprModal .btn::after {
  content: none !important;
}

#gdprModal .btn:focus,
#gdprModal .btn:active {
  outline: none !important;
  box-shadow: none !important;
}

#gdprModal .btn-primary:focus,
#gdprModal .btn-primary:active,
#gdprModal .btn-primary:hover {
  background-position: 100% 0;
  box-shadow: 0 8px 20px rgba(166,166,166,.35);
  transform: translateY(-1px);
}


@media (max-width: 767.98px) {

  .site-header {
    transition: padding .25s ease;
  }

  .site-header.compact {
    padding-bottom: 0;
  }

  .header-info {
    overflow: hidden;
    max-height: 0;          /* default = skryté */
    opacity: 0;
    transition: max-height .25s ease, opacity .25s ease;
  }

  .header-info.is-visible { /* keď sa má ukázať */
    max-height: 80px;
    opacity: 1;
  }
}


.hero-topbar {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  padding: 14px 0;
  background-color: rgba(166, 166, 166, 0); /* transparentná zlatá */
  box-shadow: none;
  transition:
    background-color .3s ease,
    box-shadow .3s ease,
    padding .3s ease;
}

@media (min-width: 768px) {
  .hero-topbar.is-sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    padding: 14px 0;                /* ak chceš menší bar po pripnutí */
    background-color: rgba(166, 166, 166, 1); /* plná zlatá */
    box-shadow: 0 2px 14px rgba(15, 12, 49, .12);
  }
}

.services-stack {
  max-width: 1200px;
  margin: 60px auto;
}

.services-stack .services-accordion {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.service-row {
  border-radius: 16px;
  border: 1px solid rgba(84, 84, 84, 0.16);
  background: #fff;
  box-shadow: 0 10px 30px rgba(15, 12, 49, .06);
  overflow: hidden;
  transition: box-shadow .3s ease, border-color .3s ease, transform .3s ease;
}

.service-row.is-open {
  border-color: rgba(84, 84, 84, 0.46);
  box-shadow: 0 20px 60px rgba(84, 84, 84, 0.20);
  transform: translateY(-2px);
}

.service-row-header {
  position: relative;
  width: 100%;
  padding: 18px 20px;
  border: 0;
  cursor: pointer;
  text-align: left;
  background: transparent;
  overflow: hidden;
  border-radius: 16px;
}

.service-row-header-bg {
  position: absolute;
  inset: 0;
  background-color: rgba(166,166,166, 0.08);
  background-size: cover;
  background-position: right center;
  filter: none;
  transform: none;
  transition: filter .3s ease;
  border-radius: inherit;
}

.service-row-header::before {
  content: none;
}

.service-row-header-content {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  color: #3c3c3c;
}

.service-row-header-main {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.service-row-kicker {
  font-size: 0.8rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  opacity: .9;
  color: #3c3c3c;
}

.service-row-title {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 800;
  color: #3c3c3c;
}

.service-row-subtitle {
  margin: 0;
  font-size: 0.95rem;
  opacity: .95;
  color: #3c3c3c;
}

.service-row-header-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  flex-shrink: 0;
}

.service-row-meta-pill {
  font-size: 0.8rem;
  font-weight: 700;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(84, 84, 84, 0.08);
  color: #3c3c3c;
  white-space: nowrap;
  border: 1px solid rgba(84, 84, 84, 0.28);
}

.service-row-icon {
  font-size: 1rem;
  transition: transform .3s ease, opacity .3s ease;
  opacity: .9;
  color: #555;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(255,255,255,.7);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.service-row.is-open .service-row-icon {
  transform: rotate(180deg);
  opacity: 1;
}


/* telo */
.service-row-body {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height .45s cubic-bezier(.19,1,.22,1), opacity .3s ease;
  background: #fff;
}

.service-row.is-open .service-row-body {
  max-height: 1400px;
  opacity: 1;
}

.service-row-inner {
  padding: 18px 20px 22px;
}

.service-row-content.rich {
  font-size: 0.98rem;
  color: #3c3c3c;
}

.service-row-content.rich h4 {
  margin-top: 0;
  margin-bottom: 10px;
  font-weight: 700;
  color: #2e2e2e;
}

.service-row-content.rich p {
  margin-bottom: 10px;
}

.service-row-content.rich ul {
  padding-left: 18px;
  margin: 6px 0 14px;
}

.service-row-content.rich li + li {
  margin-top: 4px;
}

/* responsive */
@media (max-width: 768px) {
  .services-stack {
    margin: 40px auto;
  }

  .service-row-header-content {
    flex-direction: column;
    align-items: flex-start;
  }

  .service-row-header-meta {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }
}


/* === AURUM FOOTER – DARK VERSION === */
.aurum-footer-dark {
  background: #606060;
  color: #ffffff;
  border-radius: 14px;
  margin: 50px auto 30px;
  padding-top: 38px;
  overflow: hidden;
}

.aurum-footer-dark .aurum-footer__wrap {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr 1fr;
  gap: 42px;
  padding: 0 18px 24px;
}

.aurum-footer-dark h5 {
  margin: 0 0 14px;
  font-weight: 800;
  color: #ffffff;
}

.aurum-footer-dark a {
  color: #ffffff;
  text-decoration: none;
  position: relative;
  padding-bottom: 2px;
  transition: color .25s ease;
}

.aurum-footer-dark a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 0;
  height: 1px;
  background: #ffffff;
  transition: width .25s ease;
}

.aurum-footer-dark a:hover {
  color: #ffffff;
}

.aurum-footer-dark a:hover::after {
  width: 100%;
}

.aurum-footer-dark .soc {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255,255,255,0.25);
  color: #ffffff;
  box-shadow: none;
  transition: transform .2s ease, background .25s ease;
}

.aurum-footer-dark .soc:hover {
  transform: translateY(-2px);
  background: rgba(255,255,255,0.4);
}

.aurum-footer-dark .aurum-footer__bottom {
  border-top: 1px solid rgba(255,255,255,.25);
}

.aurum-footer-dark .aurum-footer__bottom-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 18px;
  color: #ffffff;
}

.aurum-footer-dark .aurum-footer__logo {
  filter: brightness(0) invert(1);
  opacity: .95;
}

/* Social ikony – žiadne podčiarknutie, žiadny hover lift */
.aurum-footer-dark .soc {
  text-decoration: none !important;
  transform: none !important;
}

.aurum-footer-dark .soc::after {
  content: none !important;
}

.aurum-footer-dark .soc:hover {
  transform: none !important;        /* bez posunu hore */
  background: rgba(255,255,255,0.35); /* môžeš upraviť alebo ponechať */
}

.aurum-footer-dark .soc:hover::after {
  content: none !important;          /* istota – žiadne podčiarknutie */
}

/* Footer link – odstráni posun pri hover */
.aurum-footer-dark .aurum-footer__bottom a {
  position: relative;
  padding-bottom: 0; /* istota – žiadne odsadenie od underline */
}

.aurum-footer-dark .aurum-footer__bottom a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;        /* nebude meniť výšku riadku */
  width: 0;
  height: 1px;
  background: #ffffff;
  transition: width .25s ease;
}

.aurum-footer-dark .aurum-footer__bottom a:hover::after {
  width: 100%;
}

/* istota – bez podskočenia */
.aurum-footer-dark .aurum-footer__bottom-inner p {
  line-height: 1.4;
  display: flex;
  align-items: center; /* zarovnanie bez vizuálneho posunu */
}


/* Responsive */
@media (max-width: 992px) {
  .aurum-footer-dark .aurum-footer__wrap {
    grid-template-columns: 1fr 1fr;
    gap: 28px;
  }
}

@media (max-width: 640px) {
  .aurum-footer-dark {
    border-radius: 10px;
  }
  .aurum-footer-dark .aurum-footer__wrap {
    grid-template-columns: 1fr;
    gap: 22px;
    padding: 0 16px 18px;
  }
  .aurum-footer-dark .aurum-footer__bottom-inner {
    flex-direction: column;
    text-align: center;
  }
}

.hero-nav {
  margin-left: auto;
}

.hero-nav-menu {
  list-style: none;
  display: flex;
  gap: 24px;
  margin: 0;
  padding: 0;
  white-space: nowrap;
}

.hero-nav-menu li a {
  color: #ffffff;
  text-decoration: none;
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
  position: relative;
  padding-bottom: 2px;
  transition: color .25s ease;
  white-space: nowrap;
}

.hero-nav-menu li a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 1px;
  background-color: #ffffff;
  transition: width .25s ease;
}

.hero-nav-menu li a:hover::after {
  width: 100%;
}

.hero-topbar .container-fixed-width {
  display: flex;
  align-items: center;
  gap: 32px;
}

.hero-logo {
  flex-shrink: 0;
}

.hero-nav {
  margin-left: auto;
}

.hero-topbar-meta {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-left: 40px;
  font-size: 0.95rem;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-4px);
  transition: opacity .25s ease, transform .25s ease;
}

.hero-topbar-meta-item {
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  color: #ffffff;
}

.hero-topbar-meta-item a,
.hero-topbar-meta-item span {
  color: #ffffff;
  text-decoration: none;
  font-weight: 600;
}

.hero-topbar.show-meta .hero-topbar-meta {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

/* hide meta on mobile */
@media (max-width: 767.98px) {
  .hero-topbar-meta {
    display: none;
  }
}

.hero-topbar-meta {
  display: flex;
  flex-direction: column; /* pod seba */
  align-items: flex-start; /* zarovnanie doľava */
  gap: 4px; /* malé medzery medzi riadkami */
  margin-left: 40px;
  font-size: 0.9rem;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-4px);
  transition: opacity .25s ease, transform .25s ease;
}

.hero-topbar-meta-item {
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  color: #ffffff;
}



.swiper-pagination-bullet-active {
    background: #A6A6A6 !important; 
}

.hero-mobile-meta {
  display: none;
}

@media (max-width: 767.98px) {
  .hero-mobile-meta {
    margin-top: 32px;   /* posunuté nižšie pod tlačidlom */
    display: flex;
    align-items: center;
    gap: 16px;
    color: #ffffff;
  }

  .hero-mobile-meta-item {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    font-size: 0.95rem;
  }

  .hero-mobile-meta-item a,
  .hero-mobile-meta-item span {
    color: #ffffff;
    text-decoration: none;
    font-weight: 600;
  }
}


/* Rýchly kontakt v headri – nová verzia */
.header-quick-contact {
  display: flex;
  align-items: center;
  gap: 18px;
}

/* Desktop – vždy viditeľné, nič špeciálne neriešime */
@media (min-width: 768px) {
  .header-quick-contact {
    justify-content: flex-end;
  }
}

/* Mobile – skryté po načítaní, ukáže sa až po scrolle pod hero */
@media (max-width: 767.98px) {
  .navbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 64px;
  }

  .header-quick-contact {
    order: 2;
    width: 100%;
    justify-content: space-between;
    margin-top: 0;
    overflow: hidden;
    max-height: 0;          /* po načítaní nezaberá výšku */
    opacity: 0;
    transition: max-height .25s ease, opacity .25s ease;
  }

  .header-quick-contact.is-visible {
    max-height: 60px;       /* môžeš doladiť podľa oka */
    opacity: 1;
  }
}

@media (max-width: 767.98px) {
  .hero-mobile-meta {
    margin-top: 32px;
    width: 100%;
    display: flex;
    justify-content: center;   /* celý blok zarovnaný na stred */
  }

  .hero-mobile-meta-inner {
    width: 100%;
    max-width: 320px;          /* aby nebol príliš široký */
    display: flex;
    justify-content: space-between; /* telefon vľavo, hodiny vpravo */
    align-items: center;
    color: #ffffff;
    gap: 16px;
  }

  .hero-mobile-meta-item {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    font-size: 0.95rem;
  }

  .hero-mobile-meta-item a,
  .hero-mobile-meta-item span {
    color: #ffffff;
    text-decoration: none;
    font-weight: 600;
  }
}

@media (max-width: 767.98px) {
  .navbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 64px;
    padding-top: 12px;
  }

  .header-quick-contact {
    order: 2;
    width: 100%;
    justify-content: space-between;
    padding: 0 15px;  /* vertikálne 0 -> nezvyšuje výšku */
    margin-top: 0;
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    pointer-events: none;
    transition:
      max-height .25s ease,
      opacity .25s ease,
      padding-top .25s ease,
      padding-bottom .25s ease;
  }

  .header-quick-contact.is-visible {
    max-height: 60px;       /* podľa oka si môžeš doladiť */
    padding: 6px 15px;      /* vertikálny padding až keď je viditeľný */
    opacity: 1;
    pointer-events: auto;
  }
}

/* Mobile header over hero – transparent first, solid after scroll */
@media (max-width: 767.98px) {
  .site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background: transparent;
    box-shadow: none;
    transition: background-color .25s ease, box-shadow .25s ease;
  }

  .site-header.is-solid {
    background: #A6A6A6;
    box-shadow: 0 2px 14px rgba(15, 12, 49, .06);
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .hero-bottom .container-fixed-width {
    display: flex;
    justify-content: center;
  }

  .hero-bottom-grid {
    max-width: 960px;
    margin: 0 auto;
  }
}

/* tablet: 2 rovnaké stĺpce, blok vycentrovaný */
@media (min-width: 768px) and (max-width: 1199px){
  .hero-bottom-grid{
    display:grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 960px;
    margin: 0 auto;
    gap: 18px;
  }

  .hero-info-item{
    flex: initial;
  }
}

/* menší highlight/magic na menších zariadeniach (napr. aj landscape mobil) */
@media (max-width: 767px) and (orientation: landscape) {
  .highlight {
    font-size: 15px !important;
    padding-top: 10px;
  }

  .highlight-magic {
    font-size: 26px !important;
    line-height: 1.1 !important;
  }

    .menu-panel {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .menu-close {
    font-size: 20px;
  }

  .menu-list {
    margin: 8px 0;
  }

  .menu-list li {
    margin: 6px 0;
  }

  .menu-list a {
    font-size: 22px;
  }

  .menu-meta {
    margin-top: 12px; /* namiesto auto, nech to netlačí úplne dolu */
  }

  .menu-meta-item {
    margin: 4px 0;
    font-size: 14px;
  }
}


/* ======================== */
/* ALODENT REDESIGN PATCHES */
/* ======================== */

/* Benefits grid - replaces swiper */
.benefits-section {
  padding: 70px 0;
  background: #fafafa;
}

.benefits-section .section-header {
  margin-bottom: 40px;
}

.benefits-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}

.benefit-card {
  background: #fff;
  border-radius: 16px;
  padding: 28px 22px;
  text-align: center;
  border: 1px solid rgba(166,166,166,.12);
  box-shadow: 0 4px 20px rgba(0,0,0,.04);
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}

.benefit-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 36px rgba(0,0,0,.08);
  border-color: rgba(166,166,166,.3);
}

.benefit-card-icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(166,166,166,.08);
  border-radius: 14px;
}

.benefit-card-icon img {
  width: 32px;
  height: 32px;
  opacity: .75;
}

.benefit-card h3 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text);
  margin: 0 0 10px;
}

.benefit-card p {
  font-size: .88rem;
  color: var(--text20);
  line-height: 1.5;
  margin: 0;
}

/* Benefits responsive */
@media (max-width: 1100px) {
  .benefits-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 768px) {
  .benefits-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
  }
  .benefit-card {
    padding: 22px 16px;
  }
}

@media (max-width: 480px) {
  .benefits-grid {
    grid-template-columns: 1fr;
  }
}

/* Service row refinements for silver theme */
.service-row {
  border: 1px solid rgba(166,166,166,.18) !important;
  box-shadow: 0 6px 22px rgba(0,0,0,.04) !important;
}

.service-row.is-open {
  border-color: rgba(166,166,166,.35) !important;
  box-shadow: 0 14px 44px rgba(0,0,0,.08) !important;
}

.service-row-header-bg {
  background-color: rgba(166,166,166,.08);
  background-size: cover;
  background-position: right center;
  background-repeat: no-repeat;
}

/* Service images with left-to-right gradient fade */
[data-service="preventivna-prehliadka"] .service-row-header-bg {
  background: linear-gradient(to right, rgba(240,240,240,1) 0%, rgba(240,240,240,.95) 40%, rgba(240,240,240,.6) 65%, transparent 85%),
    url('/images/services/preventivna-prehliadka.jpg') right center / cover no-repeat !important;
}
[data-service="dentalna-hygiena"] .service-row-header-bg {
  background: linear-gradient(to right, rgba(240,240,240,1) 0%, rgba(240,240,240,.95) 40%, rgba(240,240,240,.6) 65%, transparent 85%),
    url('/images/services/dentalna-hygiena.jpg') right center / cover no-repeat !important;
}
[data-service="korunky"] .service-row-header-bg {
  background: linear-gradient(to right, rgba(240,240,240,1) 0%, rgba(240,240,240,.95) 40%, rgba(240,240,240,.6) 65%, transparent 85%),
    url('/images/services/korunky.jpg') right center / cover no-repeat !important;
}
[data-service="zubne-implantaty"] .service-row-header-bg {
  background: linear-gradient(to right, rgba(240,240,240,1) 0%, rgba(240,240,240,.95) 40%, rgba(240,240,240,.6) 65%, transparent 85%),
    url('/images/services/implantaty.jpg') right center / cover no-repeat !important;
}
[data-service="zubna-chirurgia"] .service-row-header-bg {
  background: linear-gradient(to right, rgba(240,240,240,1) 0%, rgba(240,240,240,.95) 40%, rgba(240,240,240,.6) 65%, transparent 85%),
    url('/images/services/zubna-chirurgia.jpg') right center / cover no-repeat !important;
}
[data-service="detska-stomatologia"] .service-row-header-bg {
  background: linear-gradient(to right, rgba(240,240,240,1) 0%, rgba(240,240,240,.95) 40%, rgba(240,240,240,.6) 65%, transparent 85%),
    url('/images/services/detska-stomatologia.jpg') right center / cover no-repeat !important;
}
[data-service="zachovna-stomatologia"] .service-row-header-bg {
  background: linear-gradient(to right, rgba(240,240,240,1) 0%, rgba(240,240,240,.95) 40%, rgba(240,240,240,.6) 65%, transparent 85%),
    url('/images/services/zachovna-stomatologia.jpg') right center / cover no-repeat !important;
}
[data-service="zubne-nahrady"] .service-row-header-bg {
  background: linear-gradient(to right, rgba(240,240,240,1) 0%, rgba(240,240,240,.95) 40%, rgba(240,240,240,.6) 65%, transparent 85%),
    url('/images/services/zubna-proteza.jpg') right center / cover no-repeat !important;
}

/* Hover - slightly reveal more image */
.service-row-header:hover .service-row-header-bg {
  filter: brightness(1.03);
}

/* Open state - subtle dim */
.service-row.is-open .service-row-header-bg {
  filter: brightness(.97);
}

/* Mobile: compact layout */
@media (max-width: 768px) {
  .service-row-header {
    padding: 16px 16px;
  }

  .service-row-header-content {
    gap: 10px;
  }

  .service-row-subtitle {
    font-size: 0.85rem;
    line-height: 1.35;
  }

  .service-row-kicker {
    font-size: 0.7rem;
  }

  .service-row-title {
    font-size: 1.1rem;
  }
}

@media (max-width: 480px) {
  .service-row-title {
    font-size: 1.05rem;
  }

  .service-row-subtitle {
    font-size: 0.82rem;
  }
}

.service-row-meta-pill {
  background: rgba(255,255,255,.82) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(166,166,166,.3) !important;
  color: #444 !important;
  font-weight: 700;
  text-shadow: none;
}

.service-row-kicker {
  color: #A6A6A6 !important;
  font-weight: 700;
}

.service-row-content.rich h4 {
  color: #555 !important;
}

/* Active service indicator */
.service-row.is-open {
  border-left: 3px solid #A6A6A6 !important;
}

/* Section titles - aluminum underline */
.section-title {
  position: relative;
  display: inline-block;
}

.section-title::after {
  content: "";
  display: block;
  width: 48px;
  height: 3px;
  background: #A6A6A6;
  margin: 12px auto 0;
  border-radius: 2px;
}

/* Footer - updated dark scheme */
.aurum-footer-dark {
  background: #555 !important;
}

/* Contact form silver focus */
.section-contact :is(input,textarea,select):focus {
  border-color: rgba(166,166,166,.6) !important;
  box-shadow: 0 0 0 3px rgba(166,166,166,.15), 0 10px 30px rgba(166,166,166,.08) !important;
}

/* Hero btn.light silver */
.btn.light {
  background-color: #efefef !important;
  color: #2e2e2e !important;
}

.btn.light .text {
  color: #2e2e2e !important;
}

.btn.light::before {
  background-color: #A6A6A6 !important;
}

.btn.light svg path {
  stroke: #fff;
}

.btn.light:hover {
  background-color: #e0e0e0 !important;
  box-shadow: 0 8px 20px -8px rgba(0,0,0,.2) !important;
}

/* Btn-aurum silver */
.btn-aurum {
  background: #A6A6A6 !important;
  box-shadow: 0 6px 18px rgba(166,166,166,.25) !important;
}

.btn-aurum:hover {
  background: #999 !important;
  box-shadow: 0 10px 26px rgba(166,166,166,.35) !important;
}

/* Menu panel - glass effect with silver */
.menu-panel {
  background: rgba(166, 166, 166, 0.12) !important;
}

.menu-list a:hover {
  color: #ddd !important;
}

.menu-list a::after {
  background-color: #A6A6A6 !important;
}

/* Mobile header solid */
.site-header.is-solid {
  background: #A6A6A6 !important;
}

.site-header {
  background: #A6A6A6 !important;
}

@media (max-width: 767.98px) {
  .site-header {
    background: transparent !important;
  }
  .site-header.is-solid {
    background: #A6A6A6 !important;
  }
}

/* Hero topbar sticky */
.hero-topbar.is-sticky {
  background-color: rgba(166, 166, 166, 1) !important;
}

/* Toast notifications */
.alo-toast-container{
  position:fixed;bottom:28px;right:28px;z-index:10001;
  display:flex;flex-direction:column-reverse;gap:12px;
  pointer-events:none;
}
.alo-toast{
  pointer-events:auto;
  display:flex;align-items:flex-start;gap:14px;
  min-width:340px;max-width:440px;
  padding:18px 20px 22px;
  background:#fff;
  border-radius:16px;
  box-shadow:0 12px 48px rgba(0,0,0,.12),0 2px 8px rgba(0,0,0,.06);
  border-left:4px solid transparent;
  position:relative;overflow:hidden;
  opacity:0;transform:translateX(40px) scale(.96);
  transition:opacity .35s cubic-bezier(.22,1,.36,1),transform .35s cubic-bezier(.22,1,.36,1);
  font-family:"Quicksand",sans-serif;
}
.alo-toast--visible{opacity:1;transform:translateX(0) scale(1)}
.alo-toast--exit{
  animation:toastExit .3s ease forwards;
}
@keyframes toastExit{
  to{opacity:0;transform:translateX(40px) scale(.96)}
}
.alo-toast--success{border-left-color:#4ead6b}
.alo-toast--error{border-left-color:#d94f4f}
.alo-toast__icon{
  flex-shrink:0;width:40px;height:40px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  margin-top:1px;
}
.alo-toast--success .alo-toast__icon{background:rgba(78,173,107,.1);color:#4ead6b}
.alo-toast--error .alo-toast__icon{background:rgba(217,79,79,.1);color:#d94f4f}
.alo-toast__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.alo-toast__title{font-weight:700;font-size:15px;color:#333;line-height:1.3}
.alo-toast__msg{font-weight:500;font-size:13.5px;color:#777;line-height:1.4}
.alo-toast__close{
  position:absolute;top:12px;right:14px;
  background:none;border:none;cursor:pointer;
  font-size:20px;line-height:1;color:#bbb;
  transition:color .15s;padding:0;
}
.alo-toast__close:hover{color:#666}
.alo-toast__progress{
  position:absolute;bottom:0;left:0;right:0;height:3px;
  background:rgba(0,0,0,.04);
}
.alo-toast__progress-bar{
  height:100%;width:100%;transform-origin:left;
  border-radius:0 0 0 16px;
}
.alo-toast--success .alo-toast__progress-bar{background:#4ead6b}
.alo-toast--error .alo-toast__progress-bar{background:#d94f4f}
.alo-toast__progress-bar--running{
  animation:toastProgress linear forwards;
  animation-duration:4500ms;
}
@keyframes toastProgress{
  from{transform:scaleX(1)}
  to{transform:scaleX(0)}
}

@media(max-width:600px){
  .alo-toast-container{left:16px;right:16px;bottom:16px}
  .alo-toast{min-width:0;max-width:none;width:100%}
}

/* ── Preregistration Modal ──────────────────────────────── */
.alo-modal-overlay{
  position:fixed;inset:0;z-index:10000;
  background:rgba(0,0,0,.45);
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;
  padding:20px;
  opacity:0;visibility:hidden;
  transition:opacity .3s ease,visibility .3s ease;
}
.alo-modal-overlay.is-visible{opacity:1;visibility:visible}

.alo-modal{
  position:relative;
  width:100%;max-width:520px;
  max-height:90vh;overflow-y:auto;
  background:#fff;border-radius:20px;
  box-shadow:0 24px 80px rgba(0,0,0,.18);
  padding:36px 32px 28px;
  transform:translateY(20px) scale(.97);
  transition:transform .35s cubic-bezier(.22,1,.36,1);
  -webkit-overflow-scrolling:touch;
}
.alo-modal-overlay.is-visible .alo-modal{
  transform:translateY(0) scale(1);
}
.alo-modal::-webkit-scrollbar{width:4px}
.alo-modal::-webkit-scrollbar-thumb{background:rgba(166,166,166,.3);border-radius:4px}

/* Close button */
.alo-modal__close{
  position:absolute;top:16px;right:18px;
  background:none;border:none;cursor:pointer;
  font-size:28px;line-height:1;color:#aaa;
  transition:color .15s,transform .15s;
  padding:4px;z-index:2;
}
.alo-modal__close:hover{color:#555;transform:scale(1.1)}

/* Header */
.alo-modal__header{margin-bottom:24px}
.alo-modal__kicker{
  display:inline-block;
  font-size:.75rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
  color:#A6A6A6;margin-bottom:6px;
}
.alo-modal__title{
  font-size:1.5rem;font-weight:800;
  color:#333;margin:0 0 10px;line-height:1.2;
}
.alo-modal__desc{
  font-size:.9rem;font-weight:500;
  color:#777;margin:0;line-height:1.5;
  padding-left:12px;
  border-left:3px solid #A6A6A6;
}

/* Form layout */
.alo-modal__form{display:flex;flex-direction:column;gap:16px}
.alo-modal__row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.alo-modal__field{display:flex;flex-direction:column;gap:5px}
.alo-modal__field--full{width:100%}

.alo-modal__field label{
  font-size:.8rem;font-weight:700;
  color:#444;letter-spacing:.02em;
}

.alo-modal__field input,
.alo-modal__field textarea{
  font-family:"Quicksand",sans-serif;
  font-size:15px;font-weight:600;
  padding:12px 14px;
  color:#333;background:#fff;
  border:1.5px solid rgba(166,166,166,.25);
  border-radius:12px;
  transition:border-color .2s,box-shadow .2s;
  width:100%;
}
.alo-modal__field textarea{resize:none;min-height:100px}

.alo-modal__field input:focus,
.alo-modal__field textarea:focus{
  outline:none;
  border-color:rgba(166,166,166,.5);
  box-shadow:0 0 0 3px rgba(166,166,166,.12);
}

/* Custom select inside modal */
.alo-modal__field .custom-select-ui{
  border:1.5px solid rgba(166,166,166,.25);
  border-radius:12px;min-height:44px;
}
.alo-modal__field .custom-select-trigger{
  padding:11px 40px 11px 14px;
  font-size:15px;
}

/* Checkbox */
.alo-modal__checkbox{
  display:flex;align-items:flex-start;gap:10px;
  font-size:.85rem;font-weight:500;color:#666;
  cursor:pointer;line-height:1.4;
}
.alo-modal__checkbox input[type="checkbox"]{
  width:18px;height:18px;margin-top:1px;
  accent-color:#A6A6A6;flex-shrink:0;
  cursor:pointer;
}
.alo-modal__checkbox a{color:#888;text-decoration:underline}
.alo-modal__checkbox a:hover{color:#555}

/* Footer */
.alo-modal__footer{
  display:flex;align-items:center;justify-content:flex-end;gap:14px;
  margin-top:4px;
}
.alo-modal__footer .error-message{
  font-size:13px;font-weight:600;opacity:0;transition:opacity .3s;
}

/* Responsive */
@media(max-width:600px){
  .alo-modal{
    padding:28px 20px 22px;
    max-width:100%;border-radius:16px;
    max-height:85vh;
  }
  .alo-modal__row{grid-template-columns:1fr}
  .alo-modal__title{font-size:1.3rem}
  .alo-modal__close{top:12px;right:14px;font-size:26px}
}

/* Smooth scroll */
html {
  scroll-behavior: smooth;
}