/* Manakamana Paan Bhandar — WB4 Typography, Buttons & UI Component Reconciliation
   Final-loaded UI authority. WB3 remains the colour authority.
   Purpose: unify shared typography, action controls, cards, forms, focus states and
   interaction geometry without replacing intentional page-specific composition. */

:root {
  --wb4-font-display: Georgia, Cambria, "Times New Roman", serif;
  --wb4-font-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --wb4-font-ui: var(--wb4-font-body);

  --wb4-text-xs: .75rem;
  --wb4-text-sm: .875rem;
  --wb4-text-base: 1rem;
  --wb4-text-lead: 1.125rem;

  --wb4-weight-body: 400;
  --wb4-weight-medium: 600;
  --wb4-weight-strong: 700;
  --wb4-weight-action: 800;

  --wb4-radius-control: 14px;
  --wb4-radius-card: 22px;
  --wb4-radius-pill: 999px;
  --wb4-control-height: 48px;
  --wb4-field-height: 50px;
  --wb4-focus-ring: 0 0 0 3px rgba(201,162,77,.28);
  --wb4-control-shadow: 0 10px 24px rgba(3,26,21,.10);
  --wb4-control-shadow-hover: 0 14px 30px rgba(3,26,21,.14);
  --wb4-card-shadow: 0 12px 32px rgba(3,26,21,.08);
}

/* ---------- Typography authority ---------- */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  font-family: var(--wb4-font-body);
  font-size: var(--wb4-text-base);
  font-weight: var(--wb4-weight-body);
  line-height: 1.62;
  font-kerning: normal;
}

:where(h1,h2,h3) {
  font-family: var(--wb4-font-display);
  font-weight: var(--wb4-weight-strong);
  line-height: 1.04;
  letter-spacing: -.028em;
  text-wrap: balance;
}

:where(h4,h5,h6) {
  font-family: var(--wb4-font-ui);
  font-weight: var(--wb4-weight-strong);
  line-height: 1.2;
  text-wrap: balance;
}

:where(p,li,dd) { text-wrap: pretty; }
:where(strong,b) { font-weight: var(--wb4-weight-strong); }

/* Small brand/system labels use one disciplined treatment. */
:where(.p5-eyebrow,.scene-kicker,.captivating-hero-kicker,.media-badge,.location-badge,
       .p6-enquiry-summary dt,.p5-brand-location) {
  font-family: var(--wb4-font-ui);
  font-size: var(--wb4-text-xs);
  font-weight: var(--wb4-weight-action);
  line-height: 1.2;
  letter-spacing: .10em;
}

:where(.p5-nav,.primary-nav,.p6-service-nav) {
  font-family: var(--wb4-font-ui);
}
.p5-nav > a:not(.p5-btn),
.primary-nav > a:not(.btn) {
  font-weight: var(--wb4-weight-strong);
  letter-spacing: .005em;
}

/* Keep Nepali companion text readable rather than over-spaced/display-like. */
.p5-brand-nepali,
.p5-footer-nepali {
  font-family: var(--wb4-font-body);
  font-weight: var(--wb4-weight-strong);
  letter-spacing: 0;
}

/* ---------- Unified action controls ---------- */
:where(.btn,.p5-btn,.p5-button,.captivating-hero-button) {
  min-height: var(--wb4-control-height);
  padding: .78rem 1.18rem;
  border-radius: var(--wb4-radius-pill);
  border-width: 1px;
  font-family: var(--wb4-font-ui);
  font-size: .94rem;
  font-weight: var(--wb4-weight-action);
  line-height: 1.15;
  letter-spacing: .005em;
  text-align: center;
  text-wrap: balance;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease,
              border-color .18s ease, color .18s ease;
}

:where(.btn,.p5-btn,.p5-button,.captivating-hero-button):hover {
  transform: translateY(-1px);
  box-shadow: var(--wb4-control-shadow-hover);
}

:where(.btn,.p5-btn,.p5-button,.captivating-hero-button):active {
  transform: translateY(0);
  box-shadow: var(--wb4-control-shadow);
}

/* WB3 owns the primary maroon fill; WB4 normalizes surface/outline controls. */
:where(.btn-secondary,.p5-btn-secondary,.p5-button--secondary,.captivating-hero-button-secondary) {
  border-width: 1px;
  font-weight: var(--wb4-weight-action);
}

:where(.btn-utility,.p5-btn-light,.p5-btn-ghost) {
  font-weight: var(--wb4-weight-action);
}

:where(.button-row,.p5-actions,.p6-form-actions,.p6-result-actions,.contact-actions,
       .collection-actions,.more-actions,.menu-order-actions,.c2-hero-actions,
       .c2-card-actions,.c2-final-actions,.g7-final-actions) {
  gap: .75rem;
}

