/* BLVZ RC responsive polish. This file intentionally contains only breakpoint
   overrides so the established desktop art direction remains unchanged. */

html { overflow-x: clip; }
body { min-width: 0; overflow-wrap: break-word; }
img, svg, video, canvas { max-width: 100%; }
button, input, select, textarea { max-width: 100%; }

@supports (padding: max(0px)) {
  .blvz-header { padding-left: max(0px, env(safe-area-inset-left)); padding-right: max(0px, env(safe-area-inset-right)); }
  .welcome-hero-overlay { padding: max(1rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left)); }
}

/* The canonical menu remains reachable and comfortably tappable on touch screens. */
@media (max-width: 900px) {
  .blvz-header { padding-top: max(8px, env(safe-area-inset-top)); }
  .blvz-burger { min-width: 44px; min-height: 44px; display:grid; place-content:center; }
  .blvz-mobile-link, .blvz-mobile-trigger { min-height:64px; display:flex; align-items:center; }
  .blvz-mobile-submenu a { min-height:48px; display:flex; align-items:center; }
}

/* Homepage: a purpose-built, centered phone hero—not a shrunken desktop layout. */
@media (max-width: 767px) {
  .hero-section {
    min-height: 0;
    isolation: isolate;
  }
  .hero-bg-img {
    height: 100%;
    transform: none;
    object-position: 68% 64%;
    opacity: .78;
  }
  .hero-overlay { background:linear-gradient(180deg, rgba(8,11,16,.58) 0%, rgba(8,11,16,.68) 47%, rgba(8,11,16,.88) 100%); }
  .hero-container {
    min-height: 0;
    padding: max(98px, calc(76px + env(safe-area-inset-top))) 20px 34px;
    align-items: center;
    justify-content: initial;
    text-align: center;
  }
  .hero-top-bar { justify-content:center; margin-bottom:24px; }
  .hero-top-text { font-size:.64rem; letter-spacing:.09em; }
  .hero-main { width:100%; max-width:430px; margin:0; }
  .hero-section .hero-badge { margin-bottom:.8rem; padding:.38rem .72rem; }
  .hero-section .badge-text { font-size:.62rem; letter-spacing:.065em; }
  .hero-section .hero-title { font-size:clamp(2.35rem, 11vw, 3.15rem); line-height:1.02; margin:0 auto 1rem; }
  .hero-section .title-line-2 { white-space:normal; }
  .hero-section .hero-description { max-width:34ch; margin:0 auto 1.35rem; font-size:.95rem; line-height:1.55; }
  .hero-section .hero-actions { width:100%; flex-direction:column; gap:.72rem; }
  .hero-section .hero-actions .btn { width:100%; min-height:48px; padding:.82rem 1.1rem; }
  .hero-bottom { width:100%; margin-top:2.5rem; }
  .feature-list { justify-content:center; gap:.45rem .85rem; padding-bottom:1.25rem; }
  .feature-item { font-size:.72rem; gap:.35rem; padding:0 .6rem 0 0; border-right:0; }
  .feature-icon { width:16px; height:16px; }
  .metrics-footer { display:block; padding-top:1.1rem; }
  .metrics-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:.7rem; width:100%; }
  .metric-item { min-height:76px; padding:.9rem .75rem; border:1px solid rgba(255,255,255,.08); background:rgba(8,11,16,.35); text-align:left; }
  .metric-value { font-size:1.25rem; }
  .metric-label { font-size:.66rem; line-height:1.25; }
  .scroll-explore { justify-content:center; min-height:44px; margin-top:.7rem; font-size:.72rem; }

  section { padding:64px 0; }
  .pricing-section, .hybrid-section { padding:80px 0; }
  .pricing-container, .about-container { width:calc(100% - 40px); }
  .pricing-card, .hybrid-card { min-width:0; }
  .pricing-card { padding:1.5rem; }
  .contact-section { padding:72px 0; }
  .faq-section { padding:72px 0 84px; }
  .contact-card, .faq-card { width:calc(100% - 32px); padding:2rem 1.1rem; }
  .form-group input, .form-group select, .form-group textarea { min-height:48px; font-size:16px; }
  .form-group textarea { min-height:130px; }
  .privacy-consent { align-items:flex-start; line-height:1.45; }
  .privacy-consent input[type="checkbox"] { width:20px; height:20px; flex:0 0 20px; margin-top:1px; }
  .btn-submit, .faq-question { min-height:48px; }
  .faq-question { padding:1rem 1.1rem; }
  .faq-answer, .faq-item.active .faq-answer { padding-left:1.1rem; padding-right:1.1rem; }
  .site-footer { margin-top:0; padding:56px 0 32px; }
  .footer-grid { gap:32px; padding-bottom:36px; }
  .footer-meta-row { gap:28px; }
  .footer-links a { display:inline-flex; align-items:center; min-height:32px; }
  .footer-bottom { gap:8px; }
  .site-footer, footer { padding-bottom:max(32px, env(safe-area-inset-bottom)); }
}

