/* Homepage autumn styling. Shared section pages use site.css and catalog.css. */
:root {
  --paper: #E9E5DC;
  --midnight: #193649;
  --copper: #B64D20;
  --burgundy: #70242B;
  --brown: #3C2921;
  --paper-border: #D3CCC0;
  --paper-surface: #FAF8F3;
  --bg-1: var(--paper);
  --bg-2: var(--paper);
  --surface: var(--paper-surface);
  --surface-soft: #EDE7DD;
  --text: var(--midnight);
  --muted: #63594F;
  --accent: #9C411F; /* Darker copper for readable small text. */
  --accent-2: var(--midnight);
  --accent-soft: #EEE4D7;
  --chip: #EEE4D7;
  --border: var(--paper-border);
  --shadow: 0 8px 24px rgba(60, 41, 33, .045);
}
body { background: var(--paper); }
.topbar { background: rgba(250,248,243,.96); border-color: var(--border); }
.brand-badge, .btn-primary, .assistant-launcher, .assistant-header { background: var(--midnight); color: var(--surface); box-shadow: var(--shadow); }
.icon-pill, .section-shell, .promo-card, .catalog-section-card, .search-wrap input { background: var(--surface); border-color: var(--border); box-shadow: var(--shadow); }
.icon-pill:hover, .btn-secondary:hover { background: var(--surface-soft); }
.btn-secondary { background: var(--surface); border:1px solid var(--accent); color:var(--midnight); }
.hero-card {
  background-color: var(--paper);
  background-image: url('./assets/hero-editorial-collage.png');
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: bottom right;
  padding: 30px 30px 220px;
  /* The existing narrow column cannot cover-fill this landscape artwork
     without losing its empty left area. Preserve its natural aspect ratio. */
}
.hero-card::after { display:none; }
.hero-card h1, .hero-card > p { max-width: 78%; }
.hero-kicker { color: var(--burgundy); background:var(--surface); }
.hero-buttons { max-width:68%; position:relative; }
.hero-buttons .btn { background:var(--surface); }
.hero-buttons .btn-primary { background:var(--midnight); }
.catalog-product-image img { filter:sepia(.18); }
.catalog-section-card > img {
  height:auto;
  aspect-ratio:4 / 3;
  object-fit:cover;
  object-position:center;
}
#seasonalPromo > img { object-position:right center; }
.seasonal-scope { border-top-color:var(--copper); }
.seasonal-scope h2 { color:var(--midnight); }
.seasonal-scope .section-link, .seasonal-scope .catalog-eyebrow { color:var(--accent); }
.catalog-section-card:hover { border-color:var(--accent); }
.search-wrap input:focus { border-color:var(--midnight); box-shadow:0 0 0 3px var(--chip); }
.assistant-launcher:hover, .assistant-launcher:focus-visible { box-shadow:0 10px 24px rgba(60,41,33,.12); }
.assistant-panel { box-shadow:0 16px 40px rgba(60,41,33,.16); }
.assistant-message-user, .assistant-send { background:var(--burgundy); }
.catalog-overlay { background:rgba(25,54,73,.96); }
:where(a,button,input):focus-visible { outline:3px solid var(--burgundy); outline-offset:4px; }
@media (max-width:940px) {
  .hero-card { padding-bottom:210px; }
  .hero-card h1, .hero-card > p { max-width:65%; }
}
@media (max-width:640px) {
  .hero-card { padding:24px 22px 205px; background-position:bottom right; background-size:100% auto; }
  .hero-card h1, .hero-card > p { max-width:100%; }
  .hero-buttons { max-width:100%; }
  .hero-kicker { font-size:.85rem; }
}
/* Blend the upper image edge into the paper extension without covering the artwork. */
.hero-card::before {
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  aspect-ratio:1672 / 941;
  background:linear-gradient(to bottom,var(--paper),transparent 18%);
  pointer-events:none;
}
.hero-card > * { position:relative; }
.hero-card > p { max-width:60%; }
@media(max-width:640px) { .hero-card > p { max-width:100%; } }
