﻿/* ============================================================
   PAGES — extra styles for shop, product, about
   Loaded after site.css.
   ============================================================ */

/* ============================================================
   PAGE HEADER
   ============================================================ */
.page-head {
  background: var(--talent-cream);
  padding: 64px 64px 56px;
  border-bottom: 2px solid var(--talent-burgundy);
  position: relative;
  background-image: url('../assets/patterns/triangles-cream.svg');
  background-size: 22px 22px;
}
.crumbs {
  font-family: var(--font-narrow);
  font-weight: 800;
  font-size: 11px; letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--talent-red);
  margin-bottom: 22px;
  display: flex; gap: 10px; align-items: center;
}
.crumbs a { color: var(--talent-red); text-decoration: none; font-weight: 800; }
.crumbs a:hover { color: var(--talent-red); }
.crumbs span.sep { opacity: 0.45; }

.page-head h1 {
  font-family: var(--font-narrow);
  font-weight: 900;
  font-size: clamp(56px, 8vw, 128px);
  line-height: 0.92;
  letter-spacing: -0.02em;
  color: var(--talent-burgundy);
  margin: 0 0 18px;
  text-wrap: balance;
}
.page-head .lead {
  font-family: var(--font-sans); font-style: italic;
  font-size: 22px; line-height: 1.5;
  color: var(--ink-2);
  max-width: 56ch;
  margin: 0;
}

/* ============================================================
   SHOP — filter bar + grid
   ============================================================ */
.shop-filters {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 16px;
  padding: 24px 64px;
  background: var(--paper);
  border-bottom: 1px solid var(--ink-5);
  position: sticky; top: 88px;
  z-index: 20;
}
.filter-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.chip {
  font-family: var(--font-narrow); font-weight: 700;
  font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 8px 14px;
  border: 2px solid var(--talent-burgundy);
  background: var(--talent-cream);
  color: var(--talent-burgundy);
  cursor: pointer;
  box-shadow: 2px 2px 0 var(--talent-burgundy);
  transition: transform var(--dur-fast), box-shadow var(--dur-fast), background var(--dur-fast), color var(--dur-fast);
  display: inline-block;
  text-decoration: none;
}
.chip:hover { transform: translate(-1px,-1px); box-shadow: 3px 3px 0 var(--talent-burgundy); }
.chip.active { background: var(--talent-red); color: var(--talent-cream); border-color: var(--talent-burgundy); }
.chip.active:hover { box-shadow: 3px 3px 0 var(--talent-burgundy); }

.sort-select {
  font-family: var(--font-narrow); font-weight: 700;
  font-size: 11px; letter-spacing: 0.16em;
  text-transform: uppercase;
  padding: 8px 14px;
  border: 2px solid var(--talent-burgundy);
  background: var(--talent-cream);
  color: var(--talent-burgundy);
  cursor: pointer;
  box-shadow: 2px 2px 0 var(--talent-burgundy);
  outline: none;
}

.shop-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  padding: 64px;
  background: var(--paper);
}
.shop-card {
  position: relative;
  border: 2px solid var(--talent-burgundy);
  background: var(--talent-cream);
  overflow: hidden;
  cursor: pointer;
  text-decoration: none;
  color: inherit;
  display: flex; flex-direction: column;
  box-shadow: 5px 5px 0 var(--talent-burgundy);
  transition: transform var(--dur-base) var(--ease-out-soft), box-shadow var(--dur-base);
}
.shop-card:hover { transform: translate(-3px,-3px); box-shadow: 9px 9px 0 var(--talent-burgundy); }
.shop-card .photo {
  position: relative;
  aspect-ratio: 4/4;
  overflow: hidden;
}
.shop-card .photo .swatch {
  position: absolute; inset: 0;
}
.shop-card .photo img {
  position: absolute;
  top: 8%; left: 50%;
  transform: translateX(-50%) rotate(-3deg);
  width: 68%;
  filter: drop-shadow(8px 14px 0 rgba(42,26,18,0.35));
  transition: transform var(--dur-slow) var(--ease-bounce);
}
.shop-card:hover .photo img { transform: translateX(-50%) rotate(0deg) translateY(-8px) scale(1.04); }
.shop-card.pearls .photo img {
  top: 50%;
  width: 60%;
  transform: translate(-50%, -50%) rotate(-3deg);
}
.shop-card.pearls:hover .photo img { transform: translate(-50%, -58%) rotate(0deg) scale(1.04); }

