/* TideView public home — wide, sharp, editorial product storytelling. */
.marketing{
  --page:#050b12;
  --surface:#091622;
  --ink:#f4f8fb;
  --muted:#a5bac8;
  --cyan:#58dce7;
  --orange:#ffad38;
  --content:2200px;
  --wide:2860px;
  background:var(--page);
  color:var(--ink);
}
.marketing .container{width:min(calc(100% - 96px),var(--content));}
.marketing .section{padding:112px 0;}
.marketing .section-heading{max-width:900px;margin-bottom:52px;}
.marketing .section-heading.centered{margin-inline:auto;text-align:center;}
.marketing .section-heading.centered p{margin-inline:auto;}
.marketing .eyebrow{margin-bottom:18px;color:#7be7ed;font-size:12px;font-weight:800;letter-spacing:.17em;}
.marketing h2,.marketing .section-heading h2{font-size:clamp(46px,4vw,76px);line-height:1.02;letter-spacing:-.055em;}
.marketing p{color:var(--muted);}

/* Solid navigation; no blur over the page. */
.marketing .site-header.site-navigation{position:sticky;top:0;z-index:40;background:#06111b;border-bottom:1px solid #1d3342;backdrop-filter:none;}
.site-navigation .nav{display:grid;grid-template-columns:auto 1fr auto;width:min(calc(100% - 80px),var(--wide));min-height:82px;gap:38px;padding:8px 0;}
.site-navigation .brand{font-size:26px;font-weight:800;}
.site-navigation .brand>span,.marketing .site-footer .brand>span{color:#f4f8fb;}
.site-navigation .brand span span,.marketing .site-footer .brand span span{color:var(--cyan);}
.site-navigation .nav-links{justify-content:center;gap:28px;}
.site-navigation .nav-links a{color:#bfd0da;font-size:13px;font-weight:700;}
.site-navigation .nav-links a:hover{color:#fff;}
.site-navigation .nav-links .nav-cta,.site-navigation .nav-account{border:1px solid #36596a;border-radius:999px;background:#0d2430;color:#e5f8f9;}

/* The hero gives the real UI enough pixels to stay legible. */
.marketing .launch-hero{padding:102px 0 112px;background:linear-gradient(115deg,#091527 0 28%,#062234 58%,#071019 100%);overflow:hidden;}
.marketing .launch-hero .container{width:min(calc(100% - 112px),var(--wide));}
.marketing .hero-layout{display:grid;grid-template-columns:minmax(480px,620px) minmax(0,2172px);gap:72px;align-items:center;justify-content:center;}
.marketing .launch-copy{text-align:left;}
.marketing .launch-copy h1{margin:0 0 28px;font-size:clamp(68px,5vw,112px);line-height:.92;letter-spacing:-.075em;}
.marketing .launch-copy h1 span{color:#77e4ea;text-shadow:none;}
.marketing .launch-lead{max-width:590px;margin:0 0 34px;color:#c7d6df;font-size:22px;line-height:1.55;}
.marketing .actions{display:flex;justify-content:flex-start;gap:14px;}
.marketing .button{min-height:52px;padding:14px 23px;border:1px solid #43677a;border-radius:999px;background:#102431;color:#eef8fa;font-weight:750;}
.marketing .button.primary{background:linear-gradient(90deg,#ffae3d,#67dee9);border:0;color:#07151c;}
.marketing .hero-fine{margin:22px 0 0;color:#91a7b5;font-size:13px;line-height:1.7;}
.marketing .hero-preview{position:relative;width:100%;margin:0;transform:none;filter:none;}
.marketing .hero-preview::after{content:"";position:absolute;inset:auto 0 25px;height:18%;background:linear-gradient(transparent,#07131e);pointer-events:none;}
.marketing .hero-preview>img{display:block;width:100%;height:auto;border:0;border-radius:0;box-shadow:none;mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 96%,transparent 100%);}
.marketing .hero-preview figcaption{display:flex;justify-content:space-between;gap:20px;margin-top:13px;color:#8fa8b7;font-size:12px;text-align:left;}
.marketing .hero-preview figcaption span:first-child{color:#d7e6ec;font-weight:700;}
.marketing .hero-lifestyle{isolation:isolate;}
.marketing .hero-lifestyle::before{content:"";position:absolute;z-index:-1;inset:-7%;border-radius:50%;background:radial-gradient(ellipse,#36d8ef36 0,#7a4ff027 42%,transparent 72%);filter:blur(34px);}
.marketing .hero-lifestyle::after{display:none;}
.marketing .hero-lifestyle>img{aspect-ratio:16/9;object-fit:cover;border:1px solid #6cd9eb52;border-radius:24px;box-shadow:0 36px 90px #000a,0 0 48px #27dce326;mask-image:none;}
.marketing .platform-strip{background:#091722;border-block:1px solid #223b4a;}
.marketing .platform-strip>.container{width:min(calc(100% - 96px),2200px);justify-content:center;gap:58px;padding-block:26px;}

/* One app on each screen. */
.marketing #experience{background:#071019;}
.marketing #experience>.container{width:min(calc(100% - 96px),2200px);}
.marketing .device-tabs{gap:8px;margin-bottom:28px;border-bottom:1px solid #294656;}
.marketing .device-tabs button{padding:12px 22px 16px;border:0;border-bottom:3px solid transparent;border-radius:0;background:transparent;color:#9fb5c2;}
.marketing .device-tabs button[aria-selected=true]{border-color:var(--cyan);background:transparent;color:#fff;}
.marketing .screen{overflow:hidden;height:auto;min-height:0;border:0;border-radius:0;background:transparent;box-shadow:none;}
.marketing .screen::after{display:none;}
.marketing .screen img{display:block;width:100%;height:auto;aspect-ratio:auto!important;object-fit:contain;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);}
.marketing .device-gallery figcaption{margin-top:18px;color:#adc0cb;font-size:16px;}
.marketing .library-screenshot{margin-top:30px;}
.marketing .preview-disclosure{max-width:1100px;margin-top:24px;color:#8299a8;font-size:12px;}
.marketing .mobile-screen{width:min(100%,420px);margin-inline:auto;}
.marketing .mobile-screen img{display:block;width:100%;height:auto;border:1px solid #315566;border-radius:24px;box-shadow:0 24px 60px #0008;}
.marketing #panel-android-mobile figcaption{text-align:center;}
.theme-callout{display:grid;grid-template-columns:1.3fr .7fr;gap:46px;align-items:center;margin-top:56px;padding:36px 0;border-block:1px solid #315568;background:transparent;}
.theme-callout h3{margin:0 0 9px;font-size:30px;}
.theme-callout p:not(.eyebrow){margin:0;max-width:760px;}
.theme-swatches{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
.theme-swatches span{display:block;aspect-ratio:1;border-radius:50%;}
.theme-ocean{background:linear-gradient(145deg,#08253b,#21d4df)}
.theme-sunset{background:linear-gradient(145deg,#ff9d2e,#ff3b83)}
.theme-violet{background:linear-gradient(145deg,#271250,#a55dff)}
.theme-gold{background:linear-gradient(145deg,#17130b,#e7b23b)}

/* The phone has its own intentional stage. */
.phone-story{position:relative;overflow:hidden;background:linear-gradient(120deg,#07111c 0 52%,#0b3040 100%);border-block:1px solid #203d4e;}
.phone-story::before{content:"";position:absolute;width:760px;height:760px;right:24%;top:50%;translate:50% -50%;border-radius:50%;background:radial-gradient(circle,#1f8fae80 0,#14607d45 38%,transparent 70%);}
.phone-story .container{position:relative;width:min(calc(100% - 96px),1900px);}
.phone-layout{display:grid;grid-template-columns:minmax(420px,1fr) 390px minmax(380px,.9fr);gap:90px;align-items:center;}
.phone-copy h2{margin-bottom:28px;}
.phone-copy>p:not(.eyebrow){max-width:590px;font-size:19px;line-height:1.65;}
.phone-device{margin:0;text-align:center;}
.phone-device img{display:block;width:100%;height:auto;border:9px solid #101c25;border-radius:45px;background:#06101a;box-shadow:0 36px 80px #0009;}
.phone-device figcaption{margin-top:15px;color:#8ea6b5;font-size:12px;}
.phone-notes{border-left:1px solid #315263;padding-left:42px;}
.phone-notes article{padding:24px 0;border-bottom:1px solid #294656;}
.phone-notes article:last-child{border-bottom:0;}
.phone-notes span{color:var(--cyan);font-size:12px;font-weight:800;letter-spacing:.12em;}
.phone-notes h3{margin:8px 0;font-size:22px;}
.phone-notes p{margin:0;font-size:15px;line-height:1.6;}

/* Large editorial product rows with fading edges instead of boxes. */
.product-story{position:relative;padding:126px 0;overflow:hidden;}
.product-story .container{width:min(calc(100% - 112px),var(--wide));}
.product-story-grid{display:grid;grid-template-columns:minmax(440px,560px) minmax(0,2172px);gap:88px;align-items:center;justify-content:center;}
.product-story-copy h2{margin:0 0 27px;font-size:clamp(54px,4.4vw,88px);line-height:.96;letter-spacing:-.065em;}
.product-story-copy h2 span,.music-heading h2 span{color:#73e1e7;}
.product-story-copy>p:not(.eyebrow){font-size:18px;line-height:1.68;}
.proof-list{display:grid;gap:0;margin:28px 0;padding:0;list-style:none;}
.proof-list li{padding:13px 0 13px 27px;border-top:1px solid #274454;color:#c6d6df;font-size:15px;position:relative;}
.proof-list li::before{content:'✓';position:absolute;left:0;color:#71e2e9;font-weight:800;}
.product-visual{margin:0;min-width:0;}
.product-visual img{display:block;width:100%;height:auto;border:0;border-radius:0;box-shadow:none;mask-image:linear-gradient(90deg,transparent 0,#000 4%,#000 96%,transparent 100%);}
.product-visual figcaption,.sports-product-shot figcaption{margin-top:14px;color:#819aa9;font-size:12px;text-align:center;}
.guide-story{background:linear-gradient(110deg,#06101a 0 42%,#07364a 100%);}

/* Network-tuner output gets a dedicated, honest compatibility story. */
.tuner-story{background:linear-gradient(120deg,#07121d 0 52%,#0b2f3e 100%);border-block:1px solid #264859;}
.tuner-story>.container{width:min(calc(100% - 96px),2200px);}
.tuner-layout{display:grid;grid-template-columns:minmax(420px,.75fr) minmax(720px,1.25fr);gap:90px;align-items:center;}
.tuner-copy h2{margin:0 0 27px;font-size:clamp(52px,4.4vw,82px);line-height:.98;letter-spacing:-.06em;}
.tuner-copy>p:not(.eyebrow):not(.section-note){max-width:650px;font-size:18px;line-height:1.68;}
.tuner-copy .section-note{max-width:680px;margin-top:25px;padding-top:20px;border-top:1px solid #315365;}
.tuner-flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:22px;padding:58px 0;border-block:1px solid #3b6474;}
.tuner-flow article{display:grid;min-width:0;gap:9px;padding:18px 4px;}
.tuner-flow article>span{color:var(--orange);font-size:12px;font-weight:800;letter-spacing:.14em;}
.tuner-flow strong{color:#f1f8fa;font-size:clamp(20px,1.7vw,28px);line-height:1.18;}
.tuner-flow small{color:#93aab7;font-size:14px;line-height:1.55;}
.tuner-flow i{color:var(--cyan);font-size:32px;font-style:normal;}

/* Music: one sharp app screen and one supporting lifestyle moment. */
.music-story{background:linear-gradient(180deg,#070d14,#09131d);}
.music-story .container{width:min(calc(100% - 96px),2200px);}
.music-layout{display:grid;gap:46px;}
.music-heading{display:grid;grid-template-columns:minmax(420px,1fr) minmax(480px,1fr);gap:70px;align-items:end;}
.music-heading .eyebrow{grid-column:1/-1;margin-bottom:-42px;}
.music-heading h2{margin:0;font-size:clamp(58px,5vw,96px);line-height:.96;letter-spacing:-.065em;}
.music-heading>p:not(.eyebrow){max-width:690px;margin:0 0 7px;font-size:20px;line-height:1.65;}
.music-app img{mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent),linear-gradient(180deg,#000 0,#000 88%,transparent 100%);mask-composite:intersect;}
.music-support{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(360px,.75fr);gap:0;align-items:stretch;}
.music-support figure{margin:0;min-height:400px;}
.music-support figure img{display:block;width:100%;height:100%;object-fit:cover;mask-image:linear-gradient(90deg,#000 0,#000 75%,transparent 100%);}
.music-support>div{display:flex;flex-direction:column;justify-content:center;padding:55px 20px 55px 0;}
.music-support h3{margin:0 0 16px;font-size:38px;}
.music-support p:last-child{margin:0;font-size:17px;line-height:1.65;}

/* Backup uses full-bleed photography and HTML copy. */
.backup-story{min-height:760px;display:grid;align-items:center;padding:0;background:#06111b;}
.backup-image{position:absolute;inset:0;background-image:linear-gradient(90deg,#03101bf5 0,#03101bdc 30%,#03101b50 58%,transparent 78%),url('/assets/launch/tideview-photo-backup-home.webp');background-size:cover;background-position:center;}
.backup-content{position:relative;z-index:2;padding-block:130px;}
.backup-content .product-story-copy{max-width:620px;}
.backup-lead strong{color:#fff;}

/* Competitive proof and setup keep structure without card soup. */
.difference-section{background:#0a1722;}
.difference-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px;}
.difference-grid article{min-height:270px;padding:30px 0;border-top:2px solid #345b6b;}
.difference-grid article>span{color:var(--cyan);font-size:12px;font-weight:800;letter-spacing:.14em;}
.difference-grid h3{margin:54px 0 12px;font-size:25px;}
.difference-grid p{margin:0;font-size:15px;line-height:1.65;}
.product-proof{background:#050b12;}
.product-proof>.container{width:min(calc(100% - 96px),2200px);}
.proof-gallery{display:grid;gap:100px;}
.proof-gallery figure{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(320px,.35fr);gap:44px;align-items:center;margin:0;}
.proof-gallery figure:nth-child(even){grid-template-columns:minmax(320px,.35fr) minmax(0,1.65fr);}
.proof-gallery figure:nth-child(even) img{grid-column:2;grid-row:1;}
.proof-gallery figure:nth-child(even) figcaption{grid-column:1;grid-row:1;}
.proof-gallery img{display:block;width:100%;height:auto;border:0;border-radius:0;background:transparent;box-shadow:none;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);}
.proof-gallery figcaption{display:grid;gap:12px;color:#8ca5b4;font-size:15px;}
.proof-gallery figcaption strong{color:#edf6f8;font-size:28px;line-height:1.2;}
.getting-started{background:#0a1722;}
.start-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px;margin:0;padding:0;list-style:none;}
.start-grid li{min-height:230px;padding:30px 0;border-top:2px solid #315064;}
.start-grid li>span{color:var(--orange);font-size:12px;font-weight:800;letter-spacing:.14em;}
.start-grid h3{margin:56px 0 10px;font-size:24px;}
.start-grid p{margin:0;font-size:15px;}

/* Older informational sections stay readable inside the wider page. */
.ownership-layout,.pricing-layout,.streaming-layout,.alpha-layout,.enhancement-layout{max-width:1700px;margin-inline:auto;}
.benefit-grid,.platform-grid,.requirements-scroll,.hardware-notes{max-width:1900px;margin-inline:auto;}
.requirements-swipe{display:none;}

/* Sports uses a large untransformed product screen and a cinematic four-view. */
.sports-section{background:#081624;}
.sports-section>.container{width:min(calc(100% - 96px),2200px);}
.sports-layout{grid-template-columns:.8fr 1.2fr;gap:90px;}
.sports-product-shot{margin:76px 0 0;}
.sports-product-shot img{display:block;width:100%;height:auto;border:0;border-radius:0;box-shadow:none;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);}
.four-view-feature{display:grid;grid-template-columns:.7fr 1.3fr;gap:64px;align-items:center;margin-top:88px;padding:0;}
.four-view-feature h3{margin:0 0 17px;font-size:40px;line-height:1.12;}
.four-view-feature figure{margin:0;}
.four-view-feature img{display:block;width:100%;height:auto;border-radius:0;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 100%);}
.sports-rights{margin-top:24px;color:#8199aa;font-size:12px;}

@media(max-width:1500px){
  .marketing .container{width:min(calc(100% - 64px),var(--content));}
  .marketing .launch-hero .container,.product-story .container{width:min(calc(100% - 72px),var(--wide));}
  .marketing .hero-layout{grid-template-columns:minmax(390px,510px) minmax(0,1fr);gap:48px;}
  .marketing .launch-copy h1{font-size:clamp(62px,6vw,92px);}
  .product-story-grid{grid-template-columns:minmax(360px,470px) minmax(0,1fr);gap:48px;}
  .phone-layout{grid-template-columns:minmax(340px,1fr) 330px minmax(320px,.8fr);gap:54px;}
}
@media(max-width:1100px){
  .site-navigation .nav{grid-template-columns:1fr auto;width:calc(100% - 48px);}
  .site-navigation .nav-links{grid-column:1/-1;grid-row:2;justify-content:flex-start;overflow-x:auto;width:100%;}
  .marketing .launch-hero{padding:74px 0 82px;}
  .marketing .hero-layout,.product-story-grid,.music-heading,.phone-layout,.tuner-layout{grid-template-columns:1fr;}
  .marketing .launch-copy{max-width:800px;}
  .phone-device{width:min(100%,360px);margin-inline:auto;}
  .phone-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;border-left:0;padding-left:0;}
  .phone-notes article{border-top:1px solid #315263;border-bottom:0;}
  .music-heading .eyebrow{grid-column:auto;margin-bottom:0;}
  .music-support{grid-template-columns:1fr;}
  .music-support figure img{mask-image:linear-gradient(180deg,#000 0,#000 82%,transparent);}
  .music-support>div{padding:20px 0 0;}
  .difference-grid,.start-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .proof-gallery figure,.proof-gallery figure:nth-child(even){grid-template-columns:1fr;gap:18px;}
  .proof-gallery figure:nth-child(even) img,.proof-gallery figure:nth-child(even) figcaption{grid-column:1;grid-row:auto;}
  .proof-gallery figure:nth-child(even) img{grid-row:1;}
  .four-view-feature,.theme-callout,.how-card{grid-template-columns:1fr;}
}
@media(max-width:700px){
  html,body{max-width:100%;overflow-x:hidden;}
  .site-navigation .nav{width:calc(100% - 28px);min-width:0;gap:12px;}
  .site-navigation .brand{min-width:0;}
  .site-navigation .nav-account{max-width:48px;padding-inline:13px;overflow:hidden;white-space:nowrap;color:transparent;}
  .site-navigation .nav-account svg{color:#e5f8f9;}
  .site-navigation .nav-links{min-width:0;max-width:100%;}
  .marketing .container,.marketing .launch-hero .container,.product-story .container,.phone-story .container,.sports-section>.container,.product-proof>.container{width:calc(100% - 36px);}
  .marketing .section,.product-story{padding:72px 0;}
  .marketing .hero-layout,.marketing .launch-copy,.marketing .launch-copy h1,.marketing .launch-lead{min-width:0;max-width:100%;}
  .marketing .launch-copy h1{font-size:clamp(44px,12vw,58px);letter-spacing:-.065em;overflow-wrap:anywhere;}
  .marketing .launch-lead{font-size:18px;}
  .marketing .actions{align-items:stretch;flex-direction:column;}
  .marketing .actions .button{width:100%;}
  .marketing .hero-preview figcaption{display:block;}
  .marketing .hero-preview figcaption span{display:block;margin-top:4px;}
  .marketing .platform-strip>.container{justify-content:flex-start;gap:13px 22px;flex-wrap:wrap;}
  .marketing .platform-strip span{width:100%;text-align:left;}
  .phone-notes,.difference-grid,.start-grid{grid-template-columns:1fr;}
  .product-story-copy h2,.music-heading h2{font-size:clamp(48px,13vw,68px);}
  .music-support figure{min-height:240px;}
  .difference-grid article,.start-grid li{min-height:0;}
  .difference-grid h3,.start-grid h3{margin-top:30px;}
  .proof-gallery{gap:58px;}
  .proof-gallery figcaption strong{font-size:23px;}
  .sports-layout{grid-template-columns:1fr;gap:38px;}
  .four-view-feature h3{font-size:30px;}
  .tuner-flow{grid-template-columns:1fr;gap:8px;padding:32px 0;}
  .tuner-flow article{padding:15px 0;}
  .tuner-flow i{rotate:90deg;justify-self:start;font-size:25px;}
}
@media(max-width:700px){
  .marketing #experience>.container,.marketing .platform-strip>.container{width:calc(100% - 36px);}
  .marketing .section-heading{margin-bottom:40px;}
  .marketing .device-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;border-bottom:0;}
  .marketing .device-tabs button{min-height:48px;padding:10px 8px;border:1px solid #294656;border-radius:12px;background:#0c1e2a;text-align:center;}
  .marketing .device-tabs button[aria-selected=true]{border-color:var(--cyan);background:#123340;}
  .marketing #panel-pc .screen img{aspect-ratio:2.25/1!important;object-fit:cover;object-position:left top;mask-image:none;border-radius:14px;}
  .theme-callout{gap:24px;margin-top:42px;padding:28px 0;}
  .theme-swatches{grid-template-columns:repeat(4,minmax(42px,54px));justify-content:start;}
  .phone-notes{gap:0;}
  .phone-notes article{padding:20px 0;}
  .sports-product-shot{margin-top:48px;}
  .four-view-feature{margin-top:52px;}
  .proof-gallery img,.sports-product-shot img{aspect-ratio:2.25/1;object-fit:cover;object-position:left top;mask-image:none;border-radius:14px;}
  .marketing details summary{display:flex;align-items:center;min-height:44px;}
  .marketing .footer-links a{display:inline-flex;align-items:center;min-height:44px;}
  .requirements-scroll{-webkit-overflow-scrolling:touch;scrollbar-color:#58dce7 #101c28;scrollbar-width:thin;}
  .requirements-swipe{display:flex;align-items:center;gap:8px;margin:-18px 0 12px;color:#9fc0ce;font-size:13px;font-weight:700;}
}
@media(max-width:400px){
  .marketing h2,.marketing .section-heading h2{font-size:clamp(40px,12vw,46px);}
  .product-story-copy h2,.music-heading h2,.tuner-copy h2{font-size:clamp(42px,12vw,48px);}
  .price-card{padding:24px 20px;}
  .price{font-size:84px;}
  .price>span{font-size:40px;}
  .price small{margin-left:10px;font-size:14px;}
}
@media(prefers-reduced-motion:reduce){.marketing *{scroll-behavior:auto!important;transition:none!important;}}
