/* HERO */
.gl-hero { display: grid; grid-template-columns: 1fr 1fr; min-height: 88vh; }
.gl-hero-left { display: flex; flex-direction: column; justify-content: center; padding: 80px 60px 80px 80px; background: var(--warm-white); }
.gl-hero-tag { font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--accent); margin-bottom: 28px; display: flex; align-items: center; gap: 12px; }
.gl-hero-tag::before { content: ''; width: 32px; height: 1px; background: var(--accent); flex-shrink: 0; }
.gl-hero-title { font-family: 'Cormorant Garamond', serif; font-size: clamp(40px,5vw,78px); font-weight: 300; line-height: 1.08; color: var(--charcoal); margin-bottom: 24px; }
.gl-hero-title em { font-style: italic; color: var(--accent); }
.gl-hero-sub { font-size: 15px; line-height: 1.8; color: var(--bark); max-width: 400px; margin-bottom: 40px; }
.gl-hero-cta { display: inline-flex; align-items: center; gap: 14px; font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 500; color: var(--deep); text-decoration: none; border-bottom: 1px solid var(--deep); padding-bottom: 6px; width: fit-content; transition: all 0.3s; }
.gl-hero-cta:hover { color: var(--accent); border-color: var(--accent); gap: 22px; }
.gl-hero-right { position: relative; overflow: hidden; min-height: 400px; }
.gl-hero-right img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gl-hero-badge { position: absolute; bottom: 28px; right: 28px; background: rgba(253,250,245,0.95); border: 1px solid var(--sand); padding: 16px 24px; z-index: 10; backdrop-filter: blur(8px); }
.gl-hero-badge-title { font-family: 'Cormorant Garamond', serif; font-size: 14px; font-style: italic; color: var(--accent); margin-bottom: 3px; }
.gl-hero-badge-text { font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--deep); }
 
/* USP */
.gl-usp-bar { display: grid; grid-template-columns: repeat(3,1fr); gap: 32px; padding: 36px 80px; background: var(--cream); border-top: 1px solid var(--sand); border-bottom: 1px solid var(--sand); }
.gl-usp-item { display: flex; align-items: flex-start; gap: 16px; }
.gl-usp-icon { font-size: 22px; flex-shrink: 0; margin-top: 2px; }
.gl-usp-label { font-family: 'Cormorant Garamond', serif; font-size: 19px; font-weight: 400; color: var(--deep); margin-bottom: 4px; }
.gl-usp-desc { font-size: 13px; color: var(--bark); line-height: 1.6; }
 
/* CATEGORIEËN */
.gl-cat-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 3px; }
.gl-cat-card { position: relative; overflow: hidden; cursor: pointer; display: block; text-decoration: none; }
.gl-cat-card:first-child { grid-column: span 2; }
.gl-cat-card img { width: 100%; height: 100%; object-fit: cover; display: block; aspect-ratio: 3/4; transition: transform 0.7s cubic-bezier(0.25,0.46,0.45,0.94); }
.gl-cat-card:first-child img { aspect-ratio: 4/5; }
.gl-cat-card:hover img { transform: scale(1.06); }
.gl-cat-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(42,36,32,0.8) 0%, transparent 55%); pointer-events: none; }
.gl-cat-info { position: absolute; bottom: 0; left: 0; right: 0; padding: 22px 18px; color: white; }
.gl-cat-name { font-family: 'Cormorant Garamond', serif; font-size: 22px; font-weight: 300; margin-bottom: 5px; }
.gl-cat-link { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255,255,255,0.7); display: inline-flex; align-items: center; gap: 6px; transition: gap 0.3s, color 0.3s; }
.gl-cat-card:hover .gl-cat-link { gap: 14px; color: white; }
 
