.hero-grid { grid-template-columns: .9fr 1.1fr; grid-template-areas: "copy film" "conversion film"; gap: 0 44px; }
.hero-copy { grid-area: copy; }
.hero-conversion { grid-area: conversion; }
.hero h1 { font-size: clamp(2.75rem,4.5vw,4.2rem); }
.hero .lead { font-size: 1.08rem; }
.intro-film { grid-area: film; min-width: 0; position: relative; border: 1px solid rgba(127,185,255,.3); border-radius: 22px; background: #0c1a2a; box-shadow: 0 32px 90px #0008, 0 0 70px #447bdb22; overflow: hidden; }
.film-heading { display: flex; gap: 14px; justify-content: space-between; align-items: center; padding: 17px 19px; font-size: .83rem; font-weight: 700; }
.quality-badge { color: #8bffe4; font-size: .63rem; letter-spacing: .07em; white-space: nowrap; }
.film-screen { aspect-ratio: 16/9; background: #050a12; }
.film-screen video { display: block; width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
.film-controls { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; padding: 14px 16px 7px; }
.film-controls button { min-height: 44px; padding: 10px 13px; border: 1px solid #ffffff26; border-radius: 10px; color: #e8f1ff; background: #142941; cursor: pointer; font: 650 .78rem/1.2 system-ui,sans-serif; }
.film-controls button:hover { background: #21425c; }
.film-controls .sound-button { color: #06101d; background: #6df7c1; border-color: #6df7c1; margin-left: auto; }
.film-controls .sound-button:hover { background: #a1ffda; }
.film-help { padding: 0 18px; margin: 5px 0 17px; color: #b8c9db; font-size: .75rem; line-height: 1.6; }
.film-status { padding: 0 18px; color: #ffd66d; font-size: .78rem; }
.film-status:empty { display: none; }
.intro-film:fullscreen { width: 100%; height: 100%; border: 0; border-radius: 0; display: flex; flex-direction: column; justify-content: center; background: #050a12; }
.intro-film:fullscreen .film-screen { min-height: 0; flex: 1; aspect-ratio: auto; }
.intro-film:fullscreen .film-controls { justify-content: center; }
.intro-film:fullscreen .sound-button { margin-left: 0; }
.package-note { margin: 16px 0 0; color: #c2d2e3; font-size: .79rem; line-height: 1.6; border-top: 1px solid #ffffff20; padding-top: 14px; }
.pricing-note { margin: 18px 4px 0; color: #a7b9cd; font-size: .8rem; }
.film-controls button { min-width: 44px; }
.film-controls { padding-bottom: 14px; }
.bonus-link { display: block; margin-top: 20px; color: var(--mint); text-decoration: none; font-size: .83rem; font-weight: 650; }
.bonus-section { padding-bottom: 0; }
.bonus-shell { padding: 48px; border: 1px solid #6df7c14a; border-radius: 30px; background: radial-gradient(ellipse at 95% 0,#17664b55,transparent 65%),#0c1c2c; }
.bonus-heading { display: flex; align-items: center; justify-content: space-between; gap: 26px; }
.bonus-heading h2 { font-size: clamp(2rem,4.4vw,3.8rem); }
.bonus-price { flex: 0 0 auto; display: grid; text-align: center; padding: 18px 28px; border-radius: 23px; border: 1px solid #6df7c15c; background: #6df7c112; transform: rotate(4deg); }
.bonus-price strong { font-size: 4.6rem; line-height: 1.1; letter-spacing: -.07em; color: #91ffd7; }
.bonus-price span { font-size: .78rem; color: #c4f7e3; }
.bonus-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin: 32px 0; }
.bonus-grid article { padding: 22px; background: #08142188; border: 1px solid #ffffff14; border-radius: 18px; }
.bonus-number { display: block; color: #6df7c1; font: 700 .77rem/1 system-ui,sans-serif; margin-bottom: 20px; }
.bonus-grid h3 { font-size: 1.12rem; line-height: 1.3; }
.bonus-grid p,.difference-grid p { color: #b8c9db; font-size: .89rem; margin-bottom: 0; }
.bonus-bottom { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.bonus-bottom p { color: #b8c9db; margin: 0; }
.bonus-bottom strong { color: #f2fbff; }
.bonus-note,.comparison-caption { color: #a9bbcc; font-size: .76rem; line-height: 1.7; margin: 24px 0 0; }
.bonus-note a,.comparison-caption a { color: #b2e8ff; text-underline-offset: 3px; }
.comparison-label { color: #c5d6e7; font-size: .8rem; font-weight: 700; }
.value-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: .87rem; }
.value-table th,.value-table td { padding: 18px 12px; border-bottom: 1px solid #ffffff20; text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.value-table thead th { font-size: .76rem; color: #c5d6e7; }
.value-table th:first-child { width: 40%; }
.value-table td:last-child,.value-table thead th:last-child { background: #6df7c110; }
.value-table strong { color: #8bffce; font-size: 1rem; }
.value-table small { display: block; color: #a9bbcc; font-size: .69rem; margin-top: 6px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.difference-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; margin-top: 22px; }
.difference-grid article { padding: 27px; background: #0c1c2c; border: 1px solid #ffffff1a; border-radius: 20px; }
.difference-grid h3 { font-size: 1.12rem; }
@media (max-width: 980px) { .bonus-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 680px) {
  .bonus-shell { padding: 28px 20px; }
  .bonus-heading { align-items: flex-start; gap: 13px; }
  .bonus-heading .eyebrow { font-size: .65rem; }
  .bonus-price { padding: 15px 12px; transform: none; }
  .bonus-price strong { font-size: 3rem; }
  .bonus-price span { font-size: .63rem; }
  .bonus-grid,.difference-grid { grid-template-columns: 1fr; }
  .bonus-bottom { flex-direction: column; align-items: stretch; }
  .bonus-heading h2 { font-size: 2rem; }
  .value-table th,.value-table td { padding: 14px 7px; font-size: .77rem; }
  .value-table thead th { font-size: .7rem; }
  .value-table th:first-child { width: 36%; }
  .value-table strong { font-size: .84rem; }
}
@media (max-width: 360px) { .bonus-heading { flex-direction: column; } .bonus-price { display: flex; align-items: center; gap: 12px; transform: none; } }
@media (max-width: 980px) {
  .hero-grid { grid-template-columns: 1fr; grid-template-areas: "copy" "film" "conversion"; gap: 27px; }
  .hero-conversion { text-align: center; }
  .intro-film { width: min(100%,740px); margin-inline: auto; text-align: left; }
  .hero h1 { max-width: 18ch; margin-inline: auto; }
  .hero-conversion .hero-actions { margin-top: 0; }
}
@media (max-width: 680px) {
  .hero { padding-top: 140px; }
  .hero h1 { font-size: clamp(2.4rem,9.7vw,3.6rem); }
  .hero .lead { font-size: 1rem; line-height: 1.65; }
  .local-pill { font-size: .72rem; }
  .film-heading { padding: 13px; gap: 8px; font-size: .73rem; }
  .quality-badge { font-size: .57rem; }
  .film-controls { padding: 10px 10px 5px; gap: 5px; }
  .film-controls button { padding: 9px; font-size: .7rem; }
  .film-help { padding-inline: 12px; font-size: .72rem; }
  .hero-conversion .founder-intro { text-align: left; }
}
@media (max-width: 360px) {
  .film-controls { display: grid; grid-template-columns: 1fr 44px; }
  .film-controls .sound-button { margin-left: 0; }
}
