/* ==========================================================================
   responsive.css
   Comprehensive cross-device + cross-browser responsive layer.
   Loaded last so its rules win on tied specificity. Breakpoints:
     - tablet:        ≤ 1100px
     - mobile-large:  ≤ 900px
     - mobile:        ≤ 640px
     - mobile-small:  ≤ 480px
     - mobile-tiny:   ≤ 360px
   Plus safe-area + iOS dynamic-viewport fixes.
   ========================================================================== */

/* ─── Global defensive defaults ────────────────────────────────────────────── */

html, body {
	overflow-x: hidden;
	-webkit-text-size-adjust: 100%;
	    -ms-text-size-adjust: 100%;
	        text-size-adjust: 100%;
}

/* ─── Mobile nav drawer & hamburger — strict display:none on desktop ──────── */
/* These rules live in responsive.css (loaded last) so they win the cascade
   even if components.css fails to apply. */
.mobile-nav,
#mobileNav { display: none !important; }
.header-burger,
#headerBurger { display: none !important; }

@media (max-width: 900px) {
	.mobile-nav,
	#mobileNav { display: flex !important; }
	.header-burger,
	#headerBurger { display: inline-flex !important; }
	.header .header-cta { display: none !important; }
}

img, video, svg, iframe {
	max-width: 100%;
	height: auto;
}

/* Long words and URLs should wrap rather than overflow */
h1, h2, h3, h4, h5, .hero-headline, .sec-title, .cta h2, .pq blockquote {
	overflow-wrap: anywhere;
	word-break: break-word;
	hyphens: manual;
}

/* iOS dynamic viewport — use small/dynamic units when supported, fall back to vh */
@supports (height: 100svh) {
	.home .hero,
	.page-about .hero,
	.page-contact .hero,
	.page-service .hero {
		min-height: 100svh;
	}
}

/* Safe-area inset for iPhone notch / Dynamic Island */
@supports (padding: env(safe-area-inset-top)) {
	.header {
		padding-top: max(22px, env(safe-area-inset-top));
		padding-left: max(var(--pad), env(safe-area-inset-left));
		padding-right: max(var(--pad), env(safe-area-inset-right));
	}
	.floating-cta {
		right: max(20px, env(safe-area-inset-right));
		bottom: max(20px, env(safe-area-inset-bottom));
	}
	.cta {
		padding-left: max(var(--pad), env(safe-area-inset-left));
		padding-right: max(var(--pad), env(safe-area-inset-right));
	}
}


/* ==========================================================================
   ≤ 1100px  — tablet portrait
   ========================================================================== */
@media (max-width: 1100px) {
	.home .hero-bot { grid-template-columns: 1fr; gap: 24px; }
	.home .hero-reel { width: 100%; max-width: 360px; }
	.home .approach .head { grid-template-columns: 1fr; gap: 24px; }
	.home .pillar { grid-template-columns: 100px 1fr; gap: 32px; }
	.home .pillar .img { display: none; }
	.home .work .head { grid-template-columns: 1fr; gap: 16px; }
	.page-about .story-inner { grid-template-columns: 1fr; gap: 32px; }
	.page-about .story h2 { position: static; }
	.page-contact .hero { grid-template-columns: 1fr; min-height: auto; }
	.page-contact .hero-left { padding-bottom: 60px; }
	.page-service .caps-grid { grid-template-columns: 1fr; gap: 36px; }
	.page-service .fcase, .page-service .fcase--alt { grid-template-columns: 1fr; gap: 32px; }
	.page-service .fcase--alt .body { order: 0; }
	.page-service.svc-website-development .tech-grid { grid-template-columns: repeat(3, 1fr); }
}


/* ==========================================================================
   ≤ 900px  — mobile-large / small tablet
   ========================================================================== */
