.sofable-page { --bg:#faf9f6; --ink:#202622; --muted:#657068; --accent:#2465ce; --line:#e1e4dd; }
.landing-shell { max-width:1240px; padding:0 56px; }
.icon { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.product-nav { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:22px 0; border-bottom:1px solid var(--line); }
.product-brand { display:inline-flex; align-items:center; gap:10px; font-size:21px; font-weight:650; letter-spacing:-.6px; }
.product-brand img { border-radius:8px; }
.product-nav nav { align-items:center; font-size:13px; gap:28px; }
.product-nav .nav-download { padding:10px 17px; border:1px solid #ccd2ca; border-radius:6px; }
.product-hero { display:grid; grid-template-columns:1fr 1.18fr; align-items:center; gap:52px; padding:68px 0 62px; }
.hero-copy .eyebrow { letter-spacing:1px; font-size:12px; margin-bottom:22px; }
.hero-copy h1 { font-size:clamp(38px,4.7vw,61px); font-weight:620; line-height:1.25; letter-spacing:-2px; margin-bottom:25px; }
.hero-copy h1 span { color:var(--accent); }
.hero-description { max-width:390px; font-size:17px; line-height:1.8; color:var(--muted); margin:0; }
.hero-copy .actions { gap:12px; margin-top:29px; }
.hero-copy .button .icon, .download-section .button .icon { width:18px; height:18px; }
.hero-requirement { color:var(--muted); font-size:11px; line-height:1.9; margin:18px 0 0; }
.hero-requirement a { text-decoration:underline; text-underline-offset:3px; }
.hero-photo { position:relative; margin:0; align-self:stretch; min-height:445px; border-radius:22px; overflow:hidden; }
.hero-photo img { width:100%; height:100%; display:block; object-fit:cover; object-position:49% center; }
.hero-photo figcaption { position:absolute; bottom:14px; right:16px; padding:5px 9px; border-radius:4px; color:#fff; background:#29251a80; font-size:10px; }
.section-intro h2, .download-section h2 { font-size:clamp(29px,3.1vw,41px); line-height:1.4; font-weight:570; letter-spacing:-1px; margin:0; }
.section-intro .eyebrow { letter-spacing:.7px; margin-bottom:17px; }
.visual-features { padding:72px 0 58px; border-bottom:1px solid var(--line); }
.feature-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; margin-top:38px; }
.feature-heading { display:flex; align-items:center; gap:9px; font-size:12px; color:var(--muted); min-height:24px; }
.feature-heading .icon { color:var(--accent); width:21px; height:21px; }
.pro-label { background:#e5ecfc; color:#2465ce; border-radius:4px; padding:3px 5px; font-size:8px; }
.visual-feature h3 { font-size:23px; line-height:1.55; font-weight:560; letter-spacing:-.5px; margin:17px 0 22px; }
.visual-feature figure { margin:0; background:#0b0b15; border-radius:18px; padding:10px 12px; overflow:hidden; }
.visual-feature figure img { display:block; width:100%; height:auto; margin-top:-35%; margin-bottom:-20%; }
.visual-feature > p { font-size:13px; color:var(--muted); margin:18px 0 0; text-align:center; }
.gallery-caption { font-size:10px; color:var(--muted); margin:25px 0 0; line-height:1.8; }
.gallery-swipe { display:none; }
.visual-plans { padding:72px 0 58px; border-bottom:1px solid var(--line); }
.plan-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:34px; }
.plan { padding:28px 32px; border:1px solid var(--line); border-radius:15px; }
.pro-plan { background:#eef2fa; border-color:#e0e7f3; }
.plan-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.plan-name { font-size:13px; }
.plan-price { font-size:20px; font-weight:550; letter-spacing:-.5px; }
.connection-diagram { display:flex; justify-content:space-between; align-items:center; gap:16px; margin:36px 0 31px; }
.connection-diagram > div { display:flex; flex-direction:column; align-items:center; gap:12px; font-size:11px; color:var(--muted); }
.connection-diagram .icon { width:39px; height:39px; color:var(--ink); }
.connection-diagram .connection-middle { flex:1; position:relative; }
.connection-middle::before, .connection-middle::after { content:''; width:calc(50% - 27px); position:absolute; top:20px; border-top:1px dashed #bec7bc; }
.connection-middle::before { left:0; }
.connection-middle::after { right:0; }
.connection-middle .icon { width:26px; height:39px; color:var(--accent); }
.icon-benefits { list-style:none; padding:0; margin:0; }
.icon-benefits li { display:flex; gap:8px; align-items:flex-start; font-size:13px; color:var(--muted); line-height:1.7; margin-top:12px; }
.icon-benefits .icon { width:17px; height:20px; color:var(--accent); }
.plan-note { font-size:10px; color:var(--muted); line-height:1.8; margin:16px 0 0; }
.connection-note { font-size:11px; color:var(--muted); line-height:1.9; margin:22px 0 0; }
.faq-section { display:grid; grid-template-columns:.8fr 1.2fr; gap:80px; padding:68px 0; }
.faq-list details { border-bottom:1px solid var(--line); }
.faq-list details:first-child { border-top:1px solid var(--line); }
.faq-list summary { position:relative; list-style:none; cursor:pointer; font-size:15px; font-weight:500; padding:22px 28px 22px 0; line-height:1.7; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary::after { content:'+'; position:absolute; right:2px; top:22px; font-size:18px; color:var(--muted); }
.faq-list details[open] summary::after { content:'−'; }
.faq-list summary:focus-visible { outline:2px solid var(--accent); outline-offset:5px; }
.faq-list p { color:var(--muted); font-size:14px; line-height:1.95; margin:0 0 23px; max-width:520px; }
.faq-list p a { text-decoration:underline; text-underline-offset:3px; }
.download-section { text-align:center; background:#f0f2ec; border-radius:22px; padding:52px 24px; margin-bottom:60px; }
.download-section > img { border-radius:16px; margin-bottom:25px; }
.download-section .actions { justify-content:center; }
.sofable-page footer { padding-bottom:32px; }
@media(max-width:1000px) {
  .landing-shell { padding:0 34px; }
  .product-hero { gap:30px; padding:54px 0 48px; }
  .hero-copy h1 { font-size:43px; }
  .hero-photo { min-height:420px; }
  .hero-description { font-size:16px; }
  .feature-gallery { gap:18px; }
  .visual-feature h3 { font-size:20px; }
  .plan { padding:26px; }
  .faq-section { gap:36px; }
}
@media(max-width:700px) {
  .landing-shell { padding:0 24px; }
  .product-nav { padding:16px 0; gap:14px; }
  .product-brand { font-size:19px; gap:8px; }
  .product-brand img { width:28px; height:28px; }
  .product-nav nav { gap:18px; font-size:12px; }
  .product-nav .nav-detail { display:none; }
  .product-nav .nav-download { padding:8px 12px; }
  .product-hero { grid-template-columns:1fr; gap:28px; padding:43px 0 34px; }
  .hero-copy h1 { font-size:42px; letter-spacing:-1.5px; }
  .hero-copy .eyebrow { margin-bottom:18px; }
  .hero-description { max-width:100%; }
  .hero-copy .actions { gap:12px; }
  .hero-photo { min-height:0; aspect-ratio:3/2; border-radius:15px; }
  .section-intro h2, .download-section h2 { font-size:30px; }
  .visual-features, .visual-plans { padding:42px 0 36px; }
  .feature-gallery { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:18px; padding-bottom:8px; margin-top:30px; scrollbar-width:thin; scrollbar-color:#bec7bc transparent; }
  .visual-feature { flex:0 0 84%; scroll-snap-align:start; min-width:0; }
  .visual-feature h3 { font-size:22px; margin-bottom:18px; }
  .visual-feature figure { padding:8px 12px; }
  .feature-heading { font-size:11px; gap:7px; }
  .gallery-caption { margin-top:19px; }
  .gallery-swipe { display:block; font-size:11px; color:var(--accent); margin:13px 0 0; }
  .plan-grid { grid-template-columns:1fr; gap:15px; margin-top:27px; }
  .plan { padding:25px; }
  .connection-diagram { margin:28px 0 24px; }
  .faq-section { grid-template-columns:1fr; gap:26px; padding:42px 0; }
  .faq-list summary { font-size:14px; }
  .download-section { padding:40px 20px; margin-bottom:38px; border-radius:18px; }
  .download-section .actions { gap:14px; }
  .sofable-page .footer-links { gap:18px; }
}
@media(max-width:360px) { .landing-shell { padding:0 18px; } .hero-copy h1 { font-size:37px; } .product-nav nav { gap:12px; } }

.feature-gallery:focus-visible { outline:2px solid var(--accent); outline-offset:8px; border-radius:8px; }

.visual-feature h3 { font-size:20px; }
.hero-copy .button, .download-section .button { gap:10px; }
@media(max-width:700px) { .visual-feature h3 { font-size:19px; } }
@media(max-width:360px) {
  .hero-copy .actions, .download-section .actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
  .hero-copy .button, .download-section .button { padding:0 9px; font-size:12px; gap:6px; }
  .hero-copy .button .icon, .download-section .button .icon { width:15px; height:15px; }
  .showcase-copy .actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
  .showcase-copy .button { padding:0 9px; font-size:12px; gap:6px; }
}
