/*
Theme Name: Beloria
Template: twentytwentyfive
Description: Beloria child theme, based on the "Home, option B" mockup.
Version: 0.1.0
Text Domain: beloria
*/

:root {
  --b-stone: #F4F1EC;
  --b-paper: #FBFAF7;
  --b-sand: #EAE5DC;
  --b-line: #E2DDD3;
  --b-forest: #1E3D35;
  --b-forest-dark: #142B25;
  --b-forest-soft: #284A41;
  --b-brass: #B89B6E;
  --b-brass-light: #D9C49E;
  --b-brass-text: #7A5E36;
  --b-ink: #1C211E;
  --b-muted: #5B605B;
  --b-mist: #D3DCD8;
  --b-serif: "Cormorant Garamond", Georgia, serif;
}

.wp-site-blocks > * { margin-block-start: 0; }
.wp-site-blocks { padding: 0; }
.b-page > *, .b-header > *, .b-header-bar > *, .b-header-icons > * { margin-block: 0; }

/* Shared pieces */
.b-wrap { max-width: 1280px; margin: 0 auto; padding-left: 24px; padding-right: 24px; box-sizing: border-box; }
.b-section { padding-top: 112px; padding-bottom: 112px; }
.b-lbl { margin: 0; font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--b-brass-text); }
.b-page h1, .b-page h2, .b-page h3 { margin: 0; font-family: var(--b-serif); font-weight: 500; color: inherit; }
.b-page p { margin: 0; }
.b-h2 { font-size: clamp(36px, 4.4vw, 52px); line-height: 1.05; }
.b-body { font-size: 17px; line-height: 1.75; color: var(--b-muted); }
.b-actions { display: flex; flex-wrap: wrap; gap: 12px; }

