/* Magazine Box (magazinebox.emcobooth.com). Loads after site.css: same EMCO pieces (buttons, builder, checkout),
   restyled as a glossy black-and-white fashion issue with EMCO pink as the accent. */
:root{
  --paper:#F6F3EE;
  --ink:#111111;
  --ink-soft:#55524D;
  --line:#111111;
  --sun:#FFFFFF;
  --sun-soft:#F1ECE4;
  --pink:#FF4F8B;
  --serif:'Bodoni Moda','Didot','Bodoni 72',Georgia,serif;
  --shadow:3px 3px 0 var(--ink);
  --shadow-lg:6px 6px 0 var(--ink);
}
body{background:var(--paper)}
.btn{border-radius:999px;background:#fff;letter-spacing:.02em}
.btn.pink{background:var(--ink);color:#fff;box-shadow:3px 3px 0 var(--pink)}
.btn.pink:hover{box-shadow:5px 5px 0 var(--pink)}
.mb-btn{background:var(--ink);color:#fff}
.sec-head h2{font-family:var(--serif);font-weight:900;letter-spacing:-.01em}
.mb-kicker{font-weight:800;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--pink)}

/* header wordmark */
.mb-top{background:var(--paper)}
.mb-word{display:flex;flex-direction:column;line-height:1}
.mb-mast{font-family:var(--serif);font-weight:900;font-size:24px;letter-spacing:-.01em}
.mb-by{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-top:3px}
.mb-by img{height:16px;width:auto}
@media(min-width:720px){.mb-mast{font-size:28px}}

/* hero */
.mb-hero{padding-block:40px 64px;overflow:hidden}
.mb-hero-grid{display:grid;gap:44px;align-items:center}
@media(min-width:960px){.mb-hero-grid{grid-template-columns:1.05fr .95fr}}
.mb-hero-copy{display:flex;flex-direction:column;gap:22px}
.mb-h1{font-family:var(--serif);font-weight:900;font-size:clamp(64px,13vw,150px);line-height:.88;letter-spacing:-.03em}
.mb-h1 em{font-style:italic;font-weight:500;color:var(--pink)}
.mb-lead{font-size:19px;color:var(--ink-soft);max-width:34ch}
.mb-price{display:flex;flex-wrap:wrap;gap:18px 28px;align-items:center;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);padding:16px 0}
.mb-price small{display:block;font-size:12px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}
.mb-price b{font-family:var(--serif);font-size:54px;line-height:1}
.mb-price ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px;font-weight:700;font-size:15px}
.mb-price li::before{content:"✦ ";color:var(--pink)}

