/* Brand hero — scoped, additive */
.brand-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"band band" "scene detail";gap:clamp(18px,2.6vw,32px);padding:clamp(24px,3.4vw,44px) 0;align-items:stretch;max-width:100%}

/* Title band */
.brand-hero__band{grid-area:band;background:var(--mist);border-radius:18px;padding:clamp(22px,3vw,38px) clamp(20px,3.2vw,40px);display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.brand-hero__eyebrow{margin:0 0 .7em;font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--warm)}
.brand-hero__title{margin:0 0 .5em;font-family:var(--font-display);font-weight:600;font-size:clamp(1.75rem,3.4vw,2.7rem);line-height:1.12;letter-spacing:-.015em;color:var(--ink);max-width:26ch}
.brand-hero__lede{margin:0 0 1.4em;font-size:1rem;line-height:1.6;color:#3c4a50;max-width:58ch}
.brand-hero__actions{display:flex;flex-wrap:wrap;gap:10px}
.brand-hero__btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:.7em 1.3em;border-radius:999px;font-weight:600;font-size:.92rem;border:1px solid transparent;transition:background .18s,color .18s,border-color .18s}
.brand-hero__btn:hover{text-decoration:none}
.brand-hero__btn--solid{background:var(--accent);color:#fff}
.brand-hero__btn--solid:hover{background:#245a56}
.brand-hero__btn--line{background:transparent;color:var(--ink);border-color:var(--line)}
.brand-hero__btn--line:hover{border-color:var(--accent);color:var(--accent)}

/* Wide scene */
.brand-hero__scene{grid-area:scene;position:relative;margin:0;border-radius:18px;overflow:hidden;background:var(--mist);min-height:300px}
.brand-hero__scene img{width:100%;height:100%;object-fit:cover;display:block}
.brand-hero__caption{position:absolute;left:12px;bottom:12px;margin:0;background:rgba(246,244,239,.92);color:#3c4a50;font-size:.72rem;line-height:1.3;padding:5px 10px;border-radius:999px;max-width:calc(100% - 24px)}

/* Product detail card */
.brand-hero__detail{grid-area:detail;margin:0;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;min-width:0}
.brand-hero__detail-img{display:block;background:var(--mist);padding:clamp(14px,2vw,24px);flex:1 1 auto;min-height:0}
.brand-hero__detail-img img{width:100%;height:100%;max-height:260px;object-fit:contain;display:block}
.brand-hero__detail-text{display:flex;flex-direction:column;gap:4px;padding:clamp(14px,2vw,20px);border-top:1px solid var(--line);min-width:0}
.brand-hero__detail-label{font-size:.68rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--warm)}
.brand-hero__detail-name{font-size:.98rem;font-weight:600;line-height:1.35;color:var(--ink)}
.brand-hero__detail-name:hover{color:var(--accent);text-decoration:none}
.brand-hero__detail-meta{font-size:.78rem;color:#6b7a78}
.brand-hero__detail-link{align-self:flex-start;margin-top:8px;font-size:.84rem;font-weight:600;color:var(--accent);border-bottom:1px solid currentColor;padding-bottom:1px}
.brand-hero__detail-link:hover{text-decoration:none;color:#245a56}

/* Tablet */
@media (max-width:860px){
  .brand-hero{grid-template-columns:1fr;grid-template-areas:"band" "scene" "detail";gap:16px;padding:20px 0}
  .brand-hero__title{max-width:none}
  .brand-hero__lede{max-width:none}
  .brand-hero__scene{min-height:0;aspect-ratio:16/10}
  .brand-hero__btn{flex:1 1 auto}
  .brand-hero__detail{flex-direction:row;align-items:center}
  .brand-hero__detail-img{flex:0 0 38%;padding:12px}
  .brand-hero__detail-img img{max-height:150px}
  .brand-hero__detail-text{border-top:0;border-left:1px solid var(--line);flex:1 1 auto}
}

/* Small phones */
@media (max-width:420px){
  .brand-hero__band{padding:20px 16px}
  .brand-hero__detail{flex-direction:column;align-items:stretch}
  .brand-hero__detail-img{flex:none;padding:14px}
  .brand-hero__detail-img img{max-height:180px}
  .brand-hero__detail-text{border-left:0;border-top:1px solid var(--line)}
  .brand-hero__detail-name{font-size:.92rem}
}

.brand-hero__band{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-areas:"eyebrow eyebrow" "title lede" "actions actions";column-gap:clamp(20px,3.4vw,48px);row-gap:clamp(10px,1.4vw,18px);align-items:start}
.brand-hero__eyebrow{grid-area:eyebrow;margin:0}
.brand-hero__title{grid-area:title;margin:0;max-width:22ch}
.brand-hero__lede{grid-area:lede;margin:0;max-width:46ch;align-self:end;padding-bottom:.2em}
.brand-hero__actions{grid-area:actions;display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(4px,1vw,10px)}
@media (max-width:860px){
  .brand-hero__band{grid-template-columns:1fr;grid-template-areas:"eyebrow" "title" "lede" "actions";row-gap:12px}
  .brand-hero__title{max-width:none}
  .brand-hero__lede{max-width:none;align-self:auto;padding-bottom:0}
  .brand-hero__actions{margin-top:4px}
}
@media (max-width:420px){
  .brand-hero__band{row-gap:10px}
}