/* Menu Matrix public website: premium visual refresh, October 2026.
   Marketing only. Existing sign-in, free trial, pricing and application remain intact. */
:root{--mm-bg:#0b1110;--mm-forest:#12291f;--mm-emerald:#1f4837;--mm-gold:#d4b277;--mm-champagne:#f0d5a1;--mm-cream:#f7edd9;--mm-line:#b08e5c80;--mm-muted:#c9bda6}
html{scroll-padding-top:78px}
body{background:var(--mm-bg);color:var(--mm-cream)}
.site-head{background:#0c2018ed;border-bottom:1px solid var(--mm-line)}
.head-row{height:70px}
.logo{height:48px;max-width:45vw}
.nav a:hover{color:var(--mm-champagne)}
.btn-primary,.strip{background:linear-gradient(115deg,#ac8149,#dfbc7f);color:#12271d;box-shadow:none}
.btn-ghost{border-color:var(--mm-line);color:var(--mm-cream)}
.btn:focus-visible,.pillar-card summary:focus-visible{outline:3px solid var(--mm-champagne);outline-offset:3px}
.hero{min-height:650px;padding:120px 0 55px;background-color:var(--mm-bg)}
.hero:after{background:linear-gradient(90deg,rgba(5,16,13,.97) 0%,rgba(5,19,14,.85) 44%,rgba(5,20,14,.38) 100%),linear-gradient(0deg,rgba(5,15,11,.96),transparent 60%)}
.hero h1{font-size:clamp(44px,6vw,76px);line-height:1.03}
.hero h1 em,.kicker,.launch-note b,.live{color:var(--mm-champagne)}
.hero-card,.launch-note{background:#142c22e8;border:1px solid var(--mm-line);box-shadow:0 12px 40px #0005}
.mini{background:#264435a6}
.strip{padding:11px 0}
.section{padding:68px 0}
.section-dark{background:#0e1e18}
.section:not(.section-dark){background:linear-gradient(145deg,#11251d,#182e24);color:var(--mm-cream)}
.section:not(.section-dark) .section-intro,.section:not(.section-dark) .step p,.section:not(.section-dark) .recipe-point span{color:var(--mm-muted)}
.section h2{font-size:clamp(33px,4vw,55px)}
.sig{min-height:165px;background:linear-gradient(150deg,#234b3b,#122a20)!important;border:1px solid var(--mm-line);border-radius:17px;padding:17px}
.sig b{font-size:20px}.sig p{font-size:13px}
.demo-shell,.card-preview-wrap{background:#10241c;border:1px solid var(--mm-line)}
.demo-screen{background:#1a3428;color:var(--mm-cream)}
.demo-metric{background:#254637;color:var(--mm-cream);border:1px solid var(--mm-line)}
.demo-metric small{color:var(--mm-muted)}
.demo-tabs button{background:#254637;color:var(--mm-cream)}
.demo-tabs button.on{background:var(--mm-gold);color:#12271d}
.recipe-panel{background:linear-gradient(140deg,#1e4233,#11261d);border-color:var(--mm-line);color:var(--mm-cream)}
.recipe-point i,.step span{background:#315940;color:var(--mm-champagne)}
.recipe-card-preview{background:#fffdf8;color:#10271d}
.site-foot{background:#071711;color:var(--mm-cream)}
/* Seven connected pillars — customer-facing roadmap, not live feature promises. */
.mm-roadmap{background:radial-gradient(ellipse at 80% 0%,#875f3430,transparent 35%),linear-gradient(145deg,#0a1511,#18382a 70%,#101a16);color:var(--mm-cream);padding:54px 0 60px;border-block:1px solid var(--mm-line)}
.mm-roadmap-head{display:flex;justify-content:space-between;gap:18px;align-items:end;margin-bottom:20px}
.mm-roadmap h2{font:700 clamp(31px,4.5vw,51px)/1.05 Georgia,serif;letter-spacing:-.03em;margin:9px 0 13px}
.mm-roadmap p{color:var(--mm-muted);max-width:660px;margin:0;font-size:15px}
.mm-roadmap .eyebrow{font-size:12px;letter-spacing:.19em;font-weight:900;text-transform:uppercase;color:var(--mm-champagne)}
.mm-status{border:1px solid var(--mm-line);color:var(--mm-champagne);border-radius:999px;padding:9px 13px;font-size:11px;letter-spacing:.08em;font-weight:850;white-space:nowrap}
.mm-pillar-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.pillar-card{background:linear-gradient(150deg,#244538,#10231b);border:1px solid var(--mm-line);border-radius:16px;min-height:118px;overflow:hidden}
.pillar-card summary{list-style:none;cursor:pointer;display:flex;flex-direction:column;justify-content:center;gap:7px;min-height:118px;padding:17px;position:relative}
.pillar-card summary::-webkit-details-marker{display:none}
.pillar-card summary:after{content:'＋';position:absolute;right:12px;top:11px;color:var(--mm-champagne);font-size:20px}
.pillar-card[open] summary:after{content:'−'}
.pillar-card .mm-pillar-icon{font-size:25px;line-height:1}
.pillar-card b{font-size:16px}
.pillar-card p{padding:0 16px 17px;color:#dfd2b9;font-size:12px;line-height:1.5}
.mm-roadmap-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:20px;flex-wrap:wrap}
.mm-roadmap-foot small{color:var(--mm-muted);max-width:640px}
.mm-roadmap-foot .btn{padding:11px 18px}
@media(max-width:900px){.mm-pillar-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.mm-roadmap-head{align-items:start;flex-direction:column}.hero{min-height:620px}}
@media(max-width:620px){.head-row{height:62px}.logo{height:41px}.hero{min-height:0;padding:100px 0 35px}.hero h1{font-size:clamp(39px,10vw,52px)}.hero-actions{margin:18px 0}.section{padding:46px 0}.mm-roadmap{padding:34px 0 42px}.mm-pillar-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.pillar-card,.pillar-card summary{min-height:105px}.pillar-card summary{padding:12px}.pillar-card b{font-size:13px}.pillar-card .mm-pillar-icon{font-size:22px}.pillar-card p{padding:0 12px 13px}.mm-status{font-size:10px}.sig{min-height:150px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn,.sig{transition:none}}

/* Mobile Safari hardening: compact trial CTA, reliable static hero, no overflow. */
html,body{max-width:100%;overflow-x:clip}
.hero{isolation:isolate}
.hero .hero-grid{min-width:0}
.hero .hero-grid>div{min-width:0}
.hero h1,.lead,.launch-note{overflow-wrap:break-word}
@media(max-width:760px){
 .site-head .head-row{height:62px;gap:8px}
 .site-head .logo{width:155px;max-width:43vw;height:40px}
 .site-head .actions{gap:6px;flex-shrink:0}
 .site-head .actions .btn-primary{font-size:11px!important;white-space:nowrap!important;line-height:1.1;padding:11px 10px!important;border-radius:12px;min-height:40px}
 .site-head .mobile-menu{font-size:23px;min-width:38px;min-height:40px;padding:5px}
 .hero{min-height:0!important;padding:91px 0 34px!important;background:#071b14 url('./marketing-hero-v164.png') center center/cover no-repeat!important}
 .hero video{display:none!important}
 .hero:after{background:linear-gradient(90deg,rgba(4,19,14,.97),rgba(4,19,14,.78))!important}
 .hero-grid{display:block!important}
 .hero h1{font-size:clamp(36px,9vw,47px)!important;line-height:1.04!important;margin:14px 0 16px!important;letter-spacing:-.04em}
 .kicker{font-size:10px!important;letter-spacing:.14em!important;line-height:1.6}
 .lead{font-size:15px!important;line-height:1.55;margin:0}
 .launch-note{display:flex!important;padding:10px 12px!important;margin-top:15px!important}
 .launch-note b{font-size:13px!important}
 .launch-note span{font-size:12px!important}
 .hero-actions{gap:8px!important;margin:16px 0!important}
 .hero-actions .btn{font-size:12px!important;padding:11px 13px!important;min-height:42px}
 .trust{font-size:11px!important;gap:8px 13px!important}
 .strip{padding:7px 0!important;font-size:11px}
}
@media(max-width:380px){
 .site-head .logo{width:132px;max-width:38vw}
 .site-head .actions .btn-primary{font-size:10px!important;padding:10px 7px!important}
 .site-head .mobile-menu{min-width:30px;padding:3px}
}

/* Mobile motion restored with static poster fallback; compact disclosure navigation. */
.mobile-fold{display:contents}
.mobile-fold>details>summary{display:none}
.mobile-fold-content{display:contents}
@media(max-width:760px){
 .hero video{display:block!important;opacity:.36!important;object-fit:cover;object-position:center center;transform:none!important;will-change:auto!important}
 .hero:after{background:linear-gradient(90deg,rgba(4,19,14,.9),rgba(4,19,14,.64))!important}
 .mobile-fold{display:block;background:#0b1913;padding:0 12px}
 .mobile-fold>details{border:1px solid #b08e5c80;border-radius:15px;margin:9px auto;max-width:1180px;overflow:hidden;background:#17362a}
 .mobile-fold>details>summary{display:block;list-style:none;padding:15px 17px;font-size:15px;font-weight:800;color:#f7edd9;cursor:pointer}
 .mobile-fold>details>summary::-webkit-details-marker{display:none}
 .mobile-fold>details>summary:after{content:'＋';float:right;color:#f0d5a1}
 .mobile-fold>details[open]>summary:after{content:'−'}
 .mobile-fold-content{display:block}
 .mobile-fold-content .section,.mobile-fold-content .recipe-feature,.mobile-fold-content .video-section{padding:20px 0!important}
 .mobile-fold-content .section h2{font-size:30px}
 .mobile-fold-content .story,.mobile-fold-content .recipe-panel{gap:20px}
 .mobile-fold-content .signature-grid{margin-top:18px}
 .mobile-fold-content .sig{min-height:120px;padding:12px}
 .mobile-fold-content .sig b{font-size:17px}
 .mobile-fold-content .sig p{font-size:12px}
 .mobile-fold-content .demo-screen{min-height:0}
 .mobile-fold-content .video-frame{border-radius:15px}
 .mm-roadmap-head p{display:none}
 .mm-roadmap h2{font-size:31px}
 .mm-roadmap{padding:24px 0!important}
 .mm-pillar-grid{gap:7px}
 .pillar-card,.pillar-card summary{min-height:78px!important}
 .pillar-card summary{padding:10px!important}
 .pillar-card .mm-pillar-icon{font-size:19px!important}
 .pillar-card b{font-size:12px!important}
 .mm-roadmap-foot small{font-size:11px}
 .nav.nav-open{display:flex!important;position:absolute;top:62px;left:12px;right:12px;max-height:min(65dvh,450px);overflow-y:auto;flex-direction:column;align-items:stretch;gap:0;padding:7px 12px;background:#0b231a;border:1px solid #b08e5c80;border-radius:0 0 15px 15px;box-shadow:0 16px 35px #0008}
 .nav.nav-open a{padding:10px 12px;border-bottom:1px solid #ffffff18;font-size:14px}
 .section#pricing{padding:27px 0!important}
 .section#pricing .plans{gap:12px;margin-top:22px}
 .section#pricing .plan{padding:20px!important}
 .section#pricing .plan,.section#pricing .plan *{color:#12271d}
 .section#pricing .plan .price small{color:#53665d}
 .section#pricing .plan-badge{color:#092016!important}
 .section#pricing .plan .btn-primary{color:#092016}
 .section#pricing .plan.featured{transform:none}
 .final{background:linear-gradient(145deg,#123b2c,#0b211a)!important;color:#f7edd9!important;padding:42px 0!important}
 .final h2{font-size:37px!important}
 .final .btn{background:linear-gradient(115deg,#ac8149,#dfbc7f);color:#10271d}
 .site-foot{padding:30px 0}
 .site-foot .foot-grid{gap:15px}
}
@media(prefers-reduced-motion:reduce){.hero video{display:none!important}}

/* Align chef in the mobile hero video rather than cropping them at the right edge. */
@media(max-width:760px){
 .hero video{object-position:78% center!important}
 .hero{background-position:78% center!important}
}