.mb-stage{position:relative;max-width:520px;margin-inline:auto;width:100%;padding:0 8% 10% 0}
.mb-glow{position:absolute;inset:6% 4% 4% 6%;background:radial-gradient(closest-side,rgba(255,79,139,.35),transparent);filter:blur(24px);z-index:0}
.mb-frame{margin:0;position:relative;z-index:1;border:2px solid var(--ink);background:#fff;padding:10px;box-shadow:var(--shadow-lg)}
.mb-frame img{width:100%;aspect-ratio:3/4;object-fit:cover}
.mb-frame.main{transform:rotate(-2deg)}
.mb-frame.side{position:absolute;right:0;bottom:0;width:42%;transform:rotate(5deg);z-index:2;padding:6px}
.mb-sticker{position:absolute;left:-6px;bottom:14%;z-index:3;background:var(--pink);color:var(--ink);border:2px solid var(--ink);border-radius:999px;padding:10px 16px;font-weight:800;font-size:14px;line-height:1.1;text-align:center;transform:rotate(-8deg);box-shadow:var(--shadow)}
@media(prefers-reduced-motion:no-preference){
  .mb-frame.main{animation:mbIn .9s cubic-bezier(.2,.8,.2,1) both}
  .mb-frame.side{animation:mbIn .9s .2s cubic-bezier(.2,.8,.2,1) both}
  .mb-sticker{animation:mbPop .5s .7s cubic-bezier(.2,1.6,.4,1) both}
}
@keyframes mbIn{from{opacity:0;translate:0 30px}to{opacity:1;translate:0 0}}
@keyframes mbPop{from{opacity:0;scale:.4}to{opacity:1;scale:1}}

/* fallback drawn cover (no photos) */
.mb-cover{position:relative;max-width:420px;margin-inline:auto;aspect-ratio:3/4;border:2px solid var(--ink);background:#fff;box-shadow:var(--shadow-lg)}
.mb-cover-inner{position:absolute;inset:12px;display:flex;flex-direction:column;justify-content:space-between;padding:16px}
.mb-cover-mast{font-family:var(--serif);font-weight:900;font-size:56px}
.mb-cl-big{font-family:var(--serif);font-size:48px;font-weight:900;display:block}

/* marquee */
.mb-marquee{background:var(--ink);color:#fff;overflow:hidden;border-block:2px solid var(--ink)}
.mb-marquee-track{display:flex;gap:44px;width:max-content;padding:14px 0;font-family:var(--serif);font-style:italic;font-size:22px}
.mb-marquee-track span::after{content:"✦";margin-left:44px;color:var(--pink);font-style:normal}
@media(prefers-reduced-motion:no-preference){.mb-marquee-track{animation:mbScroll 38s linear infinite}}
@keyframes mbScroll{to{transform:translateX(-50%)}}

/* how it works */
.mb-how{padding-block:88px 24px}
.mb-steps{list-style:none;margin:0;padding:0;display:grid;gap:18px}
@media(min-width:820px){.mb-steps{grid-template-columns:repeat(3,1fr)}}
.mb-steps li{border-top:2px solid var(--ink);padding-top:16px;display:flex;flex-direction:column;gap:8px}
.mb-step-n{font-family:var(--serif);font-size:44px;font-weight:900;color:var(--pink);line-height:1}
.mb-steps h3{font-family:var(--serif);font-size:28px}
.mb-steps p{color:var(--ink-soft)}

/* add-ons */
.mb-addons{padding-block:88px 24px}
.mb-add-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.mb-add{background:#fff;border:2px solid var(--ink);padding:18px;display:flex;flex-direction:column;gap:6px;transition:transform .2s,box-shadow .2s}
.mb-add:hover{transform:translate(-2px,-2px);box-shadow:var(--shadow)}
.mb-add.pop{box-shadow:4px 4px 0 var(--pink)}
.mb-add-price{font-family:var(--serif);font-weight:900;font-size:34px;line-height:1}
.mb-add h3{font-size:19px;font-family:var(--body)}
.mb-add p{font-size:15px;color:var(--ink-soft)}

/* gallery */
.mb-gallery{padding-block:88px 24px}
.mb-shots{display:grid;gap:12px;grid-template-columns:repeat(2,1fr)}
@media(min-width:820px){.mb-shots{grid-template-columns:repeat(4,1fr)}}
.mb-shots figure{margin:0;border:2px solid var(--ink);background:#fff;padding:6px}
.mb-shots figure:nth-child(odd){transform:rotate(-1deg)}
.mb-shots figure:nth-child(even){transform:rotate(1deg)}
.mb-shots img{width:100%;aspect-ratio:3/4;object-fit:cover}

/* builder tweaks */
.mb-build .panel{border-radius:4px}
.mb-build .summary{border-radius:4px}
.opt{border-radius:10px}
.opt[aria-pressed="true"]{background:var(--ink);color:#fff}
.opt:disabled{opacity:.45;cursor:not-allowed}
.opt.sub-addon{margin-left:22px}
.att-hrs{display:flex;flex-direction:column;gap:6px;font-weight:700;font-size:15px;margin:-2px 0 6px 22px}
.mb-foot-mast{font-family:var(--serif);font-weight:900;font-size:34px;text-decoration:none;color:inherit}
.quote-card{background:var(--ink);border-radius:4px;box-shadow:6px 6px 0 var(--pink)}
.quote-card h2{font-family:var(--serif);font-weight:900}
.mb-foot{background:var(--ink)}