@media (max-width: 900px) {
	/* Header — wordmark hidden, logo + CTA only */
	.header { padding: 18px var(--pad); }
	.header .logo img.mark,
	.header .logo img.mark--img { height: 36px !important; max-height: 36px !important; max-width: 160px !important; }
	.header-cta { padding: 10px 18px !important; font-size: 13px !important; }

	/* Home hero */
	.home .hero { padding: 100px var(--pad) 40px; }
	.home .hero-headline { font-size: clamp(34px, 9vw, 64px); }
	.home .hero-headline .rotator { min-width: auto; }
	.home .hero-bot { font-size: 10px; }

	.home .manifesto { padding: 64px var(--pad); }
	.home .mani-grid { grid-template-columns: 1fr; gap: 32px; }
	.home .mani-grid h2 { font-size: clamp(32px, 8vw, 56px); margin-top: 0; }
	.home .mani-body p { font-size: 16px; }
	.home .pq { margin-top: 56px; padding-left: 24px; }
	.home .pq blockquote { font-size: clamp(22px, 5.5vw, 40px); }
	.home .pq::before { width: 28px; }

	.home .approach { padding: 64px var(--pad); }
	.home .approach h2 { font-size: clamp(34px, 8vw, 64px); }
	.home .approach .head { margin-bottom: 48px; }
	.home .pillar { grid-template-columns: 1fr; gap: 16px; padding: 40px 0; }
	.home .pillar .n { font-size: 64px; opacity: .22; }
	.home .pillar h3 { font-size: clamp(26px, 6vw, 40px); }

	.home .work { padding: 64px var(--pad); }
	.home .work h2 { font-size: clamp(32px, 8vw, 60px); }
	.home .work-grid { grid-template-columns: 1fr; gap: 32px; }
	.home .work-foot { flex-direction: column; align-items: flex-start; gap: 12px; padding-top: 24px; margin-top: 48px; }

	.home .clients { padding: 56px 0; }
	.home .clients .head { flex-direction: column; align-items: flex-start; gap: 16px; margin-bottom: 32px; }
	.home .clients h2 { font-size: clamp(28px, 7vw, 48px); }

	.home .recog { padding: 56px var(--pad); }
	.home .recog h2 { font-size: clamp(32px, 8vw, 60px); }
	.home .award { grid-template-columns: 1fr; gap: 4px; padding: 20px 0; font-size: 17px; }
	.home .award .ar { display: none; }

	/* About */
	.page-about .hero { padding: 100px var(--pad) 56px; min-height: auto; gap: 40px; }
	.page-about .hero h1 { font-size: clamp(40px, 11vw, 88px); }
	.page-about .hero .footer-row { grid-template-columns: 1fr; gap: 20px; padding-top: 24px; }
	.page-about .hero .footer-row .stats { justify-content: flex-start; gap: 20px; flex-wrap: wrap; }
	.page-about .hero .footer-row .stats > div { text-align: left; }
	.page-about .story { padding: 56px var(--pad); }
	.page-about .princ { padding: 56px var(--pad); }
	.page-about .princ h2 { font-size: clamp(32px, 8vw, 60px); }
	.page-about .princ-row { grid-template-columns: 1fr; gap: 14px; padding: 32px 0; }
	.page-about .princ-row .n { font-size: 44px; }
	.page-about .team { padding: 56px var(--pad); }
	.page-about .team h2 { font-size: clamp(32px, 8vw, 60px); }
	.page-about .team-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
	.page-about .team-stats { grid-template-columns: repeat(2, 1fr); margin-top: 56px; }
	.page-about .tline { padding: 56px var(--pad); }
	.page-about .tline h2 { font-size: clamp(32px, 8vw, 60px); }
	.page-about .year { grid-template-columns: 1fr; gap: 8px; padding: 24px 0; }
	.page-about .clients { padding: 56px var(--pad); }
	.page-about .cl-marq { grid-template-columns: repeat(3, 1fr); }

	/* Contact */
	.page-contact .hero-left { padding: 100px var(--pad) 48px; gap: 32px; }
	.page-contact .hero-left h1 { font-size: clamp(40px, 10vw, 88px); }
	.page-contact .hero-right { padding: 48px var(--pad); }
	.page-contact .form-frame { gap: 20px; }
	.page-contact .form-frame h2 { font-size: clamp(26px, 6vw, 36px); }
	.page-contact .row2 { grid-template-columns: 1fr; gap: 18px; }
	.page-contact .svc-grid { grid-template-columns: repeat(2, 1fr); }
	.page-contact .submit-row { flex-direction: column; align-items: flex-start; gap: 12px; }
	.page-contact .submit-row .btn { width: 100%; justify-content: center; }
	.page-contact .office { padding: 56px var(--pad); }
	.page-contact .office h2 { font-size: clamp(28px, 7vw, 48px); }
	.page-contact .office .head { grid-template-columns: 1fr; gap: 16px; margin-bottom: 32px; }
	.page-contact .off-grid { grid-template-columns: 1fr; }
	.page-contact .off-info { padding: 32px 24px; gap: 24px; }
	.page-contact .faq { padding: 56px var(--pad); }
	.page-contact .faq h2 { font-size: clamp(28px, 7vw, 48px); }
	.page-contact .contact-blocks { grid-template-columns: 1fr; }
	.page-contact .contact-blocks > div { border-right: 0; border-bottom: 1px solid rgba(245,242,236,.18); padding: 16px 0; }
	.page-contact .contact-blocks > div:last-child { padding-left: 0; border-bottom: 0; }

	/* Service archive */
	.archive-services { padding: 120px var(--pad) 56px; }
	.archive-services .archive-head h1 { font-size: clamp(32px, 8vw, 60px); }
	.archive-services .svc-row { grid-template-columns: 60px 1fr; gap: 16px; padding: 32px 0; }
	.archive-services .svc-row .arr { grid-column: 1 / -1; justify-self: start; padding-top: 6px; }

	/* Service single (all variants) */
	.page-service .hero { padding: 100px var(--pad) 48px; min-height: auto; }
	.page-service.svc-branding .hero { padding: 100px var(--pad) 48px; }
	.page-service.svc-branding .hero-mid { padding: 32px 0; }
	.page-service.svc-branding .hero h1 { font-size: clamp(38px, 10vw, 80px); }
	.page-service.svc-branding .hero-bot { grid-template-columns: 1fr; gap: 16px; }
	.page-service.svc-website-development .hero,
	.page-service.svc-social-media-marketing .hero,
	.page-service.svc-it-training .hero { grid-template-columns: 1fr; }
	.page-service.svc-website-development .hero-left,
	.page-service.svc-website-development .hero-right,
	.page-service.svc-social-media-marketing .hero-left,
	.page-service.svc-social-media-marketing .hero-right,
	.page-service.svc-it-training .hero-left,
	.page-service.svc-it-training .hero-right { padding: 100px var(--pad) 40px; }
	.page-service.svc-website-development .hero-left,
	.page-service.svc-social-media-marketing .hero-left,
	.page-service.svc-it-training .hero-left { padding-bottom: 56px; }
	.page-service.svc-website-development .hero-left .stats-row,
	.page-service.svc-social-media-marketing .hero-left .stats-row,
	.page-service.svc-it-training .hero-left .stats-row { gap: 24px; flex-wrap: wrap; }
	.page-service.svc-performance-marketing .hero { grid-template-columns: 1fr; gap: 32px; padding: 100px var(--pad) 48px; }
	.page-service.svc-performance-marketing .hero .meta { position: static; margin-bottom: 24px; }
	.page-service.svc-performance-marketing .hero h1 { font-size: clamp(38px, 10vw, 80px); }
	.page-service.svc-performance-marketing .hero .stats-row { gap: 24px; flex-wrap: wrap; margin-top: 36px; padding-top: 18px; }

	.page-service .caps { padding: 56px var(--pad); }
	.page-service .caps-grid { grid-template-columns: 1fr; gap: 36px; }
	.page-service .caps-grid h2 { font-size: clamp(32px, 8vw, 64px); }
	.page-service.svc-branding .caps-list { grid-template-columns: 1fr; }
	.page-service.svc-branding .caps-list .cap:nth-last-child(-n+2) { border-bottom: 0; }
	.page-service.svc-branding .caps-list .cap:last-child { border-bottom: 1px solid var(--stone); }

	.page-service.svc-branding .process { padding: 56px 0; }
	.page-service.svc-branding .process .head { grid-template-columns: 1fr; padding: 0 var(--pad); margin-bottom: 32px; }
	.page-service.svc-branding .process h2 { font-size: clamp(32px, 8vw, 60px); }
	.page-service.svc-branding .process-strip { grid-template-columns: repeat(5, 80%); padding: 0 var(--pad); }
	.page-service.svc-branding .process-step { min-height: 380px; padding: 0 24px 0 24px; }

	.page-service .featured { padding: 56px var(--pad); }
	.page-service .featured h2 { font-size: clamp(32px, 8vw, 60px); }
	.page-service .featured .head { grid-template-columns: 1fr; gap: 16px; margin-bottom: 40px; }
	.page-service .fcase, .page-service .fcase--alt { grid-template-columns: 1fr; gap: 24px; padding: 32px 0; }
	.page-service .fcase--alt .body { order: 0; }

	.page-service.svc-branding .pq-sec { padding: 56px var(--pad); }
	.page-service.svc-branding .pq-sec .pq blockquote { font-size: clamp(24px, 6.5vw, 48px); }

	.page-service.svc-website-development .tech { padding: 56px var(--pad); }
	.page-service.svc-website-development .tech-grid { grid-template-columns: repeat(2, 1fr); }
	.page-service.svc-website-development .tech .head { grid-template-columns: 1fr; gap: 16px; margin-bottom: 32px; }
	.page-service.svc-website-development .build { padding: 56px var(--pad); }
	.page-service.svc-website-development .phase { grid-template-columns: 1fr; gap: 16px; padding: 32px 0; }
	.page-service.svc-website-development .phase .stat { padding-left: 0; border-left: 0; border-top: 1px solid var(--stone); padding-top: 16px; margin-top: 8px; }
	.page-service.svc-website-development .perf { padding: 56px var(--pad); }
	.page-service.svc-website-development .perf-grid { grid-template-columns: repeat(2, 1fr); }
	.page-service.svc-website-development .perf-stat { padding: 32px 20px; }
	.page-service.svc-website-development .perf-foot { flex-direction: column; gap: 8px; align-items: flex-start; }

	.page-service.svc-performance-marketing .channels { padding: 56px var(--pad); }
	.page-service.svc-performance-marketing .channels .head { grid-template-columns: 1fr; gap: 16px; margin-bottom: 36px; }
	.page-service.svc-performance-marketing .ch-grid { grid-template-columns: 1fr; }
	.page-service.svc-performance-marketing .ch { padding: 32px 24px; min-height: auto; }
	.page-service.svc-performance-marketing .funnel { padding: 56px var(--pad); }
	.page-service.svc-performance-marketing .funnel-grid { grid-template-columns: 1fr; gap: 36px; }
	.page-service.svc-performance-marketing .fr { grid-template-columns: 1fr 80px; gap: 12px; }
	.page-service.svc-performance-marketing .fr .stage { grid-column: 1 / -1; }
	.page-service.svc-performance-marketing .method { padding: 56px var(--pad); }
	.page-service.svc-performance-marketing .method-grid { grid-template-columns: 1fr; }
	.page-service.svc-performance-marketing .rule { padding: 32px 24px; }
	.page-service.svc-performance-marketing .bigstat { padding: 56px var(--pad); }
	.page-service.svc-performance-marketing .bigstat-inner { grid-template-columns: 1fr; gap: 32px; }
	.page-service.svc-performance-marketing .bigstat .num { font-size: clamp(80px, 22vw, 200px); }
	.page-service.svc-performance-marketing .dash { padding: 56px var(--pad); }
	.page-service.svc-performance-marketing .dash-grid { grid-template-columns: repeat(2, 1fr); }
	.page-service.svc-performance-marketing .dash-tile { padding: 20px 16px; }

	.page-service.svc-social-media-marketing .plats { padding: 56px var(--pad); }
	.page-service.svc-social-media-marketing .plats .head { grid-template-columns: 1fr; gap: 16px; margin-bottom: 36px; }
	.page-service.svc-social-media-marketing .plats-grid { grid-template-columns: repeat(2, 1fr); }
	.page-service.svc-social-media-marketing .plat { padding: 28px 18px; min-height: auto; }
	.page-service.svc-social-media-marketing .plat .pn { font-size: 18px; }
	.page-service.svc-social-media-marketing .pillars { padding: 56px var(--pad); }
	.page-service.svc-social-media-marketing .pillars-grid { grid-template-columns: 1fr; }
	.page-service.svc-social-media-marketing .pillars-grid .pillar { padding: 28px 24px; min-height: auto; }
	.page-service.svc-social-media-marketing .gstat { padding: 56px var(--pad); }
	.page-service.svc-social-media-marketing .gstat-grid { grid-template-columns: repeat(2, 1fr); }
	.page-service.svc-social-media-marketing .gst { padding: 28px 20px; }
	.page-service.svc-social-media-marketing .gst .num { font-size: clamp(40px, 11vw, 80px); }

	.page-service.svc-it-training .tracks { padding: 56px var(--pad); }
	.page-service.svc-it-training .tracks .head { grid-template-columns: 1fr; gap: 16px; margin-bottom: 36px; }
	.page-service.svc-it-training .track { grid-template-columns: 1fr; gap: 8px; padding: 24px 0; }
	.page-service.svc-it-training .track:hover { padding-left: 0; }
	.page-service.svc-it-training .track .arr { display: none; }
	.page-service.svc-it-training .track .meta { grid-column: auto; flex-direction: row; }
	.page-service.svc-it-training .track .price { grid-column: auto; text-align: left; }
	.page-service.svc-it-training .curr { padding: 56px var(--pad); }
	.page-service.svc-it-training .curr-grid { grid-template-columns: 1fr; }
	.page-service.svc-it-training .formats { padding: 56px var(--pad); }
	.page-service.svc-it-training .fm-grid { grid-template-columns: 1fr; gap: 16px; }
	.page-service.svc-it-training .fmt { padding: 28px 24px; min-height: auto; }
	.page-service.svc-it-training .cohort { padding: 56px var(--pad); }
	.page-service.svc-it-training .coh { grid-template-columns: 1fr; gap: 8px; padding: 20px 0; }
	.page-service.svc-it-training .coh .cta-mini { width: 100%; text-align: center; padding: 12px 18px; }
	.page-service.svc-it-training .tlist { padding: 56px var(--pad); }
	.page-service.svc-it-training .t-grid { grid-template-columns: 1fr; gap: 16px; }
	.page-service.svc-it-training .testi { padding: 24px 22px; }
	.page-service.svc-it-training .testi blockquote { font-size: 18px; }

	/* CTA universal */
	.cta { padding: 72px var(--pad); }
	.cta h2 { font-size: clamp(36px, 9vw, 80px); }
	.cta-row { flex-direction: column; align-items: flex-start; gap: 24px; }
	.cta-row .meta { text-align: left; }

	/* Footer */
	.footer-cols { grid-template-columns: repeat(2, 1fr); gap: 36px; padding: 48px var(--pad); }
	.footer-word { font-size: clamp(80px, 22vw, 220px); padding: 48px 0 20px; }
	.footer-copy { padding: 22px var(--pad); }
}


