/* Homepage responsive overlay: thumb-friendly mobile + 10-foot TV UI */
:root {
  font-size: clamp(16px, 0.45vw + 14.5px, 24px);
  --max-width: 1400px;
  --step--1: clamp(0.875rem, 0.82rem + 0.16vw, 1rem);
  --step-0: clamp(1rem, 0.94rem + 0.26vw, 1.125rem);
  --step-1: clamp(1.125rem, 1rem + 0.45vw, 1.375rem);
  --step-2: clamp(1.35rem, 1.12rem + 0.8vw, 1.85rem);
  --step-3: clamp(1.8rem, 1.35rem + 1.4vw, 2.7rem);
  --step-4: clamp(2.2rem, 1.65rem + 2vw, 3.5rem);
  --step-5: clamp(2.8rem, 1.9rem + 3vw, 4.8rem);
  --touch-target: 50px;
  --focus-ring: 4px solid #ffd700;
  --focus-offset: 4px;
  --focus-saffron: #b35900;
  --responsive-gap: clamp(1rem, 1.8vw, 1.8rem);
  --responsive-card-min: 320px;
}

html {
  scroll-padding-top: calc(var(--header-height, 88px) + 1rem);
}

body {
  font-size: var(--step-0);
  line-height: 1.75;
}

.container {
  width: min(var(--max-width), calc(100% - clamp(1rem, 4vw, 3rem)));
  max-width: var(--max-width);
}

.hero h1 {
  font-size: var(--step-5);
  line-height: 1.05;
}

.eyebrow,
.hero .eyebrow,
.language-switcher-label,
.hub-card .tag,
.welcome-chip {
  font-size: var(--step--1);
}

.section h2,
.service-highlight h3 {
  font-size: var(--step-4);
  line-height: 1.08;
}

:where(
  .welcome-panel h2,
  .welcome-support-panel h3,
  .feature-card h3,
  .journey-card h3,
  .quick-link-card strong,
  .essential-link strong,
  .package-copy h3,
  .timings-card h3,
  .hub-card h3,
  .trust-badge h3,
  .blog-card h3,
  .service-item strong
) {
  font-size: var(--step-2);
  line-height: 1.2;
}

:where(
  .section p.lead,
  .hero p,
  .welcome-panel p,
  .welcome-check span,
  .welcome-note p,
  .quick-link-card p,
  .essential-link span,
  .feature-card p,
  .journey-card p,
  .package-copy p,
  .timings-card p,
  .timing-row strong,
  .timing-row span,
  .hub-card p,
  .trust-strip p,
  .blog-card p,
  .testimonial-card p,
  .service-item p,
  .footer p,
  .footer a,
  .site-nav a,
  .submenu a,
  .language-switcher,
  .btn,
  .btn-outline
) {
  font-size: var(--step-0);
}

.hero-actions,
.hero-action-buttons,
.welcome-actions,
.cta-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  gap: clamp(0.75rem, 1.5vw, 1rem);
  align-items: stretch;
}

.hero-actions > *,
.hero-action-buttons > *,
.welcome-actions > *,
.cta-row > * {
  width: 100%;
}

.home-intro-grid,
.quick-links-grid,
.essential-links,
.journey-grid,
.hub-card-grid,
.services-layout,
.timings-wrapper,
.trust-badges,
.testimonials-grid,
.blog-grid {
  gap: var(--responsive-gap);
}

.home-intro-grid,
.quick-links-grid,
.services-layout,
.timings-wrapper,
.hub-card-grid,
.trust-badges,
.testimonials-grid,
.blog-grid {
  grid-template-columns: repeat(auto-fit, minmax(var(--responsive-card-min), 1fr));
}

.essential-links,
#visit .packages-grid {
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

.essential-links,
.quick-links-grid,
#visit .packages-grid {
  align-items: stretch;
}

:where(
  .quick-link-card,
  .essential-link,
  .feature-card,
  .journey-card,
  .package-card,
  .hub-card,
  .timings-card,
  .trust-badge,
  .blog-card,
  .testimonial-card
) {
  height: 100%;
}

.essential-link,
.quick-link-card,
.feature-card,
.journey-card,
.package-card,
.hub-card {
  min-width: 0;
}

#visit .package-card {
  overflow: hidden;
}

#visit .package-card > img {
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background: rgba(200, 165, 90, 0.12);
}

.service-highlight img {
  aspect-ratio: 16 / 10;
  height: auto;
}

