/* =========================================================================
   SOULBREW — OUTLETS · "Considered"
   Green hero band → paper list of two outlet cards, in the shared Considered
   language (considered.css). Static content, no JS-rendered pieces.
   ========================================================================= */

/* ---- pill variant for dark actions on paper ---- */
.lp .pill--outline { background:transparent; color:var(--ink); border:1px solid rgba(38,34,26,.32); }
.lp .pill--outline:hover { background:var(--ink); color:var(--cream); transform:translateY(-2px); }

/* ============================= HERO ============================= */
.outlets-hero {
  background:radial-gradient(120% 130% at 50% 0%, #5A4230 0%, var(--green) 45%, var(--green-deep) 100%);
  color:var(--cream);
  padding-top:clamp(120px, 16vh, 168px);
  padding-bottom:clamp(48px, 8vw, 88px);
}
.outlets-hero__big {
  font-size:clamp(34px, 6vw, 72px); text-transform:uppercase; letter-spacing:0.05em;
  line-height:1.0; margin-top:14px; color:var(--cream); font-weight:300;
}
.outlets-hero__sub {
  color:var(--cream-dim); font-size:15px; font-weight:300; letter-spacing:0.03em;
  max-width:44ch; margin-top:20px;
}

/* ============================= LIST ============================= */
.outlets-list { background:var(--paper); color:var(--ink); padding-block:clamp(48px, 8vw, 96px) clamp(64px, 10vw, 120px); }

.outlet {
  display:grid; gap:clamp(28px, 4vw, 56px); grid-template-columns:1fr;
  padding-block:clamp(44px, 6vw, 72px);
  border-top:1px solid rgba(38,34,26,.16);
}
.outlet:first-child { border-top:0; }
@media (min-width:820px) {
  .outlet { grid-template-columns:1fr 1fr; align-items:center; }
}

.outlet__media {
  aspect-ratio:5/4; border-radius:10px; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(110% 100% at 50% 18%, color-mix(in srgb, var(--dc, #cbb) 30%, transparent), transparent 68%),
    linear-gradient(180deg, var(--paper-2), #E4DAC4);
}
.outlet__media img { width:44%; height:auto; transition:transform .6s var(--ease); }
.outlet:hover .outlet__media img { transform:translateY(-8px) scale(1.04); }

.outlet__idx { font-size:11px; letter-spacing:0.2em; text-transform:uppercase; color:var(--clay); }
.outlet__body h2 {
  font-size:clamp(24px, 3.4vw, 38px); text-transform:uppercase; letter-spacing:0.05em;
  font-weight:400; color:var(--ink); margin:12px 0 0;
}
.outlet__address { color:var(--ink-soft); font-size:15px; font-weight:300; margin-top:14px; max-width:34ch; }

.hours-table { margin-top:24px; border-collapse:collapse; }
.hours-table th, .hours-table td { text-align:left; padding:6px 0; font-size:13.5px; font-weight:300; }
.hours-table th {
  color:var(--ink-soft); padding-right:40px; font-weight:400;
  letter-spacing:0.06em; text-transform:uppercase; font-size:11.5px;
}
.hours-table td { color:var(--ink); letter-spacing:0.02em; }

.outlet__actions { display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-top:30px; }
.outlet__tel {
  font-size:12px; letter-spacing:0.14em; text-transform:uppercase; color:var(--moss);
  padding-inline:6px; transition:color .2s ease;
}
.outlet__tel:hover { color:var(--green-deep); }