/* ==========================================================================
   ≤ 640px  — mobile portrait
   ========================================================================== */
@media (max-width: 640px) {
	:root { --pad: 20px; }

	.header { padding: 14px var(--pad); }
	.header .logo img.mark,
	.header .logo img.mark--img { height: 32px !important; max-height: 32px !important; max-width: 130px !important; }
	.header-cta { padding: 8px 14px !important; font-size: 12.5px !important; }

	.home .hero { padding: 90px var(--pad) 32px; }
	.home .hero-meta { font-size: 10px; gap: 12px; flex-direction: column; align-items: flex-start; }
	.home .hero-meta .right { text-align: left; }
	.home .hero-mid { padding: 32px 0; }
	.home .hero-headline { font-size: clamp(30px, 9vw, 56px); }
	.home .hero-bot { padding-top: 16px; }

	.home .pq { margin-top: 40px; padding-left: 18px; }

	.home .approach .head h2,
	.home .work h2,
	.home .recog h2 { font-size: clamp(28px, 8vw, 50px); margin-top: 8px; }
	.home .pillar h3 { font-size: clamp(22px, 6vw, 32px); }
	.home .pillar p { font-size: 15px; }

	.home .clients h2 { font-size: clamp(24px, 6vw, 40px); }
	.home .award { font-size: 16px; padding: 16px 0; }
	.home .award .y { font-size: 12px; }

	.page-about .team-grid { grid-template-columns: 1fr; gap: 24px; }
	.page-about .team-stats { grid-template-columns: repeat(2, 1fr); }
	.page-about .cl-marq { grid-template-columns: repeat(2, 1fr); }
	.page-about .hero h1 { font-size: clamp(36px, 11vw, 72px); }
	.page-about .hero .footer-row .stats { gap: 18px; }
	.page-about .hero .footer-row .stats > div { font-size: 10px; }
	.page-about .hero .footer-row .stats b { font-size: 28px; }

	.page-contact .hero-left h1 { font-size: clamp(36px, 11vw, 72px); }
	.page-contact .form-frame h2 { font-size: clamp(24px, 6vw, 32px); }
	.page-contact .svc-grid { grid-template-columns: 1fr 1fr; gap: 6px; }
	.page-contact .svc-chip span { padding: 9px 8px; font-size: 10px; }

	.page-service.svc-branding .hero h1,
	.page-service.svc-website-development .hero-left h1,
	.page-service.svc-performance-marketing .hero h1,
	.page-service.svc-social-media-marketing .hero-left h1,
	.page-service.svc-it-training .hero-left h1 { font-size: clamp(34px, 10vw, 64px); }
	.page-service .caps-grid h2 { font-size: clamp(28px, 7vw, 56px); }
	.page-service.svc-website-development .tech-grid { grid-template-columns: 1fr; }
	.page-service.svc-performance-marketing .dash-grid { grid-template-columns: 1fr; }
	.page-service.svc-performance-marketing .bigstat .num { font-size: clamp(64px, 22vw, 160px); }
	.page-service.svc-social-media-marketing .plats-grid { grid-template-columns: 1fr; }
	.page-service.svc-social-media-marketing .gstat-grid { grid-template-columns: 1fr; }
	.page-service.svc-website-development .perf-grid { grid-template-columns: 1fr; }

	.cta h2 { font-size: clamp(32px, 8vw, 64px); }

	.footer-cols { grid-template-columns: 1fr; gap: 28px; padding: 40px var(--pad); }
	.footer-word { font-size: clamp(70px, 22vw, 180px); padding: 40px 0 16px; }
	.footer-copy { flex-direction: column; align-items: flex-start; gap: 10px; padding: 20px var(--pad); }

	.floating-cta { right: 12px; bottom: 12px; gap: 6px; }
	.floating-cta__btn { width: 42px; height: 42px; }
	.floating-cta__btn svg { margin: 0 10px; width: 20px; height: 20px; }
	.floating-cta__btn:hover { width: 142px; }
}


