        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        :root {
            --contact-gap: 1.25rem;               /* = rozestup mezi bannerem a první kartou */
            --services-gap: 2rem;                 /* desktop default for cards + banner */
            --lab-grad-start:#E1FAE9;           /* soft green */
            --lab-grad-end:#DEEAFB;             /* soft blue */
            --lab-border:#CFE4F2;
            --lab-ink:#003867;                  /* text color */
            --lab-accent:#003867;               /* CTA color */
            --cta-h-desktop: 44px;                /* unify all primary buttons on desktop */
            --cta-h-mobile: 48px;                 /* slightly bigger touch target on mobile */
            --cta-radius: 1rem;                   /* unify rounding */
            --card-radius: 1.5rem;
        }

        html {
            -webkit-text-size-adjust: 100%;
            text-size-adjust: 100%;
        }
        
        body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
            line-height: 1.6;
            color: #1f2937;
        }

        /* Header Styles */
        .header {
            background: white;
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
            position: sticky;
            top: 0;
            z-index: 50;
        }

        .header-container {
            min-height: 64px;
            max-width: 1200px;
            margin: 0 auto;
            padding: 1rem 2rem;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .logo {
            font-size: 1.5rem;
            font-weight: bold;
            color: #2563eb;
        }

        .nav {
            display: flex;
            gap: 2rem;
        }

        .nav a {
            text-decoration: none;
            color: #374151;
            transition: color 0.3s;
        }

        .nav a:hover {
            color: #2563eb;
        }

        .btn {
            box-sizing: border-box;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .5rem;
            min-height: var(--cta-h-desktop);
            padding-block: 0;            /* height comes from min-height */
            padding-inline: 1rem;
            line-height: 1;
            font-weight: 400;
            text-decoration: none;
            background: #2563eb;
            color: white;
            border: none;
            border-radius: var(--cta-radius);
            cursor: pointer;
            transition: background 0.3s;
        }      

        .btn > svg,
        .btn > i {
            width: 20px;
            height: 20px;
            flex: 0 0 auto;
        }

        .btn:hover {
            background: #1d4ed8;
        }

        .btn-outline {
            background: transparent;
            color: #2563eb;
            border: 1.75px solid #2563eb;
        }

        .btn-outline:hover {
            background: #eff6ff;
        }

        /* Mobile Menu */
        .mobile-menu-btn {
            display: none;
            background: none;
            border: none;
            cursor: pointer;
            color: #374151;
        }

        /* Hero Section */
        .hero {
            background: linear-gradient(to bottom, #dbeafe, white);
            padding: 4rem 0;
        }

        .hero-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
            display: grid;
            grid-template-columns: 1fr 1fr;
            column-gap: 3rem;               /* keep side spacing */
            row-gap: 1.25rem;               /* reduce vertical spacing between rows */
            align-items: center;

            /* NEW: explicit layout for desktop/tablet */
            grid-template-areas:
                "content image"
                "stats   image";
        }

        .hero-content {
            grid-area: content;
        }
        
        .hero-content h1 {
            font-size: 3rem;
            font-weight: bold;
            line-height: 1.2;
            margin-bottom: 1rem;
        }

        .hero-content .highlight {
            color: #2563eb;
        }

        .hero-content p {
            font-size: 1.125rem;
            color: #4b5563;
            margin-bottom: 2rem;
        }

        .hero-buttons {
            display: flex;
            gap: 1rem;
            margin-bottom: 0.75rem;         /* avoid stacking extra space above stats */
            margin-top: .5rem;              /* tiny breathing room below the paragraph */
        }

        .hero-stats {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 1rem;
            grid-area: stats;
        }

        .stat-card {
            background: white;
            padding: 1rem;
            border-radius: var(--card-radius);
            text-align: center;
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
            transition: box-shadow 0.3s;
        }

        .hero-stats .stat-card > svg {
            width: 32px;
            height: 32px;
            margin: 0 auto 8px;
        }

        .stat-card:hover {
            box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
        }

        .stat-number {
            font-size: 1.5rem;
            font-weight: bold;
            color: #1f2937;
        }

        .stat-label {
            font-size: 0.875rem;
            color: #6b7280;
        }

        .hero-image {
            background: linear-gradient(135deg, #dbeafe, #dcfce7);
            border-radius: var(--card-radius);
            padding: 1rem;
            position: relative;
            grid-area: image;
        }

        .hero-image img {
            width: 100%;
            height: 24rem;
            object-fit: cover;
            border-radius: 1rem;
            box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
            display: block;             /* removes inline baseline gap */
        }

        /* Services Section */
        .services {
            padding: 2rem 0 4rem;
            background: #f9fafb;
        }

        .services-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
        }

        .section-header {
            text-align: center;
            margin-bottom: 4rem;
        }

       .services .section-header {
            text-align: center;
            margin-bottom: 2.5rem;
        }

        #pediatrie-header {
            text-align: center;
            margin-bottom: 3rem;
        }

        #alergo-header {
            text-align: center;
            margin-bottom: 3rem;
        }        

        .section-header h2 {
            font-size: 2.5rem;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .subheading-h3 {
            font-size: 1.5rem;
            font-weight: bold;
            margin-bottom: 2rem;
        }

        .section-header p {
            font-size: 1.125rem;
            color: #4b5563;
            max-width: 48rem;
            margin: 0 auto;
        }

        .services-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: var(--services-gap);
            margin-bottom: 3rem;
        }

        .service-card {
            background: white;
            padding: 1.5rem;
            border-radius: var(--card-radius);
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
            transition: all 0.3s;
        }

        .service-card:hover {
            box-shadow: 0 20px 25px rgba(0, 0, 0, 0.1);
            transform: translateY(-4px);
        }

        .service-icon {
            width: 3rem;
            height: 3rem;
            margin-bottom: 1rem;
        }

        .service-card h3 {
            font-size: 1.25rem;
            font-weight: 600;
            margin-bottom: 0.75rem;
        }

        .service-card p {
            color: #4b5563;
        }

        /* --- SYNLAB banner (card) --- */
        .lab-banner {
            display:flex;
            align-items:center;
            gap:1rem;
            padding:1rem 1.25rem;
            margin: var(--services-gap) 0 var(--services-gap);
            background:linear-gradient(135deg, var(--lab-grad-start) 0%, var(--lab-grad-end) 100%);
            border:1px solid var(--lab-border);
            border-radius: var(--card-radius);
            box-shadow: 0 6px 18px rgba(0,0,0,.06);
        }

        /* Left block: logo + copy sit on a flex row so text is to the right */
        .lab-banner-body {
            display:flex;
            align-items:center;   /* ← vertical centering of logo vs text */
            gap: 1.5rem;
            min-width:0;          /* prevents overflow with long titles */
        }

        /* Logo */
        .lab-banner-brand {
            display:flex;         /* ensures logo box self-centers contents */
            align-items:center;   /* vertical centering inside brand box */
            flex:0 0 auto;
        }

        .lab-banner-brand img {
            display:block;
            height:36px;          /* adjust if you want bigger/smaller */
            width:auto;
        }

        /* Text (to the right of logo) */
        .lab-banner-copy {
            display:grid;
            gap:.3rem;
            min-width:0;
        }

        .lab-banner-title {
            font-weight:800;
            color:var(--lab-ink);
            line-height:1.35;
            font-size:clamp(1rem, .9rem + .6vw, 1.2rem);
            white-space:normal;
        }

        .lab-banner-sub {
            color:color-mix(in srgb, var(--lab-ink) 90%, white);
            font-size:.95rem;
        }

        /* CTA on the far right */
        .lab-banner-cta {
            margin-left:auto;
            flex:0 0 auto;
            background:#fff;
            color:var(--lab-accent);
            border:1.5px solid var(--lab-accent);
            border-radius: var(--cta-radius);
            text-decoration:none;
            font-weight:700;
            padding-block: 0;
            padding-inline: .9rem;            
            white-space:nowrap;
            display:inline-flex;
            align-items:center;
            justify-content:center;
            gap:.5rem;
            min-height: var(--cta-h-desktop);
            line-height: 1;
            cursor:pointer;
        }

        .lab-banner-cta > svg,
        .lab-banner-cta > i {
            width:20px;
            height:20px;
            flex:0 0 auto;
        }

        .lab-banner-cta:hover {
            background:color-mix(in srgb, var(--lab-accent) 10%, #fff);
            border-color:color-mix(in srgb, var(--lab-accent) 85%, #fff);
        }

        .new-patients-card {
            background: #2563eb;
            color: white;
            padding: 2rem;
            border-radius: var(--card-radius);
            text-align: center;
        }

        .new-patients-card h3 {
            font-size: 1.5rem;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        /* About Section */
        .about {
            padding: 3rem 0 4rem;
            background: white;
        }

        .about-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
        }

        .about-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 3rem;
            align-items: center;
            margin-bottom: 0;
        }

        .about-content h2 {
            font-size: 2.5rem;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .about-content p {
            color: #4b5563;
            margin-bottom: 1.5rem;
        }

        .credentials {
            align-items: stretch;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 1rem;
        }

        .credential-card {
            height: 100%; 
            background: white;
            border: 1px solid #e5e7eb;
            border-radius: var(--card-radius);
            padding: 1rem;
            display: flex;
            flex-direction: column;
            gap: .5rem;                 /* jemné rozestupy mezi ikonou, h4 a p */
        }

        .credential-card h4 {
            font-weight: 600;
            margin-bottom: 0.25rem;
        }

        .credential-card p {
            font-size: 0.875rem;
            color: #6b7280;
            margin: 0;
            line-height: 1.4;  
        }

        .credential-card > :last-child {
              margin-bottom: 0;
        }

        /* Let credential cards shrink/wrap instead of forcing overflow */
        .credentials > * {
            min-width: 0;            /* key fix for CSS Grid overflow */
            word-break: break-word;  /* extra safety for very long tokens */
        }

        .about-image {
            background: linear-gradient(135deg, #dcfce7, #dbeafe);
            border-radius: var(--card-radius);
            padding: 1rem;
        }

        .about-image img {
            width: 100%;
            height: 24rem;
            object-fit: cover;
            border-radius: 1rem;
            box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
            display: block;             /* removes inline baseline gap */
        }
        
         /* Hours Section */
        .office-hours-table[hidden] {
            display: none !important;
        }

        .hours {
            padding: 2rem 0 3rem;
            background: #f9fafb;
        }

        .hours-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
        }

        .hours .section-header {
            text-align: center;
            margin-bottom: 2.5rem;
        }

        .hours-nav {
            display: flex;
            gap: .5rem;
            flex-wrap: wrap;
            margin-bottom: 1rem;
            justify-content: center;
        }

        .tab-btn {
            flex: 0 0 auto;
            cursor: pointer;
            padding: .5rem 1rem;
            border: 1px solid #2563eb;
            background: #fff;
            color: #2563eb;
            border-radius: 0.75rem;
            font-weight: 600;
            transition: background .2s;
        }

        .tab-btn.active,
        .tab-btn:hover {
            background: #2563eb;
            color: #fff;
        }

        .hours-table-wrapper {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            border: none;
            border-radius: var(--card-radius);
        }

        .office-hours-table {
            width: 100%;
            border-collapse: collapse;
            border: 1px solid #e5e7eb;
            margin: 0;
        }

        .office-hours-table th,
        .office-hours-table td {
            background: white;
            border: 1px solid #e5e7eb;
            padding: .75rem;
            text-align: center;
        }
        
        .office-hours-table thead th {
            background: #F3F4F6;
            color: #2563eb;
            font-weight: 600;
        }

        .office-hours-table th:first-child,
        .office-hours-table td:first-child {
            text-align: left;
            font-weight: 600;
        }

        /* Contact Section */
        .contact {
            padding: 2.5rem 0;
            background: #f9fafb;
            margin-top: -2.5rem;
            margin-bottom: 0rem;
        }

        .contact .section-header{
            margin-bottom: 2.5rem;            /* stejné jako .hours .section-header */
        }

        .contact-banner {                     /* přesunut do Hours section */
            display: flex;
            align-items: center;
            gap: .75rem;
            padding: .875rem 1rem;
            margin-top: 1rem; 
            margin-bottom: 1rem;
            background: #eef2ff;            /* light indigo */
            border: 1px solid #c7d2fe;      /* indigo-200 */
            color: #1e3a8a;                 /* indigo-900 */
            border-radius: var(--card-radius);
        }

        .contact-banner a {
            color: #1d4ed8;                 /* indigo-600 */
            font-weight: 600;
            text-underline-offset: 2px;
        }

        .contact-banner a:hover {
            text-decoration: underline;
        }

        .banner-content {
            display: flex;
            align-items: center;
            gap: .75rem;
            flex-wrap: wrap;
        }

        /* --- Facebook pill link (flat, sekundární vzhled) --- */
        .social-pill {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .4rem .65rem;
            border-radius: 999px;
            border: 1px solid #d1d5db;     /* neutrální obrys – nekonkuruje CTA */
            background: #f3f4f6;           /* flat */
            color: #1f2937;                /* neutrální text */
            text-decoration: none;           /* žádné podtržení */
            font-weight: 500;                /* méně výrazné než primární CTA */
            line-height: 1;
        }
        .social-pill:hover {
            background: #e5e7eb;           /* jemný hover, stále flat */
            border-color: #cbd5e1;
        }
        .social-pill:focus-visible {
            outline: 2px solid #2563eb;    /* přístupnost */
            outline-offset: 2px;
        }
        .social-pill > svg {
            width: 18px;
            height: 18px;
            opacity: .9;                    /* decentní ikony */
        }
        .social-pill > svg:last-child {
            width: 16px;                    /* šipka o chlup menší */
            height: 16px;
            opacity: .7;
        }

        .contact :is(a[href^="tel:"], a[href^="mailto:"]) {
            color: inherit;
            text-decoration: none;
            display: inline-flex;
            align-items: center;
            gap: .5rem;
        }

        .contact :is(a[href^="tel:"], a[href^="mailto:"]):hover {
            text-decoration: underline;
        }

        .contact :is(a[href^="tel:"], a[href^="mailto:"]):focus-visible {
            outline: 2px solid #2563eb;
            outline-offset: 2px;
        }

        .contact-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
        }

        .contact-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: var(--contact-gap); 
        }

        .contact-info {
            display: flex;
            flex-direction: column;
            gap: var(--contact-gap);
        }

        .contact-card {
            background: white;
            border-radius: var(--card-radius);
            padding: 1.5rem;
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
            margin: 0;
        }

        .contact-card-header {
            display: flex;
            align-items: flex-start;
            gap: 1rem;
        }

        .contact-card h3 {
            font-size: 1.125rem;
            font-weight: 600;
            margin-bottom: 0.5rem;
        }

        /* Responsive Google Map */
        .map-responsive {
            position: relative;
            width: 100%;
            height: 100%;                   /* bude řízeno JS – stejné jako výška levého sloupce */
            overflow: hidden;
            border-radius: var(--card-radius);
        }

        .map-responsive iframe {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            display: block;
            border: 0;
        }

        /* Footer */
        .footer {
            background: #111827;
            color: white;
            padding: 3rem 0;
        }

        .footer-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
        }

        .footer-section a:hover {
            color: #60a5fa;
        }

        .footer-bottom {
            display: flex;
            justify-content: space-between;
            align-items: center;
            flex-wrap: wrap;
            gap: 1rem;
        }

        .footer-bottom-right {
            display: flex;
            align-items: center;
            gap: 0.5rem;
            color: #9ca3af;
            font-size: 0.875rem;
        }

        /* ---- Mobile Hours Viewer ---- */
        .hours-mobile {
            display: none;
        }

        .hours-mobile .day-controls {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: .75rem;
            margin-bottom: .75rem;
            font-weight: 700;
        }

        .hours-mobile .day-controls button {
            border: 1px solid #2563eb;
            background: #fff;
            color: #2563eb;
            width: 40px;              /* square */
            height: 40px;             /* square */
            padding: 0;               /* no extra padding */
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 20px;          /* bigger chevron */
            line-height: 0;           /* tight line height */
            font-weight: 100;         /* slightly bolder */
            border-radius: .85rem;    /* gentle corners (not pill) */
            cursor: pointer;
        }

        .hours-mobile .day-controls button:hover {
            background: #eff6ff;
        }

        .hours-mobile .day-label {
            min-width: 8ch;
            text-align: center;
            color: #2563eb;
        }

        .hours-mobile .day-note {
            text-align: center;
            font-size: .95rem;
            color: #4b5563;
            background: #fff;
            border: 1px solid #e5e7eb;
            border-radius: 1rem;
            padding: .5rem .75rem;
            margin-bottom: .5rem;
        }

        .hours-mobile .day-slots {
            list-style: none;
            background: #fff;
            border: 1px solid #e5e7eb;
            border-radius: var(--card-radius);
            padding: .25rem;
            margin: 0;
        }

        .hours-mobile .day-slots li {
            display: flex;
            justify-content: space-between;
            gap: .75rem;
            padding: .5rem .5rem;
            border-top: 1px solid #e5e7eb;
        }

        .hours-mobile .day-slots li:first-child {
            border-top: 0;
        }

        .hours-mobile .day-slots strong {
            font-weight: 600;
            color: #111827;
        }

        .hours-mobile .day-slots span {
            color: #374151;
        }

        /* Cookie Consent (compact, accessible) */
        .cc-banner {
            position: fixed;
            z-index: 9999;

            /* horizontally centered, near bottom */
            left: 50%;
            bottom: 2rem;
            transform: translateX(-50%);

            /* size */
            width: clamp(560px, 48vw, 720px);
            max-width: calc(100% - 2rem);

            /* card look */
            background: #ffffff;
            color: #111827;
            border: 1px solid #e5e7eb;
            border-radius: var(--card-radius);
            box-shadow: 0 10px 25px rgba(0,0,0,.12);

            /* layout guardrails */
            box-sizing: border-box;
            max-height: calc(100dvh - 4rem);
            overflow:auto;
        }

        .cc-inner {
            display: grid;
            gap: .6rem;
            padding: 1.25rem;               /* symmetric spacing */
            box-sizing: border-box;
        }

        .cc-title {
            margin: 0 0 .25rem 0;
            font-size: 1rem;
            line-height: 1.3;
            color: #111827;
            font-weight: 700;
        }

        .cc-desc {
            margin: 0 0 .5rem 0;
            font-size: .925rem;
            color: #4b5563;                /* gray-600 */
        }

        .cc-details {
            margin: .25rem 0 .25rem;
        }

        .cc-details summary {
            cursor: pointer;
            list-style: none;
            font-size: .9rem;
            color: #2563eb;                /* primary blue */
            text-underline-offset: 2px;
        }

        .cc-details summary::-webkit-details-marker {
            display: none;
        }

        .cc-prefs {
            margin-top: .5rem;
            display: grid;
            gap: .35rem;
            padding: .5rem;
            border: 1px solid #e5e7eb;
            border-radius: .5rem;
            background: #fafafa;
        }

        .cc-toggle {
            display: flex;
            align-items: center;
            gap: .5rem;
            font-size: .9rem;
            color: #374151;
        }

        .cc-toggle input {
            width: 16px;
            height: 16px;
        }

        .cc-actions {
            display: flex;
            gap: .5rem;
            margin-top: .25rem;
            flex-wrap: wrap;
        }

        .cc-btn {
            border: 1px solid #e5e7eb;
            background: #ffffff;
            color: #111827;
            padding: .55rem .8rem;
            border-radius: .85rem;
            cursor: pointer;
            font-size: .95rem;
        }

        .cc-btn:focus {
            outline: 2px solid #93c5fd;
            outline-offset: 2px;
        }

        /* primary/secondary mapping to site buttons */
        .cc-accept {
            background: #2563eb;
            color: #ffffff;
            border-color: #2563eb;
        }

        .cc-accept:hover{
            filter: brightness(.98);
        }

        .cc-reject {
            background: #ffffff;
        }

        .cc-reject:hover{ 
            background: #f9fafb;
        }

        .cc-save {
            background: #ffffff;
        }

        .cc-save:hover {
            background: #f9fafb;
        }

        /* Footer “Nastavení soukromí” look */
        .footer .cc-manage-link {
            color: #9ca3af;
            font-size: 0.875rem;
            text-decoration: none;
        }

        .footer .cc-manage-link:hover {
            color: #60a5fa;
            text-decoration: underline;
        }

         @media (max-width: 900px) { 
            .header .nav {
                display: flex;
                flex-direction: column;
                position: absolute;
                top: 100%;
                left: 0;
                width: 100%;
                background: #fff;
                box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
                padding: 1rem;
                gap: 1rem;
                z-index: 1000;
                transform: scaleY(0);
                transform-origin: top;
                transition: transform 0.3s ease;
            }

            .header .btn {
                display: none;
            }

            .mobile-menu-btn {
                display: block;
                -webkit-tap-highlight-color: transparent;
            }

            /* when .menu-open is toggled on the header */
            .header.menu-open .nav {
                transform: scaleY(1);
            }

            .header.menu-open .btn {
                display: block;
                margin: 0.5rem 1rem;
                width: calc(100% - 2rem);
                text-align: center;
            }

            .contact-button {
                display: none !important;
            }

            /* Increase touch area and font size */
            .header.menu-open .nav a {
                font-size: 1.15rem;              /* slightly larger text */
                padding: 0.75rem 1rem;           /* more vertical padding */
                line-height: 1;                  /* better readability */
                border-bottom: 1px solid rgba(0,0,0,0.05);  /* very light divider */
            }

            /* Remove the last divider so it doesn’t show after the final item */
            .header.menu-open .nav a:last-child {
                border-bottom: none;
            }

            /* Remove tap highlight and focus outline on burger menu */
            .mobile-menu-btn:focus,
            .mobile-menu-btn:active,
            .header .nav a:focus,
            .header .nav a:active {
                outline: none;
                box-shadow: none;
                -webkit-tap-highlight-color: transparent;
                background-color: transparent;  /* ensure no BG flash */
            }

            .hero-stats {
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 1rem;                       
                align-items: stretch;
                justify-items: stretch;
            }

            .hero-stats .stat-card:nth-child(n+3) {
                display: none;                         /* hide 3rd and beyond */
            }

            .hero-stats .stat-card {
                width: 100%;                           /* card fills the row */
            }
            
        }

        @media (max-width: 768px) {
            :root {
                --hero-gap-mobile: 1.4rem;
            }

            body {
                line-height: 1.5;
            }

            .about-grid {
                grid-template-columns: 1fr;
                margin-bottom: 0;
                gap: 1.5rem;
            }

            .hero-image {
                display: none;
            }

            .services-grid {
                grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
                gap: var(--contact-gap);
            }

            h2 {
                line-height: 1.2;
                margin-bottom: 1.35rem;
            }

            .about-content h2 {
                font-size: 2.15rem;
                line-height: 1.2;
                margin-bottom: 1.35rem;
            }

            .about-image {
                background: linear-gradient(135deg, #dcfce7, #dbeafe);
                border-radius: 1.5rem;
                padding: 0.5rem;
            }

            .section-header h2 {
                font-size: 2.15rem;
                line-height: 1.2;
                margin-bottom: 1.35rem;
            }

            .service-icon {
                width: 2.5rem;
                height: 2.5rem;
                margin-bottom: 0.15rem;
            }

            .hero {
                padding: 3.5rem 0 4rem;
            }

            .hero-container {
                grid-template-columns: 1fr;
                grid-template-areas:
                    "content"
                    "image"
                    "stats";
                row-gap: var(--hero-gap-mobile);       /* slightly tighter vertical spacing */
                text-align: center;
            }
            
            .hero-content {
                margin-bottom: 0;
            }

            .hero-content > *:last-child {
                margin-bottom: 0;
            }
            
            .hero-content h1 {
                font-size: 2.35rem;
                margin-bottom: 1.4rem;                /* zvětší rozestup pod nadpisem */
            }

            .hero-content p {
                margin-top: .25rem;                    /* jemné “odskočení” od nadpisu */
                line-height: 1.55;                     /* čitelnější na malých displejích */
                margin-bottom: 2.5rem;
            }
            
            .hero-buttons {
                margin-top: .75rem;                    /* spacing from text */
                margin-bottom: 0;                      /* avoid adding below-content space */
                flex-direction: column;
                max-width: 420px;                      /* button doesn’t get too wide on tablets */
                margin-inline: auto;                   /* keeps it centred */
                gap: .75rem;
            }

            .hero-stats {
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 1rem;                       
                align-items: stretch;
                justify-items: stretch;
            }

            .hero-stats .stat-card:nth-child(n+3) {
                display: none;                         /* hide 3rd and beyond */
            }

            .hero-stats .stat-card {
                width: 100%;                           /* card fills the row */
                margin-inline: auto;                   /* keeps it centred */
                padding: 0.85rem;                      /* shrink card padding */
            }

            .hero-stats .stat-card > svg {
                width: 24px;
                height: 24px;
                margin: 0 auto 0;
            }

            .services {
                padding: 3rem 0 4rem;
                background: #f9fafb;
            }

            h3, .subheading-h3 {
                line-height: 1.25;
                margin-top: .5rem;
                margin-bottom: 1rem;
            }

            .services .section-header {
                margin-bottom: 2.75rem;
            }

            .lab-banner {
                flex-direction: column;
                align-items: center;        /* center the whole banner content */
                text-align: center;
                gap: 1.25rem;
                margin: var(--contact-gap) 0 var(--contact-gap);
            }

            .lab-banner-body {
                flex-direction: column;     /* ← stack logo above text */
                align-items: center;        /* center both logo + text */
                justify-content: center;
                gap: 1.25rem;               /* space between logo and text on mobile */
            }

            .lab-banner-cta {
                width: 100%;                /* full-width button on mobile */
            }

            .btn,
            .lab-banner-cta {
                min-height: var(--cta-h-mobile);
            }

            .credentials {
                grid-template-columns: 1fr;
            }

            .credential-card { 
                gap: .25rem;
            }

            .credential-card h4 {
                margin-bottom: .1rem;
            }

            .credential-card .lucide {
                display: block;             /* ensure vertical margin takes effect */
                line-height: 0;             /* remove inline svg baseline gap */
                margin-bottom: 2px !important;
            }

            .contact-banner{
                flex-direction: column;                /* stack nad sebe */
                align-items: stretch;                  /* pill přes celou šířku */
                text-align: center;                    /* vycentrovaný text */
                gap: .5rem;
                overflow-wrap: anywhere;               /* nic nepřetéká */
            }

            .hours {
                padding: 3rem 0 3rem;
            }

            .hours-table-wrapper {
                display: none;
            }

            .hours-mobile {
                display: block;
            }

            .contact-banner > i,
            .contact-banner > svg{
                align-self: center;                    /* megafon doprostřed */
                display: block;
                width: 20px;
                height: 20px;
                margin-bottom: .125rem;
            }

            .banner-content{
                flex-direction: column;                /* text a pill pod sebou */
                align-items: stretch;
                gap: .5rem;
            }

            .banner-content > span{
                display: block;
                line-height: 1.25;
            }

            .social-pill{
                width: 100%;                           /* pohodlný tap-target */
                justify-content: center;               /* obsah na střed */
                padding: .6rem .8rem;                  /* vyšší klikací plocha */
                font-weight: 500;
            }

            .social-pill > svg{
                flex: 0 0 auto;                        /* ikony se nezmenšují */
                width: 18px;
                height: 18px;
            }

            .social-pill > svg:last-child{
                width: 16px;
                height: 16px;
            }

            .contact-grid {
                grid-template-columns: 1fr;
                gap: 1.25rem;  
            }

            .contact-info {
                gap: 1.25rem;                          /* bylo 2rem → sjednotíme */
            }

            .contact-card:first-child {
                margin-top: 0;
            }

            .map-responsive {
                height: auto;                           /* zruší inline výšku z JS */
                padding-bottom: 56.25%;
                min-height: 320px;
            }

            .cc-banner {
                left: 1rem;
                right: 1rem;
                bottom: max(1rem, env(safe-area-inset-bottom));
                transform: none;        /* no centering on mobile */
                width: auto;
                border-radius: var(--card-radius);
                max-height: calc(100dvh - 2rem - env(safe-area-inset-bottom));
            }

            .cc-inner{
                padding: 1rem;
            }

            .cc-actions{
                justify-content: flex-start;
            }
    
            .footer-bottom {
                flex-direction: column;
                align-items: center;
                gap: 1.25rem;               /* one source of truth for spacing */
                text-align: center;
            }

            /* Remove stray margins and normalize line-height on each row */
            .footer-bottom > * {
                margin: 0 !important;
                padding: 0 !important;
                line-height: 1.4;
            }

            /* Make sure the privacy link looks like the other rows */
            .footer .cc-manage-link {
                display: inline-block !important;
                color: #9ca3af;
                font-size: 0.875rem;
                text-decoration: none;
            }
            
            .footer .cc-manage-link:hover {
                color: #60a5fa;
                text-decoration: underline;
            }
        } 

        /* Utility Classes */
        .text-pink-500 { color: #ec4899; }
        .text-red-500 { color: #ef4444; }
        .text-blue-500 { color: #3b82f6; }
        .text-green-500 { color: #10b981; }
        .text-purple-500 { color: #8b5cf6; }
        .text-blue-600 { color: #2563eb; }
        .text-green-600 { color: #059669; }
        .text-purple-600 { color: #7c3aed; }
        .text-yellow-500 { color: #f59e0b; }
        .text-light-yellow-500 { color: #E9BB01; }

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