/* /deals and /deals/<slug>: the deal listing and deal pages, written by the
   deals dashboard (netlify/functions/lib/deals-core.mjs). Layered on site.css
   and property.css. A logo always sits on its own tile, white by default, ink
   for white logos, so any company's mark reads on the Ink hero. */

/* ---------- Deal page hero ---------- */
.deal-hero-grid{display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,0.7fr); gap:clamp(40px, 6vw, 96px); align-items:center;}
.deal-hero h1{max-width:16ch;}
.deal-party{font-family:var(--display); font-size:11px; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:var(--platinum); margin:-6px 0 24px;}
.deal-figure{display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; margin:4px 0 30px; padding:18px 0; border-top:1px solid var(--rule-dark); border-bottom:1px solid var(--rule-dark); max-width:520px;}
.deal-figure b{font-family:var(--display); font-weight:800; font-size:clamp(34px, 4vw, 48px); letter-spacing:-0.03em; line-height:1; color:var(--white);}
.deal-figure span{font-family:var(--display); font-size:10.5px; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:var(--steel);}

/* ---------- Logo tiles ---------- */
.deal-hero-logo,.deal-card-logo{background:var(--white); display:flex; align-items:center; justify-content:center; border:1px solid var(--rule-dark);}
.deal-hero-logo.on-ink,.deal-card-logo.on-ink{background:var(--panel);}
.deal-hero-logo{justify-self:end; width:100%; max-width:380px; aspect-ratio:5/4; padding:clamp(28px, 4vw, 52px);}
.deal-card-logo{aspect-ratio:16/9; padding:26px 34px; margin-bottom:26px; border-color:var(--rule-light);}
.deal-hero-logo img,.deal-card-logo img{max-width:100%; width:auto; height:auto; object-fit:contain;}
.deal-hero-logo img{max-height:min(200px, 100%);}
.deal-card-logo img{max-height:110px;}
.deal-grid > .deal-card:only-child .deal-card-logo img{max-height:150px;}
.deal-logo-name span{font-family:var(--display); font-weight:800; letter-spacing:-0.02em; line-height:1.1; text-align:center; color:var(--ink);}
.deal-logo-name.on-ink span{color:var(--white);}
.deal-hero-logo.deal-logo-name span{font-size:clamp(24px, 2.6vw, 34px);}
.deal-card-logo.deal-logo-name span{font-size:22px;}
@media (max-width:900px){
  .deal-hero-grid{grid-template-columns:1fr;}
  .deal-hero-logo{justify-self:start; max-width:280px; order:-1;}
}

/* ---------- About, advantage, quotes ---------- */
.deal-about h2{margin-bottom:26px;}
.deal-description p{color:var(--ink-body);}
.deal-description h3{margin:30px 0 12px;}
.deal-description ul,.deal-description ol{margin:0 0 20px; padding-left:20px;}
.deal-description li{color:var(--ink-body); margin-bottom:8px;}
.deal-description .pullquote{margin:32px 0;}
.deal-advantage{font-family:var(--display); font-weight:300; font-size:clamp(20px, 2.1vw, 26px); line-height:1.5; letter-spacing:-0.01em; color:var(--white); margin:0 0 22px; max-width:34ch;}
.deal-quotes .quote{font-size:17px; line-height:1.7; color:var(--ink); margin:0 0 20px;}
.deal-quotes cite{display:block; font-style:normal; font-size:13px; line-height:1.6; color:var(--ink-label);}
.deal-quotes cite strong{display:block; color:var(--ink); font-weight:600;}

/* ---------- The /deals listing: cards keep their width however many there are ---------- */
.deal-grid, .s-white .deal-grid{background:none; gap:clamp(20px, 2.6vw, 34px);}
.deal-grid > .deal-card{flex:0 1 360px; border:1px solid var(--rule-light);}
.deal-card{display:flex; flex-direction:column; text-decoration:none; color:inherit;}
.deal-card .deal-card-logo{transition:transform .5s var(--ease);}
.deal-card:hover .deal-card-logo{transform:translateY(-4px);}
.deal-card:hover h3{color:var(--slate);}
.deal-card h3{margin-bottom:8px;}
.deal-grid .deal-card p.deal-card-party{font-family:var(--display); font-size:10.5px; font-weight:600; letter-spacing:0.18em; text-transform:uppercase; color:var(--ink-label); margin-bottom:14px;}
.deal-card-foot{margin-top:auto; padding-top:22px; display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; font-size:12.5px; color:var(--ink-label);}
.deal-card:focus-visible{outline:2px solid var(--ink); outline-offset:-2px;}
/* One deal reads as a feature, not a lonely card. */
@media (min-width:901px){
  .deal-grid > .deal-card:only-child{flex:1 1 100%; display:grid; grid-template-columns:minmax(220px, 340px) minmax(0, 1fr); grid-template-rows:auto auto auto auto 1fr; column-gap:clamp(36px, 5vw, 80px); align-items:start;}
  .deal-grid > .deal-card:only-child > *{grid-column:2; max-width:620px;}
  .deal-grid > .deal-card:only-child .deal-card-logo{grid-column:1; grid-row:1 / 6; margin-bottom:0; max-width:none;}
  .deal-grid > .deal-card:only-child .deal-card-foot{align-self:end;}
}
@media (prefers-reduced-motion:reduce){
  .deal-card .deal-card-logo{transition:none;}
  .deal-card:hover .deal-card-logo{transform:none;}
}