.shop-card.milk     .swatch { background: #E9C93C; }
.shop-card.hazelnut .swatch { background: #C95B2C; }
.shop-card.white    .swatch { background: #6E3A2E; }
.shop-card.dark     .swatch { background: #A8B852; }
.shop-card.pearls   .swatch { background: #D5E683; }


.shop-card .photo::after {
  content: '';
  position: absolute;
  top: -10%; left: -30%;
  width: 80%; height: 140%;
  background: rgba(0,0,0,0.10);
  transform: rotate(-22deg);
}

.shop-card .info {
  padding: 24px 22px 22px;
  border-top: 1px solid var(--ink-5);
  background: var(--talent-cream);
  display: flex; flex-direction: column; gap: 8px;
}
.shop-card .info .num {
  font-family: var(--font-mono);
  font-size: 11px; letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink-3);
}
.shop-card .info h3 {
  font-family: var(--font-narrow);
  font-size: 30px; line-height: 0.96;
  margin: 0;
  letter-spacing: -0.01em;
  color: var(--talent-burgundy);
  font-weight: 700;
}
.shop-card .info p {
  font-family: var(--font-sans); font-style: italic;
  font-size: 15px; line-height: 1.4;
  color: var(--ink-3);
  margin: 0;
}
.shop-card .info .row {
  display: flex; justify-content: space-between; align-items: end;
  margin-top: 10px;
  padding-top: 14px;
  border-top: 1px dashed var(--ink-5);
  font-family: var(--font-narrow); font-weight: 700;
  font-size: 12px; letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--talent-burgundy);
}
.shop-card .info .row .price {
  font-family: var(--font-narrow);
  font-weight: 900; font-size: 26px;
  letter-spacing: 0;
}
.shop-card .badge {
  position: absolute;
  top: 16px; left: 16px;
  z-index: 3;
  background: var(--talent-red);
  color: var(--talent-cream);
  font-family: var(--font-narrow); font-weight: 900;
  font-size: 10px; letter-spacing: 0.22em;
  text-transform: uppercase;
  padding: 6px 12px;
  border: 1px solid var(--talent-cream);
  transform: rotate(-4deg);
  box-shadow: 2px 2px 0 var(--talent-burgundy);
}
.shop-card .badge.lime {
  background: var(--talent-lime); color: var(--talent-burgundy);
  border-color: var(--talent-burgundy);
}

/* ============================================================
   PRODUCT DETAIL
   ============================================================ */
.product-detail {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 0;
  background: var(--paper);
  border-bottom: 2px solid var(--talent-burgundy);
}
.pd-photo {
  position: relative;
  min-height: 720px;
  overflow: hidden;
  border-right: 2px solid var(--talent-burgundy);
}
.pd-photo .swatch { position: absolute; inset: 0; }
.pd-photo.milk     .swatch { background: #F2C63A; }
.pd-photo.hazelnut .swatch { background: #C4572A; }
.pd-photo.white    .swatch { background: #56231E; }
.pd-photo.dark     .swatch { background: #8BAA40; }
.pd-photo.pearls   .swatch { background: #B8D44E; }

.pd-photo::after {
  content: '';
  position: absolute;
  top: -15%; left: -30%;
  width: 80%; height: 140%;
  background: rgba(0,0,0,0.10);
  transform: rotate(-22deg);
}
.pd-photo .bar-img {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%) rotate(-4deg);
  width: 62%;
  transition: transform 800ms var(--ease-out-soft);
}
.pd-photo:hover .bar-img { transform: translate(-50%, -50%) rotate(-2deg); }


.pd-thumbs {
  position: absolute;
  bottom: 24px; left: 24px;
  display: flex; gap: 10px;
  z-index: 3;
}
.pd-thumb {
  width: 56px; height: 76px;
  background: var(--talent-cream);
  border: 2px solid var(--talent-burgundy);
  background-size: cover; background-position: center;
  cursor: pointer;
  transition: transform var(--dur-fast);
  box-shadow: 2px 2px 0 var(--talent-burgundy);
}
.pd-thumb:hover { transform: translate(-1px,-1px); box-shadow: 3px 3px 0 var(--talent-burgundy); }
.pd-thumb.active { outline: 2px solid var(--talent-red); outline-offset: 2px; }

.pd-stamp {
  position: absolute;
  top: 24px; right: 24px;
  z-index: 3;
  background: var(--talent-cream);
  color: var(--talent-burgundy);
  border: 2px solid var(--talent-burgundy);
  font-family: var(--font-narrow); font-weight: 900;
  font-size: 12px; letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 10px 14px 9px;
  text-align: center;
  transform: rotate(6deg);
  box-shadow: 3px 3px 0 var(--talent-burgundy);
}
.pd-stamp small { display: block; font-family: var(--font-mono); font-weight: 400; font-size: 9px; letter-spacing: 0.22em; opacity: 0.85; margin-bottom: 4px; }

.pd-info {
  padding: 80px 64px;
  background: var(--paper);
  display: flex; flex-direction: column;
  gap: 28px;
}
.pd-eyebrow {
  font-family: var(--font-narrow); font-weight: 700;
  font-size: 12px; letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--talent-red);
  display: inline-flex; gap: 12px; align-items: center;
}
.pd-eyebrow::before { content: ''; width: 24px; height: 2px; background: var(--talent-red); }
.pd-info h1 {
  font-family: var(--font-narrow);
  font-weight: 900;
  font-size: clamp(48px, 6vw, 92px);
  line-height: 0.92;
  margin: 0;
  letter-spacing: -0.02em;
  color: var(--talent-burgundy);
  text-wrap: balance;
}
.pd-tagline {
  font-family: var(--font-sans); font-style: italic;
  font-size: 22px; line-height: 1.5;
  color: var(--ink-2);
  margin: 0;
  max-width: 38ch;
}

.pd-price-row {
  display: flex; align-items: baseline; gap: 16px;
  padding-top: 10px;
  border-top: 1px dashed var(--ink-5);
}
.pd-price {
  font-family: var(--font-narrow);
  font-weight: 900;
  font-size: 56px; line-height: 1;
  color: var(--talent-burgundy);
}
.pd-weight {
  font-family: var(--font-mono);
  font-size: 13px; letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink-3);
}

.pd-cta-row { display: flex; gap: 14px; align-items: stretch; flex-wrap: wrap; }
.qty {
  display: inline-flex; align-items: center;
  border: 2px solid var(--talent-burgundy);
  box-shadow: 4px 4px 0 var(--talent-burgundy);
  background: var(--talent-cream);
}
.qty button {
  background: transparent;
  border: none;
  font-family: var(--font-narrow);
  font-weight: 900;
  font-size: 26px;
  width: 48px; height: 48px;
  cursor: pointer;
  color: var(--talent-burgundy);
  transition: background var(--dur-fast);
}
.qty button:hover { background: var(--talent-cream-deep); }
.qty .val {
  font-family: var(--font-narrow); font-weight: 900;
  font-size: 18px; letter-spacing: 0.08em;
  width: 44px; text-align: center;
  color: var(--talent-burgundy);
}

.pd-tabs { margin-top: 8px; border-top: 1px solid var(--ink-5); padding-top: 24px; }
.pd-tab-row { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 0; }
.pd-tab {
  font-family: var(--font-narrow); font-weight: 700;
  font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 8px 14px;
  background: transparent;
  border: 2px solid transparent;
  color: var(--ink-3);
  cursor: pointer;
  transition: color var(--dur-fast), border-color var(--dur-fast);
}
.pd-tab.active {
  color: var(--talent-burgundy);
  border-color: var(--talent-burgundy);
}
.pd-tab:hover { color: var(--talent-burgundy); }
.pd-tab-panel {
  font-family: var(--font-sans);
  font-size: 17px; line-height: 1.6;
  color: var(--ink-2);
  margin-top: 18px;
  max-width: 56ch;
}
.pd-tab-panel ul { padding-left: 20px; margin: 8px 0 0; }
.pd-tab-panel li { margin-bottom: 6px; }
.pd-tab-panel.hidden { display: none; }

.pd-recommend {
  background: var(--paper);
  padding: 80px 64px 100px;
}
.pd-recommend h3 {
  font-family: var(--font-narrow);
  font-size: clamp(36px, 4vw, 56px);
  margin: 0 0 32px;
  color: var(--talent-burgundy);
  letter-spacing: -0.01em;
  font-weight: 700;
}
.pd-recommend-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

/* ============================================================
   ABOUT PAGE
   ============================================================ */
.about-hero {
  background: var(--talent-burgundy);
  color: var(--talent-cream);
  padding: 130px 64px 110px;
  position: relative;
  overflow: hidden;
  overflow: hidden;
}
.about-hero::before {
  content: '';
  position: absolute; left: 0; right: 0; bottom: 0;
  height: 22px;
  background: url('../assets/ornaments/tents-row.svg') repeat-x;
  background-size: 30px 22px;
  filter: brightness(0) saturate(100%) invert(94%) sepia(28%) saturate(354%) hue-rotate(351deg) brightness(105%);
}
.about-hero-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 64px;
  align-items: center;
  position: relative;
  z-index: 2;
}
.about-hero h1 {
  font-family: var(--font-narrow);
  font-weight: 900;
  font-size: clamp(60px, 8vw, 132px);
  line-height: 0.9;
  margin: 0 0 32px;
  color: var(--talent-cream);
  letter-spacing: -0.02em;
  text-wrap: balance;
}
.about-hero h1 em { color: var(--talent-lime); }
.about-hero .intro {
  font-family: var(--font-sans); font-style: italic;
  font-size: 22px; line-height: 1.55;
  color: var(--talent-cream);
  opacity: 0.94;
  max-width: 42ch;
  margin: 0;
}
.about-stamp-badge {
  position: absolute;
  bottom: 8%;
  right: 5%;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  overflow: hidden;
  background: url('../assets/imagery/stamps-sheet.webp') no-repeat;
  background-size: 968px 1361px;
  background-position: -718px -58px;
  pointer-events: none;
  transform: rotate(-8deg);
  z-index: 3;
  box-shadow: 0 4px 24px rgba(0,0,0,0.18);
}

.about-hero-bignum {
  font-family: var(--font-narrow);
  font-weight: 900;
  font-size: clamp(180px, 28vw, 460px);
  position: absolute;
  top: -10%; right: -8%;
  color: rgba(255, 229, 168, 0.08);
  line-height: 0.8;
  pointer-events: none;
  z-index: 1;
  user-select: none;
}
.about-card {
  position: relative;
  aspect-ratio: 4/5;
  background-image: url('../assets/imagery/three-bars-fan.webp');
  background-size: cover; background-position: center;
  border: 2px solid var(--talent-cream);
  box-shadow: 12px 12px 0 var(--talent-cream);
  transform: rotate(-2deg);
}

.manifest {
  background: var(--paper);
  padding: 120px 64px;
  background-image: url('../assets/patterns/triangles-cream.svg');
  background-size: 22px 22px;
}
.manifest-inner {
  max-width: 680px;
  margin: 0 auto;
}
.manifest .kicker {
  font-family: var(--font-narrow); font-weight: 700;
  font-size: 12px; letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--talent-red);
  display: block;
  margin-bottom: 48px;
  text-align: left;
}
.manifest p {
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: 17px; line-height: 1.75;
  color: var(--ink-1);
  margin: 0 0 0;
  padding: 20px 0 20px 28px;
  border-left: 3px solid var(--talent-red);
  max-width: 60ch;
}
.manifest p + p {
  margin-top: 24px;
}
.manifest p strong {
  font-weight: 700;
  color: var(--talent-burgundy);
}
.manifest .signature {
  text-align: left;
  margin-top: 56px;
  padding-top: 24px;
  border-top: 1px solid var(--ink-5);
}
.manifest .signature .sig-name {
  font-family: var(--font-narrow);
  font-weight: 700;
  font-style: italic;
  font-size: 22px;
  color: var(--talent-burgundy);
  margin: 0;
}
.manifest .signature small {
  display: block;
  font-family: var(--font-mono);
  font-size: 11px; letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink-3);
  margin-top: 8px;
}

.origins {
  background: var(--talent-cream);
  border-top: 2px solid var(--talent-burgundy);
  border-bottom: 2px solid var(--talent-burgundy);
}
.origins-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid var(--ink-5);
  align-items: stretch;
}
.origins-row:last-child { border-bottom: none; }
.origins-row.flip .origins-img { order: 2; }
.origins-row.flip .origins-text { order: 1; }
.origins-img {
  background-size: cover; background-position: center;
  min-height: 480px;
  position: relative;
  border-right: 1px solid var(--ink-5);
}
.origins-row.flip .origins-img { border-right: none; border-left: 1px solid var(--ink-5); }
.origins-img .stamp-num {
  position: absolute;
  bottom: 24px; left: 24px;
  background: var(--talent-cream);
  border: 2px solid var(--talent-burgundy);
  font-family: var(--font-narrow);
  font-weight: 900;
  font-size: 32px; line-height: 1;
  padding: 14px 18px 12px;
  color: var(--talent-burgundy);
  box-shadow: 4px 4px 0 var(--talent-burgundy);
}
.origins-text {
  padding: 80px 64px;
  display: flex; flex-direction: column; justify-content: center;
}
.origins-text .num {
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--talent-red);
  margin-bottom: 14px;
}
.origins-text h3 {
  font-family: var(--font-narrow);
  font-size: clamp(36px, 4.4vw, 64px);
  line-height: 0.96;
  margin: 0 0 18px;
  color: var(--talent-burgundy);
  letter-spacing: -0.015em;
  font-weight: 700;
  text-wrap: balance;
}
.origins-text p {
  font-family: var(--font-sans);
  font-size: 18px; line-height: 1.6;
  color: var(--ink-2);
  margin: 0;
  max-width: 48ch;
}

