/* The Analog Bag Bible - warm house ground, jade-teal accent, mustard pop (scoped :root) */
:root{--ember:#35B7A6;--ember-hi:#57D0BF;--gold:#E8A93A;--brick:#B5432E;--teal-deep:#13403A}
@keyframes kb{from{transform:scale(1.06)}to{transform:scale(1)}}

/* hero */
.ab-hero{position:relative;min-height:92vh;display:flex;align-items:stretch;overflow:hidden;padding-top:70px}
.ab-hero .bg{position:absolute;inset:0;z-index:-2;background:#0f2320 center/cover no-repeat;background-image:url('/web/image/2592/bdpsite_hero-abb-bg.jpg');animation:kb 26s ease-out both}
.ab-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,26,24,.28),transparent 30%,rgba(11,26,24,.30))}
.ab-hero .hin{position:relative;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--edge);width:100%;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(30px,5vw,64px);align-items:stretch}
.ab-hero-txt{align-self:center;min-width:0;padding-block:clamp(40px,9vh,120px)}
.ab-hero .crumb{margin-bottom:26px}
.ab-hero .crumb,.ab-hero .crumb a{color:#CDEDE7}
.ab-hero h1{font-family:"Newsreader",serif;font-weight:400;font-size:clamp(50px,7.6vw,112px);line-height:.94;letter-spacing:-.02em;margin-bottom:.16em;color:#F3FBF9}
.ab-hero .tagline{font-family:"IBM Plex Mono",monospace;font-size:clamp(13px,1.3vw,16px);letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:1.2em}
.ab-hero .lead{font-size:clamp(16px,1.35vw,20px);margin-bottom:1.9em;max-width:40ch;color:#D6ECE8}
.ab-cta{display:flex;flex-wrap:wrap;gap:14px}
/* cover as background-image div (house hero-cover gotcha: an <img> in the hero grid renders small/blows out the column) */
.ab-cover{align-self:end;justify-self:center;width:100%;max-width:340px;aspect-ratio:587/760;margin-bottom:clamp(30px,7vh,80px);transform:rotate(-4deg);border-radius:3px;background:#0f2320 url('/web/image/2533/bdpsite_nf-analog.jpg') center/cover no-repeat;box-shadow:0 50px 90px -30px rgba(0,0,0,.7),0 0 0 1px rgba(0,0,0,.25),0 0 60px -18px rgba(53,183,166,.4);transition:transform .6s var(--ease)}
.ab-cover:hover{transform:rotate(-2deg) translateY(-6px)}

/* intro */
.ab-intro h2{font-family:"Newsreader",serif;font-weight:400;font-size:clamp(28px,4.4vw,56px);letter-spacing:-.015em;max-width:15ch;margin-bottom:.4em}
.ab-intro .lead{font-size:clamp(16px,1.35vw,20px);max-width:60ch}

/* editions */
.ab-ed h2{font-family:"Newsreader",serif;font-weight:400;font-size:clamp(26px,3.8vw,48px);letter-spacing:-.015em;margin-bottom:.2em}
.ab-ed .sub{color:var(--stone);margin-bottom:clamp(32px,5vh,52px)}
.ed-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,2.6vw,34px);align-items:start}
.edn{display:flex;flex-direction:column}
.edn .cover{align-self:stretch;border-radius:3px;overflow:hidden;box-shadow:0 30px 54px -24px rgba(0,0,0,.75),0 0 0 1px var(--line);transition:transform .5s var(--ease)}
.edn:hover .cover{transform:translateY(-8px)}
.edn .cover img{width:100%;display:block}
.edn .soon{align-self:stretch;aspect-ratio:1600/2000;border-radius:3px;background:radial-gradient(120% 90% at 30% 20%,rgba(53,183,166,.22),transparent 60%),linear-gradient(155deg,var(--teal-deep),#0f201d);border:1px solid rgba(53,183,166,.3);display:flex;align-items:flex-end;padding:20px}
.edn .soon .dot{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ember-hi)}
.edn .et{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ember);margin:18px 0 8px}
.edn h3{font-family:"Newsreader",serif;font-size:clamp(18px,1.6vw,22px);line-height:1.1;letter-spacing:-.01em}
.edn .st{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.08em;color:var(--stone);margin-top:9px}
.edn .st.out{color:#6FD3C4}
.edn .buy{margin-top:13px;font-size:14px}

/* close */
.ab-close{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,70px);align-items:start}
.ab-close .an{font-family:"Newsreader",serif;font-size:clamp(30px,3.6vw,50px);letter-spacing:-.01em}
.ab-close .lead{font-size:clamp(16px,1.3vw,19px)}
.ab-close .back{margin-top:1.6em}

@media(max-width:1000px){
  .ab-hero{min-height:auto;padding-block:clamp(120px,16vh,170px) clamp(56px,9vh,90px)}
  .ab-hero .hin{grid-template-columns:1fr;gap:44px}
  .ab-cover{order:-1;max-width:260px;margin-bottom:0;align-self:start;justify-self:start}
  .ab-hero-txt{padding-block:0}
  .ed-grid{grid-template-columns:1fr 1fr}
  .ab-close{grid-template-columns:1fr;gap:16px}
}
@media(max-width:560px){
  .ed-grid{grid-template-columns:1fr;gap:34px}
}