/* PRODUCTEN */
.gl-products-section { background: var(--cream); padding: 80px; }
.gl-products-header { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 16px; margin-bottom: 48px; }
.gl-see-all { font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--deep); text-decoration: none; border-bottom: 1px solid var(--deep); padding-bottom: 4px; transition: all 0.3s; }
.gl-see-all:hover { color: var(--accent); border-color: var(--accent); }
.gl-products-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 24px; }
.gl-product-card { background: var(--warm-white); overflow: hidden; transition: box-shadow 0.4s; }
.gl-product-card:hover { box-shadow: 0 20px 60px rgba(58,47,40,0.10); }
.gl-product-img { aspect-ratio: 1; overflow: hidden; background: white; position: relative; }
.gl-product-img img { width: 100%; height: 100%; object-fit: contain; padding: 20px; transition: transform 0.6s ease; display: block; }
.gl-product-card:hover .gl-product-img img { transform: scale(1.05); }
.gl-product-badge { position: absolute; top: 12px; left: 12px; background: var(--deep); color: var(--cream); font-size: 9px; letter-spacing: 0.12em; text-transform: uppercase; padding: 5px 10px; }
.gl-product-info { padding: 20px; }
.gl-product-stars { color: var(--gold); font-size: 11px; margin-bottom: 6px; letter-spacing: 2px; }
.gl-product-name { font-family: 'Cormorant Garamond', serif; font-size: 18px; font-weight: 400; color: var(--deep); margin-bottom: 4px; line-height: 1.3; }
.gl-product-scent { font-size: 12px; color: var(--bark); margin-bottom: 14px; font-style: italic; }
.gl-product-footer { display: flex; align-items: center; justify-content: space-between; }
.gl-product-price { font-family: 'Cormorant Garamond', serif; font-size: 20px; font-weight: 500; color: var(--deep); }
.gl-product-btn { background: var(--deep); color: white; border: none; width: 36px; height: 36px; cursor: pointer; font-size: 18px; display: flex; align-items: center; justify-content: center; transition: background 0.3s; }
.gl-product-btn:hover { background: var(--accent); }
 
/* COLLECTIE */
.gl-collection { display: grid; grid-template-columns: 1fr 1fr; }
.gl-collection-content { background: var(--deep); padding: 80px 72px; display: flex; flex-direction: column; justify-content: center; }
.gl-collection-label { font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold); margin-bottom: 16px; display: flex; align-items: center; gap: 12px; }
.gl-collection-label::before { content: ''; width: 24px; height: 1px; background: var(--gold); flex-shrink: 0; }
.gl-collection-title { font-family: 'Cormorant Garamond', serif; font-size: clamp(34px,4vw,56px); font-weight: 300; line-height: 1.1; margin-bottom: 24px; color: var(--cream); }
.gl-collection-title em { font-style: italic; color: var(--gold); }
.gl-collection-text { font-size: 15px; line-height: 1.8; color: var(--stone); margin-bottom: 40px; }
.gl-collection-cta { display: inline-flex; align-items: center; gap: 14px; font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--cream); text-decoration: none; border-bottom: 1px solid var(--stone); padding-bottom: 6px; width: fit-content; transition: all 0.3s; }
.gl-collection-cta:hover { color: var(--gold); border-color: var(--gold); gap: 22px; }
.gl-collection-img { position: relative; overflow: hidden; min-height: 480px; }
.gl-collection-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; }
 
/* VERHAAL */
.gl-story { display: grid; grid-template-columns: 1fr 1fr; }
.gl-story-img { position: relative; overflow: hidden; min-height: 500px; }
.gl-story-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center; }
.gl-story-content { background: var(--cream); padding: 80px 72px; display: flex; flex-direction: column; justify-content: center; }
.gl-story-content p { font-size: 15px; line-height: 1.85; color: var(--bark); margin-bottom: 20px; }
.gl-story-link { display: inline-flex; align-items: center; gap: 12px; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--deep); text-decoration: none; border-bottom: 1px solid var(--deep); padding-bottom: 5px; width: fit-content; margin-top: 8px; transition: all 0.3s; }
.gl-story-link:hover { color: var(--accent); border-color: var(--accent); gap: 20px; }
 
/* REVIEWS */
.gl-reviews-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.gl-review-card { background: var(--cream); border: 1px solid var(--sand); padding: 36px 32px; transition: box-shadow 0.3s; }
.gl-review-card:hover { box-shadow: 0 12px 40px rgba(58,47,40,0.08); }
.gl-review-stars { color: var(--gold); letter-spacing: 2px; font-size: 14px; margin-bottom: 16px; }
.gl-review-title { font-family: 'Cormorant Garamond', serif; font-size: 20px; font-weight: 400; color: var(--deep); margin-bottom: 10px; }
.gl-review-text { font-size: 14px; line-height: 1.75; color: var(--bark); margin-bottom: 20px; }
.gl-review-author { font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--stone); display: flex; align-items: center; gap: 8px; }
.gl-review-author::before { content: ''; width: 16px; height: 1px; background: var(--stone); }
 