.numbers {
  background: var(--talent-lime);
  border-bottom: 2px solid var(--talent-burgundy);
  padding: 80px 64px;
}
.numbers-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  max-width: var(--content-max);
  margin: 0 auto;
}
.numbers-cell {
  text-align: center;
  padding: 16px 16px;
  border-right: 1px solid var(--talent-burgundy);
}
.numbers-cell:last-child { border-right: none; }
.numbers-cell .big {
  font-family: var(--font-narrow);
  font-weight: 900;
  font-size: clamp(64px, 7vw, 110px);
  line-height: 0.9;
  color: var(--talent-burgundy);
  margin-bottom: 12px;
  letter-spacing: -0.02em;
}
.numbers-cell h5 {
  font-family: var(--font-narrow); font-weight: 700;
  font-size: 13px; letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--talent-burgundy);
  margin: 0 0 6px;
}
.numbers-cell p {
  font-family: var(--font-sans); font-style: italic;
  font-size: 14px; line-height: 1.4;
  color: var(--talent-burgundy); opacity: 0.85;
  margin: 0 auto;
  max-width: 22ch;
}

/* ============================================================
   ABOUT — PHOTO STRIP
   ============================================================ */
.about-photo-strip {
  height: 460px;
  overflow: hidden;
  border-top: 2px solid var(--talent-burgundy);
  border-bottom: 2px solid var(--talent-burgundy);
  position: relative;
}
.about-photo-strip img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 40%;
  display: block;
}