@media (max-width: 390px) {
  .hero-container { padding-left:16px; padding-right:16px; }
  .hero-section .hero-title { font-size:2.28rem; }
  .feature-list { gap:.35rem .55rem; }
  .feature-item { font-size:.67rem; }
  .contact-card, .faq-card { width:calc(100% - 24px); }
}

/* Tablet maintains the current hierarchy while preventing compressed columns. */
@media (min-width: 768px) and (max-width: 1024px) {
  .hero-container { padding-left:32px; padding-right:32px; }
  .hero-bottom { margin-top:6rem; }
  .metrics-grid { gap:1.25rem; }
  .metric-item { padding-right:1.25rem; }
  .pricing-container, .about-container { width:calc(100% - 64px); }
  .contact-card, .faq-card { width:calc(100% - 64px); }
}

/* Get in Touch: keep the 3D BLVZ prism central without a tall, compressed overlay. */
@media (max-width: 640px) {
  .welcome-hero-overlay { align-items:flex-start; overflow-y:auto; }
  .hero-modal-content { display:flex; flex-direction:column; width:min(100%, 430px); gap:1.35rem; padding:1.15rem 0; text-align:center; }
  .hero-modal-content > div:first-child { display:flex; flex-direction:column; align-items:center; width:100%; }
  .welcome-hero-overlay .hero-title { font-size:clamp(2.1rem, 10vw, 2.75rem); line-height:1.06; margin-bottom:.9rem; }
  .welcome-hero-overlay .hero-desc { margin:0 auto 1.3rem; font-size:.95rem; line-height:1.55; }
  .welcome-hero-overlay .btn-magnetic-cta { width:100%; min-height:50px; justify-content:center; padding:1rem 1.25rem; }
  .hero-3d-wrapper { order:-1; width:100%; height:176px; flex:0 0 176px; }
  .object-3d-scene { width:128px; height:128px; }
  .prism-face { width:128px; height:128px; border-radius:20px; }
  .prism-face.front { transform:translateZ(64px); }
  .prism-face.back { transform:rotateY(180deg) translateZ(64px); }
  .prism-face.right { transform:rotateY(90deg) translateZ(64px); }
  .prism-face.left { transform:rotateY(-90deg) translateZ(64px); }
  .prism-face.top { transform:rotateX(90deg) translateZ(64px); }
  .prism-face.bottom { transform:rotateX(-90deg) translateZ(64px); }
  body:has(#welcomeHero) header { padding:calc(1rem + env(safe-area-inset-top)) 20px .85rem; }
  body:has(#welcomeHero) .header-tag { display:none; }
  body:has(#welcomeHero) .container { width:calc(100% - 32px); padding:2rem 0 3.5rem; }
  .progress-glass-card { padding:1rem; }
  .step-panel { padding:1.4rem 1rem; border-radius:20px; }
  .input-grid, .summary-grid { gap:1rem; }
  .input-group input, .input-group select, .input-group textarea { min-height:48px; font-size:16px; }
  .btn-nav-wrapper { gap:.75rem; }
  .btn-nav-wrapper .btn-primary, .btn-nav-wrapper .btn-secondary { min-height:48px; }
  body:has(#welcomeHero) footer { padding-left:16px; padding-right:16px; text-align:center; }
  body:has(#welcomeHero) .footer-links { justify-content:center; flex-wrap:wrap; gap:.75rem 1.25rem; }
}

/* Legal, success, 404 and maintenance pages use these compact fallbacks. */
@media (max-width: 560px) {
  .site-header { gap:12px; align-items:flex-start; }
  .site-header > a:last-child { min-height:44px; display:inline-flex; align-items:center; white-space:nowrap; }
  .legal-footer { gap:8px 16px; }
  .legal-footer a { min-height:44px; display:inline-flex; align-items:center; }
  .wrap main { overflow-x:auto; }
  .wrap table { min-width:540px; }
  .error-container, .success-container { padding:28px 18px; border-radius:20px; }
  .mascot-img { max-height:210px; }
  .btn-group .btn { min-height:48px; }
}

@media (max-width: 420px) {
  body:has(.blvz-bg-gradient) { overflow:auto; }
  .blvz-bg-gradient main > div { padding:1.75rem 1.25rem; }
  .blvz-bg-gradient a { min-height:48px; }
}

@media (prefers-reduced-motion: reduce) {
  .object-3d-scene { animation:none; }
}