/* NIEUWSBRIEF */
.gl-newsletter { background: var(--sand); text-align: center; padding: 80px; }
.gl-newsletter-title { font-family: 'Cormorant Garamond', serif; font-size: clamp(28px,4vw,42px); font-weight: 300; color: var(--deep); margin-bottom: 12px; }
.gl-newsletter-title em { font-style: italic; color: var(--accent); }
.gl-newsletter-sub { font-size: 14px; color: var(--bark); margin-bottom: 32px; line-height: 1.6; }
.gl-newsletter-form { display: flex; max-width: 460px; margin: 0 auto; }
.gl-newsletter-form input { flex: 1; padding: 14px 20px; border: 1px solid var(--stone); border-right: none; background: var(--warm-white); font-family: 'Jost', sans-serif; font-size: 13px; color: var(--deep); outline: none; border-radius: 0; }
.gl-newsletter-form input::placeholder { color: var(--stone); }
.gl-newsletter-form button { background: var(--deep); color: var(--cream); border: none; padding: 14px 28px; font-family: 'Jost', sans-serif; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; cursor: pointer; transition: background 0.3s; }
.gl-newsletter-form button:hover { background: var(--accent); }
 
/* ── RESPONSIVE ── */
@media (max-width: 1024px) {
  .gl-hero { min-height: 70vh; }
  .gl-hero-left { padding: 60px 40px; }
  .gl-usp-bar { padding: 32px 40px; gap: 24px; }
  .gl-products-section { padding: 60px 40px; }
  .gl-collection-content { padding: 60px 48px; }
  .gl-story-content { padding: 60px 48px; }
  .gl-newsletter { padding: 60px 40px; }
}
@media (max-width: 768px) {
  .gl-hero { grid-template-columns: 1fr; grid-template-rows: 55vw auto; min-height: unset; }
  .gl-hero-right { grid-row: 1; min-height: 55vw; }
  .gl-hero-left { grid-row: 2; padding: 40px 24px 48px; text-align: center; align-items: center; }
  .gl-hero-tag { justify-content: center; }
  .gl-hero-tag::before { display: none; }
  .gl-hero-sub { margin-left: auto; margin-right: auto; }
  .gl-hero-cta { margin: 0 auto; }
  .gl-hero-badge { bottom: 16px; right: 16px; padding: 12px 18px; }
  .gl-usp-bar { grid-template-columns: 1fr; gap: 24px; padding: 32px 24px; }
  .gl-cat-grid { grid-template-columns: 1fr 1fr; }
  .gl-cat-card:first-child { grid-column: span 2; }
  .gl-cat-card:first-child img { aspect-ratio: 16/9; }
  .gl-cat-card img { aspect-ratio: 1/1; }
  .gl-products-section { padding: 48px 24px; }
  .gl-products-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
  .gl-products-header { flex-direction: column; align-items: flex-start; }
  .gl-collection { grid-template-columns: 1fr; }
  .gl-collection-img { min-height: 60vw; order: -1; }
  .gl-collection-content { padding: 48px 24px; order: 1; }
  .gl-collection-content, .gl-collection-title, .gl-collection-text, .gl-collection-label { color: var(--cream) !important; }
  .gl-collection-title em { color: var(--gold) !important; }
  .gl-collection-cta { color: var(--cream) !important; border-bottom-color: var(--stone) !important; }
  .gl-story { grid-template-columns: 1fr; }
  .gl-story-img { min-height: 60vw; order: -1; }
  .gl-story-content { padding: 48px 24px; order: 1; }
  .gl-reviews-grid { grid-template-columns: 1fr; gap: 16px; }
  .gl-newsletter { padding: 48px 24px; }
  .gl-newsletter-form { flex-direction: column; max-width: 100%; }
  .gl-newsletter-form input { border-right: 1px solid var(--stone); border-bottom: none; }
  .gl-collection-img { min-height: 70vw; }
  .gl-story-img { min-height: 70vw; }
}
@media (max-width: 480px) {
  .gl-hero-right { min-height: 70vw; }
  .gl-hero-left { padding: 32px 20px 40px; }
  .gl-products-grid { grid-template-columns: 1fr; }
  .gl-usp-bar { padding: 24px 20px; }
  .gl-newsletter { padding: 40px 20px; }
  .gl-collection-img { min-height: 80vw; }
  .gl-story-img { min-height: 80vw; }
}