/* =========================================================
   ZYTONA — Typography Override
   Apple/Roborock inspired: no tracking, balanced ratios.
   Loaded AFTER styles.css/premium.css to win.
   ========================================================= */

/* ─── Kill all letter-spacing globally ─── */
*, *::before, *::after{letter-spacing:0 !important;}

/* ─── Body baseline (Apple feel: cleaner default size) ─── */
body{
  font-size:16px;
  line-height:1.5;
  font-weight:400;
  color:#1d1d1f;
}

/* ─── Heading scale (Roborock proportions, Apple weight) ─── */
.banner h1, .banner-title{
  font-size:clamp(34px, 4.2vw, 56px);
  font-weight:600;
  line-height:1.08;
  margin-bottom:18px;
}

.section-title, .scene h2{
  font-size:clamp(30px, 3.2vw, 44px);
  font-weight:600;
  line-height:1.1;
}

h1{font-size:clamp(34px, 4.2vw, 56px); font-weight:600; line-height:1.08;}
h2{font-size:clamp(28px, 3vw, 40px); font-weight:600; line-height:1.12;}
h3{font-size:clamp(22px, 2.2vw, 28px); font-weight:600; line-height:1.2;}
h4{font-size:18px; font-weight:600; line-height:1.3;}
h5{font-size:14px; font-weight:600;}

/* ─── Body copy ─── */
.banner-sub, .scene-desc{
  font-size:18px;
  line-height:1.5;
  color:#6e6e73;
  font-weight:400;
  max-width:480px;
}
.banner-features li, .scene-features li{
  font-size:15px;
  font-weight:400;
  color:inherit;
  opacity:.85;
}

/* ─── Hide visual eyebrow clutter (keeping useful badges) ─── */
.section-eyebrow,
.banner-overline,
.scene-tag,
.divider-marker,
.txt-eyebrow{
  display:none !important;
}

/* Banner-tag — keep visible but simplify (used as small status pill) */
.banner-tag{
  display:inline-block;
  padding:4px 10px;
  background:transparent;
  color:var(--olive);
  border:1px solid var(--olive);
  font-size:11px;
  font-weight:500;
  text-transform:none;
  border-radius:100px;
  margin-bottom:18px;
}
.banner-tag.dark-tag{color:var(--white); border-color:rgba(255,255,255,.4); background:transparent;}

/* ─── Tab card refinements ─── */
.tab-card-name{
  font-size:22px;
  font-weight:600;
  margin-bottom:10px;
}
.tab-card-features{
  font-size:13px;
  color:#6e6e73;
}
.tab-card-cta{font-size:13px; font-weight:500;}

/* ─── Buttons ─── */
.btn{
  font-size:14px;
  font-weight:500;
  padding:13px 26px;
}

/* ─── Footer scale tighten ─── */
.footer-newsletter h3{font-size:26px; font-weight:600;}
.footer-newsletter p{font-size:14px;}
.footer-col h5{font-size:13px; font-weight:600;}
.footer-col ul a{font-size:13px;}

/* ─── Stats ─── */
.stat-num{font-size:40px; font-weight:600; line-height:1.05;}
.stat-label{font-size:13px;}

/* ─── Strip features ─── */
.strip-item strong{font-size:14px; font-weight:600;}
.strip-item p{font-size:13px;}

/* ─── Lifestyle strip overlay text ─── */
.lifestyle-strip-content h3{font-size:36px; font-weight:600; line-height:1.12; margin-bottom:14px;}
.lifestyle-strip-content p{font-size:16px;}

/* ─── Fonts use Apple system stack first, fallback Inter ─── */
:root{
  --sans:'Inter', -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Helvetica, Arial, sans-serif;
}

/* ─── Italic neutralization stays ─── */
em, i{font-style:normal; color:var(--olive); font-weight:inherit;}

/* ─── Section padding reduction (was 100-140px, now Apple-like) ─── */
.section{padding:88px 0;}
.banner{min-height:auto;}
.banner-inner{padding:96px 40px;}
.scene-inner{padding:96px 40px;}

@media(max-width:1100px){
  .banner-inner, .scene-inner, .section{padding-left:40px; padding-right:40px;}
}
@media(max-width:680px){
  .banner h1, .banner-title{font-size:34px;}
  .section-title, .scene h2{font-size:28px;}
  .banner-inner, .scene-inner{padding:60px 24px;}
  .banner-sub, .scene-desc{font-size:16px;}
  h1{font-size:34px;} h2{font-size:26px;} h3{font-size:20px;}
}