/* ============================================================
   ABOUT — FELUL NOSTRU (dark section with image)
   ============================================================ */
.about-felul {
  background: var(--talent-burgundy);
  color: var(--talent-cream);
  padding: 130px 64px;
  border-bottom: 2px solid var(--talent-espresso);
}
.about-felul-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
  max-width: 1320px;
  margin: 0 auto;
}
.about-felul-kicker {
  font-family: var(--font-narrow); font-weight: 700;
  font-size: 12px; letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--talent-lime);
  display: block;
  margin-bottom: 22px;
}
.about-felul h2 {
  font-family: var(--font-narrow);
  font-size: clamp(40px, 5vw, 70px);
  line-height: 1.1;
  margin: 0 0 40px;
  color: var(--talent-cream);
  letter-spacing: -0.018em;
  text-wrap: balance;
}
.about-felul h2 em { color: var(--talent-lime); font-style: italic; font-weight: inherit; }
.about-felul p {
  font-family: var(--font-sans);
  font-size: 19px; line-height: 1.7;
  color: var(--talent-cream);
  opacity: 0.88;
  margin: 0 0 22px;
  max-width: 52ch;
}
.about-felul-sig {
  margin-top: 44px;
  padding-top: 28px;
  border-top: 1px solid rgba(255, 229, 168, 0.22);
}
.about-felul-sig p {
  font-family: var(--font-narrow);
  font-weight: 700;
  font-style: italic;
  font-size: 26px;
  line-height: 1.2;
  color: var(--talent-lime);
  margin: 0;
  opacity: 1;
}
.about-felul-sig small {
  display: block;
  font-family: var(--font-mono);
  font-size: 11px; letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--talent-cream);
  opacity: 0.55;
  margin-top: 8px;
}
.about-felul-img {
  position: relative;
}
.about-felul-img img {
  width: 100%;
  display: block;
  border: 2px solid rgba(255, 229, 168, 0.35);
  box-shadow: 14px 14px 0 rgba(255, 229, 168, 0.12);
  transform: rotate(1.5deg);
}