.b-btn, .b-btn-ghost, .b-btn-light {
  display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box;
  min-height: 50px; padding: 0 30px; border-radius: 2px; font-size: 14px; font-weight: 500;
  letter-spacing: .1em; text-transform: uppercase; text-decoration: none;
}
.b-btn { background: var(--b-forest); color: #fff; }
.b-btn:hover { background: var(--b-forest-dark); color: #fff; }
.b-btn-ghost { background: transparent; color: var(--b-ink); border: 1px solid var(--b-ink); }
.b-btn-ghost:hover { background: var(--b-ink); color: #fff; }
.b-btn-light { background: var(--b-stone); color: var(--b-ink); }
.b-btn-light:hover { background: #fff; color: var(--b-ink); }

.b-ph {
  display: flex; align-items: center; justify-content: center; box-sizing: border-box; padding: 20px;
  text-align: center; font-size: 14px; line-height: 1.45; color: var(--b-muted);
  background: #E6E0D6; border: 1px dashed #A39C8E; border-radius: 2px;
}

/* Header */
.b-announce { background: var(--b-forest); color: #E9E2D3; font-size: 13px; letter-spacing: .06em; line-height: 1.5; text-align: center; padding: 10px 16px; }
.b-header { background: var(--b-paper); border-bottom: 1px solid var(--b-line); }
.b-header-bar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; max-width: 1280px; margin: 0 auto; padding: 18px 24px 10px; box-sizing: border-box; }
.b-header-bar > .wp-block-search { justify-self: start; margin: 0; }
.b-logo { display: block; line-height: 0; text-decoration: none; }
.b-logo img { display: block; width: auto; height: 56px; }
.b-logo:hover img { opacity: .8; }
.b-header-bar .wp-block-search__inside-wrapper { border: 0; padding: 0; background: transparent; }
.b-header-bar .wp-block-search__input { border: 1px solid var(--b-line); border-radius: 2px; background: #fff; font-size: 16px; }
.b-header-bar .wp-block-search__button { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0; padding: 0; border: 0; border-radius: 2px; background: transparent; color: var(--b-ink); }
.b-header-bar .wp-block-search__button:hover { background: #EDE8E0; color: var(--b-ink); }
.b-header-bar .wp-block-search__button svg { width: 22px; height: 22px; min-width: 22px; fill: currentColor; }
.b-header-icons { display: flex; justify-content: flex-end; align-items: center; gap: 2px; margin: 0; }
.b-header-icons > * { display: flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; margin: 0; }
.b-header-icons a, .b-header-icons button { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0; color: var(--b-ink); }
.b-header-icons svg { width: 22px; height: 22px; }
.b-nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 36px; max-width: 1280px; margin: 0 auto; padding: 6px 24px 16px; box-sizing: border-box; }
.b-nav a { color: var(--b-ink); font-size: 13px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; }
.b-nav a:hover { color: var(--b-forest); text-decoration: underline; text-underline-offset: 6px; }

/* Hero */
.b-hero { padding-top: 88px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 24px; }
.b-hero h1 { font-size: clamp(52px, 7vw, 96px); line-height: 1; letter-spacing: -.01em; max-width: 900px; }
.b-hero-text { font-size: 18px; line-height: 1.7; color: var(--b-muted); max-width: 600px; }
.b-hero .b-actions { justify-content: center; margin-top: 8px; }
.b-hero-photo { padding-top: 64px; }
.b-hero-photo .b-ph { min-height: 600px; }

/* Categories */
.b-center-head { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; margin-bottom: 40px; }
.b-cats { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 24px; }
.b-card { display: flex; flex-direction: column; gap: 8px; color: var(--b-ink); text-decoration: none; }
.b-card:hover h3 { text-decoration: underline; text-underline-offset: 4px; }
.b-card .b-ph { height: 340px; }
.b-card h3 { font-size: 26px; margin-top: 6px; }

/* Feature split */
.b-split { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 72px; align-items: center; }
.b-stack { display: flex; flex-direction: column; gap: 22px; align-items: flex-start; }
.b-split .b-ph { min-height: 520px; }
.b-feature { background: var(--b-forest); color: var(--b-stone); }
.b-feature .b-lbl { color: var(--b-brass-light); }
.b-feature h2 { font-size: clamp(44px, 5.4vw, 68px); line-height: 1; }
.b-feature .b-body { color: var(--b-mist); }
.b-feature .b-ph { background: var(--b-forest-soft); border-color: #7E978E; color: #E9E2D3; }
.b-facts { width: 100%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; border-top: 1px solid var(--b-brass); padding-top: 24px; }
.b-facts strong { display: block; font-family: var(--b-serif); font-size: 26px; font-weight: 500; line-height: 1.15; color: var(--b-brass-light); }
.b-facts span { display: block; margin-top: 4px; font-size: 13px; letter-spacing: .06em; color: var(--b-mist); }
.b-price-line { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; }
.b-price-line p { font-size: 15px; color: var(--b-mist); }

/* Best sellers */
.b-row-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 40px; }
.b-row-head > div { display: flex; flex-direction: column; gap: 12px; max-width: 680px; }
.b-more { color: var(--b-forest); font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; text-underline-offset: 6px; }

/* Trust strip */
.b-trust { background: var(--b-paper); border-top: 1px solid var(--b-line); border-bottom: 1px solid var(--b-line); }
.b-trust-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 28px; padding-top: 44px; padding-bottom: 44px; text-align: center; }
.b-trust-grid strong { display: block; font-family: var(--b-serif); font-size: 22px; font-weight: 600; }
.b-trust-grid span { display: block; margin-top: 6px; font-size: 14px; line-height: 1.5; color: var(--b-muted); }

/* Cookware and gifting */
.b-cookware h2 { font-size: clamp(40px, 5vw, 60px); line-height: 1.02; }
.b-gift { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); align-items: stretch; background: var(--b-sand); }
.b-gift .b-ph { min-height: 460px; border: 0; border-right: 1px dashed #A39C8E; background: #DFD8CC; }
.b-gift-copy { display: flex; flex-direction: column; justify-content: center; gap: 22px; padding: 64px 56px; box-sizing: border-box; }
.b-gift-copy h2 { font-size: clamp(38px, 4.6vw, 56px); line-height: 1.02; }
.b-gift-copy .b-body { color: #4D524D; }

/* Business */
.b-business { background: var(--b-paper); border-top: 1px solid var(--b-line); border-bottom: 1px solid var(--b-line); }
.b-biz-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); border-top: 1px solid var(--b-ink); }
.b-biz-grid a { display: flex; flex-direction: column; gap: 10px; padding: 28px 24px 28px 0; color: var(--b-ink); text-decoration: none; }
.b-biz-grid h3 { font-size: 28px; }
.b-biz-grid .b-text { color: var(--b-muted); line-height: 1.65; }
.b-biz-grid .b-more { margin-top: 6px; text-decoration: underline; }

/* Footer */
.b-footer { background: var(--b-ink); color: #CFCBC2; }
.b-footer-inner { display: flex; flex-direction: column; gap: 48px; padding-top: 72px; padding-bottom: 32px; }
.b-footer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 32px; }
.b-footer-brand { display: flex; flex-direction: column; gap: 12px; font-size: 15px; line-height: 1.6; }
.b-footer-logo { line-height: 0; }
.b-footer-logo img { display: block; width: auto; height: 48px; }
.b-footer nav { display: flex; flex-direction: column; gap: 10px; font-size: 15px; }
.b-footer nav a { color: #CFCBC2; }
.b-footer nav a:hover { color: #fff; }
.b-footer .b-lbl { font-size: 11px; color: var(--b-brass-light); }
.b-footer-legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; border-top: 1px solid #3A403C; padding-top: 24px; font-size: 13px; color: #A9A59C; }
.b-footer p { margin: 0; }

@media (max-width: 700px) {
  .b-section { padding-top: 64px; padding-bottom: 64px; }
  .b-hero { padding-top: 56px; }
  .b-hero-photo { padding-top: 40px; }
  .b-hero-photo .b-ph, .b-split .b-ph, .b-gift .b-ph { min-height: 320px; }
  .b-split { gap: 40px; }
  .b-cats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .b-card .b-ph { height: 220px; }
  .b-card h3 { font-size: 22px; }
  .b-logo img { height: 40px; }
  .b-nav { gap: 6px 20px; }
  .b-facts { grid-template-columns: 1fr; }
  .b-gift .b-ph { border-right: 0; border-bottom: 1px dashed #A39C8E; }
  .b-gift-copy { padding: 40px 24px; }
}
