/* =========================================================
   TNOW-001 Hero v3.0 Final Polish
   Typography / logo / vertical rhythm / texture
   ========================================================= */

/* Purposefully structured lines: desktop remains two lines. */
.tnhero__title-line--accent > span{
  display:inline;
}

/* Refine the first screen and bring the product panels closer. */
@media (min-width:1200px){
  .tnhero{
    padding-top:128px;
    padding-bottom:74px;
  }

  .tnhero__message{
    margin-bottom:42px;
  }

  .tnhero__message::after{
    margin-top:31px;
  }

  .tnhero__actions{
    gap:10px;
    margin-top:28px;
  }

  .tnhero__title{
    max-width:1040px;
    letter-spacing:-.045em;
  }
}

/* Extremely subtle grain without an image request or network access. */
.tnhero__ambient::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.022;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E");
  mix-blend-mode:soft-light;
}

@media (max-width:767px){
  /* The logo artwork has internal whitespace, so a larger box is intentional. */
  .header-inner{
    height:calc(76px + var(--tn-mobile-safe-top));
  }

  .brand-logo{
    width:108px;
    height:66px;
    margin-left:-9px;
  }

  .tnhero{
    padding-top:calc(102px + var(--tn-mobile-safe-top));
    padding-bottom:48px;
  }

  .tnhero__message{
    margin-bottom:24px;
  }

  .tnhero__eyebrow{
    margin-bottom:20px;
    font-size:.61rem;
    line-height:1.6;
  }

  /* Mobile line breaks are designed, never delegated to the browser. */
  .tnhero__title{
    font-size:clamp(2.55rem,11.55vw,3.2rem);
    line-height:1.08;
    letter-spacing:-.048em;
    text-wrap:initial;
  }

  .tnhero__title-line,
  .tnhero__title-line--accent > span{
    display:block;
    white-space:nowrap;
  }

  .tnhero__title-line--accent{
    margin-top:.15em !important;
  }

  .tnhero__title-line--accent > span:last-child{
    margin-top:.10em;
  }

  .tnhero__lead{
    max-width:33em;
    margin-top:24px;
    font-size:.91rem;
    line-height:1.86;
  }

  .tnhero__lead span{
    display:block;
  }

  .tnhero__lead span+span::before{
    content:none;
  }

  .tnhero__actions{
    gap:8px;
    margin-top:24px;
  }

  .tnhero__button{
    min-height:52px;
    padding-right:18px;
    padding-left:18px;
  }

  .tnhero__message::after{
    margin-top:28px;
  }

  .tnhero__split{
    gap:13px;
  }

  .tnhero__panel--website{
    padding-top:19px;
  }
}

@media (max-width:380px){
  .brand-logo{
    width:100px;
    height:62px;
  }

  .tnhero__title{
    font-size:clamp(2.3rem,11.2vw,2.7rem);
  }
}

@media (prefers-reduced-motion:reduce){
  .tnhero__ambient::after{
    position:absolute;
  }
}