/* MYNOS warm-logo refinement. Shared by every page. */
:root{--accent:#ed873f;--accent-dark:#a44514;--blue:var(--accent);--blue-dark:var(--accent-dark);--yellow:#ffd16b;--ink:#35271f;--text:#5e4b3e;--muted:#796858;--paper:#fff9f0}
.navbar,.card,.faq-item,.scan-ticket,.white-section{background:#fffefa}
.hero{background:linear-gradient(120deg,#fff0d8 0%,#fff8e9 52%,#ffdfb8 100%)}
.hero-grid{gap:64px;padding-top:58px;padding-bottom:64px}
.hero::before{background:#ed873f1c}.hero::after{background:#ed873f12}
.download-band{color:#422817}.download-band h2{color:var(--ink)}.download-band .eyebrow,.band-note{color:#56301a}
.feature{display:block;padding:28px 26px}.feature h3{font-size:20px;margin:0 0 12px}.feature p{margin:0}
.category-card{padding:22px 26px 27px}.tone-1{background:#ffe3c5}.tone-2{background:#fff0bd}.tone-3{background:#ffeadc}.category-card h3{margin:25px 0 8px;font-size:25px}.category-card p{margin:0}.category-card a{margin-top:26px;padding-top:17px}
.category-top,.category-card a{border-color:#75512c33}
.page-hero{background:linear-gradient(115deg,#fff0d7,#ffead0)}
/* Real app screenshots replace the decorative brand board. */
.hero-visual{min-height:557px;max-width:440px;width:100%;padding:0;isolation:isolate}
.hero-orbit{position:absolute;width:390px;height:390px;max-width:100%;background:#ffc764;border:1px dashed #bd6c2c;opacity:.55;border-radius:50%;top:70px;right:-10px;z-index:-1}
.visual-stamp{top:0;right:0;padding:5px 13px;font-size:12px;transform:rotate(5deg)}
.phone-front,.phone-back{position:absolute;display:block;background:var(--ink);padding:7px;border:2px solid var(--ink);border-radius:26px;box-shadow:7px 8px 0 #35271f30;overflow:hidden}
.phone-front img,.phone-back img{width:100%;height:auto;border-radius:17px}
.phone-front{width:218px;top:24px;left:28px;transform:rotate(-5deg);z-index:2;transition:transform .2s}.phone-front:hover{transform:rotate(-2deg)}
.phone-back{width:178px;top:90px;right:6px;transform:rotate(9deg);z-index:1;padding:5px;border-radius:22px}.phone-back img{border-radius:14px}
.hero-screen-label{position:absolute;left:12px;bottom:42px;transform:rotate(-5deg);font-size:9px;letter-spacing:1.6px;font-weight:800;color:var(--accent-dark)}
.scan-ticket{bottom:0;right:0;padding:11px 20px 11px 11px;gap:15px;z-index:3}.scan-ticket .qr-code{width:91px;height:91px}
/* Native horizontal scrolling keeps the full screenshots intact. */
.screenshot-section{background:#fff5e7;border-bottom:1px solid #ecd5b9}
.screenshot-gallery{display:flex;gap:24px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding:6px 8px 22px;scrollbar-color:#d59454 #f5e4cc;scrollbar-width:thin}
.screenshot-gallery:focus-visible{outline:3px solid var(--accent-dark);outline-offset:5px}
.screenshot-card{margin:0;flex:0 0 244px;min-width:0;scroll-snap-align:start}
.screenshot-card>a{display:block;position:relative;padding:0;border-radius:22px;transition:transform .15s}.screenshot-card>a:hover{transform:translateY(-3px)}
.screen-frame{display:block;padding:5px;border:2px solid #6e4930;background:#6e4930;border-radius:22px;box-shadow:4px 5px 0 #d5ae8738;overflow:hidden}.screen-frame img{width:100%;height:auto;border-radius:15px}
.preview-hint{position:absolute;right:12px;bottom:12px;padding:4px 9px;border:1px solid #6e493033;border-radius:20px;background:#fff8eef0;color:var(--accent-dark);font-size:10px;font-weight:700}
.screenshot-card figcaption{padding:18px 3px 2px}.screenshot-card figcaption strong{display:block;color:var(--ink);font-size:16px;line-height:1.5}.screenshot-card figcaption span{display:block;font-size:12px;color:var(--muted);margin-top:6px}.gallery-note{text-align:center;font-size:11px;color:var(--muted);margin:23px 0 0}
/* Accessible screenshot lightbox; native dialog traps focus. */
body.preview-open{overflow:hidden}
.screenshot-dialog{max-width:640px;width:calc(100% - 32px);max-height:calc(100dvh - 32px);overflow:hidden;border-color:#6e4930;box-shadow:0 20px 80px #1c100a80;border-radius:18px;background:#fffefa}
.screenshot-dialog[open]{display:flex;flex-direction:column}.screenshot-dialog::backdrop{background:#271b14c9}
.viewer-toolbar{display:flex;justify-content:space-between;align-items:center;padding:12px 18px;gap:16px;border-bottom:1px solid #ecd7ba;flex-shrink:0}
.viewer-toolbar .eyebrow{margin:0 0 3px;font-size:8px}.viewer-toolbar h2{margin:0;font-size:17px;line-height:1.4}
.viewer-close{width:44px;height:44px;flex-shrink:0;border:1px solid #cba882;border-radius:10px;font-size:25px;color:var(--ink);background:#fff0d7}
.viewer-stage{min-height:0;flex:1;overflow:auto;display:flex;justify-content:center;background:#f5e8d5;padding:12px}
.viewer-stage img{width:auto;height:auto;max-height:calc(100dvh - 195px);max-width:100%;object-fit:contain;align-self:flex-start;border-radius:8px}
.viewer-controls{display:flex;align-items:center;justify-content:center;gap:16px;padding:11px 16px;flex-shrink:0;background:#fffefa;border-top:1px solid #ecd7ba}
.viewer-controls button{width:42px;height:40px;min-width:42px;border:1px solid #ad794b;background:var(--yellow);border-radius:8px;color:var(--ink);font-size:20px}
.viewer-controls span{min-width:35px;text-align:center;font-size:12px;font-weight:700}.viewer-controls a{margin-left:auto;font-size:12px;font-weight:700}
@media(min-width:1500px){.hero-grid{padding-top:78px;padding-bottom:80px}}
@media(max-width:1050px){.hero-grid{gap:28px}.hero-visual{max-width:370px;padding:0}.phone-front{left:8px;width:207px}.phone-back{right:0;width:164px}}
@media(max-width:800px){.hero-grid{gap:36px;padding-top:40px;padding-bottom:50px}.hero-visual{justify-self:center;max-width:380px;min-height:548px;padding:0}.phone-front{left:22px;width:214px}.phone-back{right:4px;width:168px}.category-card{padding:18px 17px 22px}.category-card h3{font-size:23px}.screenshot-card{flex-basis:222px}.screenshot-gallery{gap:20px}}
@media(max-width:560px){
 .hero-visual{width:calc(100% - 8px);max-width:335px;min-height:500px;padding:0}.phone-front{width:193px;left:10px;top:22px}.phone-back{width:147px;top:84px;right:1px}.hero-orbit{width:300px;height:300px;right:-3px;top:80px}.visual-stamp{font-size:10px;right:0}.hero-screen-label{bottom:35px;left:4px;font-size:8px}.scan-ticket{padding:10px 14px 10px 9px;gap:11px;right:0}.scan-ticket .qr-code{width:83px;height:83px}.scan-ticket strong{font-size:12px}.scan-ticket p,.scan-ticket a{font-size:11px}
 .feature{display:block;padding:23px}.feature h3{font-size:19px;margin:0 0 10px}.feature p{font-size:13px}.category-card{padding:21px 24px 23px}.category-card h3{font-size:25px;margin-top:20px}.category-card a{margin-top:20px;padding-top:15px}
 .screenshot-gallery{gap:18px;padding-bottom:19px}.screenshot-card{flex-basis:min(70vw,244px)}.gallery-note{font-size:10px;text-align:left}.viewer-toolbar{padding:11px 13px}.viewer-toolbar h2{font-size:16px}.viewer-controls{gap:12px;padding:10px 12px}.viewer-controls a{font-size:11px}.viewer-stage{padding:7px}
}