/* ALTERNATE DESIGN — simplified layer.
   Component styles (print cards, book, lightbox) come from the main site's
   stylesheet; this file sets a calmer page structure on top. */
@import url("style.css");

:root{
  --gap:clamp(72px,10vw,140px);
  --ink:#FAF8F4;      /* page background */
  --ink-2:#F1EDE5;    /* panels */
  --paper:#1E211B;    /* main text */
  --muted:#6E6B61;
  --line:#DED8CB;
  --gold:#9A6424;     /* darkened for contrast on light */
}
body{font-weight:300; line-height:1.65;}
section{padding:0;}
h1,h2,h3{font-family:'Fraunces', serif; font-weight:400; letter-spacing:-0.005em;}
img{display:block; max-width:100%;}

/* HEADER — white, logo block: name / rule / descriptor */
.site-header{position:sticky; top:0; z-index:50; background:rgba(250,248,244,0.96); backdrop-filter:blur(6px); border-bottom:1px solid var(--line);}
.nav{display:flex; justify-content:space-between; align-items:center; height:96px;}
.brand{display:flex; flex-direction:column; align-items:flex-start; gap:7px; font-weight:400;}
.brand-name{font-family:'Fraunces', serif; font-size:26px; letter-spacing:0.02em; line-height:1;}
.brand-rule{display:block; width:100%; height:1px; background:var(--paper); opacity:.55;}
.brand-sub{font-family:'Public Sans', sans-serif; font-size:10.5px; letter-spacing:0.22em; text-transform:uppercase; color:var(--muted); line-height:1;}
.navlinks{display:flex; gap:34px; font-size:14px; font-weight:400; color:var(--muted);}
.navlinks a:hover,.navlinks a.active{color:var(--paper);}
.navlinks .nav-contact{color:var(--gold);}
.nav-toggle{display:none; width:28px; height:28px; flex-direction:column; justify-content:center; gap:7px; background:none; border:0; cursor:pointer;}
.nav-toggle span{display:block; height:1.5px; background:var(--paper); transition:transform .25s ease;}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(4.25px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span:nth-child(2){transform:translateY(-4.25px) rotate(-45deg);}
@media(max-width:860px){
  .nav{height:84px;}
  .brand-name{font-size:22px;} .brand-sub{font-size:9px; letter-spacing:0.16em;}
  .nav-toggle{display:flex;}
  .navlinks{position:fixed; top:84px; left:0; right:0; flex-direction:column; gap:0; background:var(--ink); padding:8px 32px 24px; border-bottom:1px solid var(--line); transform:translateY(-8px); opacity:0; pointer-events:none; transition:opacity .2s ease, transform .2s ease;}
  .navlinks.open{opacity:1; transform:none; pointer-events:auto;}
  .navlinks a{padding:14px 0; border-bottom:1px solid var(--line); font-size:16px;}
}

/* HERO — framed image on the light page */
.hero{display:block; background:none; padding:40px 32px 0; min-height:0; height:auto;}
.hero-frame{aspect-ratio:21/9; overflow:hidden; background:var(--ink-2);}
.hero-frame img{width:100%; height:100%; object-fit:cover; object-position:50% 45%;}
@media(max-width:700px){ .hero-frame{aspect-ratio:4/3;} }

/* MISSION — title, statement, three small pillars */
.mission{text-align:center; padding-top:clamp(56px,8vw,96px); padding-bottom:var(--gap);}
.mission h1{font-size:clamp(40px,6vw,72px); font-weight:300; line-height:1.05; margin-bottom:28px;}
.lede{font-family:'Fraunces', serif; font-weight:300; font-size:clamp(21px,2.4vw,28px); line-height:1.45; max-width:760px; margin:0 auto 16px;}
.mission > p:not(.lede){color:var(--muted); font-size:17px; max-width:620px; margin:0 auto;}
.pillars{display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:64px; padding-top:48px; border-top:1px solid var(--line); text-align:left;}
.pillar{display:flex; gap:18px; align-items:center;}
.pillar img{width:76px; height:76px; object-fit:cover; flex-shrink:0;}
.pillar h2{font-size:21px; margin-bottom:2px;}
.pillar p{color:var(--muted); font-size:14px; line-height:1.45;}
.pillar:hover h2{color:var(--gold);}
@media(max-width:820px){ .pillars{grid-template-columns:1fr; gap:24px; max-width:420px; margin-left:auto; margin-right:auto;} }

/* SECTION HEADS */
.sec-head{display:flex; justify-content:space-between; align-items:baseline; gap:24px; flex-wrap:wrap; margin-bottom:44px;}
.sec-head h2{font-size:clamp(30px,3.6vw,44px);}
.sec-head p{color:var(--muted); font-size:15px; max-width:420px;}
.sec-head.center{flex-direction:column; align-items:center; text-align:center; gap:8px;}
.center{text-align:center;}
.text-link{display:inline-block; font-size:14px; color:var(--gold); border-bottom:1px solid rgba(201,138,59,0.35); padding-bottom:2px; transition:border-color .2s;}
.text-link:hover{border-color:var(--gold);}

/* NEWS */
.news{background:var(--ink-2); padding:var(--gap) 0;}
.news-list{border-top:1px solid var(--line);}
.news-item{display:grid; grid-template-columns:200px 1fr; gap:32px; padding:32px 0; border-bottom:1px solid var(--line);}
.news-meta{display:flex; flex-direction:column; gap:6px;}
.news-date{font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--muted); letter-spacing:0.06em; text-transform:uppercase;}
.news-tag{font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--gold); letter-spacing:0.1em; text-transform:uppercase;}
.news-body h3{font-size:24px; margin-bottom:8px;}
.news-body p{color:var(--muted); max-width:640px; margin-bottom:12px;}
@media(max-width:640px){ .news-item{grid-template-columns:1fr; gap:10px;} .news-meta{flex-direction:row; gap:16px;} }

