/* Dedicated home-page layout. Loaded after the shared public-page stylesheet. */
.landing-page { margin:0; min-width:320px; overflow-x:hidden; background:#f7f4ee; color:#211f1b; font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; line-height:1.45; }
.landing-page * { box-sizing:border-box; }.landing-page .shell { width:min(1160px,calc(100% - 48px)); margin-inline:auto; }.landing-page .site-header { position:sticky; top:0; z-index:50; background:#f7f4eedd; backdrop-filter:blur(12px); border-bottom:1px solid #e1d8cc; }.landing-page .topbar { min-height:70px; display:flex; align-items:center; justify-content:space-between; gap:16px; }.landing-page .brand { display:flex; align-items:center; gap:8px; color:#211f1b; font-weight:750; font-size:20px; letter-spacing:-.06em; text-decoration:none; }.landing-page .brand-mark { object-fit:contain; }.landing-page nav { display:flex; align-items:center; gap:18px; }.landing-page nav a { color:#554f47; font-size:14px; text-decoration:none; }.landing-page .language-switch { border:1px solid #d8cfc2; padding:6px 9px; border-radius:999px; }.landing-page .nav-cta,.landing-page .button.primary { border-color:#df5736; background:#df5736; color:#fff; }.landing-page .nav-cta { border-radius:999px; padding:10px 15px; font-weight:700; }
.landing-page .hero-new { min-height:650px; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr); gap:42px; align-items:center; padding:72px 0; }.landing-page .beta-pill { display:inline-flex; gap:8px; align-items:center; padding:8px 12px; margin:0 0 22px; border:1px solid #d9d0c5; border-radius:999px; color:#574f47; font-size:13px; font-weight:650; }.landing-page .beta-pill span { width:8px; height:8px; border-radius:50%; background:#df5736; }.landing-page .hero-new h1,.landing-page .how-new h2,.landing-page .section-heading-row h2,.landing-page .download h2,.landing-page .faq h2 { margin:0; font-size:clamp(42px,5.4vw,73px); line-height:.98; letter-spacing:-.07em; }.landing-page h1 em { color:#df5736; font-style:normal; }.landing-page .hero-lead { max-width:570px; margin:26px 0 0; color:#6e675e; font-size:18px; line-height:1.55; }.landing-page .hero-actions,.landing-page .store-row { display:flex; flex-wrap:wrap; gap:12px; align-items:center; }.landing-page .hero-actions { margin-top:28px; }.landing-page .button { display:inline-flex; align-items:center; gap:12px; min-height:48px; padding:12px 19px; border:1px solid #cfc6b9; border-radius:999px; color:#211f1b; font-weight:700; text-decoration:none; }.landing-page .text-link { color:#211f1b; font-size:14px; font-weight:700; text-underline-offset:5px; }.landing-page .store-row { margin-top:25px; }.landing-page .store-badge { position:relative; min-width:143px; display:flex; flex-direction:column; padding:7px 12px 8px 33px; border-radius:9px; background:#211f1b; color:#fff; text-decoration:none; line-height:1.05; }.landing-page .store-badge::before { content:'●'; position:absolute; left:13px; top:13px; }.landing-page .store-badge:nth-child(2)::before { content:'▶'; font-size:11px; }.landing-page .store-badge small { font-size:9px; }.landing-page .store-badge strong { font-size:17px; letter-spacing:-.04em; }
.landing-page .hero-visual { position:relative; min-height:500px; isolation:isolate; overflow:visible; }.landing-page .orange-orb { position:absolute; right:0; top:24px; width:390px; aspect-ratio:1; border-radius:48% 52% 45% 55%; background:#f3b79d; transform:rotate(15deg); }.landing-page .phone { position:absolute; right:14%; top:0; z-index:1; width:242px; height:470px; overflow:hidden; border:7px solid #24211d; border-radius:30px; background:#24211d; box-shadow:0 24px 52px #492b1c40; transform:rotate(4deg); }.landing-page .phone img { width:100%; height:100%; object-fit:cover; object-position:top; }.landing-page .floating-note { position:absolute; z-index:2; left:0; top:55%; width:205px; display:flex; gap:9px; padding:13px; border-radius:14px; background:#fff; box-shadow:0 14px 30px #3c28182e; font-size:12px; }.landing-page .floating-note b,.landing-page .floating-note small { display:block; }.landing-page .floating-note small { color:#736b61; margin-top:4px; }.landing-page .note-dot { width:8px; height:8px; flex:none; margin-top:4px; border-radius:50%; background:#df5736; }.landing-page .visual-caption { position:absolute; right:0; bottom:0; color:#6d6358; font-size:12px; }.landing-page .visual-caption span { color:#df5736; font-size:20px; }.landing-page .hero-promise { margin:14px 0 0; color:#3c342c; font-size:16px; font-weight:750; line-height:1.42; }
.landing-page .benefit-strip { border-block:1px solid #ded6ca; background:#fffdf9; }.landing-page .benefits { display:grid; grid-template-columns:repeat(3,1fr); }.landing-page .benefits article { padding:34px; border-left:1px solid #ded6ca; }.landing-page .benefits article:last-child { border-right:1px solid #ded6ca; }.landing-page .benefits span,.landing-page .eyebrow,.landing-page .feature-card span { color:#d75031; font-size:11px; font-weight:800; letter-spacing:.12em; }.landing-page .benefits h2 { margin:17px 0 9px; font-size:21px; letter-spacing:-.04em; }.landing-page .benefits p,.landing-page .feature-card p { margin:0; color:#6e675e; font-size:14px; line-height:1.48; }
.landing-page .product-features,.landing-page .how-new { padding-block:105px; }.landing-page .section-intro { display:grid; grid-template-columns:1.35fr .65fr; gap:60px; align-items:end; }.landing-page .section-intro h2 { margin:15px 0 0; font-size:clamp(38px,4.6vw,60px); line-height:1; letter-spacing:-.065em; }.landing-page .section-intro > p:last-child { margin:0 0 5px; color:#6e675e; font-size:16px; line-height:1.5; }.landing-page .feature-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:16px; margin-top:45px; }.landing-page .feature-card { min-height:255px; position:relative; overflow:hidden; padding:24px; border:1px solid #ddd3c5; border-radius:22px; background:#fffdf9; grid-column:span 4; }.landing-page .feature-card > div { position:relative; z-index:1; max-width:270px; }.landing-page .feature-card h3 { margin:38px 0 10px; font-size:24px; line-height:1.05; letter-spacing:-.055em; }.landing-page .feature-card img { position:absolute; right:12px; bottom:-92px; width:160px; height:308px; object-fit:cover; object-position:top; border:5px solid #292620; border-radius:20px; box-shadow:0 14px 30px #422d1d35; transform:rotate(7deg); }.landing-page .feature-shared { grid-column:span 7; min-height:325px; background:#e8ded0; }.landing-page .feature-shared img { width:190px; height:375px; right:35px; }.landing-page .feature-widgets { grid-column:span 5; min-height:325px; background:#f6d0c3; }.landing-page .feature-widgets img { width:180px; height:350px; }.landing-page .feature-ai { grid-column:span 5; background:#dbe3d9; }.landing-page .feature-calm { grid-column:span 3; background:#302e29; color:#fff8ef; }.landing-page .feature-calm p { color:#d9d1c7; }
.landing-page .steps { display:grid; grid-template-columns:1.15fr .85fr .85fr; gap:16px; margin-top:46px; }.landing-page .step-card { position:relative; min-height:390px; overflow:hidden; padding:24px; border-radius:22px; background:#e5ded2; }.landing-page .step-card > span { color:#d75031; font-size:12px; font-weight:800; }.landing-page .step-card h3 { max-width:245px; margin:56px 0 9px; font-size:26px; line-height:1.05; letter-spacing:-.06em; }.landing-page .step-card p { max-width:245px; margin:0; color:#645c53; font-size:14px; line-height:1.45; }.landing-page .step-card img { position:absolute; right:19px; bottom:-58px; width:135px; height:240px; object-fit:cover; object-position:top; border:4px solid #292620; border-radius:19px; transform:rotate(7deg); }.landing-page .step-chat { background:#f6d1c5; }.landing-page .step-chat img { width:175px; height:300px; right:28px; }.landing-page .step-return { background:#d7ded7; }
.landing-page .usecases { padding-block:100px; background:#292722; color:#faf6ef; }.landing-page .section-heading-row { display:flex; justify-content:space-between; gap:40px; align-items:end; }.landing-page .section-heading-row h2 { font-size:clamp(40px,4.8vw,63px); }.landing-page .section-heading-row > p { max-width:310px; margin:0; color:#cec5ba; }.landing-page .bento { display:grid; grid-template-columns:1.1fr .9fr .9fr; grid-template-rows:225px 215px; gap:15px; margin-top:45px; }.landing-page .bento article { overflow:hidden; padding:24px; border-radius:20px; }.landing-page .bento h3 { margin:35px 0 9px; font-size:26px; line-height:1; letter-spacing:-.06em; }.landing-page .bento p { color:#71695f; font-size:14px; }.landing-page .bento-large { grid-row:span 2; background:#f9f5ee; color:#221f1b; }.landing-page .bento-large q { display:block; margin-top:55px; color:#994530; }.landing-page .bento-warm { background:#e4b69e; color:#382119; }.landing-page .bento-dark { background:#3b4038; }.landing-page .bento-dark p { color:#d2d7ce; }.landing-page .bento-photo { position:relative; grid-column:span 2; padding:0!important; }.landing-page .bento-photo img { width:100%; height:100%; object-fit:cover; opacity:.75; }.landing-page .bento-photo div { position:absolute; inset:auto 24px 20px; }.landing-page .bento-photo h3 { margin:0 0 8px; }
.landing-page .download { display:flex; justify-content:space-between; align-items:center; gap:40px; min-height:420px; margin-block:100px; padding:60px 80px; overflow:hidden; border-radius:26px; background:#e95f3c; color:#fff; }.landing-page .download h2 { margin-top:15px; font-size:clamp(40px,4.6vw,61px); }.landing-page .download p:not(.eyebrow) { max-width:540px; margin:20px 0 0; color:#fff4ef; }.landing-page .download .eyebrow { color:#6c2817; }.landing-page .download .store-badge { background:#fff; color:#211f1b; }.landing-page .download-mark { width:210px; max-width:100%; height:315px; flex:none; margin:0; overflow:hidden; border:6px solid #2b2824; border-radius:27px; background:#2b2824; box-shadow:0 20px 36px rgba(96,34,20,.28); transform:rotate(5deg); }.landing-page .download-mark img { display:block; width:100%; height:100%; object-fit:cover; object-position:top; }
.landing-page .faq { max-width:820px; padding-bottom:110px; }.landing-page .faq h2 { margin:12px 0 38px; font-size:clamp(38px,4.3vw,56px); }.landing-page details { border-top:1px solid #d8d0c5; }.landing-page details:last-child { border-bottom:1px solid #d8d0c5; }.landing-page summary { position:relative; padding:21px 32px 21px 0; cursor:pointer; list-style:none; font-size:18px; font-weight:700; }.landing-page summary::after { content:'+'; position:absolute; right:2px; color:#d75031; font-size:25px; }.landing-page details[open] summary::after { content:'–'; }.landing-page details p { margin:0; padding:0 0 22px; color:#6e675e; }.landing-page footer { padding-block:27px; border-top:1px solid #ddd5ca; }.landing-page .footer-new { display:flex; justify-content:space-between; align-items:center; gap:22px; color:#6c645b; font-size:13px; }.landing-page .footer-new > div { display:flex; flex-wrap:wrap; gap:18px; }.landing-page a:focus-visible { outline:3px solid #211f1b; outline-offset:3px; }
@media (max-width:760px) { .landing-page .shell { width:calc(100% - 32px); }.landing-page .topbar { min-height:62px; }.landing-page nav { gap:8px; }.landing-page nav > a:not(.nav-cta):not(.language-switch) { display:none; }.landing-page .nav-cta { padding:9px 12px; }.landing-page .hero-new { min-height:auto; grid-template-columns:1fr; gap:27px; padding-block:51px 54px; }.landing-page .hero-new h1 { font-size:clamp(42px,12vw,57px); }.landing-page .hero-lead { font-size:17px; }.landing-page .hero-visual { min-height:400px; }.landing-page .orange-orb { width:min(300px,92%); right:0; }.landing-page .phone { right:10%; width:205px; height:400px; }.landing-page .floating-note { left:0; top:59%; width:177px; }.landing-page .benefits,.landing-page .section-intro,.landing-page .steps { grid-template-columns:1fr; }.landing-page .benefits article { padding:24px 5px; border:0; border-bottom:1px solid #ded6ca; }.landing-page .benefits article:last-child { border-bottom:0; }.landing-page .product-features,.landing-page .how-new { padding-block:72px; }.landing-page .section-intro { gap:18px; }.landing-page .feature-grid { grid-template-columns:1fr; margin-top:30px; }.landing-page .feature-card,.landing-page .feature-shared,.landing-page .feature-widgets,.landing-page .feature-ai,.landing-page .feature-calm { min-height:260px; grid-column:auto; }.landing-page .feature-shared,.landing-page .feature-widgets { min-height:292px; }.landing-page .feature-card h3 { max-width:205px; font-size:23px; }.landing-page .feature-card img,.landing-page .feature-shared img,.landing-page .feature-widgets img { right:14px; bottom:-83px; width:140px; height:270px; }.landing-page .step-card { min-height:335px; }.landing-page .section-heading-row { display:block; }.landing-page .section-heading-row > p { margin-top:20px; }.landing-page .usecases { padding-block:72px; }.landing-page .bento { grid-template-columns:1fr 1fr; grid-template-rows:250px 210px 210px; margin-top:31px; }.landing-page .bento-large,.landing-page .bento-photo { grid-column:span 2; grid-row:auto; }.landing-page .download { min-height:0; margin-block:70px; padding:45px 24px; align-items:flex-start; flex-direction:column; }.landing-page .download-mark { width:min(156px,calc(100% - 28px)); height:236px; align-self:center; transform:rotate(4deg); }.landing-page .faq { padding-bottom:76px; }.landing-page .footer-new { align-items:flex-start; flex-direction:column; }.landing-page .footer-new > div { gap:12px 17px; } }
@media (prefers-reduced-motion:no-preference) { .landing-page .hero-copy { animation:reveal .55s ease both; }.landing-page .hero-visual { animation:reveal .7s .1s ease both; }.landing-page .feature-card,.landing-page .step-card { transition:transform .2s ease; }.landing-page .feature-card:hover,.landing-page .step-card:hover { transform:translateY(-4px); } @keyframes reveal { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:translateY(0); } } }
.landing-page .store-badge { padding-left:38px; }
.landing-page .store-badge::before { content:'▶'; left:14px; top:13px; font-size:11px; }
.landing-page .store-badge:has(.store-icon-apple)::before { content:none; }
.landing-page .store-row .store-badge:first-child::before { content:none; }
.landing-page .store-icon-apple { position:absolute; left:13px; top:10px; width:15px; height:17px; }
.landing-page .store-icon-apple::before { content:''; position:absolute; left:1px; bottom:0; width:13px; height:13px; border-radius:48% 48% 46% 46% / 45% 45% 55% 55%; background:currentColor; }
.landing-page .store-icon-apple::after { content:''; position:absolute; top:0; left:9px; width:6px; height:7px; border-radius:100% 0 100% 0; background:currentColor; transform:rotate(-27deg); transform-origin:bottom left; }
.landing-page .comparison { padding-block:88px 24px; }
.landing-page .comparison-heading { max-width:720px; }.landing-page .comparison-heading h2 { margin:13px 0 15px; font-size:clamp(37px,4.4vw,57px); line-height:1; letter-spacing:-.065em; }.landing-page .comparison-heading > p:last-child { margin:0; color:#6e675e; font-size:16px; line-height:1.55; }
.landing-page .comparison-table-wrap { margin-top:34px; overflow:hidden; border:1px solid #ddd3c5; border-radius:22px; background:#fffdf9; }.landing-page .comparison-table { width:100%; border-collapse:collapse; table-layout:fixed; text-align:left; }.landing-page .comparison-table caption { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }.landing-page .comparison-table th,.landing-page .comparison-table td { padding:20px 22px; vertical-align:top; border-bottom:1px solid #e6ded3; }.landing-page .comparison-table thead th { background:#eee5d9; color:#4e463d; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.landing-page .comparison-table thead th:nth-child(1) { width:23%; }.landing-page .comparison-table thead th:nth-child(2) { width:39%; color:#b74329; }.landing-page .comparison-table tbody th { color:#24211d; font-size:14px; font-weight:750; }.landing-page .comparison-table td { color:#665e55; font-size:14px; line-height:1.48; }.landing-page .comparison-table tbody td:nth-child(2) { color:#3c342c; background:#fff8f3; }.landing-page .comparison-table tbody tr:last-child > * { border-bottom:0; }
@media (max-width:760px) { .landing-page .comparison { padding-block:65px 10px; }.landing-page .comparison-table-wrap { overflow:visible; border:0; background:transparent; }.landing-page .comparison-table,.landing-page .comparison-table tbody,.landing-page .comparison-table tr,.landing-page .comparison-table th,.landing-page .comparison-table td { display:block; width:100%; }.landing-page .comparison-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }.landing-page .comparison-table tr { margin-top:12px; overflow:hidden; border:1px solid #ddd3c5; border-radius:16px; background:#fffdf9; }.landing-page .comparison-table th,.landing-page .comparison-table td { padding:13px 15px; border:0; }.landing-page .comparison-table tbody th { padding-bottom:8px; background:#eee5d9; }.landing-page .comparison-table td { position:relative; padding-left:95px; }.landing-page .comparison-table td::before { position:absolute; left:15px; color:#9b5140; font-size:11px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }.landing-page .comparison-table td:nth-child(2)::before { content:'Ogonek'; }.landing-page .comparison-table td:nth-child(3)::before { content:'OpenClaw'; }.landing-page .comparison-table tbody td:nth-child(2) { background:#fff8f3; }.landing-page .comparison-table tbody td:nth-child(3) { border-top:1px solid #eee5d9; } }
@media (max-width:760px) { .landing-page[lang="ru"] .comparison-table td:nth-child(2)::before { content:'Огонёк'; } }
.landing-page .phone { border:5px solid #24211d; border-radius:30px; transform:none; box-shadow:0 20px 38px rgba(73,43,28,.24); }
.landing-page .phone img { image-rendering:auto; }
.landing-page .feature-card img { border-width:3px; transform:none; box-shadow:0 12px 24px rgba(66,45,29,.18); }
.landing-page .step-card img { border-width:3px; transform:none; box-shadow:0 12px 24px rgba(66,45,29,.18); }
.landing-page .download-mark { border-width:4px; transform:none; box-shadow:0 16px 30px rgba(96,34,20,.24); }
@media (max-width:760px) { .landing-page .download-mark { transform:none; } }
.landing-page .hero-visual .phone { z-index:2; display:block; isolation:isolate; overflow:hidden; background:transparent!important; }
.landing-page .hero-visual .phone::before,.landing-page .hero-visual .phone::after { content:none!important; display:none!important; }
.landing-page .hero-visual .phone > img { position:relative!important; z-index:1!important; display:block!important; width:100%!important; height:100%!important; max-width:none!important; margin:0!important; padding:0!important; border:0!important; opacity:1!important; visibility:visible!important; background:transparent!important; object-fit:cover!important; object-position:50% 0!important; }
.landing-page .hero-visual .phone-main { background-image:url("/assets/product/shared-workspace.jpeg")!important; background-size:cover!important; background-position:center top!important; background-repeat:no-repeat!important; }
.landing-page .hero-lead + .hero-actions { margin-top:28px; }
.landing-page .steps { grid-template-columns:repeat(3,minmax(0,1fr)); align-items:stretch; }
.landing-page .step-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(104px,112px); grid-template-rows:auto 1fr; column-gap:12px; min-height:420px; }
.landing-page .step-card > span { grid-column:1 / -1; }
.landing-page .step-card > div { position:relative; z-index:1; min-width:0; align-self:start; }
.landing-page .step-card h3 { max-width:none; margin-top:40px; overflow-wrap:anywhere; }
.landing-page .step-card p { max-width:none; overflow-wrap:anywhere; }
.landing-page .step-card img,.landing-page .step-chat img,.landing-page .step-space img,.landing-page .step-return img { position:relative!important; right:auto!important; bottom:auto!important; grid-column:2; grid-row:2; align-self:end; justify-self:end; width:112px!important; height:220px!important; max-width:100%; object-fit:cover; object-position:top; }
@media (max-width:760px) { .landing-page .step-card { grid-template-columns:minmax(0,1fr) 126px; min-height:360px; }.landing-page .step-card h3 { margin-top:32px; }.landing-page .step-card img,.landing-page .step-chat img,.landing-page .step-space img,.landing-page .step-return img { width:126px!important; height:248px!important; } }
@media (max-width:1020px) and (min-width:761px) { .landing-page .steps { grid-template-columns:1fr; }.landing-page .step-card { grid-template-columns:minmax(0,1fr) 180px; min-height:330px; }.landing-page .step-card h3 { max-width:430px; font-size:29px; }.landing-page .step-card p { max-width:410px; font-size:15px; }.landing-page .step-card img,.landing-page .step-chat img,.landing-page .step-space img,.landing-page .step-return img { width:180px!important; height:290px!important; } }
.landing-page .store-badge { padding-left:40px; }
.landing-page .store-badge::before { content:none!important; }
.landing-page .store-badge > svg.store-icon { position:absolute; left:12px; top:50%; width:20px; height:20px; transform:translateY(-50%); overflow:visible; }
.landing-page .store-badge > svg.store-icon path { vector-effect:non-scaling-stroke; }
.landing-page .nav-cta { order:3; }.landing-page .language-switch { order:2; }.landing-page nav > a:not(.nav-cta):not(.language-switch) { order:1; }
@media (max-width:760px) { .landing-page .topbar { align-items:flex-start; padding-block:12px; }.landing-page nav { justify-content:flex-end; flex-wrap:wrap; }.landing-page nav > a:not(.nav-cta):not(.language-switch) { display:inline; } }

/* The desktop navigation keeps its existing inline layout; mobile uses details/summary. */
.landing-page .mobile-nav { display:contents; }
.landing-page .mobile-nav > summary { display:none; }
.landing-page .mobile-nav > nav { display:flex; }
@media (max-width:760px) {
  .landing-page .topbar { align-items:center!important; padding-block:10px; }
  .landing-page .mobile-nav { position:relative; display:block; margin-left:auto; }
  .landing-page .mobile-nav > summary {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-width:44px;
    min-height:42px;
    padding:8px 10px;
    border:1px solid #d8cfc2;
    border-radius:999px;
    color:#211f1b;
    cursor:pointer;
    font-size:13px;
    font-weight:700;
    list-style:none;
  }
  .landing-page .mobile-nav > summary::-webkit-details-marker { display:none; }
  .landing-page .mobile-nav > summary::after { content:"☰"; color:#d75031; font-size:16px; line-height:1; }
  .landing-page .mobile-nav[open] > summary::after { content:"×"; font-size:20px; }
  .landing-page .mobile-nav > nav { display:none; }
  .landing-page .mobile-nav[open] > nav {
    position:absolute;
    top:calc(100% + 8px);
    right:0;
    z-index:60;
    display:flex;
    width:min(300px,calc(100vw - 32px));
    max-height:calc(100vh - 82px);
    padding:10px;
    overflow:auto;
    flex-direction:column;
    align-items:stretch;
    gap:2px;
    border:1px solid #d8cfc2;
    border-radius:16px;
    background:#fffdf9;
    box-shadow:0 16px 32px rgba(54,39,25,.16);
  }
  .landing-page .mobile-nav > nav > a,
  .landing-page .mobile-nav > nav > a:not(.nav-cta):not(.language-switch) {
    display:block;
    order:initial;
    padding:11px 12px;
    border-radius:10px;
    font-size:15px;
  }
  .landing-page .mobile-nav > nav > .nav-cta { padding:11px 12px; }
  .landing-page .mobile-nav > nav > .language-switch { padding:10px 12px; }
}

/* Feature cards reserve separate grid regions for copy and product screens. */
.landing-page .feature-card {
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(120px, 42%);
  grid-template-areas:"copy media";
  align-items:stretch;
  gap:12px;
  overflow:hidden;
}
.landing-page .feature-card > div {
  grid-area:copy;
  min-width:0;
  max-width:none;
  align-self:start;
}
.landing-page .feature-card > img {
  position:relative!important;
  right:auto!important;
  bottom:auto!important;
  grid-area:media;
  align-self:end;
  justify-self:end;
  width:min(100%, 154px)!important;
  height:286px!important;
  max-width:100%;
  object-fit:cover;
  object-position:top;
}
.landing-page .feature-shared {
  grid-template-columns:minmax(0, 1fr) minmax(165px, 34%);
  min-height:350px;
}
.landing-page .feature-shared > img {
  width:min(100%, 178px)!important;
  height:335px!important;
}
.landing-page .feature-widgets {
  grid-template-columns:minmax(0, 1fr) minmax(140px, 39%);
  min-height:350px;
}
.landing-page .feature-widgets > img {
  width:min(100%, 154px)!important;
  height:290px!important;
}
.landing-page .feature-ai {
  min-height:286px;
}
.landing-page .feature-card:not(.feature-shared):not(.feature-widgets):not(.feature-ai) {
  grid-template-columns:minmax(0, 1fr);
  grid-template-areas:"copy";
}
@media (min-width:761px) and (max-width:1020px) {
  .landing-page .feature-grid { grid-template-columns:minmax(0, 1fr); }
  .landing-page .feature-card,
  .landing-page .feature-shared,
  .landing-page .feature-widgets,
  .landing-page .feature-ai,
  .landing-page .feature-calm {
    grid-column:1 / -1;
  }
  .landing-page .feature-card.feature-shared,
  .landing-page .feature-card.feature-widgets,
  .landing-page .feature-card.feature-ai {
    grid-template-columns:minmax(0, 1fr);
    grid-template-rows:auto 300px;
    grid-template-areas:"copy" "media";
    min-height:0;
    gap:20px;
  }
  .landing-page .feature-card > img,
  .landing-page .feature-shared > img,
  .landing-page .feature-widgets > img {
    align-self:end;
    justify-self:center;
    width:160px!important;
    height:300px!important;
  }
}
@media (max-width:760px) {
  .landing-page .mobile-nav > summary { display:inline-flex!important; }
  .landing-page .mobile-nav[open] > nav { display:flex!important; }
  .landing-page .feature-card.feature-shared,
  .landing-page .feature-card.feature-widgets,
  .landing-page .feature-card.feature-ai {
    grid-template-columns:minmax(0, 1fr);
    grid-template-rows:auto 248px;
    grid-template-areas:"copy" "media";
    min-height:0;
    gap:16px;
  }
  .landing-page .feature-card > div { max-width:none; }
  .landing-page .feature-card h3 { max-width:none; }
  .landing-page .feature-card > img,
  .landing-page .feature-shared > img,
  .landing-page .feature-widgets > img {
    align-self:end;
    justify-self:center;
    width:132px!important;
    height:248px!important;
  }
  .landing-page .feature-card:not(.feature-shared):not(.feature-widgets):not(.feature-ai) {
    min-height:260px;
  }
}
.landing-page .download-mark {
  background:#2b2824 url("/assets/product/widget-picker.jpeg") center top / cover no-repeat;
}
.landing-page #download { scroll-margin-top:140px; }
@media (max-width:760px) { .landing-page #download { scroll-margin-top:96px; } }
.landing-page .faq { max-width:none; }
.landing-page .faq details { max-width:820px; }

/* Shared footer-row contract used by home and legal pages. */
.landing-page .footer-row {
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  color:#6a625a;
  font-size:13px;
}
.landing-page .footer-row > div { display:flex; flex-wrap:wrap; gap:14px; }
.landing-page .footer-row a { color:inherit; text-decoration:none; }
@media (max-width:760px) {
  .landing-page .footer-row { min-height:0; padding-block:24px; align-items:flex-start; flex-direction:column; }
  .landing-page .footer-row > div { gap:12px 17px; }
}

/* Checkbox/label menu: a single desktop nav becomes a reliable no-JS mobile disclosure. */
.landing-page .mobile-nav-toggle,
.landing-page .mobile-nav-trigger { display:none; }
@media (max-width:760px) {
  .landing-page .topbar { position:relative; align-items:center!important; }
  .landing-page .mobile-nav-toggle { position:absolute; inline-size:1px; block-size:1px; opacity:0; }
  .landing-page .mobile-nav-trigger {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-width:44px;
    min-height:42px;
    margin-left:auto;
    padding:8px 10px;
    border:1px solid #d8cfc2;
    border-radius:999px;
    color:#211f1b;
    cursor:pointer;
    font-size:13px;
    font-weight:700;
  }
  .landing-page .mobile-nav-trigger::after { content:"☰"; color:#d75031; font-size:16px; line-height:1; }
  .landing-page .mobile-nav-toggle:checked + .mobile-nav-trigger::after { content:"×"; font-size:20px; }
  .landing-page .mobile-nav-toggle:focus-visible + .mobile-nav-trigger { outline:3px solid #211f1b; outline-offset:3px; }
  .landing-page .topbar > nav { display:none!important; }
  .landing-page .mobile-nav-toggle:checked ~ nav {
    position:absolute;
    top:calc(100% - 2px);
    right:0;
    z-index:60;
    display:flex!important;
    width:min(300px,calc(100vw - 32px));
    max-height:calc(100vh - 82px);
    padding:10px;
    overflow:auto;
    flex-direction:column;
    align-items:stretch;
    gap:2px;
    border:1px solid #d8cfc2;
    border-radius:16px;
    background:#fffdf9;
    box-shadow:0 16px 32px rgba(54,39,25,.16);
  }
  .landing-page .topbar > nav > a { display:block; order:initial; padding:11px 12px; border-radius:10px; font-size:15px; }
}