:where(
  .btn,
  .btn-outline,
  .menu-toggle,
  .nav-group-toggle,
  .site-nav > a,
  .submenu a,
  .language-switcher-links a,
  .essential-link,
  .quick-link-card,
  .feature-card,
  .journey-card,
  .package-card,
  .hub-card,
  .blog-card,
  .footer a,
  .guruswamy-fab-action,
  .guruswamy-toggle,
  .ss-home-float
) {
  min-height: var(--touch-target);
}

:where(
  a,
  button,
  input,
  select,
  textarea,
  [tabindex]:not([tabindex="-1"])
):focus-visible {
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
  box-shadow: 0 0 0 0.35rem rgba(255, 215, 0, 0.18);
}

:where(
  .btn,
  .btn-outline,
  .menu-toggle,
  .nav-group-toggle,
  .site-nav > a,
  .submenu a,
  .language-switcher-links a,
  .essential-link,
  .quick-link-card,
  .feature-card,
  .journey-card,
  .package-card,
  .hub-card,
  .blog-card,
  .footer a,
  .guruswamy-fab-action,
  .guruswamy-toggle,
  .ss-home-float
):focus-visible {
  background-color: var(--focus-saffron) !important;
  color: #ffffff !important;
  transform: scale(1.02);
}

:where(
  .essential-link,
  .quick-link-card,
  .feature-card,
  .journey-card,
  .hub-card,
  .blog-card,
  .footer a
):focus-visible :where(h3, strong, p, span) {
  color: inherit !important;
}

:where(
  .btn,
  .btn-outline,
  .menu-toggle,
  .nav-group-toggle,
  .site-nav > a,
  .submenu a,
  .language-switcher-links a,
  .essential-link,
  .quick-link-card,
  .feature-card,
  .journey-card,
  .package-card,
  .hub-card,
  .blog-card,
  .footer a,
  .guruswamy-fab-action,
  .guruswamy-toggle,
  .ss-home-float
) {
  transition:
    transform 0.2s ease,
    background-color 0.2s ease,
    color 0.2s ease,
    box-shadow 0.2s ease;
}

@media (max-width: 768px) {
  body {
    padding-bottom: clamp(7rem, 22vw, 9rem);
  }

  .hero-actions,
  .hero-action-buttons,
  .welcome-actions,
  .cta-row {
    grid-template-columns: 1fr;
  }

  .timing-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
  }

  .timing-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.55rem;
    padding: 1rem;
    border: 1px solid rgba(200, 165, 90, 0.24);
    border-radius: 18px;
    background: rgba(255, 250, 241, 0.82);
  }

  .timing-row:last-child {
    padding-bottom: 1rem;
  }

  .timing-row span {
    text-align: left;
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    background: rgba(33, 66, 50, 0.1);
  }

  .floating-action-bar,
  .guruswamy-chat-shell {
    left: max(0.75rem, env(safe-area-inset-left));
    right: max(0.75rem, env(safe-area-inset-right));
    bottom: max(0.75rem, env(safe-area-inset-bottom));
    width: auto;
    justify-items: stretch;
    gap: 0.55rem;
  }

  .guruswamy-fab-strip {
    width: 100%;
  }

  .guruswamy-fab-action,
  .guruswamy-toggle {
    min-height: 3.25rem;
  }
}

@media (max-width: 359px) {
  .home-intro-grid,
  .quick-links-grid,
  .essential-links,
  #visit .packages-grid,
  .services-layout,
  .timings-wrapper,
  .hub-card-grid,
  .trust-badges,
  .testimonials-grid,
  .blog-grid {
    grid-template-columns: 1fr;
  }
}

/* Smart TV & 4K Monitor Optimization */
@media (min-width: 2560px) {
  :root {
    font-size: 150%;
    --max-width: 1800px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  :where(
    .btn,
    .btn-outline,
    .menu-toggle,
    .nav-group-toggle,
    .site-nav > a,
    .submenu a,
    .language-switcher-links a,
    .essential-link,
    .quick-link-card,
    .feature-card,
    .journey-card,
    .package-card,
    .hub-card,
    .blog-card,
    .footer a,
    .guruswamy-fab-action,
    .guruswamy-toggle,
    .ss-home-float
  ) {
    transition: none;
  }

  :where(
    .btn,
    .btn-outline,
    .menu-toggle,
    .nav-group-toggle,
    .site-nav > a,
    .submenu a,
    .language-switcher-links a,
    .essential-link,
    .quick-link-card,
    .feature-card,
    .journey-card,
    .package-card,
    .hub-card,
    .blog-card,
    .footer a,
    .guruswamy-fab-action,
    .guruswamy-toggle,
    .ss-home-float
  ):focus-visible {
    transform: none;
  }
}