/* X2 Web v2.1 — minimal public homepage */

.hero-minimal{
  min-height:560px;
  padding-top:132px;
  padding-bottom:74px;
}
.hero-minimal .hero-content{max-width:880px}
.hero-minimal h1{
  max-width:760px;
  font-size:clamp(62px,6.2vw,92px);
  line-height:.92;
}
.hero-minimal .hero-copy{
  margin-top:26px;
  font-size:17px;
  letter-spacing:.005em;
}
.hero-minimal .hero-actions{margin-top:32px}
.development-inline{
  max-width:760px;
  margin:26px 0 0;
  color:var(--muted);
  font-size:12px;
  line-height:1.55;
}
.development-inline strong{
  color:var(--foreground);
  font-weight:650;
}

.pricing-section{
  padding-top:92px;
  padding-bottom:110px;
}
.pricing-intro-minimal{
  margin-bottom:58px;
}
.pricing-intro-minimal h2{
  font-size:clamp(46px,4.5vw,68px);
}

.pricing-card{
  border-color:var(--border);
  background:var(--background);
}
.pricing-card:hover{
  transform:translateY(-2px);
  border-color:var(--primary);
  background:var(--surface-2);
}
.pricing-card:hover .plan-action{
  border-color:var(--primary);
  color:var(--primary);
  background:var(--primary-soft);
}
.pricing-card-dark:hover{
  border-color:var(--primary);
}
.plan-action-disabled{
  pointer-events:none;
}
.plan-availability small{display:none}

.site-footer{
  background:#11172f;
  color:#fff;
  border-top-color:rgba(255,255,255,.07);
  padding-top:58px;
}
.site-footer .footer-columns{
  padding-top:0;
  border-top:0;
  border-bottom-color:rgba(255,255,255,.07);
}
.site-footer .footer-columns h3{color:rgba(255,255,255,.43)}
.site-footer .footer-columns a{color:rgba(255,255,255,.68)}
.site-footer .footer-columns a:hover{color:#fff}
.site-footer .footer-social a,
.site-footer .footer-social span{
  color:rgba(255,255,255,.68);
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.12);
}
.site-footer .footer-base{color:rgba(255,255,255,.43)}
.site-footer .locale-controls button{
  color:rgba(255,255,255,.68);
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.12);
}

@media(max-width:780px){
  .hero-minimal{
    min-height:auto;
    padding:102px 22px 42px;
  }
  .hero-minimal .hero-eyebrow{margin-bottom:15px}
  .hero-minimal h1{
    max-width:390px;
    font-size:clamp(45px,13vw,62px);
  }
  .hero-minimal .hero-copy{
    margin-top:18px;
    font-size:13px;
    line-height:1.55;
  }
  .hero-minimal .hero-actions{
    margin-top:24px;
  }
  .hero-minimal .hero-actions .text-link{display:none}
  .development-inline{
    margin-top:22px;
    font-size:11px;
  }

  .mobile-product-summary{
    display:grid;
    grid-template-columns:1fr;
    background:var(--surface);
    border-block:1px solid var(--border);
  }
  .mobile-product-summary article{
    padding:28px 22px;
    border-bottom:1px solid var(--border);
  }
  .mobile-product-summary article:last-child{border-bottom:0}
  .mobile-product-summary h2{
    margin:10px 0 0;
    color:var(--foreground);
    font-size:18px;
    line-height:1.45;
    font-weight:600;
    letter-spacing:-.02em;
  }

  .pricing-section{display:none}

  .site-footer{
    padding:36px 22px 22px;
  }
  .footer-columns{
    grid-template-columns:1fr 1fr;
    gap:24px 18px;
    padding-bottom:28px;
  }
  .footer-columns>div:nth-child(3){display:none}
  .footer-social{display:none}
  .footer-base{
    align-items:flex-start;
    flex-direction:column;
    padding-top:20px;
    gap:12px;
  }
  .locale-controls{display:none}
}

/* X2 mobile entry — account first */
:root{
  --primary:#11172f;
  --primary-hover:#18213e;
  --primary-soft:#e8eaf0;
  --primary-contrast:#ffffff;
}

.brand-mark,
.hero-eyebrow,
.section-label{
  color:#11172f!important;
}

.button-primary{
  background:#11172f!important;
  border-color:#11172f!important;
  color:#ffffff!important;
}