/* ============================================================
   ABOUT GALLERY
   ============================================================ */
.about-gallery {
  padding: 0;
  overflow: hidden;
}
.about-gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3px;
  background: var(--talent-burgundy);
}
.about-gallery-grid img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}
.about-gallery-grid img:hover {
  transform: scale(1.03);
  z-index: 1;
  position: relative;
}
.about-gallery-grid .gallery-mobile-only { display: none; }
@media (max-width: 760px) {
  .about-gallery-grid { grid-template-columns: repeat(2, 1fr); }
  .about-gallery-grid .gallery-mobile-only { display: block; }
}

/* ============================================================
   CTA STRIP (about page)
   ============================================================ */
.cta-strip {
  background: var(--talent-red);
  color: var(--talent-cream);
  padding: 100px 64px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.cta-strip::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 22px;
  background: url('../assets/ornaments/tents-row.svg') repeat-x;
  background-size: 30px 22px;
  filter: brightness(0) saturate(100%) invert(94%) sepia(28%) saturate(354%) hue-rotate(351deg) brightness(105%);
  transform: scaleY(-1);
}
.cta-strip .eyebrow {
  font-family: var(--font-narrow); font-weight: 700;
  font-size: 12px; letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--talent-cream); opacity: 0.85;
  margin-bottom: 24px;
  display: block;
}
.cta-strip h2 {
  font-family: var(--font-narrow);
  font-size: clamp(48px, 6.5vw, 96px);
  line-height: 0.92;
  margin: 0 auto 40px;
  max-width: 22ch;
  color: var(--talent-cream);
  letter-spacing: -0.018em;
}
.cta-strip h2 em { color: var(--talent-lime); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1100px) {
  .shop-grid { grid-template-columns: repeat(2, 1fr); }
  .pd-recommend-row { grid-template-columns: repeat(2, 1fr); }
  .numbers-grid { grid-template-columns: repeat(2, 1fr); gap: 32px 0; }
  .numbers-cell:nth-child(2) { border-right: none; }
}
@media (max-width: 760px) {
  .page-head { padding: 48px 24px 40px; }
  .shop-filters { padding: 16px 24px; top: 76px; flex-direction: column; align-items: flex-start; }
  .shop-grid { grid-template-columns: repeat(2, 1fr); padding: 24px 16px; gap: 12px; }
  .product-detail { grid-template-columns: 1fr; }
  .pd-photo { min-height: 460px; border-right: none; border-bottom: 2px solid var(--talent-burgundy); }
  .pd-info { padding: 40px 20px 32px; }
  .pd-recommend { padding: 48px 0 100px; overflow: hidden; }
  .pd-recommend h3 { padding: 0 20px; margin-bottom: 20px; }
  .pd-recommend-row { display: flex !important; grid-template-columns: unset; }
  .about-hero { padding: 80px 24px 70px; }
  .about-hero-grid { grid-template-columns: 1fr; gap: 40px; }
  .manifest { padding: 80px 24px; }
  .about-photo-strip { height: 240px; }
  .about-felul { padding: 80px 24px; }
  .about-felul-grid { grid-template-columns: 1fr; gap: 40px; }
  .about-felul-img { display: none; }
  .origins-row { grid-template-columns: 1fr; }
  .origins-row.flip .origins-img { order: 0; border-left: none; }
  .origins-row.flip .origins-text { order: 1; }
  .origins-img { min-height: 320px; border-right: none; border-bottom: 1px solid var(--ink-5); }
  .origins-text { padding: 56px 24px; }
  .numbers { padding: 56px 24px; }
  .numbers-grid { grid-template-columns: 1fr; gap: 32px; }
  .numbers-cell { border-right: none; border-bottom: 1px solid var(--talent-burgundy); padding-bottom: 32px; }
  .numbers-cell:last-child { border-bottom: none; }
  .cta-strip { padding: 80px 24px; }
  .manifest { padding: 80px 24px; }
  .manifest p { max-width: 100%; padding: 16px 0 16px 20px; font-size: 16px; }
}

