/* OMTIOR v1.0 Release – extracted from single HTML file. */
/* Updated: full mobile responsive fix + mobile nav dropdown */

/* ===== Mobile nav: hidden on desktop, shown ≤1000px ===== */
.nav-toggle{
  display:none;
}
.mobile-nav{
  display:none;
}

/* ===== BREAKPOINT: ≤1000px (tablet + mobile) ===== */
@media(max-width:1000px){
  /* Show hamburger, hide desktop nav links */
  .navlinks{display:none}
  .nav-toggle{
    display:inline-flex;
    flex-direction:column;
    justify-content:center;
    gap:5px;
    width:36px;
    height:36px;
    padding:0;
    border:none;
    background:transparent;
    cursor:pointer;
    flex-shrink:0;
  }
  .nav-toggle span{
    display:block;
    width:24px;
    height:2.5px;
    border-radius:2px;
    background:#fff;
    transition:transform .25s ease, opacity .25s ease;
    margin:0 auto;
  }
  .nav-toggle.active span:nth-child(1){
    transform:translateY(7.5px) rotate(45deg);
  }
  .nav-toggle.active span:nth-child(2){
    opacity:0;
  }
  .nav-toggle.active span:nth-child(3){
    transform:translateY(-7.5px) rotate(-45deg);
  }

  /* Hide desktop lang-switch on mobile (it's in the mobile nav) */
  .nav-actions .lang-switch:not(.mobile-lang-switch){display:none}

  /* Mobile nav dropdown panel */
  .mobile-nav{
    display:flex;
    flex-direction:column;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    background:rgba(6,9,18,.96);
    backdrop-filter:blur(18px);
    border-bottom:1px solid var(--line);
    padding:16px 22px 24px;
    gap:4px;
    z-index:49;
    max-height:0;
    overflow:hidden;
    opacity:0;
    transition:max-height .3s ease, opacity .25s ease, padding .3s ease;
    padding-top:0;
    padding-bottom:0;
  }
  .mobile-nav.open{
    max-height:400px;
    opacity:1;
    padding-top:16px;
    padding-bottom:24px;
  }
  .mobile-nav a{
    color:#dce7f7;
    text-decoration:none;
    font-size:1rem;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.03em;
    padding:14px 0;
    border-bottom:1px solid rgba(255,255,255,.06);
    transition:color .2s ease;
  }
  .mobile-nav a:last-of-type{
    border-bottom:none;
  }
  .mobile-nav a:hover{
    color:#fff;
  }
  .mobile-lang-switch{
    margin-top:12px;
    align-self:center;
    padding:12px 42px;
    min-width:120px;
    justify-content:center;
  }

  /* Layout fixes */
  .hero,.production{grid-template-columns:1fr}
  .hero{width:100%;max-width:100%}
  .blocks{grid-template-columns:1fr}
  .grid4{grid-template-columns:repeat(2,1fr)}
  .grid3{grid-template-columns:1fr}
  .brand span{font-size:1.12rem}
  nav{padding:14px 18px}
  h1{font-size:clamp(1.8rem,7vw,3.2rem);overflow-wrap:break-word;word-break:break-word}
  .hero{min-height:auto;padding:48px 22px;text-align:center}
  .hero>div:first-child{display:flex;flex-direction:column;align-items:center}
  .hero h1{font-size:clamp(1.6rem,6.5vw,2.6rem);letter-spacing:-.04em;line-height:1}
  .eyebrow{width:auto;max-width:100%;font-size:.62rem;padding:6px 12px;white-space:normal;letter-spacing:.04em;margin-bottom:18px}
  .btn{width:auto;max-width:100%;white-space:normal;text-align:center}
  .hero p{margin-left:auto;margin-right:auto}
  .block{min-height:auto;max-width:400px;margin:0 auto;padding:18px;gap:10px}
  .block h3{min-height:auto;text-align:left;margin:8px 0 6px;font-size:1.15rem}
  .block p{font-size:.9rem}
  .block .creator-icon{justify-content:flex-start;width:42px;height:42px}
  .block small{text-align:left}
  .production-timeline{display:flex;flex-direction:column;gap:0;max-width:500px;margin:32px auto 0;padding:0;align-items:center}
  .production-timeline::before,.production-timeline::after{display:none}
  .timeline-step{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
    padding:0 0 28px 0;
    position:relative;
    text-align:center;
    width:100%;
  }
  .timeline-step:not(:last-child)::after{
    content:"";
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    top:56px;
    bottom:0;
    width:2px;
    background:linear-gradient(180deg,rgba(136,182,255,.4),rgba(92,148,255,.08));
  }
  .timeline-dot{
    width:56px;height:56px;
    font-size:.95rem;
    box-shadow:0 0 20px rgba(92,148,255,.18);
    flex-shrink:0;
  }
  .timeline-label{
    font-size:1.15rem;
    font-weight:800;
    letter-spacing:.01em;
    text-align:center;
  }
  .footer-grid{grid-template-columns:1fr 1fr}
  .form-block-grid{grid-template-columns:repeat(3,1fr)}

  /* Page hero padding fix */
  .page-hero{padding-top:110px;padding-bottom:30px}
  .page-hero .eyebrow{font-size:.62rem;padding:6px 12px;white-space:normal;letter-spacing:.04em}
  .page-hero h1{font-size:clamp(1.6rem,6.5vw,2.6rem)}
  .page-hero p{font-size:1rem}
  .legal-hero{padding-top:130px;padding-left:22px;padding-right:22px}
  .legal-layout{padding-left:22px;padding-right:22px}
  section.info-section{padding:50px 22px!important;max-width:100%!important}
  .info-card{padding:20px;border-radius:20px;max-width:400px;margin:0 auto}
  .info-card h3{font-size:1.1rem;margin-bottom:10px}
  .info-card p{font-size:.9rem;line-height:1.6}
  .info-list{gap:10px;margin-top:20px}
  .info-list-item{gap:10px;line-height:1.5;font-size:.9rem}
  .info-check{width:22px;height:22px;font-size:.75rem}
  section.cta-panel{margin:40px auto 0!important;padding:28px!important;max-width:calc(100% - 32px)!important;border-radius:24px}
  .footer67{padding-left:22px;padding-right:22px;margin-top:60px;padding-top:40px}
  .footer-grid{gap:24px}
  .footer67 h4{margin-bottom:10px;font-size:.95rem}
  .footer67 p,.footer67 li,.footer67 a{font-size:.88rem;line-height:1.6}
  .footer-badges{gap:8px;margin-top:14px}
  .footer-badges span{padding:6px 10px;font-size:.78rem}
  .footer-bottom{margin-top:28px;padding-top:18px;font-size:.82rem;justify-content:center;text-align:center}
}