/* COLLECTIONS STRIP */
.collections{padding:var(--gap) 32px;}
.coll-row{display:grid; grid-template-columns:repeat(3,1fr); gap:48px; margin-bottom:48px;}
.coll{display:flex; flex-direction:column; align-items:center; text-align:center;}
.coll img{width:100%; max-width:220px; aspect-ratio:1; object-fit:cover; transition:transform .4s ease;}
.coll:hover img{transform:translateY(-4px);}
.coll-name{font-family:'Fraunces', serif; font-size:21px; margin-top:20px;}
.coll-sub{font-size:13px; color:var(--muted);}
@media(max-width:720px){ .coll-row{grid-template-columns:1fr; gap:48px;} }

/* INNER PAGES */
.page{padding-top:clamp(56px,8vw,96px); padding-bottom:var(--gap);}
.page-head{margin-bottom:56px; max-width:640px;}
.page-head h1,.store-intro h1,.about-text h1{font-size:clamp(40px,5.5vw,64px); font-weight:300; line-height:1.05; margin-bottom:16px;}
.page-head p{color:var(--muted); font-size:17px;}

/* STORE */
.store-intro{display:grid; grid-template-columns:1fr 220px; gap:56px; align-items:end; padding-bottom:48px; margin-bottom:72px; border-bottom:1px solid var(--line);}
.store-intro p{color:var(--muted); font-size:16px; max-width:560px;}
.jump{display:flex; flex-wrap:wrap; gap:10px 26px; margin-top:28px; font-size:13px;}
.jump a{color:var(--paper); border-bottom:1px solid var(--line); padding-bottom:2px;}
.jump a:hover{border-color:var(--gold); color:var(--gold);}
.wall-thumb{margin:0;}
.wall-thumb .plate{aspect-ratio:1614/1344; background:var(--ink-2); height:auto;}
.wall-thumb .plate img{width:100%; height:100%; object-fit:cover;}
.wall-thumb figcaption{margin-top:10px; font-size:12px; color:var(--muted);}
@media(max-width:720px){ .store-intro{grid-template-columns:1fr; gap:28px;} .wall-thumb{max-width:220px;} }
.collection-intro{scroll-margin-top:120px; border-bottom:none; margin-bottom:36px; padding-bottom:0;}
.collection-text h2{font-weight:400;}
.collection-plates{margin-bottom:var(--gap);}
.book{scroll-margin-top:120px; padding-top:calc(var(--gap)*0.4); border-top:1px solid var(--line);}

