/* Blue-lit desktop studio: white canvas, compact near-black type, one saturated blue
   (sampled from the app icon) for exploration controls, real app media framed in
   20px cards over a pale blue field. Fonts stay local: the system SF face carries
   the 450/550/600 weights the reference uses with Google Sans Flex. */
:root{
  color-scheme:light;
  --paper:#fff;
  --ink:#000;
  --graphite:#161618;
  --charcoal:#6a6a6b;
  --studio:#0f0f12;
  --blue:#085cec;
  --blue-bright:#168fff;
  --sweep:linear-gradient(90deg,#161618 0%,#161618 38%,#085cec 100%);
  --hairline:rgba(22,22,24,.08);
  --fill-soft:rgba(22,22,24,.05);
  --glow:radial-gradient(60% 70% at 50% 40%,#d3edfe 0%,#e8f5ff 45%,transparent 80%);
  --field:radial-gradient(120% 90% at 0% 0%,#dff3ff 0%,transparent 55%),radial-gradient(110% 90% at 100% 100%,#cee9ff 0%,transparent 60%),#f6fbff;
  --shadow-card:rgba(22,22,24,.02) 0 7px 20px -8px,rgba(22,22,24,.02) 0 29px 33px -4px,rgba(22,22,24,.05) 0 22px 30px -8px,rgba(22,22,24,.06) 0 0 0 1px;
  --shadow-blue:rgba(4,24,85,.28) 0 2px 6px -1px,rgba(66,174,247,.48) 0 6px 14px 0 inset;
  --shadow-chip:rgba(22,22,24,.2) 0 2px 6px -1px,rgba(22,22,24,.16) 0 0 0 1px;
  --shadow-window:rgba(14,35,88,.10) 0 30px 60px -20px,rgba(22,22,24,.08) 0 12px 24px -12px,rgba(22,22,24,.08) 0 0 0 1px;
  --r-control:14px;
  --r-card:20px;
  font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  font-size:16px;
  line-height:1.5;
  font-synthesis:none;
  -webkit-font-smoothing:antialiased;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--paper);color:var(--ink)}
button,a{touch-action:manipulation}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--blue-bright);outline-offset:4px}
button{font:inherit}
img,video{display:block;max-width:100%}
img{height:auto}
h1,h2,h3,p,figure{margin-top:0}
h1,h2,h3{color:var(--ink);font-weight:600}
h2{font-size:clamp(2.25rem,3.6vw,2.5rem);line-height:1.2;letter-spacing:-.02em}
h3{line-height:1.4}
em{font-style:normal;color:inherit}
h2 em,.showcase-heading h2 em{color:var(--charcoal)}
.wrap{width:min(100% - 64px,1200px);margin-inline:auto}
.skip-link{position:fixed;z-index:40;left:18px;top:-100px;padding:10px 16px;border-radius:var(--r-control);background:#fff;color:#000;box-shadow:var(--shadow-chip)}
.skip-link:focus{top:14px}

/* Navigation */
.site-header{height:68px;position:sticky;top:0;z-index:30;background:rgba(255,255,255,.82);backdrop-filter:saturate(1.6) blur(20px);-webkit-backdrop-filter:saturate(1.6) blur(20px);box-shadow:0 1px 0 var(--hairline)}
.nav{height:100%;display:flex;align-items:center;gap:28px}
.wordmark{display:inline-flex;align-items:center;gap:10px;font-size:1.06rem;font-weight:600;letter-spacing:-.02em;color:var(--graphite);white-space:nowrap}
.wordmark img,.closing-inner>img{border-radius:22%;box-shadow:0 4px 8px #0000001a}
.nav-links{display:flex;align-items:center;gap:6px;margin-left:auto;font-size:15px;font-weight:550;line-height:1.6;color:var(--graphite)}
.nav-links a{padding:6px 12px;border-radius:10px;transition:background .15s ease}
.nav-links a:hover{background:var(--fill-soft)}
.nav-links a:last-child{margin-left:4px;padding:6px 13px 6px 16px;border:1px solid var(--graphite);border-radius:var(--r-control)}
.nav-cta{min-height:40px;padding:8px 16px;font-size:15px}
.menu-toggle{display:none;margin-left:auto;min-width:44px;min-height:44px;align-items:center;justify-content:center;gap:7px;padding:0 10px;background:none;border:1px solid var(--graphite);border-radius:var(--r-control);color:var(--graphite);cursor:pointer;font-weight:550}

/* Shared type and controls */
.eyebrow{margin-bottom:0;font-size:14px;font-weight:550;line-height:1.43;color:var(--charcoal)}
.section{padding:104px 0}
.button,.text-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:11px 20px;border-radius:var(--r-control);font-size:15px;font-weight:550;line-height:1.6;transition:background .18s ease,transform .18s ease,box-shadow .18s ease}
.button:hover,.text-link:hover{transform:translateY(-1px)}
.button-primary{border:1px solid #fff;background:var(--blue);color:#fff;box-shadow:var(--shadow-blue)}
.button-primary:hover{background:#0752d6}
.text-link{border:1px solid var(--graphite);background:#fff;color:var(--graphite)}
.text-link:hover{background:#fafafa}
.play-glyph{width:0;height:0;border-style:solid;border-width:5.5px 0 5.5px 9px;border-color:transparent transparent transparent currentColor}
.section-link{display:inline-flex;align-items:center;gap:6px;margin-top:24px;color:var(--graphite);font-size:15px;font-weight:550}
.section-link:hover,.workflow-card a:hover,.closing-link:hover,.site-footer a:hover{text-decoration:underline;text-underline-offset:5px}

/* Hero: badge, two-line display, copy, controls, guarantee line, then the product stage */
.hero{position:relative;padding:72px 0 96px;overflow:hidden}
.hero-glow{position:absolute;z-index:0;left:50%;top:300px;width:min(1400px,140%);height:760px;transform:translateX(-50%);background:var(--glow);filter:blur(30px);pointer-events:none}
.stage-heading{display:none}
.hero-content{position:relative;z-index:1;display:flex;flex-direction:column;text-align:center}
.hero-editorial{max-width:1000px;margin:0 auto}
.announce-badge{display:inline-flex;align-items:center;gap:8px;margin:0 0 24px;padding:8px 13px 8px 10px;border-radius:var(--r-control);background:var(--studio);color:#fff;font-size:14px;font-weight:550;letter-spacing:.01em}
.hero .announce-badge{color:#fff}
.status-dot{width:7px;height:7px;border-radius:50%;background:var(--blue-bright);box-shadow:0 0 0 3px #168fff40}
.hero h1{margin:0;font-size:clamp(2.4rem,4.4vw,3.5rem);font-weight:600;line-height:1.12;letter-spacing:-.02em}
.hero h1>span{display:block}
@media(min-width:900px){.hero h1>span{white-space:nowrap}}
.sweep{background:var(--sweep);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;padding-right:.04em}
.hero-aside{margin-top:20px}
.hero-intro{max-width:600px;margin:0 auto;color:var(--charcoal);font-size:18px;font-weight:450;line-height:1.67;letter-spacing:.01em}
.hero-actions,.closing-actions{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:28px}
.compatibility{margin:16px 0 0;color:var(--charcoal);font-size:13px;line-height:1.23}
.compatibility strong{color:var(--graphite);font-weight:550}
.hero-visual{position:relative;width:min(100%,1080px);margin:64px auto 0}
.visual-halo{display:none}
.hero-orbit{position:absolute;z-index:2;top:-26px;left:-34px;width:76px;height:76px;border-radius:20px;background:#fff url("app-icon.png") center/56px 56px no-repeat;box-shadow:var(--shadow-card);transform:rotate(-9deg)}
.window-frame{position:relative;height:clamp(300px,36vw,520px);overflow:hidden;padding:28px 28px 0;border-radius:var(--r-card);background:var(--field);box-shadow:var(--shadow-card)}
.window-frame picture{display:block;height:100%;overflow:hidden;border-radius:12px 12px 0 0;background:#fff;box-shadow:var(--shadow-window)}
.window-frame img{width:100%;max-width:none;transform:translateY(-5.2%) scale(1.11);transform-origin:top center}
.hero-mobile-panes{display:none}
.visual-label{position:absolute;right:28px;bottom:-18px;display:flex;align-items:center;gap:10px;padding:8px 13px 8px 8px;border-radius:var(--r-control);background:#fff;box-shadow:var(--shadow-chip);color:var(--graphite);font-size:14px;font-weight:450}
.visual-label strong{font-weight:600}
.label-icon{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:var(--studio);color:#fff;font-size:.9rem}
.image-note{align-self:center;margin:34px 0 0;color:var(--charcoal);font-size:13px;line-height:1.5}
.image-note a,.media-card figcaption a,.faq-list a{text-decoration:underline;text-underline-offset:3px;color:var(--graphite)}

/* Monochrome fact strip in place of a partner-logo row */
.fact-strip{padding:8px 0 0}
.fact-inner{display:flex;align-items:center;justify-content:center;gap:12px 28px;flex-wrap:wrap;padding:28px 0;border-block:1px solid var(--hairline)}
.fact-inner p{margin:0;color:var(--charcoal);font-size:14px;font-weight:450}
.fact-inner ul{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 28px;margin:0;padding:0;list-style:none}
.fact-inner li{color:#737375;font-size:17px;font-weight:600;letter-spacing:-.01em}

/* Section intros */
.intro-grid,.section-heading,.showcase-heading{max-width:760px;text-align:center}
.intro-grid h2,.section-heading h2,.showcase-heading h2{margin:12px 0 0}
.section-lead,.section-heading>p,.showcase-heading>p:last-child{max-width:620px;margin:20px auto 0;color:var(--charcoal);font-size:18px;font-weight:450;line-height:1.67}
.feature-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px}
.feature-strip article,.workflow-card,.trust-items p{border-radius:var(--r-card);background:#fff;box-shadow:var(--shadow-card)}
.feature-strip article{min-width:0;padding:28px}
.feature-number{display:inline-grid;place-items:center;min-width:32px;height:28px;padding:0 8px;border-radius:9px;background:var(--fill-soft);color:var(--charcoal);font-size:13px;font-weight:550}
.feature-strip h3{margin:20px 0 8px;font-size:20px}
.feature-strip p{margin:0;color:var(--charcoal);font-size:15px;line-height:1.6}
.feature-strip .section-link{margin-top:16px}
.feature-note{max-width:460px;margin:20px 0 0;color:var(--charcoal);font-size:14px;line-height:1.5}

/* Alternating feature rows: copy on one side, framed product scene on the other */
.feature-section{background:var(--paper)}
.feature-section+.feature-section{padding-top:0}
.feature-layout{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:64px}
.feature-layout-reverse{grid-template-columns:1.2fr .8fr}
.feature-layout-reverse .feature-copy{grid-column:2;grid-row:1}
.feature-layout-reverse .media-card{grid-column:1;grid-row:1}
.feature-copy h2{margin:12px 0 20px}
.feature-copy>p:not(.eyebrow){max-width:460px;margin:0;color:var(--charcoal);font-size:18px;font-weight:450;line-height:1.67}
.query-example{display:flex;align-items:center;gap:8px;flex-wrap:wrap;width:fit-content;margin-top:24px;padding:8px 10px 8px 14px;border-radius:var(--r-control);background:#fff;box-shadow:var(--shadow-chip);color:var(--charcoal);font-size:14px}
.query-example>span:first-child{font-weight:550;color:var(--graphite)}
.chip{padding:3px 10px;border-radius:9px;background:var(--studio);color:#fff;font-size:13px;font-weight:550}
.media-card{min-width:0;margin:0;padding:28px;border-radius:var(--r-card);background:var(--field);box-shadow:var(--shadow-card)}
/* Captures carry black recording margins (4.4% top, 8.9% bottom, 4.3% sides).
   Stages and pictures use the content box ratio (1.66) and offset the image to it. */
.video-stage{position:relative;width:100%;aspect-ratio:1.66;overflow:hidden;border-radius:12px;background:#fff;box-shadow:var(--shadow-window)}
.media-card .video-stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#fff}
.has-js .video-stage:not(.is-playing) video{visibility:hidden}
.video-start{display:none}
.has-js .video-start{position:absolute;inset:0;display:grid;place-items:center;width:100%;height:100%;padding:0;border:0;background:#fff;cursor:pointer;overflow:hidden}
.video-stage.is-playing .video-start{display:none}
.video-start img{position:absolute;left:-4.67%;top:-5.1%;width:109.34%;height:auto;max-width:none;transform:none}
.video-start:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(15,15,18,.18))}
.play-circle{position:relative;z-index:1;display:grid;place-items:center;width:56px;height:56px;padding-left:4px;border-radius:50%;background:rgba(255,255,255,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--graphite);font-size:1.1rem;box-shadow:var(--shadow-chip);transition:transform .18s ease}
.video-start:hover .play-circle{transform:scale(1.06)}
.video-label{position:absolute;z-index:1;bottom:16px;left:50%;transform:translateX(-50%);padding:8px 13px;border-radius:var(--r-control);background:#fff;box-shadow:var(--shadow-chip);color:var(--graphite);font-size:14px;font-weight:550;white-space:nowrap}
.video-error{position:absolute;z-index:2;bottom:8px;left:8px;right:8px;padding:9px 12px;border-radius:10px;background:#fff;color:var(--graphite);font-size:.8rem;text-align:center}
.video-error[hidden]{display:none}
.video-error a{text-decoration:underline;color:var(--blue)}
.media-card figcaption{margin:16px 2px 0;color:var(--charcoal);font-size:13px;line-height:1.5}
.mobile-detail{display:none}

/* Showcase: macOS-style segmented control over a framed scene */
.showcase-heading>p:last-child{margin-bottom:40px}
.showcase-shell{padding:12px;border-radius:24px;background:#fff;box-shadow:var(--shadow-card)}
.showcase-tabs{display:flex;gap:4px;width:fit-content;max-width:100%;margin:0 auto 12px;padding:4px;border-radius:var(--r-control);background:var(--fill-soft)}
.showcase-tab{min-height:40px;min-width:136px;padding:8px 16px;border:0;border-radius:10px;background:transparent;color:var(--charcoal);font-size:15px;font-weight:550;cursor:pointer;white-space:nowrap;transition:background .18s ease,box-shadow .18s ease}
.showcase-tab[aria-selected="true"]{background:#fff;color:var(--graphite);box-shadow:var(--shadow-chip)}
.showcase-tab:hover:not([aria-selected="true"]){background:rgba(22,22,24,.06)}
.tab-index{font-size:12px;margin-right:6px;opacity:.7}
.showcase-panel{display:grid;grid-template-columns:.63fr 1.37fr;align-items:center;gap:2%;min-height:420px;overflow:hidden;border-radius:var(--r-card);background:var(--field)}
.showcase-panel[hidden]{display:none}
.showcase-panel:not([hidden]){animation:showcase-enter .22s ease-out both}
@keyframes showcase-enter{from{opacity:.75;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
.showcase-copy{padding:36px 0 36px 40px}
.showcase-copy h3{margin:10px 0 12px;font-size:clamp(1.6rem,2.4vw,2rem);line-height:1.2;letter-spacing:-.02em}
.showcase-copy>p:not(.eyebrow){margin:0;color:var(--charcoal);font-size:16px;line-height:1.6}
.showcase-image{height:100%;min-width:0;display:flex;align-items:center;padding:28px 0 28px 0;overflow:hidden}
.showcase-image picture{position:relative;aspect-ratio:1.66;display:block;width:100%;flex:none;border-radius:12px 0 0 12px;overflow:hidden;box-shadow:var(--shadow-window)}
.showcase-image picture img{position:absolute;left:-4.67%;top:-5.1%;width:109.34%;height:auto;max-width:none;transform:none}
.showcase-mobile-panes,.showcase-mobile-search{display:none}
.showcase-video{padding-right:28px}
.showcase-video .video-stage{flex:1}
.showcase-image.showcase-zoom picture img{transform:scale(1.6);transform-origin:95.7% 9%}
.showcase-note{max-width:1200px;margin:16px auto 0;text-align:center;color:var(--charcoal);font-size:13px}

/* Safety details: text cards under the rename story */
.safety-points{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px}
.workflow-card{min-width:0;overflow:hidden}
.card-body{padding:28px}
.card-kicker{color:var(--charcoal);font-size:14px;font-weight:550}
.card-body h3{margin:8px 0 8px;font-size:20px;letter-spacing:-.01em}
.card-body p{margin:0;color:var(--charcoal);font-size:15px;line-height:1.6}
.card-body a{display:inline-block;margin-top:16px;color:var(--graphite);font-size:15px;font-weight:550}

/* Compare: "you keep" / "you gain", no scoring */
.compare-card{max-width:960px;margin-top:48px;padding:8px 32px 24px;border-radius:var(--r-card);background:#fff;box-shadow:var(--shadow-card)}
.compare-list{margin:0}
.compare-row{display:grid;grid-template-columns:.8fr 1.2fr;gap:32px;padding:20px 0;border-bottom:1px solid var(--hairline)}
.compare-head{padding:16px 0 12px;color:var(--charcoal);font-size:13px;font-weight:550}
.compare-head span:last-child{color:var(--blue)}
.compare-row dt{color:var(--graphite);font-size:16px;font-weight:550}
.compare-row dd{margin:0;color:var(--charcoal);font-size:16px;line-height:1.6}
.compare-row dd a{margin-left:4px;color:var(--graphite);font-weight:550;white-space:nowrap;text-decoration:underline;text-underline-offset:3px}
.compare-note{margin:20px 0 0;color:var(--charcoal);font-size:13px}
.compare-note a{color:var(--graphite);text-decoration:underline;text-underline-offset:3px}

/* Trust */
.trust-section{padding-top:0}
.trust-layout{max-width:1200px;display:block}
.trust-layout>div:first-child{text-align:center}
.trust-layout h2{margin:12px 0 0}
.trust-items{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px}
.trust-items p{display:flex;gap:12px;margin:0;padding:28px;color:var(--charcoal);font-size:15px;line-height:1.6}
.trust-items strong{display:block;margin-bottom:6px;color:var(--ink);font-size:17px;font-weight:600}
.trust-mark{flex:0 0 auto;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--studio);color:#fff;font-size:12px;font-weight:700}
.trust-items .section-link{grid-column:1/-1;justify-self:center;margin-top:8px}

/* FAQ */
.faq-section{padding-top:0}
.faq-layout{display:block;max-width:800px}
.faq-layout>div:first-child{text-align:center}
.faq-layout h2{margin:12px 0 36px}
.faq-list{border-top:1px solid var(--hairline)}
.faq-list details{border-bottom:1px solid var(--hairline);padding:22px 0}
.faq-list summary{cursor:pointer;list-style:none;position:relative;padding-right:44px;color:var(--graphite);font-size:18px;font-weight:550}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary:after{content:"+";position:absolute;right:0;top:50%;display:grid;place-items:center;width:30px;height:30px;margin-top:-15px;border-radius:50%;background:var(--fill-soft);font-size:1.2rem;font-weight:400;color:var(--graphite)}
.faq-list details[open] summary:after{content:"−"}
.faq-list p{max-width:680px;margin:12px 44px 0 0;color:var(--charcoal);font-size:16px;line-height:1.67}

/* Studio band */
.closing-section{position:relative;overflow:hidden;padding:120px 0;text-align:center;background:var(--studio);color:#fff}
.closing-section:before{content:"";position:absolute;left:50%;bottom:-340px;width:1100px;height:560px;transform:translateX(-50%);background:radial-gradient(closest-side,#085cec8c,#085cec26 55%,transparent);filter:blur(10px);pointer-events:none}
.closing-section:after{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--sweep)}
.closing-inner{position:relative}
.closing-inner>img{margin:0 auto 28px;box-shadow:0 10px 30px #085cec55}
.closing-section .eyebrow{margin:0 0 12px;color:#a8a8ad}
.closing-section h2{margin:0 0 16px;color:#fff;font-size:clamp(2.6rem,5vw,3.75rem);line-height:1.1}
.closing-section p:not(.eyebrow){margin:0;color:#b4b4b9;font-size:18px;line-height:1.67}
.closing-actions{margin:32px 0 20px}
.closing-section .button-primary{border-color:#ffffff40}
.closing-link{display:inline-flex;align-items:center;gap:6px;min-height:48px;padding:11px 20px;border:1px solid rgba(255,255,255,.24);border-radius:var(--r-control);color:#fff;font-size:15px;font-weight:550}
.closing-link:hover{background:rgba(255,255,255,.06);text-decoration:none}
.closing-inner small{color:#a8a8ad;font-size:13px}

/* Footer */
.site-footer{padding:40px 0;background:var(--paper)}
.footer-inner{display:grid;grid-template-columns:1fr 1fr auto;align-items:center;gap:14px 24px}
.site-footer p,.site-footer small{margin:0;color:var(--charcoal);font-size:14px}
.site-footer nav{display:flex;gap:24px;color:var(--graphite);font-size:14px;font-weight:550}
.site-footer small{grid-column:1/-1;font-size:13px}

@media(max-width:1100px){.hero-orbit{display:none}}
@media(max-width:900px){
  .wrap{width:min(100% - 48px,1200px)}
  .section{padding:96px 0}
  .feature-layout,.feature-layout-reverse{gap:36px}
  .media-card{padding:20px}
  .feature-strip article,.trust-items p{padding:24px}
  .nav-links a{padding:6px 9px}
}
@media(max-width:700px){
  .wrap{width:min(100% - 32px,550px)}
  .site-header{height:64px}
  .wordmark{font-size:1rem}
  .wordmark img{width:31px;height:31px}
  .menu-toggle{display:inline-flex}
  .nav-cta{display:none}
  .nav{position:relative}
  .nav-links{display:none;position:absolute;top:59px;left:-16px;right:-16px;flex-direction:column;align-items:stretch;gap:0;padding:8px 16px 16px;border-radius:0 0 var(--r-card) var(--r-card);background:#fff;box-shadow:var(--shadow-card)}
  .nav-links.is-open{display:flex}
  .nav-links a{display:flex;align-items:center;min-height:44px;padding:8px 6px}
  .nav-links a:last-child{margin:0;border:0;border-radius:10px;padding:8px 6px}
  .hero{padding:40px 0 72px}
  .hero-glow{top:280px;height:520px}
  .announce-badge{margin-bottom:20px;font-size:13px}
  .hero h1{font-size:clamp(2.35rem,10.5vw,3rem)}
  .hero-intro{font-size:17px;line-height:1.6}
  .hero-actions{gap:10px;margin-top:24px}
  .button,.text-link{min-height:46px;padding:10px 16px;font-size:15px}
  .compatibility{line-height:1.45}
  .hero-visual{margin-top:44px}
  .hero-visual .window-frame{display:none}
  .hero-mobile-panes{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px;border-radius:var(--r-card);background:var(--field);box-shadow:var(--shadow-card)}
  .hero-mobile-panes>div{min-width:0;overflow:hidden;border-radius:12px;background:#fff;box-shadow:var(--shadow-window)}
  .hero-mobile-panes span,.mobile-detail span{display:block;padding:9px 10px;color:var(--charcoal);font-size:11px;font-weight:550;letter-spacing:.04em}
  .hero-mobile-panes img{width:100%;height:auto;aspect-ratio:278/230;object-fit:cover;object-position:top}
  .hero-mobile-panes>div:last-child img{aspect-ratio:300/230}
  .visual-label{right:16px;bottom:-18px;font-size:13px}
  .image-note{margin-top:32px;font-size:12px}
  .fact-inner{padding:22px 0;gap:10px}
  .fact-inner ul{gap:6px 18px}
  .fact-inner li{font-size:15px}
  .section{padding:80px 0}
  .intro-grid h2,.section-heading h2,.showcase-heading h2,.trust-layout h2,.faq-layout h2,.feature-copy h2{font-size:clamp(2rem,8.4vw,2.5rem)}
  .section-lead,.section-heading>p,.showcase-heading>p:last-child,.feature-copy>p:not(.eyebrow){font-size:17px;line-height:1.6}
  .feature-strip,.safety-points,.trust-items{grid-template-columns:1fr;gap:14px;margin-top:32px}
  .feature-layout,.feature-layout-reverse{display:flex;flex-direction:column;align-items:stretch;gap:28px}
  .feature-layout-reverse .feature-copy,.feature-layout-reverse .media-card{grid-column:auto;grid-row:auto}
  .media-card{padding:12px}
  .mobile-detail{display:grid;gap:10px;margin:0 0 12px}
  .mobile-detail>div{overflow:hidden;border-radius:12px;background:#fff;box-shadow:var(--shadow-window)}
  .mobile-detail img{width:100%;height:auto}
  .split-detail,.search-detail{grid-template-columns:1fr}
  .showcase-shell{padding:8px}
  .showcase-tabs{width:100%;gap:2px;margin-bottom:8px}
  .showcase-tab{min-width:0;flex:1;padding:7px 4px;font-size:14px;white-space:normal}
  .tab-index{display:none}
  .showcase-panel{display:flex;flex-direction:column;min-height:520px}
  .showcase-copy{padding:24px 20px 12px}
  .showcase-copy h3{font-size:1.6rem}
  .showcase-image{width:100%;height:220px;padding:8px;align-items:flex-start;justify-content:center}
  .showcase-image picture{width:max(100%,520px);border-radius:10px}
  #panel-shortcuts .showcase-image{display:none}
  #panel-views .showcase-image{height:auto;padding:8px}
  .showcase-mobile-panes{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:8px;width:100%;height:170px;overflow:hidden}
  .showcase-mobile-panes img{width:100%;height:auto;align-self:start;border-radius:8px;box-shadow:var(--shadow-window)}
  .showcase-mobile-search{display:grid;width:100%;padding:8px}
  .showcase-mobile-search img{width:100%;height:auto;border-radius:8px;box-shadow:var(--shadow-window)}
  #panel-preview .showcase-image{height:230px}
  #panel-preview .showcase-image picture{width:100%}
  #panel-preview .showcase-image picture{aspect-ratio:auto}
  #panel-preview .showcase-image picture img{position:static;width:100%;transform:none}
    .compare-card{padding:4px 20px 20px}
  .compare-row{grid-template-columns:1fr;gap:6px;padding:16px 0}
  .compare-head{display:none}
  .compare-row dt{font-size:15px}
  .compare-row dd{font-size:15px}
  .trust-items .section-link{grid-column:auto}
  .faq-list summary{font-size:17px}
  .faq-layout h2{margin-bottom:28px}
  .closing-section{padding:88px 0}
  .footer-inner{grid-template-columns:1fr}
  .site-footer nav{flex-wrap:wrap}
  .site-footer small{grid-column:auto}
}
@media(max-width:380px){
  .hero{padding-top:28px}
  .announce-badge{margin-bottom:16px;font-size:12px}
  .hero h1{font-size:1.8rem}
  .hero-intro{font-size:16px}
  .hero-actions{margin-top:20px}
  .hero-visual{margin-top:28px}
  .hero-actions{gap:8px}
  .hero-actions .button,.hero-actions .text-link{padding:9px 12px;font-size:14px}
  .visual-label{right:12px;font-size:12px}
  .showcase-panel{min-height:550px}
  .showcase-mobile-panes{height:150px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .button,.text-link,.showcase-tab,.play-circle,.nav-links a{transition:none}
  .button:hover,.text-link:hover{transform:none}
  .showcase-panel:not([hidden]){animation:none}
}