/*
  Responsive overrides and final breakpoint tuning.
  This file intentionally centralizes cross-page adjustments discovered during QA.
  Before adding a new rule, check whether the issue belongs in a component stylesheet first.
*/
.section-head h2,
.content-block h1,
.featured-insight h3,
.suggest-form-card h3 {
  letter-spacing: -0.02em;
}

.section-copy,
.content-block p,
.featured-insight p,
.post-body p {
  line-height: 1.65;
}

.service-premium-card,
.service-card-elevated,
.service-feature-card,
.value-card,
.info-card.feature-card {
  box-shadow: 0 18px 44px rgba(15, 23, 42, 0.07);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.service-premium-card:hover,
.service-card-elevated:hover,
.service-feature-card:hover,
.value-card:hover,
.info-card.feature-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 24px 52px rgba(15, 23, 42, 0.10);
  border-color: rgba(37, 99, 235, 0.18);
}

.featured-insight {
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: 0 24px 60px rgba(2, 12, 27, 0.22);
}

.featured-insight .text-link.light {
  color: #9fd4ff;
  font-weight: 600;
}

.featured-insight .text-link.light:hover {
  color: #c7e6ff;
}

.premium-post,
.premium-post-base,
.post-card.media-post {
  overflow: hidden;
  border: 1px solid #dce6ef;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.06);
  transition: transform .18s ease, box-shadow .18s ease;
}

.premium-post:hover,
.premium-post-base:hover,
.post-card.media-post:hover {
  transform: translateY(-2px);
  box-shadow: 0 24px 48px rgba(15, 23, 42, 0.09);
}

.post-card:not(.tv-blog-card) img {
  transform: scale(1);
  transition: transform .35s ease;
}

.post-card:not(.tv-blog-card):hover img {
  transform: scale(1.02);
}

.contact-page .info-card.feature-card,
.info-grid .info-card.feature-card {
  background: linear-gradient(180deg, rgba(255,255,255,0.96) 0%, rgba(248,251,253,0.96) 100%);
}

.contact-form-fields,
.contact-form-shell,
.login-form-shell {
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.10);
}

.contact-form-fields label > span,
.login-form-shell label > span {
  letter-spacing: -0.01em;
}

.contact-form-fields input,
.contact-form-fields select,
.contact-form-fields textarea,
.login-form-shell input {
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.contact-form-fields input:focus,
.contact-form-fields select:focus,
.contact-form-fields textarea:focus,
.login-form-shell input:focus {
  outline: none;
  border-color: rgba(37, 99, 235, 0.34);
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.10);
}

.cta-btn,
.ghost-btn {
  transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}

.cta-btn:hover,
.ghost-btn:hover {
  transform: translateY(-1px);
}

.cta-btn:active,
.ghost-btn:active {
  transform: translateY(0);
}

.hero-band,
.login-panel,
.suggest-form-card {
  backdrop-filter: blur(6px);
}

.lang-switch {
  flex-wrap: nowrap;
}

.contact-mini-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.contact-form-fields input,
.contact-form-fields select,
.contact-form-fields textarea,
.login-form-grid input,
.suggest-fields input,
.suggest-fields textarea {
  min-height: 52px;
}

.contact-form-fields textarea,
.suggest-fields textarea {
  min-height: 148px;
}

.contact-form-fields button,
.login-form-shell .cta-btn,
.login-actions .ghost-btn,
.suggest-actions .cta-btn,
.suggest-actions .ghost-btn {
  min-height: 52px;
}

