/* Phase 20T — shared public hero-card standard */
:root{
  --dvh-hero-bg:linear-gradient(135deg,#102d28 0%,#174239 62%,#215345 100%);
  --dvh-hero-radius:24px;
  --dvh-hero-border:1px solid rgba(255,255,255,.1);
  --dvh-hero-shadow:0 16px 42px rgba(9,31,27,.12);
  --dvh-hero-pad-y:24px;
  --dvh-hero-pad-x:26px;
}

/* Shared shell: same card geometry, typography and spacing on every public page. */
.dvh-public-hero{
  position:relative;
  overflow:hidden;
  border:var(--dvh-hero-border);
  border-radius:var(--dvh-hero-radius);
  background:var(--dvh-hero-bg);
  box-shadow:var(--dvh-hero-shadow);
  color:#fff;
}
.dvh-public-hero::after{
  content:"";
  position:absolute;
  width:220px;height:220px;
  right:-80px;top:-110px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(239,180,83,.22),rgba(239,180,83,0) 70%);
  pointer-events:none;
}
.dvh-public-hero .eyebrow{color:#f0bb62!important;margin:0 0 5px!important}
.dvh-public-hero h1{
  color:#fff!important;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(2rem,4vw,3.25rem)!important;
  line-height:1!important;
  letter-spacing:-.04em!important;
  margin:0 0 9px!important;
}
.dvh-public-hero p{color:rgba(255,255,255,.76)!important;margin:0;max-width:760px}
.dvh-public-hero .btn:not(.primary):not(.btn-primary){border-color:rgba(255,255,255,.25)}

/* Internal-page heroes use the same compact padding. */
.cataloguehero.dvh-public-hero,
.categoryhero.dvh-public-hero{
  width:min(1180px,calc(100% - 36px));
  margin:18px auto 0;
  padding:var(--dvh-hero-pad-y) var(--dvh-hero-pad-x)!important;
  min-height:0!important;
}
.cataloguehero.dvh-public-hero>.wrap,
.categoryhero.dvh-public-hero>.wrap{
  width:100%!important;
  margin:0!important;
}
.categoryhero.dvh-public-hero .categoryhero-actions{margin-top:15px!important}

/* Home keeps its artwork, but now uses the same card shell and edge treatment. */
.hero.dvh-public-hero--home{
  width:min(1180px,calc(100% - 36px));
  margin:18px auto 0;
}
.hero.dvh-public-hero--home>.wrap{width:100%;padding-left:30px;padding-right:30px}
.hero.dvh-public-hero--home .hero-grid{min-height:0!important;padding-top:38px!important;padding-bottom:38px!important}
.hero.dvh-public-hero--home h1{font-size:clamp(2.7rem,5.6vw,5rem)!important;margin:12px 0 16px!important}
.hero.dvh-public-hero--home h1 span{color:#f0bb62!important}

/* Basket hero and confirmation panel. */
.baskethead.dvh-public-hero,
.successbox.dvh-public-hero{
  padding:var(--dvh-hero-pad-y) var(--dvh-hero-pad-x)!important;
  margin-bottom:16px!important;
}
.baskethead.dvh-public-hero{align-items:center!important}
.baskethead.dvh-public-hero .btn.dark,
.successbox.dvh-public-hero .btn.dark{background:#fff;color:#15352f;border-color:#fff}
.successbox.dvh-public-hero .successicon{background:#f0bb62;color:#17352f}

/* Tracking and information pages. */
.trackhero.dvh-public-hero,
.info-hero.dvh-public-hero{
  padding:var(--dvh-hero-pad-y) var(--dvh-hero-pad-x)!important;
  margin:0 0 16px!important;
}
.info-hero.dvh-public-hero h1,.trackhero.dvh-public-hero h1{max-width:820px}

/* Product page: same card geometry on the product summary, while retaining product-specific layout. */
.dvh-product-summary{
  background:#fff;
  border:1px solid rgba(18,57,49,.12);
  border-radius:var(--dvh-hero-radius);
  box-shadow:var(--dvh-hero-shadow);
  padding:24px;
  align-self:start;
}
.dvh-product-summary>.eyebrow{margin-bottom:5px}
.dvh-product-summary>h1{margin-top:0!important;margin-bottom:10px!important}

@media(max-width:700px){
  :root{--dvh-hero-radius:19px;--dvh-hero-pad-y:18px;--dvh-hero-pad-x:18px}
  .cataloguehero.dvh-public-hero,
  .categoryhero.dvh-public-hero,
  .hero.dvh-public-hero--home{width:calc(100% - 24px);margin-top:12px}
  .hero.dvh-public-hero--home>.wrap{padding-left:18px;padding-right:18px}
  .hero.dvh-public-hero--home .hero-grid{padding-top:24px!important;padding-bottom:24px!important;gap:22px!important}
  .hero.dvh-public-hero--home h1{font-size:clamp(2.25rem,10vw,3.15rem)!important;white-space:normal!important}
  .baskethead.dvh-public-hero{display:grid!important;gap:13px!important}
  .baskethead.dvh-public-hero>.btn{width:100%}
  .dvh-public-hero h1{font-size:clamp(1.75rem,8vw,2.35rem)!important}
  .dvh-product-summary{padding:18px;border-radius:19px}
}
