/* ==========================================================================
   merch — STRUCTURE
   Mission-merchandise concept cards and interest form. Brand values come
   only from eil-core tokens; the three marks remain external SVG assets.
   ========================================================================== */

.eil-merch{position:relative;overflow:hidden}
.eil-merch h4{margin:0;color:var(--eil-heading);font-family:var(--eil-font-display);line-height:1.2;text-wrap:balance}

/* --- draft status -------------------------------------------------------- */
.eil-merch-draft{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;
  margin:0 0 36px;padding:12px 18px;border-radius:var(--eil-radius-sm);background:var(--eil-accent);
  color:var(--eil-accent-ink);box-shadow:var(--eil-shadow);text-align:center}
.eil-merch-draft strong{font-family:var(--eil-font-display);font-size:clamp(1rem,.88rem + .5vw,1.35rem);
  line-height:1.2;letter-spacing:.04em;text-transform:uppercase}
.eil-merch-draft span{font-size:.84rem;font-weight:600}

/* --- opening ------------------------------------------------------------- */
.eil-merch-head{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(280px,.82fr);gap:28px 64px;
  align-items:end}
.eil-merch-head h2{font-size:var(--eil-step4);letter-spacing:-.025em;margin-top:12px;max-width:14ch}
.eil-merch-intro{display:grid;gap:14px}
.eil-merch-intro>p:last-child{color:var(--eil-accent-text);font-family:var(--eil-font-display);font-weight:700}

.eil-merch-meaning{margin:42px 0 54px;padding:28px 30px;display:grid;
  grid-template-columns:minmax(220px,.7fr) minmax(0,1.3fr);gap:20px 52px;align-items:center;
  border:1px solid var(--eil-border);border-radius:var(--eil-radius);background:var(--eil-surface);
  box-shadow:var(--eil-shadow)}
.eil-merch-meaning h3{font-size:var(--eil-step2);margin-top:8px}
.eil-merch-meaning>p{color:var(--eil-text-dim);max-width:62ch}

/* --- collection ---------------------------------------------------------- */
.eil-merch-products{position:relative;isolation:isolate}
.eil-merch-products::before{content:"CONCEPT — not yet for sale";position:absolute;inset:12% 0 auto;
  z-index:-1;color:var(--eil-heading);font-family:var(--eil-font-display);font-size:clamp(3rem,8vw,7rem);
  font-weight:700;line-height:.9;letter-spacing:-.04em;text-align:center;opacity:.055;
  transform:rotate(-7deg);pointer-events:none}
.eil-merch-section-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.6fr);gap:20px 48px;
  align-items:end;margin-bottom:22px}
.eil-merch-section-head h3{font-size:var(--eil-step3);margin-top:8px}
.eil-merch-section-head>p{color:var(--eil-text-dim);font-size:.92rem;max-width:42ch}

.eil-merch-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.eil-merch-card{min-width:0;overflow:hidden;border:1px solid var(--eil-border);border-radius:var(--eil-radius);
  background:var(--eil-surface);box-shadow:var(--eil-shadow)}
.eil-merch-mock{min-height:278px;display:grid;place-items:center;position:relative;overflow:hidden;
  padding:28px;background:var(--eil-surface-2);border-bottom:1px solid var(--eil-border)}
.eil-merch-mock::after{content:"";position:absolute;width:72%;height:72%;border:1px solid var(--eil-border);
  border-radius:var(--eil-radius-pill);opacity:.42;transform:rotate(-12deg);pointer-events:none}
.eil-merch-card-copy{padding:22px 24px 26px}
.eil-merch-card-copy h4{font-size:1.3rem;margin:9px 0 8px}
.eil-merch-card-copy p{color:var(--eil-text-dim);font-size:.94rem}
.eil-merch-status{display:inline-block;color:var(--eil-accent-text);font-family:var(--eil-font-display);
  font-size:.7rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase}

.eil-merch-marks{display:flex;align-items:center;justify-content:center;gap:11px;position:relative;z-index:1}
.eil-merch-marks img{width:46px;height:46px;object-fit:contain}

/* tee */
.eil-merch-shirt{width:220px;height:212px;display:grid;place-items:center;position:relative;z-index:1;
  background:var(--eil-heading);clip-path:polygon(22% 1%,38% 1%,43% 10%,57% 10%,62% 1%,78% 1%,100% 23%,
    83% 43%,73% 34%,75% 100%,25% 100%,27% 34%,17% 43%,0 23%)}
.eil-merch-shirt .eil-merch-marks{margin-top:7px}

/* sticker pack */
.eil-merch-sticker-sheet{width:min(100%,250px);display:flex;align-items:center;justify-content:center;gap:12px;
  position:relative;z-index:1;transform:rotate(-4deg)}