/* JOURNAL */
.j-feature{display:grid; grid-template-columns:1.4fr 1fr; gap:48px; align-items:center; margin-bottom:var(--gap);}
.j-feature .j-img{aspect-ratio:3/2;}
.j-feature h2{font-size:clamp(30px,3.4vw,42px); margin:8px 0 14px;}
.j-feature p{color:var(--muted); margin-bottom:20px;}
.j-img{overflow:hidden; background:var(--ink-2);}
.j-img img{width:100%; height:100%; object-fit:cover; transition:transform .8s ease;}
a:hover .j-img img{transform:scale(1.04);}
.j-meta{font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--gold);}
.j-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:56px 36px;}
.j-card .j-img{aspect-ratio:3/2; margin-bottom:18px;}
.j-card h3{font-size:22px; margin:6px 0 8px;}
.j-card p{color:var(--muted); font-size:14px;}
@media(max-width:900px){ .j-feature{grid-template-columns:1fr; gap:24px;} .j-grid{grid-template-columns:1fr 1fr;} }
@media(max-width:600px){ .j-grid{grid-template-columns:1fr;} }

/* EXPEDITIONS */
.t-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:56px 36px;}
.t-img{aspect-ratio:4/3; overflow:hidden; background:var(--ink-2); margin-bottom:16px;}
.t-img img{width:100%; height:100%; object-fit:cover; transition:transform .8s ease;}
.t-card:hover .t-img img{transform:scale(1.04);}
.t-head{display:flex; justify-content:space-between; align-items:baseline;}
.t-head h3{font-size:24px;}
.t-head span{font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--muted);}
.t-card p{color:var(--muted); font-size:14px; margin-top:4px;}
@media(max-width:900px){ .t-grid{grid-template-columns:1fr 1fr;} }
@media(max-width:600px){ .t-grid{grid-template-columns:1fr;} }

/* ABOUT */
.about{display:grid; grid-template-columns:1fr 1.15fr; gap:64px; align-items:start;}
.about-img{margin:0; position:sticky; top:110px;}
.about-img img{width:100%; aspect-ratio:4/5; object-fit:cover;}
.about-img figcaption{margin-top:10px; font-size:12px; color:var(--muted);}
.lede-sm{font-family:'Fraunces', serif; font-style:italic; font-size:22px; color:var(--gold); margin-bottom:28px;}
.about-text p{color:#3A3C34; margin-bottom:18px; max-width:600px;}
.awards{list-style:none; margin:36px 0; border-top:1px solid var(--line);}
.awards li{padding:12px 0; border-bottom:1px solid var(--line); font-size:14px; display:grid; grid-template-columns:120px 1fr; gap:16px;}
.awards span{font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--muted);}
@media(max-width:860px){ .about{grid-template-columns:1fr; gap:36px;} .about-img{position:static;} }

/* FOOTER */
.site-footer{border-top:1px solid var(--line); padding:56px 0 40px;}
.foot{display:grid; grid-template-columns:1fr auto; gap:20px 40px; align-items:center;}
.foot-brand{font-family:'Fraunces', serif; font-style:normal; font-size:20px;}
.foot-links{display:flex; flex-wrap:wrap; gap:28px; font-size:13px; color:var(--muted);}
.foot-copy{grid-column:1/-1; margin-top:16px;}
@media(max-width:640px){ .foot{grid-template-columns:1fr;} }

