/*
Theme Name: Hotel Essentials
Theme URI: https://hotel-essentials.store
Description: "Hospitality trade ledger" design system for Hotel Essentials, child theme of Storefront.
Author: Hotel Essentials
Template: storefront
Version: 1.0.0
Text Domain: hotel-essentials
*/

:root{
  --paper:#F5F3EA;
  --paper-2:#EBE7D8;
  --paper-3:#E0DBC6;
  --ink:#16302A;
  --ink-2:#33493F;
  --ink-3:#647468;
  --line:#D7D0B8;
  --brass:#B8873A;
  --brass-2:#9A6E2C;
  --on-brass:#20180C;
  --good:#3F6B4C;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#122019; --paper-2:#182A21; --paper-3:#1F362B;
    --ink:#F2EEDD; --ink-2:#CFC9AF; --ink-3:#8FA095;
    --line:#2C4136; --brass:#D8B369; --brass-2:#E7C888; --on-brass:#1B1204;
  }
}

/* ---------- base ---------- */
html{ background:var(--paper); }
body{
  background:var(--paper) !important;
  color:var(--ink-2);
  font-family:"Public Sans","Segoe UI",system-ui,sans-serif;
  font-size:16px;
  line-height:1.6;
}
h1,h2,h3,h4,.site-title,.woocommerce-loop-product__title,.product_title{
  font-family:"Libre Caslon Display","Iowan Old Style",Georgia,serif !important;
  color:var(--ink) !important;
  font-weight:400 !important;
  line-height:1.15;
}
a{ color:var(--ink); }
a:hover{ color:var(--brass-2); }
.mono, .price, .woocommerce-Price-amount{
  font-family:"IBM Plex Mono", ui-monospace, Menlo, monospace !important;
  font-variant-numeric:tabular-nums;
}
hr, .storefront-sidebar hr{ border-top:1px solid var(--line); }

/* ---------- buttons (Storefront + WooCommerce) ---------- */
.button, button, input[type="submit"], .woocommerce a.button, .woocommerce button.button,
.woocommerce #respond input#submit, .woocommerce-message a.button, .site-header-cart .widget_shopping_cart a.button{
  background:var(--brass) !important;
  color:var(--on-brass) !important;
  border:1px solid var(--brass) !important;
  border-radius:2px !important;
  font-family:"Public Sans",sans-serif !important;
  font-weight:600 !important;
  box-shadow:none !important;
  text-shadow:none !important;
  transition:background .15s ease, border-color .15s ease;
}
.button:hover, button:hover, input[type="submit"]:hover, .woocommerce a.button:hover, .woocommerce button.button:hover{
  background:var(--brass-2) !important;
  border-color:var(--brass-2) !important;
}
.button.alt, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt{
  background:var(--ink) !important; border-color:var(--ink) !important; color:var(--paper) !important;
}

/* ---------- header ---------- */
.site-header{
  background:color-mix(in srgb, var(--paper) 92%, transparent) !important;
  border-bottom:1px solid var(--line);
  backdrop-filter:saturate(140%) blur(6px);
}
.site-header .site-title, .site-header .site-title a{
  font-family:"Libre Caslon Display",serif !important;
  font-style:italic;
  color:var(--ink) !important;
}
.site-header .site-description{
  font-family:"IBM Plex Mono",monospace !important;
  font-size:0.68rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-3) !important;
}
.main-navigation ul li a{ color:var(--ink-2) !important; font-weight:500; }
.main-navigation ul li a:hover{ color:var(--ink) !important; }
.site-header-cart a{ color:var(--ink) !important; }

/* ---------- footer ---------- */
.site-footer{ background:var(--paper-2) !important; border-top:1px solid var(--line); color:var(--ink-2); }
.site-footer a{ color:var(--ink-2); }
.site-footer .widget-title{
  font-family:"IBM Plex Mono",monospace !important; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3) !important;
}

/* ---------- shop / product loop ---------- */
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product{
  background:var(--paper-2); border:1px solid var(--line); border-radius:3px; padding:1rem;
}
.woocommerce ul.products li.product .price{ color:var(--ink) !important; font-weight:600; }
.woocommerce span.onsale{ background:var(--brass) !important; color:var(--on-brass) !important; }

/* ---------- eyebrow / mono label utility ---------- */
.eyebrow{
  font-family:"IBM Plex Mono",monospace; font-size:.72rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--brass-2);
}

/* ================= custom front page ================= */
.he-wrap{ max-width:76rem; margin:0 auto; padding:0 1.5rem; }
.he-hero{ padding:3.5rem 0 4.5rem; }
.he-hero-grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:3rem; align-items:start; }
@media (max-width:900px){ .he-hero-grid{ grid-template-columns:1fr; } }
.he-hero h1{ font-size:clamp(2.1rem,4.4vw + .6rem,3.4rem); margin:.6rem 0 0; }
.he-hero p.lead{ max-width:42ch; margin-top:1.1rem; font-size:1.05rem; }
.he-ctas{ display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.8rem; }
.he-btn{
  display:inline-flex; align-items:center; gap:.5rem; font-weight:600; font-size:.92rem;
  padding:.72rem 1.3rem; border-radius:2px; text-decoration:none; border:1px solid transparent;
}
.he-btn-primary{ background:var(--brass); color:var(--on-brass); border-color:var(--brass); }
.he-btn-primary:hover{ background:var(--brass-2); color:var(--on-brass); }
.he-btn-outline{ background:transparent; color:var(--ink); border-color:var(--ink-3); }
.he-btn-outline:hover{ background:var(--paper-2); color:var(--ink); }

.he-manifest{ background:var(--paper-2); border:1px solid var(--line); border-radius:3px; padding:1.4rem 1.5rem; }
.he-manifest-title{ font-family:"IBM Plex Mono",monospace; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3); margin-bottom:.9rem; }
.he-manifest-row{ display:flex; justify-content:space-between; align-items:baseline; padding:.6rem 0; }
.he-manifest-row + .he-manifest-row{ border-top:1px dashed var(--line); }
.he-manifest-row .label{ font-size:.9rem; color:var(--ink-2); }
.he-manifest-row .value{ font-size:1.15rem; color:var(--ink); font-weight:600; }

.he-steps{ display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); border-radius:3px; overflow:hidden; margin:3rem 0; }
@media (max-width:760px){ .he-steps{ grid-template-columns:1fr; } }
.he-step{ padding:1.6rem 1.7rem; background:var(--paper-2); }
.he-step + .he-step{ border-left:1px solid var(--line); }
@media (max-width:760px){ .he-step + .he-step{ border-left:none; border-top:1px solid var(--line); } }
.he-step .num{ font-family:"IBM Plex Mono",monospace; color:var(--brass-2); font-size:.85rem; }
.he-step h3{ font-size:1.05rem !important; font-family:"Public Sans",sans-serif !important; font-weight:700 !important; margin:.4rem 0 .35rem !important; }
.he-step p{ margin:0; font-size:.92rem; color:var(--ink-2); }

.he-section{ padding:3rem 0; }
.he-section-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:1.5rem; margin-bottom:2rem; flex-wrap:wrap; }
.he-section-head h2{ font-size:clamp(1.6rem,2.6vw + .4rem,2.3rem); margin:.4rem 0 0 !important; }
.he-section-head p{ max-width:38ch; margin:.5rem 0 0; font-size:.95rem; }

.he-hairline{ border:none; border-top:1px solid var(--line); margin:0; }