.eil-merch-sticker{width:78px;height:78px;display:grid;place-items:center;background:var(--eil-surface);
  border:2px solid var(--eil-border);box-shadow:var(--eil-shadow)}
.eil-merch-sticker img{width:58px;height:58px;object-fit:contain}
.eil-merch-sticker--one{border-radius:var(--eil-radius-pill);transform:translateY(15px) rotate(-8deg)}
.eil-merch-sticker--two{border-radius:var(--eil-radius-sm);transform:translateY(-14px) rotate(5deg)}
.eil-merch-sticker--three{border-radius:var(--eil-radius-pill);transform:translateY(10px) rotate(10deg)}

/* enamel pins */
.eil-merch-pin-board{width:min(100%,270px);min-height:164px;display:flex;align-items:center;justify-content:center;gap:14px;
  position:relative;z-index:1;padding:30px 20px;border:1px solid var(--eil-border);border-radius:var(--eil-radius-sm);
  background:var(--eil-surface);transform:rotate(2deg);box-shadow:var(--eil-shadow)}
.eil-merch-pin{width:66px;height:66px;display:grid;place-items:center;position:relative;border:2px solid var(--eil-accent);
  border-radius:var(--eil-radius-pill);background:var(--eil-surface-2)}
.eil-merch-pin::after{content:"";position:absolute;top:100%;width:2px;height:26px;background:var(--eil-border)}
.eil-merch-pin img{width:48px;height:48px;object-fit:contain}
.eil-merch-pin:nth-child(2){transform:translateY(-12px)}

/* tote */
.eil-merch-tote{width:235px;height:190px;display:grid;place-items:center;position:relative;z-index:1;margin-top:38px;
  background:var(--eil-surface);border:2px solid var(--eil-border);border-radius:0 0 var(--eil-radius-sm) var(--eil-radius-sm);
  box-shadow:var(--eil-shadow)}
.eil-merch-tote::before{content:"";position:absolute;left:50%;top:-48px;width:108px;height:82px;
  transform:translateX(-50%);border:10px solid var(--eil-border);border-bottom:0;border-radius:var(--eil-radius-pill) var(--eil-radius-pill) 0 0}
.eil-merch-tote .eil-merch-marks{margin-top:20px}

/* --- interest form ------------------------------------------------------- */
.eil-merch-interest{margin-top:52px;padding-top:34px;border-top:1px solid var(--eil-border);display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,.9fr);gap:26px 54px;align-items:center}
.eil-merch-interest h3{font-size:var(--eil-step2);margin:7px 0 9px}
.eil-merch-interest>div>p:last-child{max-width:54ch;color:var(--eil-text-dim)}
.eil-merch-form{padding:22px;border:1px solid var(--eil-border);border-radius:var(--eil-radius);
  background:var(--eil-surface);box-shadow:var(--eil-shadow)}
.eil-merch-form>label{display:block;margin-bottom:7px;color:var(--eil-heading);font-family:var(--eil-font-display);
  font-size:.86rem;font-weight:700}
.eil-merch-form-row{display:flex;gap:10px;align-items:stretch}
.eil-merch-form input[type="email"]{min-width:0;flex:1;width:100%;padding:12px 14px;border:1.5px solid var(--eil-text-dim);
  border-radius:var(--eil-radius-sm);background:var(--eil-surface-2);color:var(--eil-text);font:inherit}
.eil-merch-form input[type="email"]:hover,.eil-merch-form input[type="email"]:focus{border-color:var(--eil-accent)}
.eil-merch-form .eil-btn{flex:none}
.eil-merch-form-note{margin-top:8px;color:var(--eil-text-dim);font-size:.78rem}

@media (max-width:840px){
  .eil-merch-head,.eil-merch-meaning,.eil-merch-section-head,.eil-merch-interest{grid-template-columns:1fr}
  .eil-merch-head h2{max-width:18ch}
  .eil-merch-grid{grid-template-columns:1fr}
  .eil-merch-card{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(0,1fr)}
  .eil-merch-mock{border-bottom:0;border-right:1px solid var(--eil-border)}
}

@media (max-width:620px){
  .eil-merch-draft{align-items:stretch;flex-direction:column;gap:3px}
  .eil-merch-meaning{padding:24px 22px}
  .eil-merch-card{display:block}
  .eil-merch-mock{min-height:245px;border-right:0;border-bottom:1px solid var(--eil-border)}
  .eil-merch-form-row{display:grid}
  .eil-merch-form .eil-btn{width:100%}
}

@media (prefers-reduced-motion:reduce){
  .eil-merch-products::before{transform:none}
  .eil-merch-sticker-sheet,.eil-merch-sticker,.eil-merch-pin-board,.eil-merch-pin:nth-child(2){transform:none}
}