/* ============================================================
   INLINE STYLE REPLACEMENTS
   ============================================================ */
.about-hero-eyebrow {
  font-family: var(--font-narrow); font-weight: 700;
  font-size: 12px; letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--talent-lime);
  margin-bottom: 24px;
}

.shop-secret-title {
  font-family: var(--font-narrow);
  font-weight: 900;
  font-size: 56px; line-height: 0.9;
  color: var(--talent-cream);
  letter-spacing: -0.02em;
}
.shop-secret-title em {
  font-family: inherit;
  font-style: italic;
  color: var(--talent-lime);
}

@media (max-width: 768px) {
  .shop-card[data-variant="secret"] .photo {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
  }
  .shop-card[data-variant="secret"] .photo > div {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 20px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }
  .shop-secret-title {
    font-size: 36px !important;
  }
}

@media (max-width: 768px) {
  .page-head h1,
  .pd-info h1,
  .shop-card .info h3,
  .about-hero h1,
  .origins-text h3,
  .cta-strip h2,
  .shop-secret-title {
    line-height: 1.1;
  }
}

/* ============================================================
   OFERTE SPECIALE — Gift cards
   ============================================================ */
.gifts-intro {
  padding: 40px 64px 56px;
  max-width: 700px;
}
.gifts-intro p {
  font-family: var(--font-sans);
  font-size: 16px; line-height: 1.75;
  color: var(--ink-2); margin: 0;
}
.gifts-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border-left: 2px solid var(--talent-burgundy);
  border-top: 2px solid var(--talent-burgundy);
}
.gift-card {
  border-right: 2px solid var(--talent-burgundy);
  border-bottom: 2px solid var(--talent-burgundy);
  background: var(--paper);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.gift-card-img-wrap { overflow: hidden; }
.gift-card-img {
  width: 100%; height: 280px;
  object-fit: cover; object-position: center;
  display: block;
  transition: transform 500ms ease;
}
.gift-card-img.pos-top { object-position: center 18%; }
.gift-card:hover .gift-card-img { transform: scale(1.03); }
.gift-card-body {
  padding: 32px 36px 40px;
  flex: 1; display: flex; flex-direction: column;
}
.gift-card-tag {
  font-family: var(--font-mono);
  font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--talent-red); display: block; margin-bottom: 12px;
}
.gift-card-title {
  font-family: var(--font-narrow); font-weight: 700;
  font-size: 30px; line-height: 1; letter-spacing: -0.015em;
  color: var(--talent-burgundy); margin: 0 0 16px;
}
.gift-card-title em { font-style: italic; }
.gift-card-desc {
  font-family: var(--font-sans); font-size: 14px; line-height: 1.7;
  color: var(--ink-2); margin: 0 0 28px; flex: 1;
}
.gift-card-link {
  font-family: var(--font-narrow); font-weight: 700;
  font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--talent-burgundy); text-decoration: none;
  display: inline-flex; align-items: center; gap: 8px;
  border-bottom: 2px solid var(--talent-burgundy);
  padding-bottom: 3px;
  transition: color 140ms, border-color 140ms;
  align-self: flex-start;
}
.gift-card-link:hover { color: var(--talent-red); border-color: var(--talent-red); }
.gift-card.wide {
  grid-column: span 2;
  flex-direction: row;
}
.gift-card.wide .gift-card-img-wrap { flex: 0 0 50%; }
.gift-card.wide .gift-card-img { height: 100%; min-height: 300px; }
.gift-card.wide .gift-card-body { justify-content: center; padding: 48px 56px; }
.gift-card.wide .gift-card-desc { flex: none; }
.gift-card.wide .gift-card-title { font-size: 40px; }

@media (max-width: 768px) {
  .gifts-intro { padding: 32px 24px 40px; }
  .gifts-grid { grid-template-columns: 1fr; }
  .gift-card.wide { flex-direction: column; grid-column: span 1; }
  .gift-card.wide .gift-card-img-wrap { flex: none; }
  .gift-card.wide .gift-card-img { height: 220px; min-height: unset; }
  .gift-card.wide .gift-card-body { padding: 24px 24px 32px; justify-content: flex-start; flex: none; }
  .gift-card.wide .gift-card-desc { flex: initial; }
  .gift-card.wide .gift-card-title { font-size: 30px; }
  .gift-card-img { height: 220px; }
  .gift-card-body { padding: 24px 24px 32px; }
}