.button-primary:hover{
  background:#18213e!important;
  border-color:#18213e!important;
}

.mobile-auth-actions{
  display:none;
}

@media(max-width:780px){
  .hero-minimal .hero-actions{
    display:none!important;
  }

  .mobile-auth-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    margin-top:24px;
  }

  .mobile-auth-actions .button{
    width:100%;
  }

  .mobile-product-summary{
    display:none!important;
  }
}

/* X2 mobile public entry — final minimal layer */
@media(max-width:780px){

  body .hero.hero-minimal .hero-eyebrow,
  body .hero.hero-minimal h1,
  body .hero.hero-minimal .hero-copy{
    display:none!important;
  }

  body .hero.hero-minimal{
    min-height:auto!important;
    padding:104px 22px 34px!important;
  }

  body .hero.hero-minimal .mobile-auth-actions{
    display:grid!important;
    margin-top:0!important;
  }

  body .hero.hero-minimal .development-inline{
    margin-top:22px!important;
  }

  .site-footer .footer-social{
    display:flex!important;
    flex-wrap:wrap;
    gap:8px;
    padding:24px 0 8px;
  }
}

/* X2 mobile final public composition */
@media(max-width:780px){

  body .hero.hero-minimal .hero-eyebrow,
  body .hero.hero-minimal h1{
    display:none!important;
  }

  body .hero.hero-minimal .hero-copy{
    display:block!important;
    margin:0 0 24px!important;
    color:var(--muted)!important;
    font-size:13px!important;
    line-height:1.5!important;
  }

  body .hero.hero-minimal .hero-actions{
    display:none!important;
  }

  body .hero.hero-minimal .mobile-auth-actions{
    display:grid!important;
    margin-top:0!important;
  }

  .mobile-product-summary{
    display:none!important;
  }

  .site-footer .footer-social{
    display:flex!important;
    flex-wrap:wrap;
    gap:8px;
    padding:24px 0 8px;
  }
}

/* X2 mobile one-page authentication */
.home-auth{
  display:none;
}

@media(max-width:780px){
  .hero-minimal{
    padding-bottom:28px!important;
  }

  .hero-minimal .hero-copy{
    display:block!important;
    margin:0 0 14px!important;
    color:var(--muted)!important;
    font-size:13px!important;
    line-height:1.5!important;
  }

  .hero-minimal .development-inline{
    margin:0 0 24px!important;
    color:var(--muted)!important;
    font-size:11px!important;
    line-height:1.55!important;
  }

  .home-auth{
    display:block;
    margin-top:0;
    padding:0;
  }

  .home-auth-modes{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    margin-bottom:18px;
  }

  .home-auth-mode{
    min-height:46px;
    border:1px solid var(--border);
    border-radius:10px;
    background:var(--surface);
    color:var(--foreground);
    font-size:13px;
    font-weight:700;
    cursor:pointer;
  }

  .home-auth-mode.is-active{
    border-color:#11172f;
    background:#11172f;
    color:#ffffff;
  }

  .home-auth-body{
    padding:18px;
    border:1px solid var(--border);
    border-radius:14px;
    background:var(--surface);
    box-shadow:0 14px 35px rgba(17,23,47,.06);
  }

  .home-auth .auth-divider{
    margin:18px 0;
  }

  .home-auth .auth-legal{
    margin:18px 0 0;
    color:var(--muted);
    text-align:center;
    font-size:10px;
    line-height:1.5;
  }

  .home-auth .email-form button:not(:disabled){
    color:#ffffff;
    background:#11172f;
    border-color:#11172f;
  }

  .home-auth .email-form button:not(:disabled):hover{
    color:#ffffff;
    background:#18213e;
    border-color:#18213e;
  }

  .home-auth .auth-status{
    margin-top:12px;
  }

  .mobile-auth-actions{
    display:none!important;
  }
}