/* ==========================================================================
   ≤ 480px  — small mobile
   ========================================================================== */
@media (max-width: 480px) {
	:root { --pad: 18px; }

	.header { padding: 12px var(--pad); }
	.header .logo img.mark,
	.header .logo img.mark--img { height: 28px !important; max-height: 28px !important; max-width: 120px !important; }
	.header-cta { padding: 7px 12px !important; font-size: 11.5px !important; letter-spacing: 0; }
	.header-cta .arr { display: none; }

	.home .hero-headline { font-size: clamp(28px, 9vw, 44px); }
	.home .mani-grid h2 { font-size: clamp(26px, 8vw, 44px); }
	.home .approach h2 { font-size: clamp(26px, 8vw, 44px); }
	.home .work h2 { font-size: clamp(26px, 8vw, 44px); }
	.home .recog h2 { font-size: clamp(26px, 8vw, 44px); }
	.home .clients h2 { font-size: clamp(22px, 7vw, 38px); }

	.page-about .hero h1,
	.page-contact .hero-left h1,
	.page-service.svc-branding .hero h1,
	.page-service.svc-website-development .hero-left h1,
	.page-service.svc-performance-marketing .hero h1,
	.page-service.svc-social-media-marketing .hero-left h1,
	.page-service.svc-it-training .hero-left h1 { font-size: clamp(28px, 9vw, 52px); }

	.cta h2 { font-size: clamp(28px, 8vw, 52px); }
	.cta { padding: 56px var(--pad); }

	.footer-word { font-size: clamp(60px, 22vw, 140px); }
}


