/* Launch hardening: post-launch UX / mobile / link fixes */
:root { --nav-height: 81px; }
html { max-width: 100%; overflow-x: clip; scroll-padding-top: calc(var(--nav-height) + 12px); }
body { max-width: 100%; overflow-x: clip; }
img, svg, video, canvas { max-width: 100%; }
.hero, .hero-left, .hero-right, .hero-graphic-container, .about, .services, .process, .testimonials, .contact, footer,
.services-grid, .steps, .testi-grid, .footer-top, .frow { min-width: 0; }
.section-p, .svc-desc, .step-desc, .testi-text, .cinfo-val, .footer-tagline, .footer-copy { overflow-wrap: anywhere; }

/* Accessible mobile navigation */
.mobile-menu-btn {
  display:none; width:46px; height:46px; border:1px solid rgba(72,89,79,.16); border-radius:50%;
  background:#FFFDF9; align-items:center; justify-content:center; flex-direction:column; gap:5px;
  padding:0; color:var(--navy); box-shadow:none; -webkit-tap-highlight-color:transparent;
}
.menu-line { width:20px; height:2px; border-radius:10px; background:currentColor; transition:transform .22s ease, opacity .2s ease; }
nav.nav-open .mobile-menu-btn .menu-line:nth-child(1){ transform:translateY(7px) rotate(45deg); }
nav.nav-open .mobile-menu-btn .menu-line:nth-child(2){ opacity:0; }
nav.nav-open .mobile-menu-btn .menu-line:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* Form success/error feedback */
.form-status { display:none; margin-top:16px; padding:14px 16px; border-radius:12px; font-size:.92rem; line-height:1.55; border:1px solid transparent; }
.form-status.is-visible { display:block; }
.form-status[data-state="success"] { background:#EDF5EB; border-color:#BCD2B8; color:#3F6045; }
.form-status[data-state="error"] { background:#FBEEEE; border-color:#E4B8B8; color:#7D3E3E; }
.fsubmit[disabled] { opacity:.65; cursor:wait; transform:none !important; }
.finput:focus-visible, .fselect:focus-visible, .ftextarea:focus-visible, a:focus-visible, button:focus-visible {
  outline:3px solid rgba(200,135,133,.45); outline-offset:3px;
}
.footer-home-link { display:inline-flex; flex-direction:column; text-decoration:none; color:inherit; }
.footer-bottom a { color:rgba(255,255,255,.58); text-decoration:none; }
.footer-bottom a:hover { color:#fff; }

/* Prevent the decorative 3D hero from forcing overflow. */
.hero-graphic-container { overflow:hidden !important; }
.hero-3d-scene { max-width:100%; }

@media (max-width: 920px) {
  :root { --nav-height: 73px; }
  nav { min-height:var(--nav-height); padding:10px 18px !important; }
  .nav-logo-img { width:44px !important; height:44px !important; }
  .nav-logo-name { font-size:1.05rem !important; }
  .nav-logo-sub { font-size:.55rem !important; letter-spacing:.08em !important; }
  .mobile-menu-btn { display:flex; margin-left:auto; position:relative; z-index:204; flex:0 0 auto; }
  .nav-links {
    display:flex !important; position:fixed; z-index:203; top:calc(var(--nav-height) + 8px); left:14px; right:14px;
    max-height:calc(100dvh - var(--nav-height) - 24px); overflow-y:auto; flex-direction:column; align-items:stretch !important;
    gap:0 !important; padding:10px; margin:0; background:rgba(255,253,249,.985); border:1px solid rgba(72,89,79,.12);
    border-radius:18px; box-shadow:0 18px 50px rgba(47,60,53,.16); opacity:0; visibility:hidden; pointer-events:none;
    transform:translateY(-8px) scale(.985); transform-origin:top right; transition:opacity .18s ease, transform .18s ease, visibility .18s;
  }
  nav.nav-open .nav-links { opacity:1; visibility:visible; pointer-events:auto; transform:none; }
  .nav-links li { width:100%; }
  .nav-links a { display:flex; width:100%; min-height:48px; align-items:center; padding:11px 14px; font-size:.98rem !important; border-radius:12px; }
  .nav-links a:not(.nav-cta)::after { display:none !important; }
  .nav-links .nav-cta { justify-content:center; margin-top:5px; min-height:48px; }
  body.nav-menu-open { overflow:hidden; }

  .hero { min-height:auto !important; padding-top:var(--nav-height) !important; }
  .hero-left { padding:44px 22px 34px !important; }
  .hero-main-title { font-size:clamp(2.25rem, 10.8vw, 3.25rem) !important; }
  .hero-quote { font-size:1.05rem !important; margin-bottom:30px !important; }
  .hero-actions { gap:10px !important; }
  .btn-primary, .btn-outline { min-height:48px; display:inline-flex; align-items:center; justify-content:center; padding:12px 20px !important; }
  .hero-badges { gap:12px 16px !important; margin-top:30px !important; }
  .hero-right { min-height:320px !important; }
  .hero-graphic-container { padding:16px !important; }
  .hero-3d-scene { width:min(440px,100%) !important; }
  .hero-rating-badge { left:18px !important; bottom:18px !important; padding:11px 14px !important; }
  .about, .contact { padding-left:22px !important; padding-right:22px !important; }
  .services, .process, .testimonials { padding-left:20px !important; padding-right:20px !important; }
  .brand-cta { margin-left:18px !important; margin-right:18px !important; }
  .frow { grid-template-columns:1fr !important; }
  .finput, .fselect, .ftextarea { width:100%; max-width:100%; font-size:16px !important; }
  .fsubmit { width:100%; min-height:50px; }
  .contact { overflow:hidden; }
  .footer-bottom { flex-direction:column; align-items:flex-start !important; gap:10px; }
}

@media (max-width: 560px) {
  nav { padding-left:14px !important; padding-right:14px !important; }
  .nav-logo-text { max-width:190px; }
  .hero-left { padding-left:18px !important; padding-right:18px !important; }
  .hero-actions { flex-direction:column; align-items:stretch; }
  .hero-actions a { width:100%; }
  .hero-badges { display:grid !important; grid-template-columns:1fr 1fr; }
  .hero-badge-item { min-width:0; font-size:.78rem !important; }
  .hero-right { min-height:285px !important; }
  .about, .contact { padding:58px 18px !important; }
  .services, .process, .testimonials { padding:58px 16px !important; }
  .steps { grid-template-columns:1fr !important; }
  .about-floating-card { position:relative !important; right:auto !important; bottom:auto !important; margin-top:14px; }
  .brand-cta { margin:0 14px 42px !important; padding:28px 22px !important; border-radius:20px !important; }
  footer { padding:42px 18px 26px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .nav-links, .menu-line { transition:none !important; }
}