/* X2 mobile auth — compact professional controls */
@media(max-width:780px){

  .home-auth{
    margin-top:0!important;
  }

  .home-auth-modes{
    gap:6px!important;
    margin-bottom:16px!important;
  }

  .home-auth-mode{
    height:38px!important;
    min-height:38px!important;
    padding:0 14px!important;
    border-radius:9px!important;
    font-size:13px!important;
    line-height:1!important;
    font-weight:700!important;
  }

  .home-auth-body{
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  .home-auth .google-signin-host{
    min-height:40px!important;
  }

  .home-auth .auth-divider{
    margin:14px 0!important;
    font-size:12px!important;
  }

  .home-auth .email-form label{
    margin-bottom:7px!important;
    font-size:12px!important;
    line-height:1.3!important;
  }

  .home-auth .email-field{
    margin-bottom:10px!important;
  }

  .home-auth .email-field input{
    height:42px!important;
    min-height:42px!important;
    padding:0 13px!important;
    border-radius:9px!important;
    font-size:14px!important;
  }

  .home-auth .email-form button:not(.email-change){
    height:42px!important;
    min-height:42px!important;
    padding:0 14px!important;
    border-radius:9px!important;
    font-size:13px!important;
    line-height:1!important;
  }

  .home-auth .email-change{
    min-height:34px!important;
    font-size:12px!important;
  }

  .home-auth .auth-status{
    margin-top:10px!important;
    font-size:12px!important;
  }

  .home-auth .auth-legal{
    margin-top:14px!important;
    font-size:10px!important;
    line-height:1.45!important;
  }

  .hero-minimal .development-inline{
    margin-bottom:18px!important;
  }
}

/* X2 mobile auth — lighter professional typography */
@media(max-width:780px){

  .home-auth-mode{
    font-weight:600!important;
  }

  .home-auth .email-form label{
    font-weight:500!important;
  }

  .home-auth .email-form button:not(.email-change){
    font-weight:600!important;
  }

  .home-auth .email-change{
    font-weight:500!important;
  }

  .hero-minimal .development-inline{
    font-weight:400!important;
  }

  .hero-minimal .development-inline strong{
    font-weight:600!important;
  }

  .home-auth .auth-legal,
  .home-auth .auth-status,
  .home-auth .auth-divider{
    font-weight:400!important;
  }
}

/* X2 mobile showcase + neutral auth controls */
@media(max-width:780px){

  .mobile-showcase-frame{
    display:block;
    width:100%;
    aspect-ratio:1 / 1;
    margin:0 0 20px;
    border:1px solid #dfe2e7;
    border-radius:14px;
    background:#ffffff;
    box-shadow:0 4px 18px rgba(17,23,47,.035);
    overflow:hidden;
  }

  .home-auth-mode{
    background:#ffffff!important;
    color:#11172f!important;
    border:1px solid #d8dce3!important;
    box-shadow:none!important;
    font-weight:500!important;
    transition:
      background .15s ease,
      border-color .15s ease,
      box-shadow .15s ease,
      transform .08s ease;
  }

  .home-auth-mode.is-active{
    background:#ffffff!important;
    color:#11172f!important;
    border-color:#aeb4bf!important;
    box-shadow:0 3px 10px rgba(17,23,47,.08)!important;
  }

  .home-auth-mode:active{
    background:#f4f5f7!important;
    box-shadow:0 2px 6px rgba(17,23,47,.08)!important;
    transform:translateY(1px);
  }

  .home-auth .email-form button:not(.email-change){
    background:#ffffff!important;
    color:#11172f!important;
    border:1px solid #cfd3da!important;
    box-shadow:none!important;
    font-weight:500!important;
    transition:
      background .15s ease,
      border-color .15s ease,
      box-shadow .15s ease,
      transform .08s ease;
  }

  .home-auth .email-form button:not(.email-change):hover{
    background:#f7f8f9!important;
    border-color:#b9bec7!important;
    box-shadow:0 3px 10px rgba(17,23,47,.06)!important;
  }

  .home-auth .email-form button:not(.email-change):active{
    background:#f1f2f4!important;
    box-shadow:0 2px 6px rgba(17,23,47,.07)!important;
    transform:translateY(1px);
  }
}

/* X2 mobile entry — clean professional composition */
@media(max-width:780px){

  /* Header */
  .mobile-menu{
    display:none!important;
  }

  /* Remove marketing text on mobile */
  .hero-minimal .hero-eyebrow,
  .hero-minimal h1,
  .hero-minimal .hero-copy,
  .mobile-product-summary,
  .pricing-section{
    display:none!important;
  }

  .hero-minimal{
    padding:0 32px 26px!important;
    min-height:auto!important;
  }

  .hero-minimal .hero-content{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
  }

  /* Future X2 visual / slider area */
  .mobile-showcase-frame{
    order:1;
    display:block!important;
    width:100vw!important;
    aspect-ratio:1 / 1!important;
    margin:0 0 18px calc(50% - 50vw)!important;
    border:0!important;
    border-radius:0!important;
    background:#ffffff!important;
    box-shadow:none!important;
    overflow:hidden!important;
  }

  /* Auth immediately after visual */
  .home-auth{
    order:2;
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    margin:0!important;
  }

  .home-auth-body{
    display:contents!important;
  }

  .home-google-signin,
  #home-google-signin{
    order:1;
    width:100%!important;
    margin:0 0 8px!important;
  }

  .social-auth-button{
    width:100%!important;
    height:40px!important;
    min-height:40px!important;
    margin:0 0 8px!important;
    padding:0 14px!important;
    border:1px solid #d2d5da!important;
    border-radius:4px!important;
    background:#ffffff!important;
    color:#30343b!important;
    font-family:inherit!important;
    font-size:13px!important;
    font-weight:400!important;
    line-height:1!important;
    box-shadow:none!important;
    transition:box-shadow .12s ease, border-color .12s ease, background .12s ease;
  }

  .social-facebook{
    order:2;
  }

  .social-apple{
    order:3;
  }

  .social-auth-button:active{
    background:#fafafa!important;
    border-color:#bfc3ca!important;
    box-shadow:0 3px 10px rgba(17,23,47,.08)!important;
  }

  .social-auth-button:disabled{
    opacity:1!important;
  }

  .home-auth .auth-divider{
    order:4;
    margin:8px 0 12px!important;
    font-size:11px!important;
    font-weight:400!important;
  }

  /* Sign in / Create account: full-width rectangular controls */
  .home-auth-modes{
    order:5;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    width:100%!important;
    margin:0 0 14px!important;
  }

  .home-auth-mode,
  .home-auth-mode.is-active{
    width:100%!important;
    height:40px!important;
    min-height:40px!important;
    padding:0 14px!important;
    border:1px solid #cfd3d9!important;
    border-radius:4px!important;
    background:#ffffff!important;
    color:#20242b!important;
    font-size:13px!important;
    font-weight:500!important;
    line-height:1!important;
    box-shadow:none!important;
    transition:box-shadow .12s ease, border-color .12s ease, background .12s ease;
  }

  .home-auth-mode.is-active{
    border-color:#aeb4bd!important;
  }

  .home-auth-mode:hover{
    background:#fafafa!important;
    box-shadow:0 3px 10px rgba(17,23,47,.06)!important;
  }

  .home-auth-mode:active{
    background:#f7f7f8!important;
    box-shadow:0 3px 10px rgba(17,23,47,.08)!important;
  }

  /* Email */
  #home-email-auth-start,
  #home-email-auth-complete{
    order:6;
    width:100%!important;
  }

  .home-auth .email-field input{
    height:40px!important;
    min-height:40px!important;
    border-radius:4px!important;
    font-size:13px!important;
  }

  .home-auth .email-form button:not(.email-change){
    height:40px!important;
    min-height:40px!important;
    border-radius:4px!important;
    background:#ffffff!important;
    color:#20242b!important;
    border:1px solid #cfd3d9!important;
    font-size:13px!important;
    font-weight:500!important;
    box-shadow:none!important;
  }

  .home-auth .email-form button:not(.email-change):active{
    background:#f7f7f8!important;
    box-shadow:0 3px 10px rgba(17,23,47,.08)!important;
  }

  #home-auth-status,
  #home-email-auth-status{
    order:7;
  }

  .home-auth .auth-legal{
    order:8;
  }

  /* Development notice below account controls */
  .hero-minimal .development-inline{
    order:3;
    display:block!important;
    margin:18px 0 0!important;
    font-size:10px!important;
    line-height:1.5!important;
    font-weight:400!important;
  }

  .hero-minimal .development-inline strong{
    font-weight:500!important;
  }

  /* No footer on mobile entry */
  .site-footer,
  footer{
    display:none!important;
  }
}

@media(max-width:780px){
  body .hero.hero-minimal .hero-content > .hero-copy{
    display:none!important;
  }
}