@media (max-width: 900px) {
  .page-hero-grid,
  .contact-grid,
  .login-grid {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .contact-mini-grid {
    grid-template-columns: 1fr;
  }

  .contact-panel-soft,
  .login-panel,
  .suggest-form-card {
    padding: 20px;
  }

  .form-grid-two .span-full,
  .suggest-fields .span-full {
    grid-column: 1 / -1;
  }

  .suggest-lock {
    position: relative;
    inset: auto;
    min-height: 180px;
  }
}

@media (max-width: 640px) {
  .site-header .nav-wrap,
  .site-header .nav-wrap-premium,
  .site-header .nav-wrap-responsive,
  .site-header .nav-wrap-spacious {
    padding-left: 16px;
    padding-right: 16px;
  }

  .contact-form-fields,
  .login-form-shell,
  .suggest-form-card {
    border-radius: 22px;
  }

  .contact-form-fields input,
  .contact-form-fields select,
  .contact-form-fields textarea,
  .login-form-grid input,
  .suggest-fields input,
  .suggest-fields textarea {
    font-size: 16px;
  }

  .contact-form-fields .cta-btn,
  .login-form-shell .cta-btn,
  .login-actions .ghost-btn,
  .blog-ghost-btn,
  .auth-gate .cta-btn {
    width: 100%;
  }

  .header-user-chip {
    padding: 10px 12px;
  }
}

img{height:auto}
:focus-visible {
    outline: 2px solid rgba(89,180,106,.65);
    outline-offset: 2px;
    border-radius: 4px
}

a:focus:not(:focus-visible), button:focus:not(:focus-visible) {
    outline: none
}

h1:focus, h1:focus-visible, h2:focus, h2:focus-visible, h3:focus, h3:focus-visible {
    outline: none !important
}
html{scroll-behavior:smooth}
.site-header a,.site-header button,.cta-btn,.ghost-btn,.lang-btn{min-height:44px}
.site-header img,.footer-logo{height:auto}
.home-hero-image img,.page-hero-visual img,.post-card:not(.tv-blog-card) img,.visual-card-elevated img{width:100%;height:100%;object-fit:cover}
.post-card:not(.tv-blog-card) img{aspect-ratio:3/2}
.page-hero-visual img,.visual-card-elevated img{aspect-ratio:3/2}
.home-hero-image img{aspect-ratio:3/2}
.main-nav a,.footer-grid a{overflow-wrap:anywhere}
.header-user-meta strong,.header-user-email{overflow-wrap:anywhere}
@media (max-width: 900px){
  .nav-panel-mobile{padding-bottom:24px}
  .main-nav-responsive a,.header-login,.header-logout,.lang-btn{justify-content:center}
}
@media (max-width: 768px){
  .page-shell{overflow-x:hidden}
  .home-hero-copy h1{font-size:clamp(2.2rem,9vw,3rem)}
  .hero-actions,.login-actions{display:grid;grid-template-columns:1fr;gap:12px}
  .trust-strip-logos{grid-template-columns:1fr 1fr}
  .post-card:not(.tv-blog-card) img{aspect-ratio:16/10}
}
@media (max-width: 520px){
  .site-header{backdrop-filter:blur(12px)}
  .home-hero-floating-card,.hero-floating-card-balanced,.hero-floating-card{position:static;max-width:none;margin:16px}
  .trust-strip-logos{grid-template-columns:1fr}
  .footer-bottom-inner{display:grid;gap:8px;text-align:center}
}

@media (max-width: 1180px) {
  .blog-suggest-wrap .container-wide,
  .suggest-shell,
  .suggest-grid,
  .suggest-form-card,
  .suggest-media {
    min-width: 0;
  }

  .suggest-grid {
    grid-template-columns: 1fr !important;
    gap: 22px;
  }

  .suggest-media {
    position: static !important;
    height: auto !important;
    max-height: none !important;
    width: 100%;
    align-self: auto;
    order: 2;
  }

  .suggest-media img {
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    max-height: none;
    display: block;
    object-fit: cover;
    object-position: center 24%;
    aspect-ratio: 16 / 10;
  }

  .suggest-form-card {
    width: 100%;
    min-width: 0;
    order: 1;
  }

  .auth-login-grid,
  .suggest-fields {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .blog-suggest-wrap,
  .blog-suggest-wrap .container-wide,
  .suggest-shell,
  .suggest-grid,
  .suggest-form-card,
  .suggest-media {
    overflow: hidden;
  }

  .suggest-form-card {
    padding: 18px;
    border-radius: 22px;
  }

  .suggest-form-card h3 {
    font-size: 1.5rem;
    line-height: 1.15;
  }
}

@media (max-width: 1365px){
  .page-shell.menu-open{overflow:hidden}

  .site-header .mobile-menu-toggle,
  .site-header .mobile-menu-toggle-premium{display:inline-flex !important;justify-self:end}

  .site-header .nav-overlay-mobile{display:none !important}
  .site-header .nav-overlay-mobile.open{display:block !important;position:fixed;inset:0;background:rgba(4,10,18,.52);backdrop-filter:blur(4px);z-index:130}

  .site-header .nav-panel-mobile{display:none !important;position:fixed;top:16px;right:16px;width:min(360px,calc(100vw - 24px));max-width:360px;max-height:calc(100vh - 32px);overflow:auto;padding:16px;border-radius:24px;z-index:140;background:linear-gradient(180deg,rgba(7,19,31,.98) 0%,rgba(8,24,41,.98) 100%);box-shadow:0 30px 80px rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.08);transform:translateX(18px);opacity:0;pointer-events:none}

  .site-header .nav-panel-mobile.open{display:grid !important;gap:12px !important;align-items:start;align-content:start;transform:translateX(0);opacity:1;pointer-events:auto}

  .site-header .nav-mobile-header{display:flex !important;align-items:center;justify-content:space-between;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.08)}
  .site-header .nav-mobile-header span{display:block;font-size:11px;font-weight:800;letter-spacing:.14em;color:rgba(255,255,255,.64);margin-bottom:6px}
  .site-header .nav-mobile-header strong{font-size:1rem;color:#fff}
  .site-header .mobile-menu-close{width:40px;height:40px}

  .site-header .main-nav,
  .site-header .main-nav-responsive{display:grid !important;grid-template-columns:1fr !important;gap:6px !important;justify-items:stretch !important}

  .site-header .main-nav a,
  .site-header .main-nav-responsive a{padding:11px 14px !important;border-radius:14px;background:rgba(255,255,255,.04)}

  .site-header .main-nav a.active::after,
  .site-header .main-nav a:hover::after{display:none !important}

  .site-header .actions,
  .site-header .header-actions-mobile,
  .site-header .header-actions-auth{display:grid !important;grid-template-columns:1fr !important;gap:10px !important;width:100% !important;align-items:start !important;justify-items:start !important}

  .site-header .lang-switch{justify-content:flex-start !important;margin:0 !important;transform:none !important}
  .site-header .header-auth-shell,
  .site-header .header-user{width:100% !important;min-width:0 !important}
  .site-header .header-user{display:grid !important;grid-template-columns:1fr !important;gap:8px !important}
  .site-header .header-user-chip{width:100% !important;max-width:none !important}
  .site-header .header-user-email{overflow:hidden !important;text-overflow:ellipsis !important;white-space:nowrap !important}
  .site-header .header-login,
  .site-header .header-logout{width:100% !important;min-width:0 !important;justify-content:center !important;padding-top:9px !important;padding-bottom:9px !important}
}

@media (max-width: 1024px){
  .site-header .nav-wrap-responsive,
    .site-header .nav-wrap-premium,
  .site-header .nav-wrap-spacious{min-height:70px !important;padding-top:6px !important;padding-bottom:6px !important;align-items:center !important}

  .site-header .brand img,
  .site-header .brand-wrap img,
  .site-header .logo-wrap img{max-height:44px !important;width:auto !important}

  .site-header .nav-panel-mobile{top:12px;right:12px;width:min(330px,calc(100vw - 20px));max-height:min(72vh,560px);padding:14px;border-radius:20px}
}

@media (max-width: 768px){
  .site-header .nav-wrap-responsive,
    .site-header .nav-wrap-premium,
  .site-header .nav-wrap-spacious{min-height:64px !important;padding-top:4px !important;padding-bottom:4px !important}

  .site-header .brand img,
  .site-header .brand-wrap img,
  .site-header .logo-wrap img{max-height:40px !important}

  .site-header .nav-panel-mobile{top:10px;right:10px;width:min(310px,calc(100vw - 16px));max-height:min(74vh,520px);padding:12px;border-radius:18px}
}

@media (min-width: 1366px){
  .site-header .mobile-menu-toggle,
  .site-header .mobile-menu-toggle-premium,
  .site-header .nav-overlay-mobile,
  .site-header .nav-overlay-mobile.open{display:none !important}

  .site-header .nav-panel-mobile{display:contents !important;position:static !important;max-height:none !important;overflow:visible !important;padding:0 !important;border:none !important;box-shadow:none !important;background:transparent !important;transform:none !important;opacity:1 !important;pointer-events:auto !important;width:auto !important}

  .site-header .nav-mobile-header,
  .site-header .nav-mobile-footer{display:none !important}

  .site-header .main-nav,
  .site-header .main-nav-responsive{display:flex !important;align-items:center !important;justify-content:center !important;gap:22px !important;visibility:visible !important;opacity:1 !important}

  .site-header .actions,
  .site-header .header-actions-mobile,
  .site-header .header-actions-auth{display:flex !important;align-items:center !important;justify-self:end !important;gap:12px !important;white-space:nowrap !important}
}

.site-header{
  will-change: auto !important;
  transform: none !important;
  backface-visibility: visible !important;
  -webkit-backface-visibility: visible !important;
  transition: background-color .18s ease, border-color .18s ease !important;
}

.site-header.scrolled{
  box-shadow: 0 8px 22px rgba(0,0,0,.12);
}

.site-header,
.site-header.scrolled{
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.site-header{
  background: rgba(7,19,31,.94) !important;
}

@media (max-width: 1365px){
  .site-header .nav-panel-mobile{
    left: auto !important;
    right: 12px !important;
    width: min(360px, calc(100vw - 24px)) !important;
    max-width: calc(100vw - 24px) !important;
    transform: translateX(110%) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    display: block !important;
    top: 12px !important;
    bottom: auto !important;
    max-height: calc(100vh - 24px) !important;
    overflow-y: auto !important;
  }

  .site-header .nav-panel-mobile.open{
    transform: translateX(0) !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    display: block !important;
  }

  .site-header .main-nav,
  .site-header .main-nav-responsive{
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: stretch !important;
  }

  .site-header .main-nav a,
  .site-header .main-nav-responsive a{
    text-align: left !important;
  }

  .site-header .actions,
  .site-header .header-actions-mobile,
  .site-header .header-actions-auth{
    justify-items: stretch !important;
  }

  .site-header .lang-switch{
    justify-content: flex-start !important;
  }
}

@media (min-width: 1366px){
  .site-header .nav-panel-mobile,
  .site-header .nav-panel-mobile.open{
    transform: none !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}

@media (max-width: 1365px){
  .site-header .nav-wrap,
  .site-header .nav-wrap-premium,
  .site-header .nav-wrap-responsive,
  .site-header .nav-wrap-spacious{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
  }

  .site-header .brand,
  .site-header .brand-responsive,
  .site-header .brand-premium{
    flex:0 1 auto !important;
    min-width:0 !important;
    margin-right:auto !important;
  }

  .site-header .mobile-menu-toggle,
  .site-header .mobile-menu-toggle-premium{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    margin-left:auto !important;
    margin-right:0 !important;
    padding:0 !important;
    width:46px !important;
    min-width:46px !important;
    max-width:46px !important;
    height:46px !important;
    flex:0 0 46px !important;
  }
}

.home-hero-actions .cta-btn,
.home-hero-actions .ghost-btn,
.hero-actions .cta-btn,
.hero-actions .ghost-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}

@media (max-width: 768px){
  .home-hero-actions,
    /* CTA buttons stack to avoid uneven widths and awkward text wrapping on narrow screens. */
  .hero-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
  }

  .home-hero-actions .cta-btn,
  .home-hero-actions .ghost-btn,
  .hero-actions .cta-btn,
  .hero-actions .ghost-btn{
    width:100%;
    min-height:48px;
  }
}

.hero-image-home,
.home-hero-image,
.hero-image-base{
  position:relative;
}

.home-hero-floating-card{
  /* Keep the floating card readable without covering the focal area of the hero image. */
  position:absolute;
  left:24px;
  bottom:24px;
  max-width:320px;
  width:calc(100% - 48px);
  padding:20px 22px;
  border-radius:20px;
}

@media (max-width: 900px){
  .home-hero-floating-card{
    /* On tablet/mobile the card is intentionally left-aligned for a more stable editorial layout. */
    left:16px;
    right:16px;
    bottom:20px;
    transform:none;
    width:auto;
    max-width:420px;
    padding:18px;
    border-radius:18px;
  }
}

@media (max-width: 600px){
  .home-hero-floating-card{
    left:12px;
    right:12px;
    bottom:16px;
    width:auto;
    max-width:none;
    padding:16px;
    border-radius:16px;
  }

    /* Home hero — shrink image panel on tablet/mobile so the trust strip and metrics sit closer to the fold */
    @media (max-width: 900px) {
        .home-hero-shell .hero-image-panel,
        .home-hero-image {
            min-height: 320px;
        }
    }

    @media (max-width: 640px) {
        .home-hero-shell .hero-image-panel,
        .home-hero-image {
            min-height: 240px;
        }
    }
    /* Careers — collapse oversized gap between hero band and metrics row */
    .page-shell .wide-hero.page-section-top {
        padding-bottom: 0 !important;
    }

    .page-shell .wide-hero + .section.section-spacing-tight,
    .page-shell section.page-hero + section.section.section-spacing-tight {
        padding-top: 28px !important;
    }

    @media (max-width: 640px) {
        .page-shell .wide-hero + .section.section-spacing-tight,
        .page-shell section.page-hero + section.section.section-spacing-tight {
            padding-top: 18px !important;
        }
    }
  .home-hero-floating-card strong{
    font-size:1.1rem;
    line-height:1.3;
  }

  .home-hero-floating-card p{
    font-size:.95rem;
    line-height:1.5;
    margin-bottom:0;
  }
}
