/* Crown Aperture — production site CSS. Same design tokens as the approved
   Phase 1 prototype (Brand Board Option A, Noto Serif + Be Vietnam Pro). */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Be+Vietnam+Pro:wght@400;500;600;700;800&display=swap');

:root{
  --ink:#14120F; --ink-soft:#211C16; --ivory:#F0E6D3; --paper:#FBF8F2;
  --gold:#A9812F; --gold-soft:#C9A45C; --burgundy:#5C1626; --stone:#6E6656; --stone-soft:#C9C3B6;
  --line:rgba(20,18,15,0.16); --line-soft:rgba(20,18,15,0.10);
  --bg:var(--paper); --surface:var(--ivory); --text:var(--ink-soft); --text-dim:var(--stone);
  --serif:"Noto Serif",Georgia,serif; --sans:"Be Vietnam Pro",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --r-1:3px; --r-2:6px; --r-pill:999px; --tap:44px;
}
*{box-sizing:border-box;}
body{margin:0; background:var(--bg); color:var(--text); font-family:var(--sans); font-size:1.0625rem; line-height:1.6;}
h1,h2,h3,h4{font-family:var(--serif); font-weight:600; margin:0; color:var(--ink);}
a{color:inherit;}
img,video{max-width:100%; display:block;}
.container{max-width:1360px; margin-inline:auto; padding-inline:clamp(16px,4vw,48px);}
:focus-visible{outline:3px solid #1E5FA8; outline-offset:2px;}

.masthead{position:sticky; top:0; z-index:50; background:color-mix(in srgb, var(--bg) 94%, transparent); backdrop-filter:blur(10px); border-bottom:1px solid var(--line);}
.masthead__row{display:flex; align-items:center; gap:24px; padding-block:12px; min-height:76px;}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--ink);}
.brand__mark{width:42px; height:42px;}
.brand b{font-family:var(--serif); font-size:1.28rem; font-weight:700; display:block;}
.brand span{font-size:10px; font-weight:600; color:var(--text-dim); letter-spacing:.12em; display:block;}
.masthead__nav{display:flex; gap:2px; margin-left:12px; flex:1; flex-wrap:wrap;}
.masthead__nav a{font-size:1rem; font-weight:500; text-decoration:none; color:var(--text-dim); padding:10px 14px; border-radius:3px; border-bottom:2px solid transparent;}
.masthead__nav a:hover,.masthead__nav a.is-active{color:var(--ink); border-color:var(--gold);}

.frame{position:relative; background:var(--surface); overflow:hidden;}
.frame img,.frame video{position:absolute; inset:0; width:100%; height:100%; object-fit:contain; background:var(--ink);}
.frame--cover img{object-fit:cover;} /* explicitly-labelled fixed editorial preview cards only, per spec */

.section{padding-block:56px; border-bottom:1px solid var(--line);}
.section__head{display:flex; justify-content:space-between; align-items:baseline; margin-bottom:24px; gap:16px; flex-wrap:wrap;}
.pulse-item{display:flex; gap:16px; padding-block:16px; border-top:1px solid var(--line-soft); text-decoration:none; color:inherit;}

.contact-sheet{display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:3px; background:var(--line);}
.contact-sheet__item{position:relative; aspect-ratio:4/3; background:var(--bg); text-decoration:none; display:block; overflow:hidden;}
.contact-sheet__meta{position:absolute; inset:auto 0 0 0; background:linear-gradient(0deg, rgba(0,0,0,.78), transparent); color:#fff; padding:24px 10px 8px; font-size:12px;}
.contact-sheet__meta b{display:block; font-family:var(--serif); font-size:14px;}

.story-row{display:grid; grid-template-columns:150px 1fr; gap:20px; padding-block:20px; border-top:1px solid var(--line-soft); text-decoration:none; color:inherit;}
.story-row__title{font-family:var(--serif); font-size:1.4rem; font-weight:600;}
.story-row__meta{font-size:12.5px; color:var(--text-dim); margin-top:6px;}

.btn{display:inline-flex; align-items:center; gap:8px; padding:12px 22px; font-size:.95rem; font-weight:600; border-radius:3px; border:1px solid var(--ink); background:var(--ink); color:var(--paper); text-decoration:none; min-height:var(--tap); cursor:pointer;}
.btn--outline{background:transparent; color:var(--ink);}

.footer{background:var(--surface); padding-block:56px; margin-top:0;}
.footer-grid{display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:44px;}
.footer-grid h4{font-size:12px; letter-spacing:.07em; text-transform:uppercase; color:var(--text-dim); margin-bottom:12px;}
.footer-grid ul{list-style:none; margin:0; padding:0;}
.footer-grid li{margin-bottom:8px;}
.footer-grid a{text-decoration:none; font-size:14px;}
.footer-bottom{border-top:1px solid var(--line); margin-top:44px; padding-top:20px; font-size:12.5px; color:var(--text-dim); display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;}

@media (max-width:900px){ .masthead__nav{display:none;} .story-row{grid-template-columns:100px 1fr;} .footer-grid{grid-template-columns:1fr 1fr;} .masthead__search{display:none;} }
@media (max-width:560px){ .footer-grid{grid-template-columns:1fr;} }

.masthead__search{margin-left:auto;}
.masthead__search input{border:1px solid var(--line); border-radius:3px; padding:8px 12px; font-size:14px;}
.mobile-menu-btn{display:none; background:none; border:1px solid var(--line); border-radius:3px; width:var(--tap); height:var(--tap); align-items:center; justify-content:center; margin-left:12px; cursor:pointer; color:var(--ink);}
@media (max-width:900px){ .mobile-menu-btn{display:flex;} }
.mobile-menu{position:fixed; inset:0; background:var(--bg); z-index:100; transform:translateX(100%); transition:transform .3s ease; padding:24px; display:flex; flex-direction:column;}
.mobile-menu.is-open{transform:translateX(0);}
.mobile-menu-close{align-self:flex-end; background:none; border:none; font-size:22px; cursor:pointer; width:var(--tap); height:var(--tap);}
.mobile-menu nav{display:flex; flex-direction:column; gap:4px; margin-top:32px;}
.mobile-menu nav a{font-family:var(--serif); font-size:1.4rem; text-decoration:none; color:var(--ink); padding:12px 0; border-bottom:1px solid var(--line-soft);}