/* ===== BREAKPOINT: ≤700px (phones) ===== */
@media(max-width:700px){
  section{padding:60px 18px}
  .hero{padding:36px 18px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:20px}
  .footer67{padding:40px 18px 24px;margin-top:40px}
  .footer67 h4{font-size:.9rem;margin-bottom:8px}
  .footer67 p,.footer67 li,.footer67 a{font-size:.84rem;line-height:1.5}
  .footer-badges{display:flex;gap:8px;margin-top:14px}
  .footer-badges span{padding:6px 10px;font-size:.72rem}
  .footer-bottom{flex-direction:column;gap:6px;text-align:center;justify-content:center}
  .form-grid{grid-template-columns:1fr}
  .form-block-grid{grid-template-columns:repeat(2,1fr)}
  .block,.mini{padding:20px;min-height:auto}
  .project-form{padding:22px;text-align:center}
  .project-form label{text-align:left}
  .form-submit{margin-left:auto;margin-right:auto}

  /* Font size fixes */
  h2{font-size:clamp(1.6rem,6vw,2.8rem)}
  .statement-inner{font-size:clamp(1.4rem,5vw,2.4rem)}
  .hero p{font-size:1rem}
  .sub{font-size:1rem}

  /* Nav padding */
  nav{padding:12px 16px}

  /* CTA panel fix */
  section.info-section{padding:40px 18px!important;max-width:100%!important}
  .info-card{padding:18px;max-width:360px}
  .info-list-item{font-size:.85rem}
  section.cta-panel{margin:30px auto 0!important;padding:22px!important;max-width:calc(100% - 24px)!important;border-radius:22px}
  .cta-panel h2{font-size:clamp(1.4rem,5vw,2rem)}
  .cta-panel p{font-size:.9rem}

  /* Footer padding */
  .footer67{padding:50px 18px 30px}

  /* Page hero */
  .page-hero{padding-top:90px}
  .legal-hero{padding-top:110px;padding-left:18px;padding-right:18px}
  .legal-layout{padding-left:18px;padding-right:18px}
  .info-section{padding-left:18px;padding-right:18px}

  /* Trust strip tighter */
  .trust-strip{gap:8px}
  .trust-strip span{padding:8px 12px;font-size:.85rem}
}

/* ===== BREAKPOINT: ≤480px (small phones) ===== */
@media(max-width:480px){
  section{padding:50px 16px}
  .hero{padding:32px 16px}
  .hero h1{font-size:clamp(1.4rem,6vw,2rem)}
  .hero p{max-width:100%;font-size:.95rem}
  .eyebrow{font-size:.58rem;padding:5px 10px}
  .btn{padding:12px 20px;font-size:.85rem}
  .hero-card{padding:18px;border-radius:24px}
  .form-block-grid{grid-template-columns:1fr}
  .footer67{padding:32px 16px 20px}
  .footer-grid{grid-template-columns:1fr;gap:16px}
  .project-form{padding:18px;border-radius:20px}
  section.cta-panel{padding:20px!important;max-width:calc(100% - 20px)!important;border-radius:20px}
  section.info-section{padding:32px 16px!important;max-width:100%!important}
  .info-card{padding:16px;max-width:100%}
  .grid4{grid-template-columns:1fr}
  .block{padding:18px}
  .mini{padding:18px}
  .legal-hero{padding-left:16px;padding-right:16px}
  .legal-layout{padding-left:16px;padding-right:16px}
  .info-section{padding-left:16px;padding-right:16px}
}