/* ==========================================================================
   ≤ 360px  — extra-small (older Android, iPhone SE 1st gen)
   ========================================================================== */
@media (max-width: 360px) {
	:root { --pad: 16px; }
	.home .hero-headline { font-size: clamp(24px, 8vw, 36px); }
	.cta h2 { font-size: clamp(24px, 8vw, 44px); }
	.header-cta { padding: 6px 10px !important; font-size: 11px !important; }
	.floating-cta__btn { width: 40px; height: 40px; }
	.floating-cta__btn svg { margin: 0 9px; width: 18px; height: 18px; }
}


/* ==========================================================================
   Cross-browser fallbacks
   ========================================================================== */

/* Older browsers without aspect-ratio: provide explicit aspect using padding-bottom hack */
@supports not (aspect-ratio: 1) {
	.case .img-wrap,
	.fcase .img-wrap { position: relative; height: 0; padding-bottom: 75%; }
	.case .img-wrap > *,
	.fcase .img-wrap > * { position: absolute; inset: 0; width: 100%; height: 100%; }
}

/* Safari < 16: backdrop-filter with -webkit- prefix */
.header.is-scrolled,
.header.is-light.is-scrolled,
.topbar { -webkit-backdrop-filter: saturate(140%) blur(12px); }

/* Safari iOS: prevent zoom on input focus by ensuring 16px minimum on inputs */
@media (max-width: 900px) {
	.field input,
	.field textarea,
	.field select,
	.field .ctl,
	.page-contact .form-frame .field input,
	.page-contact .form-frame .field textarea,
	.page-contact .form-frame .field select { font-size: 16px !important; }
}

/* Reduce motion globally if user prefers */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
	.marquee .track { animation: none !important; transform: none !important; }
}

/* Print — keep at the end */
@media print {
	.header, .footer, .floating-cta, .cta, .grain::after { display: none !important; }
	* { background: #fff !important; color: #000 !important; box-shadow: none !important; }
	a[href]::after { content: " (" attr(href) ")"; font-size: 11px; color: #555; }
}