/* Nashi Landing Express model catalog · 2026-10-19.2
   Shared Nashi visual language, light/dark preferences, large/ultrawide screens. */
:root{
  --paper:#f5f2e9;--ink:#171816;--muted:#626357;--line:#d9d2c4;
  --accent:#c9d27a;--olive:#707822;--surface:#ece8de;--nav:#f5f2e9;
  --card:#f9f6ef;--accent-ink:#171816;color-scheme:light;
}
html[data-theme="dark"]{
  --paper:#171816;--ink:#f5f2e9;--muted:#c2c2b4;--line:#3c3e34;
  --accent:#c9d27a;--olive:#c9d27a;--surface:#22251e;--nav:#1c1e19;
  --card:#1d201b;--accent-ink:#171816;color-scheme:dark;
}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:96px;min-width:320px}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}button{font:inherit}a:focus-visible,button:focus-visible{outline:2px solid var(--olive);outline-offset:4px}
.catalog-header{width:100%;background:var(--nav);border-bottom:1px solid var(--line)}
.catalog-header-inner{width:min(calc(100% - clamp(36px,9.2vw,200px)),2100px);margin-inline:auto;min-height:88px;display:flex;align-items:center;gap:32px;justify-content:space-between}
.catalog-header .brand{flex:0 0 auto;display:inline-flex;align-items:center;text-decoration:none}
.catalog-header .logo{display:block;width:clamp(162px,12.5vw,218px);height:auto;max-height:66px}
.catalog-header .dark-logo{display:none}html[data-theme="dark"] .catalog-header .light-logo{display:none}html[data-theme="dark"] .catalog-header .dark-logo{display:block}
.catalog-header nav{display:flex;align-items:center;justify-content:flex-end;gap:clamp(12px,1.9vw,27px);flex-wrap:wrap;margin-left:auto}
.catalog-header nav>a{font-size:12px;text-decoration:none;white-space:nowrap;transition:color .18s ease}
.catalog-header nav>a:hover{color:var(--olive)}
.catalog-back{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--ink)}
.catalog-contact{background:var(--ink);color:var(--paper)!important;border-radius:999px;padding:11px 20px;font-weight:600}
.catalog-langs{display:inline-flex!important;align-items:center;gap:5px;border:0!important;margin:0!important;padding:0!important}
.catalog-langs a{font-size:11px;padding:5px;text-decoration:none;color:var(--muted);border-bottom:1px solid transparent}
.catalog-langs a[aria-current="page"]{font-weight:700;color:var(--ink);border-color:var(--ink)}
.theme-toggle{width:39px;height:39px;display:inline-flex;align-items:center;justify-content:center;flex:none;border:1px solid var(--line);border-radius:50%;color:var(--ink);background:transparent;cursor:pointer}
.theme-toggle span{display:block;width:16px;height:16px;border:2px solid currentColor;border-radius:50%;background:linear-gradient(90deg,currentColor 50%,transparent 50%);font-size:0}
.catalog-content{width:min(calc(100% - clamp(36px,9.2vw,200px)),2100px);margin-inline:auto}
.catalog-intro{padding:clamp(70px,6.2vw,122px) 0 clamp(62px,4.4vw,90px);display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,.56fr);gap:clamp(35px,7vw,145px);align-items:end}
.eyebrow{font-family:Manrope,Arial,sans-serif;font-weight:700;font-size:10px;letter-spacing:.16em;color:var(--olive)}
.catalog-intro h1,.catalog-close h2{font-family:Manrope,Arial,sans-serif;font-weight:500;letter-spacing:-.068em;font-size:clamp(52px,6.5vw,112px);line-height:1.01;margin:26px 0 0;max-width:1060px}
.catalog-intro h1 em,.catalog-close h2 em{font-weight:500;font-style:normal;color:var(--olive)}
.catalog-side{padding-bottom:8px}.catalog-side p{font-size:clamp(14px,1vw,17px);line-height:1.8;color:var(--muted);max-width:525px}
.catalog-side span{display:block;border-top:1px solid var(--line);padding-top:18px;font:700 10px/1.55 Manrope,Arial,sans-serif;letter-spacing:.14em;color:var(--olive);margin-top:28px}
.catalog-grid{border-top:1px solid var(--line);padding:clamp(45px,4.2vw,78px) 0 clamp(80px,7vw,135px)}
.filter-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:38px}
.filter-heading h2{font:500 clamp(26px,2.1vw,34px)/1.2 Manrope,Arial,sans-serif;letter-spacing:-.04em;margin:0}
.filter-heading p{color:var(--muted);font-size:13px;margin:9px 0 0}
.filters{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}
.filters button{background:transparent;color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:10px 13px;font-size:11px;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.filters button:hover{border-color:var(--olive)}.filters button.active{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:44px 22px}
.model-card{text-decoration:none;min-width:0;display:flex;flex-direction:column}.model-card[hidden]{display:none!important}
.model-preview{overflow:hidden;aspect-ratio:16/10;border:1px solid var(--line);background:var(--surface);border-radius:14px;transition:border-color .25s ease,box-shadow .25s ease}
.model-preview img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s cubic-bezier(.2,.8,.3,1)}
.model-card:hover .model-preview,.model-card:focus-visible .model-preview{border-color:var(--olive);box-shadow:0 15px 32px rgba(0,0,0,.07)}
.model-card:hover .model-preview img,.model-card:focus-visible .model-preview img{transform:scale(1.035)}
.model-meta{padding-top:16px;display:flex;justify-content:space-between;align-items:center;color:var(--olive);font:700 10px/1.3 Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.11em}
.model-arrow{font-size:23px}.model-name{font:500 clamp(20px,1.55vw,27px)/1.2 Manrope,Arial,sans-serif;margin-top:9px;letter-spacing:-.04em}
.model-card p{font-size:13px;line-height:1.65;color:var(--muted);max-width:390px;margin:9px 0 0}
.catalog-close{background:var(--surface);border-top:1px solid var(--line);padding:clamp(74px,6vw,120px) 0}
.catalog-close-inner{width:min(calc(100% - clamp(36px,9.2vw,200px)),2100px);margin-inline:auto;display:flex;align-items:end;justify-content:space-between;gap:55px}
.catalog-close h2{font-size:clamp(44px,5.5vw,88px)}.catalog-close span{color:var(--olive);font:700 10px Manrope,Arial,sans-serif;letter-spacing:.12em}
.catalog-close p{max-width:660px;color:var(--muted);line-height:1.8;font-size:14px}
.catalog-close-inner>a{flex-shrink:0;background:var(--accent);color:var(--accent-ink);border-radius:999px;padding:18px 25px;text-decoration:none;font:700 12px Manrope,Arial,sans-serif}
.catalog-footer{border-top:1px solid var(--line)}.catalog-footer-inner{width:min(calc(100% - clamp(36px,9.2vw,200px)),2100px);margin:auto;padding:24px 0;display:flex;justify-content:space-between;gap:30px;align-items:center;font-size:11px;color:var(--muted)}
.catalog-footer a{text-decoration:none;font-weight:600;color:var(--ink)}
@media(min-width:2500px){.catalog-intro{padding-top:125px}.cards{grid-template-columns:repeat(5,minmax(0,1fr));gap:52px 25px}}
@media(min-width:1800px) and (max-width:2499px){.cards{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1380px){.cards{grid-template-columns:repeat(3,minmax(0,1fr))}.catalog-header-inner{gap:16px}.catalog-header nav{gap:14px}}
@media(max-width:1050px){.catalog-intro{grid-template-columns:1fr;gap:12px}.catalog-side{max-width:690px}.filter-heading{flex-direction:column;align-items:flex-start}.filters{justify-content:flex-start}.catalog-close-inner{flex-direction:column;align-items:flex-start}.catalog-header-inner{flex-wrap:wrap;padding-block:14px;min-height:78px}.catalog-header nav{width:100%;justify-content:flex-start;margin-left:0}.catalog-contact{padding:8px 13px}}
@media(max-width:860px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog-intro h1{font-size:clamp(48px,8vw,76px)}}
@media(max-width:580px){.catalog-header-inner{padding-block:13px;gap:10px}.catalog-header .logo{width:158px}.catalog-header nav{gap:12px 15px}.catalog-header nav>a{font-size:11px}.catalog-intro{padding-top:62px;padding-bottom:55px}.catalog-intro h1{font-size:clamp(48px,11vw,72px)}.catalog-grid{padding-top:46px;padding-bottom:80px}.cards{grid-template-columns:1fr;gap:34px}.filters button{padding:10px 12px}.model-name{font-size:24px}.catalog-footer-inner{flex-direction:column;align-items:flex-start;gap:9px}}
@media(max-width:370px){.catalog-header .logo{width:145px}.catalog-header nav{gap:9px}.catalog-back{font-size:10px!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.model-preview img,.model-preview,.filters button{transition:none}}
