/*
Theme Name: Handloom Lanka
Theme URI: https://handloomlanka.lk/
Author: Handloom Lanka
Author URI: https://handloomlanka.lk/
Description: An elegant, WooCommerce-ready WordPress theme built for Handloom Lanka — authentic Sri Lankan handloom sarongs and textiles. Warm cream and gold palette inspired by traditional handloom weaving.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: handloom-lanka
Tags: e-commerce, custom-menu, featured-images, translation-ready, woocommerce

Handloom Lanka WordPress Theme. Built for handloomlanka.lk.
*/

/* ==========================================================================
   1. CSS VARIABLES / BRAND PALETTE
   ========================================================================== */
:root {
  --hl-cream: #FAF6EF;
  --hl-cream-dark: #F1E9DA;
  --hl-white: #FFFFFF;
  --hl-brown-dark: #3B2A20;
  --hl-brown: #5C4433;
  --hl-gold: #B8862F;
  --hl-gold-light: #D9B76A;
  --hl-green: #4B5D3A;
  --hl-maroon: #6E1F2A;
  --hl-blue: #12508C;
  --hl-black: #1C1A18;
  --hl-text: #3A332C;
  --hl-text-light: #7A7166;
  --hl-border: #E5DCC8;

  --hl-font-heading: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --hl-font-body: 'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --hl-radius: 4px;
  --hl-shadow: 0 6px 24px rgba(59, 42, 32, 0.08);
  --hl-shadow-lg: 0 16px 48px rgba(59, 42, 32, 0.14);
  --hl-container: 1240px;
}

/* ==========================================================================
   2. RESET & BASE
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--hl-font-body);
  font-size: 16px;
  line-height: 1.7;
  color: var(--hl-text);
  background: var(--hl-cream);
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; transition: color .2s ease, opacity .2s ease; }
ul, ol { padding-left: 1.2em; }
figure { margin: 0; }

h1, h2, h3, h4, h5, h6 {
  font-family: var(--hl-font-heading);
  color: var(--hl-brown-dark);
  font-weight: 600;
  line-height: 1.25;
  margin: 0 0 .5em;
}
h1 { font-size: clamp(2rem, 4vw, 3.2rem); }
h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); }
h3 { font-size: 1.4rem; }
p { margin: 0 0 1.2em; }

.hl-container {
  max-width: var(--hl-container);
  margin: 0 auto;
  padding: 0 24px;
}

.hl-eyebrow {
  display: inline-block;
  font-family: var(--hl-font-body);
  letter-spacing: .22em;
  text-transform: uppercase;
  font-size: .72rem;
  color: var(--hl-gold);
  font-weight: 600;
  margin-bottom: 14px;
}

.hl-section { padding: 84px 0; }
.hl-section--tight { padding: 56px 0; }
.hl-section--cream-dark { background: var(--hl-cream-dark); }
.hl-section--dark { background: var(--hl-brown-dark); color: #EFE6D8; }
.hl-section--dark h2, .hl-section--dark h3 { color: #fff; }

.hl-center { text-align: center; }
.hl-max-content { max-width: 640px; margin-left: auto; margin-right: auto; }

/* Buttons */
.hl-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 15px 34px;
  font-family: var(--hl-font-body);
  font-size: .85rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 600;
  border-radius: var(--hl-radius);
  border: 1px solid transparent;
  cursor: pointer;
  transition: all .25s ease;
}
.hl-btn--primary { background: var(--hl-brown-dark); color: #fff; }
.hl-btn--primary:hover { background: var(--hl-gold); color: var(--hl-brown-dark); }
.hl-btn--outline { background: transparent; border-color: var(--hl-brown-dark); color: var(--hl-brown-dark); }
.hl-btn--outline:hover { background: var(--hl-brown-dark); color: #fff; }
.hl-btn--gold { background: var(--hl-gold); color: #fff; }
.hl-btn--gold:hover { background: var(--hl-brown-dark); }
.hl-btn--light { background: #fff; color: var(--hl-brown-dark); }
.hl-btn--light:hover { background: var(--hl-gold); color: #fff; }
.hl-btn--sm { padding: 10px 22px; font-size: .75rem; }

/* ==========================================================================
   3. HEADER
   ========================================================================== */
.hl-topbar {
  background: var(--hl-brown-dark);
  color: #E9DFC9;
  font-size: .78rem;
  letter-spacing: .04em;
}
.hl-topbar .hl-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 8px;
  padding-bottom: 8px;
  gap: 16px;
  flex-wrap: wrap;
}
.hl-topbar a:hover { color: var(--hl-gold-light); }
.hl-topbar__right { display: flex; gap: 20px; align-items: center; }

.hl-header {
  background: var(--hl-cream);
  border-bottom: 1px solid var(--hl-border);
  position: sticky;
  top: 0;
  z-index: 999;
}
.hl-header .hl-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 14px;
  padding-bottom: 14px;
  gap: 24px;
}
.hl-logo { display: flex; align-items: center; gap: 12px; }
.hl-logo img { height: 58px; width: auto; }
.hl-logo__text {
  font-family: var(--hl-font-heading);
  font-size: 1.5rem;
  color: var(--hl-brown-dark);
  line-height: 1.1;
}
.hl-logo__text span { display: block; font-size: .62rem; letter-spacing: .2em; color: var(--hl-gold); text-transform: uppercase; font-family: var(--hl-font-body); font-weight: 600; margin-top: 2px;}

.hl-nav { display: flex; }
.hl-nav ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 36px; }
.hl-nav a {
  font-size: .86rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--hl-brown-dark);
  position: relative;
  padding: 6px 0;
}
.hl-nav a:hover { color: var(--hl-gold); }
.hl-nav .current-menu-item > a { color: var(--hl-gold); }
.hl-nav li { position: relative; }
.hl-nav ul ul {
  position: absolute; top: 100%; left: 0; background: #fff;
  min-width: 220px; flex-direction: column; gap: 0;
  box-shadow: var(--hl-shadow-lg); border-radius: var(--hl-radius);
  padding: 10px 0; opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: all .2s ease;
}
.hl-nav li:hover > ul { opacity: 1; visibility: visible; transform: translateY(0); }
.hl-nav ul ul a { display: block; padding: 10px 20px; }

.hl-header__actions { display: flex; align-items: center; gap: 22px; }
.hl-header__icon { position: relative; display: inline-flex; }
.hl-header__icon .count {
  position: absolute; top: -8px; right: -10px; background: var(--hl-gold);
  color: #fff; font-size: .65rem; width: 18px; height: 18px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-weight: 700;
}
.hl-burger { display: none; background: none; border: none; cursor: pointer; padding: 6px; }
.hl-burger span { display: block; width: 24px; height: 2px; background: var(--hl-brown-dark); margin: 5px 0; }

/* ==========================================================================
   4. HERO
   ========================================================================== */
.hl-hero {
  background: linear-gradient(135deg, var(--hl-cream-dark) 0%, var(--hl-cream) 60%);
  position: relative;
  overflow: hidden;
}
.hl-hero .hl-container {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 48px;
  align-items: center;
  padding-top: 70px;
  padding-bottom: 70px;
}
.hl-hero__copy h1 { margin-bottom: 22px; }
.hl-hero__copy p { font-size: 1.08rem; color: var(--hl-text-light); max-width: 460px; margin-bottom: 30px; }
.hl-hero__actions { display: flex; gap: 16px; flex-wrap: wrap; }
.hl-hero__image { position: relative; }
.hl-hero__image img { border-radius: 10px; box-shadow: var(--hl-shadow-lg); }
.hl-hero__badge {
  position: absolute; bottom: -22px; left: -22px; background: #fff;
  padding: 18px 22px; border-radius: var(--hl-radius); box-shadow: var(--hl-shadow-lg);
  font-family: var(--hl-font-heading); text-align: center;
}
.hl-hero__badge strong { display: block; font-size: 1.7rem; color: var(--hl-gold); }
.hl-hero__badge span { font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--hl-text-light); }