/* light-theme touches */
.news{background:var(--ink-2);}
.lightbox{background:rgba(250,248,244,0.97);}
.lightbox-caption{color:var(--muted);}
.lightbox-close{color:var(--paper); border-color:var(--line);}
.wa-plates{background:linear-gradient(180deg,#ECE8DF 0%,#E2DCD0 100%);}

.site-footer .foot{display:grid;}

/* Captions laid over photographs keep a dark scrim and light text on the light theme */
.plate-overlay{background:linear-gradient(180deg, rgba(18,21,15,0) 0%, rgba(18,21,15,0.82) 100%); color:#EDE6D6;}
.plate-overlay .dim,.plate-overlay .plate-cat{color:rgba(237,230,214,0.75);}
.plate-overlay .taglabel{color:#E0B072;}
.plate-overlay .taglabel::before{background:#E0B072;}
.page-hero{border-bottom-color:var(--line);}


/* CONTACT PANEL — opens in-page, closes with ×, Esc or a click outside */
.contact-modal{position:fixed; inset:0; z-index:200; background:rgba(30,33,27,0.45); display:flex; align-items:center; justify-content:center; padding:24px;}
.contact-modal[hidden]{display:none;}
.contact-box{position:relative; background:var(--ink); max-width:480px; width:100%; padding:44px 40px 36px; box-shadow:0 20px 60px rgba(0,0,0,0.18);}
.contact-close{position:absolute; top:12px; right:14px; width:40px; height:40px; border:0; background:none; font-size:30px; line-height:1; color:var(--muted); cursor:pointer;}
.contact-close:hover{color:var(--paper);}
.contact-box h2{font-size:32px; margin-bottom:12px;}
.contact-box p{color:var(--muted); font-size:15px; margin-bottom:24px;}
.contact-email{display:flex; justify-content:space-between; align-items:center; gap:12px; border:1px solid var(--line); padding:12px 14px; font-size:16px; margin-bottom:24px; flex-wrap:wrap;}
.contact-copy{border:1px solid var(--line); background:none; padding:6px 14px; font:inherit; font-size:13px; color:var(--paper); cursor:pointer;}
.contact-copy:hover{border-color:var(--gold); color:var(--gold);}
.contact-actions{display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;}
.contact-btn{background:var(--paper); color:var(--ink); padding:11px 20px; font-size:14px;}
.contact-btn:hover{background:var(--gold);}

/* Tighter rhythm: smaller gaps between sections so the page reads as one flow */
:root{ --gap:clamp(48px,6vw,84px); }
.hero{padding-top:28px;}
.mission{padding-top:clamp(40px,5vw,64px);}
.mission h1{margin-bottom:22px;}
.pillars{margin-top:44px; padding-top:36px;}
.sec-head{margin-bottom:32px;}
.news-item{padding:24px 0;}
.coll-row{margin-bottom:36px;}
.page{padding-top:clamp(40px,5vw,64px);}
.page-head{margin-bottom:40px;}
.store-intro{margin-bottom:52px; padding-bottom:36px;}
.collection-intro{margin-bottom:28px;}
.j-feature{margin-bottom:calc(var(--gap)*0.85);}

/* Welcome text: both paragraphs the same, smaller size */
.mission .lede,
.mission > p:not(.lede){font-family:'Fraunces', serif; font-weight:300; font-size:clamp(18px,1.6vw,21px); line-height:1.6; color:var(--paper); max-width:720px; margin:0 auto 14px;}


/* ABOUT — award heading */
.awards-head{font-size:22px; margin-top:36px;}
.awards-head + .awards{margin-top:14px;}

/* HOME — Coming up */
.upcoming{padding-bottom:var(--gap);}
.up-list{display:grid; gap:28px;}
.up-item{display:grid; grid-template-columns:280px 1fr; gap:36px; align-items:center; border-top:1px solid var(--line); padding-top:28px;}
.up-img{aspect-ratio:3/2; overflow:hidden; background:var(--ink-2);}
.up-img img{width:100%; height:100%; object-fit:cover;}
.up-meta{display:flex; gap:18px; align-items:baseline; margin-bottom:8px;}
.up-text h3{font-size:24px; margin-bottom:8px;}
.up-text p{color:var(--muted); max-width:620px;}
@media(max-width:700px){ .up-item{grid-template-columns:1fr; gap:18px;} }
