/* Extracted from sk/contact.html; keep this link after site-wide styles. */
/* === Typografia (zladené s novými stránkami) === */
      * {
        --body-font-size: 18px;
        --h1-font-size: 80px;
        --h2-font-size: 56px;
        --h3-font-size: 32px;
        --h4-font-size: 24px;
        --h5-font-size: 20px;
      }
      body { font-size: 18px; }
      p { font-size: 18px; }
      p.lead { font-size: 22px; line-height: 1.6; }
      @media (max-width: 1199px) {
        * {
          --h1-font-size: 56px;
          --h2-font-size: 42px;
          --h3-font-size: 28px;
        }
        p.lead { font-size: 20px; }
      }
      @media (max-width: 575px) {
        * {
          --h1-font-size: 40px;
          --h2-font-size: 32px;
        }
        body { font-size: 17px; }
        p { font-size: 17px; }
      }

      /* === Svetlé fialové pozadie === */
      body.dark-scheme {
        background: var(--color-surface-soft) !important;
      }
      #wrapper {
        background:
          radial-gradient(ellipse 55% 25% at 22% 14%, rgba(140,90,255,0.22) 0%, rgba(180,140,255,0.08) 50%, transparent 85%),
          radial-gradient(ellipse 50% 22% at 78% 30%, rgba(190,150,255,0.18) 0%, rgba(210,180,255,0.06) 55%, transparent 88%),
          radial-gradient(ellipse 55% 25% at 22% 60%, rgba(140,90,255,0.18) 0%, rgba(180,140,255,0.07) 55%, transparent 88%),
          var(--color-surface-accent);
      }
      html, body { background: transparent !important; }

      /* Header — sticky pri scrolle */
      header.smaller {
        background: var(--color-text) !important;
      }

      /* === Hero (rovnaký banner ako na ostatných podstránkach) === */
      #section-hero {
        position: relative;
        overflow: hidden;
      }
      /* Stlmenie tmavých a farebných vrstiev, aby pôvodné farby obrázka viac presvitali */
      #section-hero .sw-overlay { opacity: 0.35 !important; }
      #section-hero .gradient-edge-top.color { opacity: 0.25 !important; }
      #section-hero .gradient-edge-bottom { opacity: 0.5 !important; }
      /* Posunutie obsahu hero bannera nižšie (ako na ostatných podstránkach) */
      #section-hero .abs-centered { top: 60% !important; }
      @media (max-width: 1199px) {
        #section-hero .abs-centered { top: 55% !important; }
      }
      /* Väčší podnadpis v hero banneri */
      #section-hero .hero-subheadline {
        font-size: 3.6rem;
        line-height: 1.15;
        font-weight: 700;
      }
      @media (max-width: 1199px) {
        #section-hero .hero-subheadline { font-size: 2.4rem; }
      }
      @media (max-width: 575px) {
        #section-hero .hero-subheadline { font-size: 1.6rem; }
      }

      /* === Kontaktná sekcia (rovnaký vzor ako #section-venue na index.html) === */
      /* Override default .dark-scheme section dark bg — chceme vidieť gradient z #wrapper */
      #section-contact {
        background: transparent !important;
        position: relative;
        padding: 100px 0 110px;
      }
      #section-contact h3, #section-contact h4,
      #section-contact p, #section-contact span, #section-contact a {
        color: var(--color-text-strong) !important;
      }
      /* Nadpis v štýle ostatných svetlých sekcií (cloud-management, index) */
      #section-contact h2 {
        background: linear-gradient(180deg, var(--color-text-strong) 0%, #7c5cbf 85%) !important;
        -webkit-background-clip: text !important;
        -webkit-text-fill-color: transparent !important;
        background-clip: text !important;
        color: transparent !important;
        margin-bottom: 18px;
      }
      #section-contact .subtitle {
        display: inline-block;
        font-size: 0.82rem;
        font-weight: 700;
        letter-spacing: 2.5px;
        text-transform: uppercase;
        color: var(--primary-color) !important;
        margin-bottom: 14px;
      }
      #section-contact .contact-info-row .contact-info-icon i {
        color: #ffffff !important;
      }
      /* Malé štítky (Sídlo spoločnosti, Obchod, IČO…) — fialové */
      #section-contact .info-label {
        color: var(--primary-color) !important;
      }

      /* Formulár — underline štýl, bez kariet */
      .contact-form-simple {
        max-width: 760px;
        margin: 0 auto;
      }
      .contact-form-simple input[type="text"],
      .contact-form-simple input[type="email"],
      .contact-form-simple input[type="tel"],
      .contact-form-simple textarea {
        width: 100%;
        background: transparent;
        border: none;
        border-bottom: 1px solid rgba(26, 16, 64, 0.25);
        border-radius: 0;
        color: var(--color-text-strong);
        padding: 14px 4px;
        font-size: 1rem;
        font-family: inherit;
        transition: border-color .25s ease;
      }
      .contact-form-simple textarea {
        min-height: 110px;
        resize: vertical;
      }
      .contact-form-simple input::placeholder,
      .contact-form-simple textarea::placeholder {
        color: rgba(26, 16, 64, 0.65);
      }
      .contact-form-simple input:focus,
      .contact-form-simple textarea:focus {
        outline: none;
        border-bottom-color: var(--primary-color);
      }
      .contact-form-simple input.error_input,
      .contact-form-simple textarea.error_input {
        border-bottom-color: #dc3545;
      }
      .contact-form-simple .form-submit-row {
        margin-top: 32px;
        text-align: center;
      }

      /* Hlášky */
      .contact-form-msg {
        max-width: 760px;
        margin: 22px auto 0;
        padding: 14px 18px;
        border-radius: 10px;
        font-size: 1rem;
        display: none;
        text-align: center;
      }
      .contact-form-msg.success {
        background: rgba(118, 77, 240, 0.12);
        color: var(--color-text-strong);
        border: 1px solid rgba(118, 77, 240, 0.35);
      }
      .contact-form-msg.error {
        background: rgba(220, 53, 69, 0.10);
        color: #7a1320;
        border: 1px solid rgba(220, 53, 69, 0.35);
      }
      .contact-form-msg.error a {
        color: #7a1320;
        text-decoration: underline;
      }

      /* === Kontaktné údaje — prehľadné stĺpce === */
      .contact-info-row {
        margin-top: 60px;
      }
      .contact-info-row .contact-info-item {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
        height: 100%;
      }
      .contact-info-row .contact-info-icon {
        width: 54px;
        height: 54px;
        border-radius: 12px;
        background: linear-gradient(135deg, var(--primary-color), #b48dff);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
      }
      .contact-info-row .contact-info-icon i {
        font-size: 1.5rem;
        color: #ffffff !important;
      }
      .contact-info-row h4 {
        margin: 0;
        color: var(--color-text-strong);
      }
      /* Riadok: štítok + hodnota, oddelené tenkou linkou */
      .contact-detail {
        width: 100%;
        padding: 12px 0;
        border-top: 1px solid rgba(26, 16, 64, 0.10);
      }
      .contact-detail:first-of-type { border-top: none; padding-top: 4px; }
      .contact-detail .info-label {
        display: block;
        font-size: 0.7rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 1.2px;
        color: var(--primary-color) !important;
        margin-bottom: 3px;
      }
      .contact-detail .info-value {
        display: block;
        font-size: 1.02rem;
        font-weight: 500;
        color: var(--color-text-strong);
        line-height: 1.4;
      }
      .contact-detail a.info-value {
        text-decoration: none;
        transition: color .2s ease;
      }
      .contact-detail a.info-value:hover { color: var(--primary-color); }

      /* Fakturačné údaje — rovnaký štýl, prehľadný grid */
      .billing-row {
        margin-top: 56px;
        padding-top: 40px;
        border-top: 1px solid rgba(26, 16, 64, 0.12);
      }
      .billing-card h4 {
        color: var(--color-text-strong);
        margin: 0 0 20px 0;
      }
      .billing-item {
        padding: 10px 0;
        color: var(--color-text-strong);
        line-height: 1.4;
        border-top: 1px solid rgba(26, 16, 64, 0.08);
      }
      .billing-item:first-child { border-top: none; padding-top: 0; }
      .billing-item .info-label {
        display: block;
        font-size: 0.7rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 1.2px;
        color: var(--primary-color) !important;
        margin-bottom: 2px;
      }
      .billing-item .info-value {
        font-size: 1.02rem;
        font-weight: 500;
        color: var(--color-text-strong);
      }

      /* Oddeľovač medzi blokom údajov a formulárom */
      .contact-form-divider {
        margin-top: 90px;
        margin-bottom: 0;
      }

/* Táto stránka nemá v pätičke CTA pruh, preto má .footer-main vyššie horné
   odsadenie než css/components/footer.css, a pätička si nastavuje vlastné
   pozadie. Zvyšok pätičky je v komponente. */
footer.footer-creative { background-color: #0f062d !important; }
.footer-main { padding: 80px 0 60px; }
.footer-creative .subfooter { color: rgba(255, 255, 255, 0.7); }

@media (max-width: 1199px) {
        #section-contact { padding: 70px 0 90px; }
        .contact-info-row { margin-top: 60px; }
      }
      @media (max-width: 767px) {
        .contact-info-row .contact-info-item {
          flex-direction: column;
          align-items: center;
          text-align: center;
          gap: 10px;
        }
      }

      /* Tlačidlo Odoslať správu — biely text na fialovom fille + fx-slide efekt (ako na ostatných podstránkach) */
      #section-contact .contact-form-simple button.btn-main span {
        color: #ffffff !important;
      }
      #section-contact .contact-form-simple button.btn-main.fx-slide {
        position: relative;
        overflow: hidden;
      }
      #section-contact .contact-form-simple button.btn-main.fx-slide span {
        display: block;
        position: relative;
        transition: all .3s ease-in-out;
      }
      #section-contact .contact-form-simple button.btn-main.fx-slide:hover {
        background: var(--btn-hover-bg);
      }
      #section-contact .contact-form-simple button.btn-main.fx-slide:hover span {
        transform: translate(0, 40px);
        opacity: 0;
      }
      #section-contact .contact-form-simple button.btn-main.fx-slide:before {
        content: attr(data-hover-text);
        color: #ffffff !important;
        position: absolute;
        top: 50%;
        left: 50%;
        white-space: nowrap;
        transform: translate(-50%, calc(-50% + 40px));
        opacity: 0;
        transition: all .3s ease-in-out;
      }
      #section-contact .contact-form-simple button.btn-main.fx-slide:hover:before {
        opacity: 1;
        transform: translate(-50%, -50%);
      }