/* ==========================================================================
   5. FEATURE STRIP
   ========================================================================== */
.hl-features { background: #fff; border-top: 1px solid var(--hl-border); border-bottom: 1px solid var(--hl-border); }
.hl-features .hl-container { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; padding-top: 40px; padding-bottom: 40px; }
.hl-feature { display: flex; gap: 14px; align-items: flex-start; }
.hl-feature__icon { font-size: 1.5rem; color: var(--hl-gold); flex-shrink: 0; }
.hl-feature h4 { margin: 0 0 4px; font-size: 1rem; font-family: var(--hl-font-body); font-weight: 600; color: var(--hl-brown-dark); }
.hl-feature p { margin: 0; font-size: .85rem; color: var(--hl-text-light); }

/* ==========================================================================
   6. PRODUCT / CATEGORY GRIDS
   ========================================================================== */
.hl-section-head { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 42px; flex-wrap: wrap; gap: 20px; }
.hl-section-head h2 { margin: 0; }

.hl-cat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.hl-cat-card { position: relative; border-radius: 8px; overflow: hidden; height: 380px; display: block; }
.hl-cat-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.hl-cat-card:hover img { transform: scale(1.06); }
.hl-cat-card::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(0deg, rgba(29,20,14,.75) 0%, rgba(29,20,14,.05) 55%);
}
.hl-cat-card__label { position: absolute; left: 24px; bottom: 22px; z-index: 2; color: #fff; }
.hl-cat-card__label span { font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--hl-gold-light); }
.hl-cat-card__label h3 { color: #fff; margin: 4px 0 0; }

.products, .hl-product-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
  list-style: none;
  margin: 0; padding: 0;
}
.hl-product-card, ul.products li.product {
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: var(--hl-shadow);
  transition: box-shadow .25s ease, transform .25s ease;
  position: relative;
}
.hl-product-card:hover, ul.products li.product:hover { box-shadow: var(--hl-shadow-lg); transform: translateY(-4px); }
.hl-product-card__image, ul.products li.product a img { aspect-ratio: 3/4; object-fit: cover; width: 100%; }
.hl-product-card__body, ul.products li.product .hl-card-body { padding: 20px 20px 24px; }
.hl-product-card__cat { font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: var(--hl-gold); font-weight: 600; }
.hl-product-card h3, ul.products li.product h2.woocommerce-loop-product__title {
  font-size: 1.05rem; margin: 6px 0 8px; font-family: var(--hl-font-heading);
}
.hl-product-card .price, ul.products li.product .price { color: var(--hl-brown-dark); font-weight: 600; font-family: var(--hl-font-body); }
.hl-product-card .price del, ul.products li.product .price del { color: var(--hl-text-light); opacity: .7; margin-right: 8px; }
.hl-product-card .price ins, ul.products li.product .price ins { text-decoration: none; color: var(--hl-maroon); }
.hl-badge-sale, span.onsale {
  position: absolute; top: 14px; left: 14px; background: var(--hl-maroon); color: #fff;
  font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; font-weight: 700;
  padding: 5px 12px; border-radius: 30px; z-index: 3;
}