/* Text links are actions too, but should not compete with buttons. */
:where(.text-link,.p5-card-link,.p6-service-card a,.p6-compare a) {
  font-weight: var(--wb4-weight-strong);
  text-underline-offset: .18em;
  text-decoration-thickness: 1px;
}

/* ---------- Cards and content surfaces ---------- */
:where(.p5-card,.p5-paan-card,.p6-service-card,.p6-info-grid article,.p6-logistics-grid article,
       .p6-decision-cards article,.p6-check-list li,.p7-trust-card,.g7-product-card,
       .ingredient-card,.menu-ingredient-card,.menu-pan-card,.premium-card,.signature-card,
       .shop-card,.contact-mini-card,.location-card,.c2-inquiry-card,.c5-inquiry-card) {
  border-radius: var(--wb4-radius-card);
}

/* Only modestly normalize elevated light cards; featured/dark cards keep their intended surfaces. */
:where(.p5-card,.p5-paan-card,.p6-info-grid article,.p6-logistics-grid article,
       .p7-trust-card,.g7-product-card,.ingredient-card,.menu-ingredient-card,
       .menu-pan-card,.premium-card,.signature-card,.shop-card,.contact-mini-card,.location-card) {
  box-shadow: var(--wb4-card-shadow);
}

:where(.p5-card,.p5-paan-card,.p6-service-card,.p6-info-grid article,.p6-logistics-grid article,
       .p6-decision-cards article,.p7-trust-card,.g7-product-card,.ingredient-card,
       .menu-ingredient-card,.menu-pan-card,.premium-card,.signature-card,.shop-card) h3 {
  line-height: 1.14;
  letter-spacing: -.018em;
}

:where(.p5-card,.p5-paan-card,.p6-service-card,.p6-info-grid article,.p6-logistics-grid article,
       .p6-decision-cards article,.p7-trust-card,.g7-product-card,.ingredient-card,
       .menu-ingredient-card,.menu-pan-card,.premium-card,.signature-card,.shop-card) p {
  line-height: 1.58;
}

/* ---------- Forms and enquiry controls ---------- */
:where(input,select,textarea,button) { font-family: var(--wb4-font-ui); }

.p6-field label,
.p6-label {
  font-weight: var(--wb4-weight-strong);
  line-height: 1.3;
}

.p6-field input,
.p6-field select,
.p6-field textarea {
  min-height: var(--wb4-field-height);
  padding: .78rem .9rem;
  border-radius: var(--wb4-radius-control);
  border: 1px solid #9A8F7D;
  background: #FFFDF8;
  line-height: 1.35;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}
.p6-field textarea { min-height: 124px; }

.p6-field input:focus,
.p6-field select:focus,
.p6-field textarea:focus {
  outline: none;
  border-color: var(--brand-gold);
  box-shadow: var(--wb4-focus-ring);
}

.p6-field [aria-invalid="true"] {
  border-color: var(--brand-maroon);
  background: #FFF8F8;
}

.p6-field small,
.p6-help,
.p6-summary-note,
.p6-copy-status,
.p5-safe-note,
.p5-hero-note {
  font-size: var(--wb4-text-sm);
  line-height: 1.5;
}

.p6-choice {
  border-radius: var(--wb4-radius-control);
  line-height: 1.4;
}
.p6-choice:has(input:checked) {
  border-color: var(--brand-gold);
  box-shadow: var(--wb4-focus-ring);
}

input[type="checkbox"],
input[type="radio"] { accent-color: var(--brand-maroon); }

/* FAQs and disclosure controls. */
.p6-faq summary,
.premium-faq-section summary,
.paan-faq-section summary,
.products-faq-section summary {
  font-family: var(--wb4-font-ui);
  font-weight: var(--wb4-weight-strong);
  line-height: 1.35;
}

/* ---------- Universal keyboard focus ---------- */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible {
  outline: 3px solid var(--brand-gold) !important;
  outline-offset: 3px !important;
}

/* Preserve touch usability in compact layouts without making every CTA full-width. */
@media (max-width: 680px) {
  :where(.btn,.p5-btn,.p5-button,.captivating-hero-button) {
    min-height: 48px;
    font-size: .93rem;
  }
  .p5-nav > a:not(.p5-btn) { font-size: .95rem; }
}

/* Respect reduced-motion users: no decorative movement is necessary to understand an action. */
@media (prefers-reduced-motion: reduce) {
  :where(.btn,.p5-btn,.p5-button,.captivating-hero-button) {
    transition: none !important;
  }
  :where(.btn,.p5-btn,.p5-button,.captivating-hero-button):hover,
  :where(.btn,.p5-btn,.p5-button,.captivating-hero-button):active {
    transform: none !important;
  }
}
