/* nyingmapacalendar.app landing. Colours from lib/core/theme (AppColors), layout after namkhazoe.com. */
:root{
  --bg:#FAF6EE; --surface:#FFFFFF; --border:#E8E0D0; --divider:#F0EAE0;
  --text:#1E1A17; --text2:#4A3F37; --muted:#766A60; --accent:#85611A;
  --brand:#8B1A1A; --brandDark:#6B1212; --brandHover:#761616; --onBrand:#FBF6EA; --onBrandMuted:#EAD9BC;
  --gold:#E8C84A; --goldHover:#EFD472;
  --serif:"Playfair Display", Georgia, "Times New Roman", serif;
  --sans:"DM Sans", -apple-system, "Segoe UI", Roboto, sans-serif;
  --bo:"Noto Serif Tibetan", "Kailasa", serif;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root{
  --bg:#15110D; --surface:#211A14; --border:#3A2F25; --divider:#2E251D;
  --text:#EDE3D0; --text2:#D6C8B0; --muted:#B5A48B; --accent:#D4A830;
  --brand:#7A1C1C; --brandDark:#5A1212; --brandHover:#8E2424; color-scheme:dark}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 var(--sans)}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent)}
a:focus-visible,.btn:focus-visible,.shots:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.wrap{max-width:1040px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.narrow{max-width:760px}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.2;text-wrap:balance;margin:0}
p{margin:0}
[lang=bo]{font-family:var(--bo);line-height:1.7}

/* header */
.top{background:var(--brandDark);color:var(--onBrand)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:12px}
.brand{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none;min-width:0}
.brand img{width:36px;height:36px;border-radius:8px;flex:none}
.brand b{font-family:var(--serif);font-size:19px;font-weight:600;white-space:nowrap}
.brand span{font-size:15px;color:var(--onBrandMuted);white-space:nowrap}
.top nav a{color:var(--onBrand);text-decoration:none;font-weight:500;font-size:15px;white-space:nowrap}
@media (max-width:560px){.brand span{display:none}}
@media (max-width:440px){.top nav{display:none}}
@media (max-width:380px){.brand b{font-size:17px}.top nav a{font-size:14px}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:999px;font:600 16px/1 var(--sans);text-decoration:none;border:1.5px solid transparent;text-align:center}
.btn.primary{background:var(--gold);color:#2A211A}
.btn.primary:hover{background:var(--goldHover)}
.btn.ghost{border-color:rgba(251,246,234,.55);color:var(--onBrand)}
.btn.ghost:hover{background:rgba(251,246,234,.1)}
.btn.brand{background:var(--brand);color:var(--onBrand)}
.btn.brand:hover{background:var(--brandHover)}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}

/* hero */
.hero{position:relative;color:var(--onBrand);background:#3a0d0d;overflow:hidden}
.hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;opacity:.6}
.hero .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(58,10,12,.35),rgba(58,10,12,.88))}
.hero .wrap{position:relative;padding-block:80px 64px}
.hero .copy{display:grid;gap:18px;align-content:center}
.hero img.art{display:none}
@media (min-width:900px){
  .hero img.bg{filter:blur(6px);transform:scale(1.05);opacity:.45}
  .hero .wrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:48px;align-items:center;padding-block:56px}
  .hero img.art{display:block;grid-column:2;grid-row:1;width:300px;height:460px;object-fit:cover;object-position:50% 50%;border-radius:20px;border:1px solid rgba(232,200,74,.45);box-shadow:0 20px 50px rgba(0,0,0,.45)}
  .hero .copy{grid-column:1;grid-row:1}
}
.hero .bo{font-size:clamp(26px,4vw,34px);color:var(--gold)}
.hero h1{font-size:clamp(34px,6vw,54px);max-width:18ch}
.hero p.lead{font-size:18px;color:var(--onBrandMuted);max-width:56ch}
.hero small{color:var(--onBrandMuted);font-size:14px}
@media (max-width:560px){.hero .actions .btn{width:100%}}

/* sections */
section.block{padding-block:56px}
section.block+section.block{border-top:1px solid var(--divider)}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}
.block h2{font-size:clamp(24px,3.5vw,30px);margin-bottom:14px}
.block .intro{color:var(--text2);max-width:62ch}
.block .actions{margin-top:24px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-top:28px}
.item{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:20px 22px;display:grid;gap:6px;align-content:start}
.item h3{font-size:19px}
.item .bo{color:var(--accent);font-size:16px}
.item p{color:var(--text2)}

/* screenshots */
.shots{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;margin-top:24px;padding-bottom:12px;-webkit-overflow-scrolling:touch}
.shots img{flex:none;width:220px;border-radius:18px;border:1px solid var(--border);scroll-snap-align:start;background:var(--surface)}
@media (min-width:1000px){.shots{overflow:visible;justify-content:space-between}.shots img{width:calc((100% - 80px)/6)}}

.list{margin:8px 0 0;padding-left:20px;display:grid;gap:10px;color:var(--text2)}
.list b{color:var(--text)}

.about .dedication{margin-top:18px;font-family:var(--serif);font-style:italic;font-weight:400;font-size:18px;color:var(--text2);max-width:52ch}

/* footer */
.foot{background:var(--brandDark);color:var(--onBrandMuted);font-size:14px}
.foot .wrap{padding-block:28px;display:grid;gap:6px}
.foot a{color:var(--onBrand)}
.btn .ic{width:20px;height:20px;flex:none}
.btn.soon{cursor:default;opacity:.85}