/* ========================================================================== main.css — page-level composition & polish. Load order in : tokens.css -> base.css -> layout.css -> components.css -> main.css ========================================================================== */ /* Anchor targets should clear the sticky header + subnav */ section[id] { scroll-margin-top: calc(var(--header-h) + 56px); } /* Hero image slider (CSS scroll-snap, no JS library) */ .hero-slider { position: relative; } .hero-track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; border-radius: var(--radius-lg); scrollbar-width: none; } .hero-track::-webkit-scrollbar { display: none; } .hero-track > a { flex: 0 0 100%; scroll-snap-align: start; } .hero-track img { width: 100%; aspect-ratio: 3/2; object-fit: cover; } .hero-dots { display: flex; gap: var(--sp-2); justify-content: center; margin-top: var(--sp-2); } .hero-dots button { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.4); border: 0; padding: 0; } .hero-dots button.active { background: var(--c-cta); } /* Utility spacing helpers used sparingly when porting legacy content */ .u-mt-3 { margin-top: var(--sp-3); } .u-mt-4 { margin-top: var(--sp-4); } .u-mb-0 { margin-bottom: 0; } /* Enquire side tab (rotated, desktop only) */ .enquire-tab { position: fixed; right: 0; top: 45%; transform: translateY(-50%) rotate(-90deg) translateX(50%); transform-origin: right center; background: var(--c-cta); color: var(--c-ink); font-weight: var(--fw-semibold); padding: var(--sp-2) var(--sp-4); border-radius: var(--radius-sm) var(--radius-sm) 0 0; z-index: var(--z-float); display: none; } @media (min-width: 992px) { .enquire-tab { display: inline-flex; } } @media print { #header, .subnav, .floating-ctas, .back-to-top, .mobile-bar, .enquire-tab, .modal-overlay { display: none !important; } }