/* ==========================================================================
   7. LOOKBOOK / STORY BAND
   ========================================================================== */
.hl-story { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.hl-story__images { position: relative; }
.hl-story__images img.hl-img-main { border-radius: 8px; box-shadow: var(--hl-shadow-lg); }
.hl-story__images img.hl-img-small { position: absolute; width: 46%; right: -34px; bottom: -34px; border: 6px solid var(--hl-cream); border-radius: 8px; box-shadow: var(--hl-shadow-lg); }
.hl-story ul { list-style: none; padding: 0; margin: 24px 0; }
.hl-story ul li { padding-left: 30px; position: relative; margin-bottom: 12px; color: var(--hl-text); }
.hl-story ul li::before { content: "✓"; position: absolute; left: 0; color: var(--hl-gold); font-weight: 700; }

/* ==========================================================================
   8. TESTIMONIALS
   ========================================================================== */
.hl-testimonials { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.hl-testimonial { background: #fff; border-radius: 8px; padding: 32px 28px; box-shadow: var(--hl-shadow); }
.hl-testimonial__stars { color: var(--hl-gold); letter-spacing: 2px; margin-bottom: 14px; }
.hl-testimonial p { font-style: italic; color: var(--hl-text); }
.hl-testimonial__author { display: flex; align-items: center; gap: 12px; margin-top: 18px; }
.hl-testimonial__author .name { font-weight: 600; color: var(--hl-brown-dark); font-size: .9rem; }
.hl-testimonial__author .loc { font-size: .78rem; color: var(--hl-text-light); }

/* ==========================================================================
   9. NEWSLETTER / CTA
   ========================================================================== */
.hl-cta { text-align: center; }
.hl-cta h2 { color: #fff; }
.hl-cta p { color: #D8CDB8; max-width: 520px; margin-left: auto; margin-right: auto; }
.hl-newsletter-form { display: flex; max-width: 440px; margin: 26px auto 0; gap: 10px; }
.hl-newsletter-form input { flex: 1; padding: 14px 18px; border-radius: var(--hl-radius); border: none; font-family: var(--hl-font-body); }
.hl-newsletter-form button { white-space: nowrap; }

/* ==========================================================================
   10. FOOTER
   ========================================================================== */
.hl-footer { background: var(--hl-brown-dark); color: #CFC3AA; padding-top: 70px; }
.hl-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 40px; padding-bottom: 50px; border-bottom: 1px solid rgba(255,255,255,.1); }
.hl-footer .hl-logo img { height: 50px; }
.hl-footer h5 { color: #fff; font-family: var(--hl-font-body); text-transform: uppercase; letter-spacing: .1em; font-size: .82rem; margin-bottom: 18px; }
.hl-footer ul { list-style: none; padding: 0; margin: 0; }
.hl-footer ul li { margin-bottom: 10px; font-size: .9rem; }
.hl-footer a:hover { color: var(--hl-gold-light); }
.hl-footer__desc { font-size: .9rem; margin: 16px 0 20px; color: #B9AC90; }
.hl-social { display: flex; gap: 12px; }
.hl-social a { width: 36px; height: 36px; border-radius: 50%; border: 1px solid rgba(255,255,255,.25); display: flex; align-items: center; justify-content: center; font-size: .85rem; }
.hl-social a:hover { background: var(--hl-gold); border-color: var(--hl-gold); }
.hl-footer__bottom { display: flex; justify-content: space-between; padding: 22px 0; font-size: .8rem; color: #A99C81; flex-wrap: wrap; gap: 10px; }
.hl-footer__payments { display: flex; gap: 8px; font-size: 1.3rem; }

/* ==========================================================================
   11. WOOCOMMERCE OVERRIDES
   ========================================================================== */
.woocommerce-breadcrumb { font-size: .82rem; color: var(--hl-text-light); margin-bottom: 30px; }
.woocommerce-breadcrumb a:hover { color: var(--hl-gold); }
.woocommerce div.product .woocommerce-product-gallery { border-radius: 8px; overflow: hidden; }
.woocommerce div.product p.price, .woocommerce div.product span.price { color: var(--hl-brown-dark); font-size: 1.5rem; font-family: var(--hl-font-heading); }
.woocommerce div.product .stock { color: var(--hl-green); font-weight: 600; }
.woocommerce a.button, .woocommerce button.button, .woocommerce #respond input#submit, .woocommerce input.button {
  background: var(--hl-brown-dark); color: #fff; border-radius: var(--hl-radius); font-family: var(--hl-font-body);
  letter-spacing: .08em; text-transform: uppercase; font-size: .78rem; padding: 14px 26px; border: none;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce #respond input#submit:hover {
  background: var(--hl-gold); color: #fff;
}
.woocommerce ul.products li.product .button { margin-top: 14px; }
.woocommerce span.onsale { background: var(--hl-maroon); }
.woocommerce nav.woocommerce-pagination ul { border: none; }
.woocommerce nav.woocommerce-pagination ul li { border: none; margin-right: 6px; }
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span {
  border-radius: var(--hl-radius); border: 1px solid var(--hl-border);
}
.woocommerce div.product form.cart .variations select { padding: 10px; border-radius: var(--hl-radius); border: 1px solid var(--hl-border); }
.woocommerce-tabs ul.tabs li a { font-family: var(--hl-font-heading); }
.woocommerce table.shop_table { border-radius: 8px; border-color: var(--hl-border); }
.woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt {
  background: var(--hl-gold);
}
.woocommerce-checkout #payment ul.payment_methods, .woocommerce-cart-form { background: transparent; }

/* Shop toolbar */
.woocommerce-ordering select, .woocommerce-result-count { font-family: var(--hl-font-body); }

/* Shop layout: product grid + sidebar */
.hl-shop-layout { display: grid; grid-template-columns: 3fr 1fr; gap: 50px; align-items: start; }
.hl-shop-main ul.products { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1024px) {
	.hl-shop-layout { grid-template-columns: 1fr; }
	.hl-shop-main ul.products { grid-template-columns: repeat(2, 1fr); }
}

/* Single product page */
.woocommerce div.product { padding: 60px 0; }
.woocommerce div.product div.summary { padding-left: 10px; }
.related.products { margin-top: 60px; }
.related.products > h2 { font-size: 1.8rem; }

/* ==========================================================================
   12. PAGE / BLOG
   ========================================================================== */
.hl-page-header { background: var(--hl-cream-dark); padding: 56px 0; text-align: center; }
.hl-page-header h1 { margin-bottom: 8px; }
.hl-content-wrap { padding: 70px 0; }
.hl-entry-meta { font-size: .8rem; color: var(--hl-text-light); letter-spacing: .04em; margin-bottom: 10px; text-transform: uppercase; }
article.hl-blog-card { background: #fff; border-radius: 8px; overflow: hidden; box-shadow: var(--hl-shadow); margin-bottom: 30px; }
article.hl-blog-card img { aspect-ratio: 16/9; object-fit: cover; }
article.hl-blog-card .hl-blog-card__body { padding: 24px 26px; }

.hl-widget { margin-bottom: 42px; }
.hl-widget h4 { font-family: var(--hl-font-heading); font-size: 1.1rem; margin-bottom: 16px; border-bottom: 2px solid var(--hl-gold); padding-bottom: 10px; display: inline-block; }
.hl-widget ul { list-style: none; padding: 0; margin: 0; }
.hl-widget ul li { padding: 8px 0; border-bottom: 1px dashed var(--hl-border); font-size: .92rem; }

/* Contact form */
.hl-contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; }
.hl-form input, .hl-form textarea, .hl-form select {
  width: 100%; padding: 14px 16px; border: 1px solid var(--hl-border); border-radius: var(--hl-radius);
  font-family: var(--hl-font-body); margin-bottom: 16px; background: #fff;
}
.hl-form label { display: block; font-size: .82rem; letter-spacing: .04em; margin-bottom: 6px; color: var(--hl-brown-dark); font-weight: 600; }
.hl-info-list { list-style: none; padding: 0; }
.hl-info-list li { display: flex; gap: 16px; margin-bottom: 22px; }
.hl-info-list .ic { color: var(--hl-gold); font-size: 1.3rem; }

/* ==========================================================================
   13. RESPONSIVE
   ========================================================================== */
@media (max-width: 1024px) {
  .hl-cat-grid, .hl-testimonials { grid-template-columns: repeat(2, 1fr); }
  .products, .hl-product-grid { grid-template-columns: repeat(3, 1fr); }
  .hl-footer__grid { grid-template-columns: 1fr 1fr; }
  .hl-features .hl-container { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
  .hl-hero .hl-container, .hl-story, .hl-contact-grid { grid-template-columns: 1fr; }
  .hl-hero__image { order: -1; }
  .hl-nav { position: fixed; top: 0; right: -100%; width: 78%; max-width: 340px; height: 100vh;
    background: #fff; flex-direction: column; padding: 90px 30px; transition: right .3s ease; box-shadow: var(--hl-shadow-lg); z-index: 1000; }
  .hl-nav.is-open { right: 0; }
  .hl-nav ul { flex-direction: column; gap: 4px; }
  .hl-nav ul ul { position: static; box-shadow: none; opacity: 1; visibility: visible; transform: none; display: none; padding-left: 14px; }
  .hl-nav li.is-open > ul { display: block; }
  .hl-burger { display: block; }
  .hl-story__images img.hl-img-small { display: none; }
}
@media (max-width: 640px) {
  .products, .hl-product-grid, .hl-cat-grid, .hl-testimonials { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .hl-section { padding: 56px 0; }
  .hl-footer__grid { grid-template-columns: 1fr; }
  .hl-newsletter-form { flex-direction: column; }
}


/* ==========================================================================
   HANDLOOM LANKA 1.1 EDITORIAL DESIGN
   ========================================================================== */
:root {
  --hl-ink: #251c16;
  --hl-paper: #fbf8f2;
  --hl-sand: #eee5d5;
  --hl-line: #d9cdbb;
  --hl-accent: #b17b36;
  --hl-accent-dark: #7c5222;
}
body { background: var(--hl-paper); color: var(--hl-ink); }
.hl-container { max-width: 1320px; }
.hl-topbar { background: var(--hl-ink); }
.hl-topbar__inner { min-height: 38px; }
.hl-header { background: rgba(251,248,242,.96); backdrop-filter: blur(12px); border-bottom-color: rgba(37,28,22,.10); transition: box-shadow .25s ease; }
.hl-header.is-scrolled { box-shadow: 0 14px 32px rgba(37,28,22,.08); }
.hl-header__inner { min-height: 82px; }
.hl-logo { flex: 0 0 auto; }
.hl-logo img { height: 63px; width: auto; max-width: 220px; object-fit: contain; }
.hl-header__actions { gap: 11px; }
.hl-icon-btn { width: 40px; height: 40px; display: inline-flex; align-items:center; justify-content:center; position:relative; border:0; background:transparent; cursor:pointer; color:var(--hl-ink); }
.hl-icon { width: 20px; height:20px; display:inline-block; position:relative; }
.hl-icon--search::before { content:""; position:absolute; width:11px; height:11px; border:1.7px solid currentColor; border-radius:50%; left:1px; top:1px; }
.hl-icon--search::after { content:""; position:absolute; width:7px; height:1.7px; background:currentColor; transform:rotate(45deg); left:12px; top:13px; }
.hl-icon--user::before { content:""; position:absolute; width:8px; height:8px; border:1.6px solid currentColor; border-radius:50%; left:6px; top:1px; }
.hl-icon--user::after { content:""; position:absolute; width:14px; height:8px; border:1.6px solid currentColor; border-bottom:0; border-radius:10px 10px 0 0; left:3px; bottom:1px; }
.hl-icon--bag::before { content:""; position:absolute; left:3px; top:6px; width:14px; height:12px; border:1.6px solid currentColor; border-radius:2px 2px 4px 4px; }
.hl-icon--bag::after { content:""; position:absolute; width:7px; height:5px; border:1.6px solid currentColor; border-bottom:0; border-radius:5px 5px 0 0; left:6px; top:2px; }
.hl-header__whatsapp { padding:9px 15px; border:1px solid var(--hl-ink); border-radius:999px; font-size:.72rem; letter-spacing:.10em; text-transform:uppercase; }
.hl-header__whatsapp:hover { background:var(--hl-ink); color:#fff; }
.hl-burger { margin-left:3px; }
.hl-nav > ul > li > a { font-size:.76rem; letter-spacing:.14em; }

.hl-search-overlay { position:fixed; inset:0; z-index:2000; }
.hl-search-overlay__backdrop { position:absolute; inset:0; background:rgba(20,14,10,.60); }
.hl-search-overlay__panel { position:relative; width:min(720px,calc(100% - 32px)); margin:9vh auto 0; background:var(--hl-paper); padding:58px; box-shadow:0 30px 90px rgba(0,0,0,.24); }
.hl-search-overlay[hidden], .hl-qv-modal[hidden] { display:none; }
.hl-search-overlay__close, .hl-qv-close { position:absolute; right:18px; top:12px; border:0; background:transparent; font-size:2rem; cursor:pointer; color:var(--hl-ink); }
.hl-search-overlay__panel h2 { font-size:clamp(2rem,4vw,3.2rem); margin-bottom:25px; }
.hl-search-form { display:flex; gap:9px; }
.hl-search-form input { flex:1; padding:16px 18px; background:#fff; border:1px solid var(--hl-line); font:inherit; }
.hl-search-suggestions { display:flex; flex-wrap:wrap; gap:9px; margin-top:18px; align-items:center; font-size:.82rem; }
.hl-search-suggestions a { padding:7px 12px; border:1px solid var(--hl-line); }

.hl-hero--editorial { background:linear-gradient(135deg,#f3ecdf 0%,#fbf8f2 48%,#e8dbc6 100%); }
.hl-hero__grid { display:grid; grid-template-columns:1fr .92fr; gap:55px; align-items:center; min-height:690px; padding-top:70px; padding-bottom:75px; }
.hl-kicker { display:flex; align-items:center; gap:10px; font-size:.69rem; letter-spacing:.22em; text-transform:uppercase; color:var(--hl-accent-dark); font-weight:700; }
.hl-kicker i { width:24px; height:1px; background:var(--hl-accent); }
.hl-hero__copy h1 { font-size:clamp(3.5rem,6vw,6.1rem); letter-spacing:-.035em; line-height:.96; max-width:690px; margin:22px 0 26px; }
.hl-hero__copy > p { max-width:560px; font-size:1.08rem; color:#665b50; }
.hl-hero__actions { display:flex; flex-wrap:wrap; align-items:center; gap:22px; margin-top:30px; }
.hl-text-link { display:inline-flex; gap:8px; align-items:center; font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; font-weight:700; border-bottom:1px solid var(--hl-ink); padding-bottom:5px; }
.hl-text-link:hover { color:var(--hl-accent-dark); border-color:var(--hl-accent-dark); }
.hl-hero__trust { display:flex; gap:22px; flex-wrap:wrap; margin-top:58px; padding-top:18px; border-top:1px solid rgba(37,28,22,.15); color:#786c5e; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; }
.hl-hero__trust b { color:var(--hl-accent-dark); margin-right:5px; }
.hl-hero__visual { position:relative; min-height:540px; }
.hl-hero__frame { position:absolute; width:86%; height:90%; right:4%; top:6%; border:1px solid rgba(177,123,54,.48); }
.hl-hero__main { position:absolute; inset:0; width:88%; height:100%; object-fit:cover; object-position:center; margin-left:auto; border-radius:2px; box-shadow:0 35px 70px rgba(60,42,25,.18); }
.hl-hero__floating { position:absolute; left:-36px; bottom:54px; background:var(--hl-ink); color:#fff; padding:18px 20px; min-width:170px; display:flex; flex-direction:column; gap:4px; }
.hl-floating__line { width:34px; height:1px; background:var(--hl-gold-light); margin-bottom:5px; }
.hl-hero__floating strong { font-size:.72rem; letter-spacing:.16em; }
.hl-hero__floating small { color:#cdbda3; font-size:.62rem; letter-spacing:.10em; }
.hl-hero__seal { position:absolute; right:-12px; top:26px; width:100px; height:100px; border-radius:50%; background:#fff; border:1px solid var(--hl-accent); display:flex; align-items:center; justify-content:center; text-align:center; font-size:.62rem; line-height:1.2; color:var(--hl-accent-dark); box-shadow:var(--hl-shadow); }
.hl-hero__seal strong { display:block; font-family:var(--hl-font-heading); font-size:1.2rem; }

.hl-marquee { overflow:hidden; white-space:nowrap; background:#3a2b20; color:#f6ead6; }
.hl-marquee__track { display:flex; justify-content:center; gap:24px; padding:13px 18px; font-size:.67rem; font-weight:700; letter-spacing:.23em; }
.hl-marquee__track b { color:var(--hl-gold-light); }

.hl-section--cream { background:var(--hl-paper); }
.hl-section--sand { background:#eee5d5; }
.hl-section--dark { background:#2a211b; }
.hl-section-head--luxury { align-items:end; margin-bottom:35px; }
.hl-section-head--luxury h2 { font-size:clamp(2.2rem,4vw,3.1rem); letter-spacing:-.02em; }
.hl-section-head--center { justify-content:center; text-align:center; }
.hl-collection-grid { display:grid; grid-template-columns:1.25fr 1fr 1fr; gap:16px; }
.hl-collection-card { min-height:455px; position:relative; overflow:hidden; background:#ddd; }
.hl-collection-card--tall { min-height:610px; }
.hl-collection-card img { width:100%; height:100%; object-fit:cover; transition:transform .7s ease; }
.hl-collection-card:hover img { transform:scale(1.035); }
.hl-collection-card::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(16,11,8,.73),rgba(16,11,8,0) 57%); }
.hl-collection-card__overlay { position:absolute; left:25px; right:25px; bottom:24px; z-index:2; color:#fff; }
.hl-collection-card__overlay span { display:block; font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:#d7c2a2; margin-bottom:9px; }
.hl-collection-card__overlay h3 { color:#fff; font-size:2rem; margin:0 0 5px; }
.hl-collection-card__overlay p { font-size:.86rem; color:#eee6db; max-width:350px; margin-bottom:12px; }
.hl-collection-card__overlay b { font-size:.72rem; text-transform:uppercase; letter-spacing:.14em; }
.hl-products-showcase ul.products { margin:0 !important; }
.hl-notice { padding:25px; background:#fff; border:1px solid var(--hl-line); }

.woocommerce ul.products li.product { background:#fff; padding-bottom:17px; box-shadow:0 8px 28px rgba(44,31,20,.05); overflow:hidden; margin-bottom:20px; }
.woocommerce ul.products li.product a img { margin-bottom:0; transition:transform .5s ease; }
.woocommerce ul.products li.product:hover a img { transform:scale(1.018); }
.woocommerce ul.products li.product .woocommerce-loop-product__title { font-family:var(--hl-font-heading); font-size:1.15rem; padding:17px 17px 3px; }
.woocommerce ul.products li.product .price { padding:0 17px; margin:0 0 2px; color:#5b4634; font-family:var(--hl-font-heading); }
.woocommerce ul.products li.product .button { margin-left:17px; }
.hl-wishlist-btn { position:absolute; right:12px; top:12px; z-index:10; width:38px; height:38px; border:0; border-radius:50%; background:rgba(255,255,255,.95); box-shadow:0 8px 20px rgba(0,0,0,.10); font-size:1.05rem; cursor:pointer; color:var(--hl-ink); }
.hl-wishlist-btn.is-active { color:var(--hl-maroon); }
.hl-quick-view { position:absolute; left:12px; right:12px; bottom:66px; z-index:8; background:rgba(37,28,22,.92); color:#fff; border:0; padding:11px 13px; text-transform:uppercase; letter-spacing:.14em; font-size:.68rem; opacity:0; transform:translateY(8px); transition:all .24s ease; cursor:pointer; }
.woocommerce ul.products li.product:hover .hl-quick-view { opacity:1; transform:none; }

.hl-process-band { background:#2c211a; color:#efe5d5; }
.hl-process-band__grid { display:grid; grid-template-columns:1.02fr .98fr; min-height:620px; }
.hl-process-band__image { min-height:620px; }
.hl-process-band__image img { width:100%; height:100%; object-fit:cover; filter:saturate(.9); }
.hl-process-band__copy { padding:85px 8% 85px 10%; align-self:center; }
.hl-process-band__copy h2 { color:#fff; font-size:clamp(2.3rem,4vw,3.6rem); }
.hl-process-band__copy p { color:#cabdaa; max-width:590px; }
.hl-process-steps { display:grid; grid-template-columns:1fr 1fr; gap:18px; padding:25px 0 30px; }
.hl-process-steps div { display:flex; gap:11px; align-items:center; color:#eadfcf; font-size:.8rem; text-transform:uppercase; letter-spacing:.08em; }
.hl-process-steps b { color:var(--hl-gold-light); font-family:var(--hl-font-heading); font-size:1.25rem; }
.hl-process-band .hl-btn--outline { color:#fff; border-color:#bca98e; }
.hl-process-band .hl-btn--outline:hover { background:#fff; color:#2c211a; }

.hl-gift-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:55px; align-items:center; }
.hl-gift-copy h2 { font-size:clamp(2.4rem,4vw,3.6rem); }
.hl-gift-copy p { color:#6d6155; max-width:550px; }
.hl-gift-points { display:grid; gap:10px; margin:24px 0 30px; font-size:.82rem; text-transform:uppercase; letter-spacing:.08em; }
.hl-gift-points b { color:var(--hl-accent); margin-right:7px; }
.hl-gift-image { padding:10px; border:1px solid var(--hl-line); background:#f0e8da; }
.hl-gift-image img { width:100%; }

.hl-quote-band { background:#b07a35; color:#fff; padding:70px 0; text-align:center; }
.hl-quote-mark { font-family:Georgia,serif; font-size:5rem; line-height:.6; opacity:.45; }
.hl-quote-band blockquote { margin:10px auto 20px; max-width:930px; font-family:var(--hl-font-heading); font-size:clamp(2rem,4vw,3.7rem); line-height:1.15; }
.hl-quote-credit { text-transform:uppercase; letter-spacing:.18em; font-size:.68rem; opacity:.84; }

.hl-testimonials--luxury { grid-template-columns:repeat(3,1fr); }
.hl-testimonials--luxury .hl-testimonial { background:#fbf8f2; border:1px solid rgba(37,28,22,.08); box-shadow:none; }
.hl-stars { color:var(--hl-accent); letter-spacing:3px; margin-bottom:15px; }
.hl-testimonial footer { margin-top:20px; display:flex; gap:9px; flex-direction:column; }
.hl-testimonial footer strong { font-size:.8rem; text-transform:uppercase; letter-spacing:.10em; }
.hl-testimonial footer span { font-size:.75rem; color:#7d7060; }

.hl-instagram-section { background:#f5efe5; }
.hl-instagram-handle { font-size:.82rem; color:#6d5c48; letter-spacing:.09em; }
.hl-image-strip { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.hl-image-strip img { width:100%; aspect-ratio:1; object-fit:cover; }
.hl-newsletter-section { padding:58px 0; }
.hl-newsletter-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:50px; align-items:center; }
.hl-newsletter-grid h2 { color:#fff; max-width:620px; margin:0; }
.hl-eyebrow--light { color:#d4ad70; }
.hl-newsletter-section .hl-newsletter-form { max-width:none; margin:0; }
.hl-newsletter-section .hl-newsletter-form input { background:#fff; }

.hl-footer { background:#211a15; }
.hl-footer__top { display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:45px; padding:70px 0 55px; }
.hl-footer__logo img { height:75px; width:auto; filter:brightness(1.04); }
.hl-footer__brand p { max-width:350px; color:#a99c89; font-size:.9rem; }
.hl-footer h5 { color:#fff; }
.hl-footer__bottom { border-top:1px solid rgba(255,255,255,.10); padding:20px 0; }
.hl-whatsapp-float { position:fixed; right:22px; bottom:22px; z-index:1200; display:flex; align-items:center; gap:10px; padding:8px 13px 8px 8px; background:#fff; border-radius:999px; box-shadow:0 10px 28px rgba(0,0,0,.16); }
.hl-whatsapp-float span { width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#2c211a; color:#fff; font-size:.75rem; font-weight:700; }
.hl-whatsapp-float small { text-transform:uppercase; letter-spacing:.10em; font-size:.64rem; font-weight:700; }

.hl-qv-modal { position:fixed; inset:0; z-index:2200; }
.hl-qv-backdrop { position:absolute; inset:0; background:rgba(18,13,9,.70); }
.hl-qv-panel { position:relative; width:min(940px,calc(100% - 26px)); margin:7vh auto; background:#fff; padding:42px; max-height:86vh; overflow:auto; box-shadow:0 30px 100px rgba(0,0,0,.30); }
.hl-qv-grid { display:grid; grid-template-columns:1fr 1fr; gap:42px; align-items:center; }
.hl-qv-image img { width:100%; height:100%; max-height:610px; object-fit:cover; }
.hl-qv-copy h2 { font-size:clamp(2rem,4vw,3.1rem); }
.hl-qv-price { font-family:var(--hl-font-heading); font-size:1.5rem; margin:12px 0 20px; }
.hl-qv-excerpt { color:#6c5d4d; margin-bottom:28px; }
.hl-qv-loading { padding:80px 20px; text-align:center; color:#766b60; }
body.hl-modal-open { overflow:hidden; }
.hl-checkout-note { display:flex; gap:14px; align-items:flex-start; padding:15px 18px; margin-bottom:18px; border:1px solid var(--hl-line); background:#f7f0e4; font-size:.82rem; }
.hl-checkout-note strong { color:var(--hl-accent-dark); }

/* Mobile / compact */
@media (max-width: 1024px) {
  .hl-header__whatsapp { display:none; }
  .hl-hero__grid { grid-template-columns:1fr .85fr; }
  .hl-collection-grid { grid-template-columns:1fr 1fr; }
  .hl-collection-card--tall { min-height:510px; grid-row:span 2; }
  .hl-footer__top { grid-template-columns:1.5fr 1fr 1fr; }
}
@media (max-width: 860px) {
  .hl-topbar__right { display:none; }
  .hl-header__inner { min-height:74px; }
  .hl-logo img { height:52px; }
  .hl-hero__grid, .hl-process-band__grid, .hl-gift-grid, .hl-newsletter-grid { grid-template-columns:1fr; }
  .hl-hero__visual { min-height:500px; order:-1; }
  .hl-hero__copy h1 { font-size:clamp(3rem,13vw,5rem); }
  .hl-hero__copy { padding-bottom:10px; }
  .hl-hero__main { width:92%; }
  .hl-hero__floating { left:0; }
  .hl-process-band__image { min-height:420px; }
  .hl-process-band__copy { padding:55px 24px 65px; }
  .hl-gift-image { order:-1; }
  .hl-newsletter-section .hl-newsletter-form { margin-top:10px; }
  .hl-testimonials--luxury { grid-template-columns:1fr; }
  .hl-footer__top { grid-template-columns:1fr 1fr; }
  .hl-nav { z-index:1900; }
}
@media (max-width: 640px) {
  .hl-container { padding-left:18px; padding-right:18px; }
  .hl-section { padding:58px 0; }
  .hl-hero__grid { padding-top:32px; padding-bottom:58px; }
  .hl-hero__visual { min-height:390px; }
  .hl-hero__seal { transform:scale(.82); transform-origin:top right; }
  .hl-hero__trust { margin-top:40px; gap:12px; }
  .hl-marquee__track { justify-content:flex-start; overflow:hidden; font-size:.57rem; }
  .hl-collection-grid { grid-template-columns:1fr; }
  .hl-collection-card, .hl-collection-card--tall { min-height:440px; grid-row:auto; }
  .hl-image-strip { grid-template-columns:1fr 1fr; }
  .hl-footer__top { grid-template-columns:1fr; }
  .hl-footer__logo img { height:64px; }
  .hl-qv-panel { padding:48px 18px 24px; margin:3vh auto; }
  .hl-qv-grid { grid-template-columns:1fr; gap:24px; }
  .hl-qv-image img { max-height:360px; }
  .hl-search-overlay__panel { padding:45px 20px 30px; }
  .hl-search-form { flex-direction:column; }
  .hl-whatsapp-float small { display:none; }
  .hl-whatsapp-float { right:14px; bottom:14px; padding:7px; }
}
\n.hl-product-trust { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:28px; border-top:1px solid var(--hl-line); border-bottom:1px solid var(--hl-line); padding:15px 0; }\n.hl-product-trust div { display:flex; flex-direction:column; gap:3px; padding-right:12px; border-right:1px solid var(--hl-line); }\n.hl-product-trust div:last-child { border-right:0; }\n.hl-product-trust b { font-size:.68rem; text-transform:uppercase; letter-spacing:.10em; color:var(--hl-accent-dark); }\n.hl-product-trust span { font-size:.74rem; color:#7a6e61; }\n@media (max-width:640px) { .hl-product-trust { grid-template-columns:1fr; } .hl-product-trust div { border-right:0; border-bottom:1px solid var(--hl-line); padding:0 0 10px; } .hl-product-trust div:last-child { border-bottom:0; padding-bottom:0; } }\n