/* ============================================================
   Occasional T — Brand Stylesheet v2
   Fonts: Libre Baskerville (display) + Nunito (body)
   Colors: Cream #FAF6F0 | Rose Gold #C9816A | Blush #F5DDD5 | Warm Ivory #FFF8F3
   ============================================================ */

:root {
  --cream: #FAF6F0;
  --ivory: #FFF8F3;
  --rose: #C9816A;
  --rose-light: #E8B5A4;
  --rose-dark: #A5614D;
  --blush: #F5DDD5;
  --blush-deep: #EAC8BB;
  --sage: #8FA88A;
  --black: #1C1410;
  --charcoal: #4A3B35;
  --white: #FFFFFF;
  --font-display: 'Libre Baskerville', Georgia, serif;
  --font-body: 'Nunito', sans-serif;
  --radius: 8px;
  --shadow: 0 8px 32px rgba(28,20,16,0.08);
  --shadow-lg: 0 20px 60px rgba(28,20,16,0.14);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

body {
  background: var(--cream);
  color: var(--black);
  font-family: var(--font-body);
  font-weight: 400;
  line-height: 1.75;
  overflow-x: hidden;
}

img { max-width: 100%; display: block; }
a { text-decoration: none; color: inherit; }

/* ---- TYPOGRAPHY ---- */
h1, h2, h3, h4 { font-family: var(--font-display); font-weight: 500; line-height: 1.2; }
h1 { font-size: clamp(2.6rem, 5.5vw, 4.8rem); }
h2 { font-size: clamp(2rem, 3.5vw, 3.2rem); }
h3 { font-size: clamp(1.3rem, 2vw, 1.7rem); }
h4 { font-size: 1.1rem; }
em { font-style: italic; color: var(--rose); }

.section-eyebrow {
  font-family: var(--font-body);
  font-size: .72rem;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--rose);
  margin-bottom: .75rem;
  font-weight: 500;
}
.section-title { margin-bottom: 1.25rem; }
.section-sub { color: var(--charcoal); max-width: 560px; margin: 0 auto; line-height: 1.8; }
.section-header { text-align: center; margin-bottom: 1.8rem; }

/* ---- BUTTONS ---- */
.btn-primary {
  display: inline-block;
  background: var(--rose);
  color: var(--white);
  padding: .9rem 2.4rem;
  border-radius: 50px;
  font-family: var(--font-body);
  font-size: .82rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  transition: background .25s, transform .2s, box-shadow .25s;
  border: none;
  cursor: pointer;
  box-shadow: 0 4px 20px rgba(201,129,106,.35);
}
.btn-primary:hover {
  background: var(--rose-dark);
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(201,129,106,.4);
}

.btn-ghost {
  display: inline-block;
  border: 1.5px solid var(--rose);
  color: var(--rose);
  padding: .9rem 2.4rem;
  border-radius: 50px;
  font-family: var(--font-body);
  font-size: .82rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  transition: background .25s, color .25s;
}
.btn-ghost:hover { background: var(--rose); color: var(--white); }

/* ============================================================
   NAV
   ============================================================ */
#navbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  background: rgba(250,246,240,.96);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid transparent;
  transition: border-color .3s, box-shadow .3s;
}
#navbar.scrolled { border-color: var(--blush-deep); box-shadow: var(--shadow); }

.nav-inner {
  max-width: 1300px;
  margin: 0 auto;
  padding: 1rem 2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.nav-logo img { height: 50px; width: auto; }
.nav-links { list-style: none; display: flex; align-items: center; gap: 2rem; }
.nav-links a {
  font-size: .78rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--charcoal);
  transition: color .2s;
  font-weight: 500;
}
.nav-links a:hover { color: var(--rose); }
.nav-cta {
  background: var(--rose) !important;
  color: var(--white) !important;
  padding: .55rem 1.4rem;
  border-radius: 50px;
  box-shadow: 0 3px 14px rgba(201,129,106,.3);
}
.nav-cta:hover { background: var(--rose-dark) !important; }

.hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; }
.hamburger span { display: block; width: 22px; height: 1.5px; background: var(--black); transition: .3s; }

.mobile-menu {
  display: none;
  flex-direction: column;
  background: var(--cream);
  padding: 1rem 2rem 1.5rem;
  border-top: 1px solid var(--blush-deep);
}
.mobile-menu.open { display: flex; }
.mobile-link {
  padding: .75rem 0;
  font-size: .85rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--charcoal);
  border-bottom: 1px solid var(--blush);
  font-weight: 500;
}

/* ============================================================
   HERO
   ============================================================ */
.hero {
  min-height: 100vh;
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
  padding: 5rem 2rem 3rem;
  background: 
    radial-gradient(ellipse 80% 60% at 75% 35%, rgba(201,129,106,.12) 0%, transparent 58%),
    radial-gradient(ellipse 55% 80% at 5% 80%, rgba(245,221,213,.5) 0%, transparent 55%),
    var(--ivory);
}

/* Confetti floating shapes */
.hero-confetti {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}
.hero-confetti span {
  position: absolute;
  display: block;
  border-radius: 50%;
  opacity: .18;
}
.hero-confetti span:nth-child(1)  { width:180px; height:180px; background:var(--rose-light); top:-40px; right:18%; animation: floatBall 9s ease-in-out infinite; }
.hero-confetti span:nth-child(2)  { width:80px;  height:80px;  background:var(--blush-deep); top:15%;   right:8%;  animation: floatBall 7s ease-in-out infinite 1s; }
.hero-confetti span:nth-child(3)  { width:50px;  height:50px;  background:var(--sage);       top:60%;   right:22%; animation: floatBall 11s ease-in-out infinite 2s; border-radius: 4px; }
.hero-confetti span:nth-child(4)  { width:120px; height:120px; background:var(--blush);      bottom:0;  right:35%; animation: floatBall 8s ease-in-out infinite .5s; }
.hero-confetti span:nth-child(5)  { width:30px;  height:30px;  background:var(--rose);       top:40%;   right:5%;  animation: floatBall 6s ease-in-out infinite 3s; border-radius: 4px; transform: rotate(45deg); }
.hero-confetti span:nth-child(6)  { width:200px; height:200px; background:var(--ivory);      top:5%;    right:28%; animation: floatBall 12s ease-in-out infinite 1.5s; border: 2px solid var(--blush-deep); background: transparent; }
.hero-confetti span:nth-child(7)  { width:60px;  height:60px;  background:var(--rose-light); top:75%;   left:5%;   animation: floatBall 9s ease-in-out infinite 2.5s; opacity:.1; }
.hero-confetti span:nth-child(8)  { width:90px;  height:90px;  background:var(--blush);      top:20%;   left:2%;   animation: floatBall 10s ease-in-out infinite 4s; opacity:.12; }
.hero-confetti span:nth-child(9)  { width:40px;  height:40px;  background:var(--rose);       bottom:20%; right:12%; animation: floatBall 7s ease-in-out infinite 0.8s; opacity:.1; border-radius: 4px; transform: rotate(20deg); }
.hero-confetti span:nth-child(10) { width:140px; height:140px; background:var(--blush-deep); bottom:10%; left:15%;  animation: floatBall 13s ease-in-out infinite 3.5s; opacity:.08; }
.hero-confetti span:nth-child(11) { width:25px;  height:60px;  background:var(--rose-light); top:30%;   right:42%; animation: floatBall 8s ease-in-out infinite 1.2s; opacity:.15; border-radius: 4px; }
.hero-confetti span:nth-child(12) { width:70px;  height:20px;  background:var(--blush-deep); top:65%;   right:48%; animation: floatBall 10s ease-in-out infinite 2.8s; opacity:.12; border-radius: 4px; }

@keyframes floatBall {
  0%,100% { transform: translateY(0) rotate(0deg); }
  33%      { transform: translateY(-18px) rotate(8deg); }
  66%      { transform: translateY(8px) rotate(-5deg); }
}

.hero-content {
  position: relative;
  z-index: 2;
  max-width: 680px;
  margin-left: max(2rem, calc(50vw - 640px));
}
.hero-eyebrow {
  font-size: .72rem;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--rose);
  font-weight: 500;
  margin-bottom: 1.5rem;
}
.hero-studio-tag {
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-style: italic;
  letter-spacing: .15em;
  color: var(--rose-dark);
  font-weight: 700;
  margin-bottom: 1.6rem;
}
.hero-title { margin-bottom: 1.5rem; color: var(--black); }
.hero-sub {
  font-size: 1rem;
  color: var(--charcoal);
  margin-bottom: 2.5rem;
  max-width: 500px;
  line-height: 2;
}
.hero-buttons { display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.8rem; }

.hero-trust {
  display: flex;
  gap: 1.5rem;
  flex-wrap: wrap;
  font-size: .8rem;
  color: var(--charcoal);
  font-weight: 500;
}
.hero-trust span {
  display: flex;
  align-items: center;
  gap: .4rem;
  padding: .4rem .9rem;
  background: var(--white);
  border-radius: 50px;
  border: 1px solid var(--blush-deep);
}

.hero-logo-float {
  position: absolute;
  right: max(2rem, calc(50vw - 600px));
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  opacity: .07;
  width: min(500px, 38vw);
  pointer-events: none;
}

/* ============================================================
   OCCASIONS RIBBON
   ============================================================ */
.occasions-ribbon {
  background: var(--rose);
  color: var(--white);
  overflow: hidden;
  padding: .7rem 0;
}
.ribbon-track {
  display: flex;
  gap: 2rem;
  white-space: nowrap;
  animation: ribbonScroll 28s linear infinite;
  font-size: .72rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-weight: 500;
  align-items: center;
}
.ribbon-track .sep { opacity: .5; }
@keyframes ribbonScroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ============================================================
   ABOUT
   ============================================================ */
.about {
  padding: 3rem 2rem;
  background: var(--white);
}
.about-grid {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 7rem;
  align-items: center;
}
.about-image-block { position: relative; }
.about-img-frame {
  aspect-ratio: 4/5;
  background: var(--blush);
  border-radius: 24px;
  overflow: hidden;
  position: relative;
}
.about-img-frame img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.img-placeholder .img-placeholder-text {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
  font-size: .85rem; color: var(--charcoal);
  opacity: .7; line-height: 1.6;
}
.img-placeholder img { display: none; }

.about-accent-box {
  position: absolute;
  bottom: -2rem;
  right: -2rem;
  background: var(--rose);
  color: var(--white);
  padding: 1.5rem 2rem;
  border-radius: 16px;
  box-shadow: var(--shadow-lg);
}
.accent-quote {
  font-family: var(--font-display);
  font-size: 1.1rem;
  font-style: italic;
  line-height: 1.6;
}

.about-text p { margin-bottom: 1.1rem; color: var(--charcoal); }
.about-location { font-size: .82rem; letter-spacing: .05em; color: var(--rose); font-weight: 500; }

.about-stats {
  display: flex;
  gap: 2.5rem;
  padding: 2rem 0;
  border-top: 1px solid var(--blush);
  border-bottom: 1px solid var(--blush);
  margin: 2rem 0;
}
.stat { text-align: center; }
.stat-num {
  display: block;
  font-family: var(--font-display);
  font-size: 2rem;
  font-weight: 700;
  color: var(--rose);
  line-height: 1;
  margin-bottom: .3rem;
}
.stat-label {
  font-size: .72rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--charcoal);
  font-weight: 500;
}

/* ============================================================
   SERVICES
   ============================================================ */
.services {
  padding: 3rem 2rem;
  background: var(--cream);
}
.services-grid {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.service-card {
  background: var(--white);
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid var(--blush);
  transition: transform .35s, box-shadow .35s;
  display: flex;
  flex-direction: column;
}
.service-card:hover {
  transform: translateY(-8px);
  box-shadow: var(--shadow-lg);
}
.service-card--featured {
  background: var(--black);
  border-color: var(--black);
  color: var(--white);
}
.service-card--featured .service-body p { color: rgba(255,255,255,.7); }
.service-card--featured .service-highlights li { color: rgba(255,255,255,.6); border-bottom-color: rgba(255,255,255,.1); }
.service-card--featured .service-link { color: var(--rose-light); }

.service-img-wrap {
  width: 100%;
  aspect-ratio: 4/3;
  background: var(--blush);
  overflow: hidden;
  position: relative;
  flex-shrink: 0;
}
.service-img-wrap img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .5s;
  display: block;
}
.service-card:hover .service-img-wrap img { transform: scale(1.05); }
.svc-img-missing img { display: none; }
.svc-img-fallback {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: .8rem; color: var(--charcoal); opacity: .6;
}
.service-body {
  padding: 1.2rem 1.5rem 1.5rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.service-body h3 { margin-bottom: .75rem; }
.service-body p { font-size: .92rem; color: var(--charcoal); margin-bottom: 1.2rem; line-height: 1.75; }
.service-highlights {
  list-style: none;
  margin-bottom: 1.5rem;
  flex: 1;
}
.service-highlights li {
  font-size: .82rem;
  color: var(--charcoal);
  padding: .45rem 0;
  border-bottom: 1px solid var(--blush);
  display: flex;
  align-items: center;
  gap: .5rem;
}
.service-highlights li::before { content: "✓"; color: var(--rose); font-weight: 700; flex-shrink: 0; }
.service-link {
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--rose);
  transition: gap .2s;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  margin-top: auto;
}
.service-link:hover { gap: .8rem; }

/* ============================================================
   WHY US
   ============================================================ */
.why-section {
  padding: 3rem 2rem;
  background: var(--blush);
}
.why-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 6rem;
  align-items: center;
}
.why-text .section-title { margin-bottom: 1.2rem; }
.why-text p { color: var(--charcoal); margin-bottom: 1rem; max-width: 480px; }
.why-text .btn-primary { margin-top: 1.5rem; }

.why-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}
.why-card {
  background: var(--white);
  padding: 1.75rem;
  border-radius: 16px;
  transition: transform .3s;
}
.why-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.why-icon { font-size: 1.8rem; margin-bottom: .75rem; }
.why-card h4 { margin-bottom: .5rem; font-size: 1rem; }
.why-card p { font-size: .88rem; color: var(--charcoal); line-height: 1.65; }

/* ============================================================
   GALLERY
   ============================================================ */
.gallery {
  padding: 3rem 2rem;
  background: var(--ivory);
}
.gallery-grid {
  max-width: 1200px;
  margin: 0 auto 3rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.gallery-item {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp .6s ease forwards;
  animation-delay: var(--delay);
}
@keyframes fadeUp { to { opacity:1; transform:translateY(0); } }

.gallery-img {
  aspect-ratio: 1;
  background: var(--blush);
  border-radius: 16px;
  overflow: hidden;
  position: relative;
  margin-bottom: .75rem;
}
.gallery-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .4s;
}
.gallery-item:hover .gallery-img img { transform: scale(1.06); }
.gallery-placeholder {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  text-align: center; font-size: .8rem;
  color: var(--charcoal); opacity: .6;
}
.gallery-label { font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--charcoal); font-weight: 500; text-align: center; }

.gallery-cta { text-align: center; margin-top: 1.5rem; }
.gallery-cta p { color: var(--charcoal); margin-bottom: 1.2rem; font-size: .9rem; }
.gallery-socials { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }

/* ============================================================
   HOW IT WORKS
   ============================================================ */
.how-section {
  padding: 3rem 2rem;
  background: var(--rose);
  color: var(--white);
}
.how-inner { max-width: 1200px; margin: 0 auto; }
.how-section .section-eyebrow { color: rgba(255,255,255,.7); }
.how-section .section-title { color: var(--white); }
.how-section em { color: rgba(255,255,255,.85); }
.how-section .section-header { margin-bottom: 1.5rem; }

.steps-grid {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  justify-content: center;
}
.step {
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 20px;
  padding: 2.5rem 2rem;
  flex: 1;
  min-width: 180px;
  max-width: 240px;
  text-align: center;
  backdrop-filter: blur(8px);
}
.step-num {
  font-family: var(--font-display);
  font-size: 3rem;
  font-weight: 700;
  opacity: .3;
  line-height: 1;
  margin-bottom: .75rem;
}
.step h4 { color: var(--white); margin-bottom: .6rem; font-size: .98rem; }
.step p { font-size: .85rem; color: rgba(255,255,255,.75); line-height: 1.7; }
.step-arrow { font-size: 1.5rem; opacity: .4; color: var(--white); flex-shrink: 0; }

/* ============================================================
   FAQ
   ============================================================ */
.faq-section {
  padding: 3rem 2rem;
  background: var(--white);
}
.faq-inner { max-width: 800px; margin: 0 auto; }
.faq-list { display: flex; flex-direction: column; gap: .75rem; }
.faq-item {
  border: 1px solid var(--blush);
  border-radius: 14px;
  overflow: hidden;
  background: var(--ivory);
}
.faq-item summary {
  padding: 1.4rem 2rem;
  cursor: pointer;
  font-family: var(--font-display);
  font-size: 1.05rem;
  font-weight: 500;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: color .2s;
}
.faq-item summary:hover { color: var(--rose); }
.faq-item summary::after {
  content: "+";
  font-size: 1.4rem;
  font-weight: 300;
  color: var(--rose);
  line-height: 1;
  flex-shrink: 0;
  margin-left: 1rem;
  transition: transform .2s;
}
.faq-item[open] summary::after { transform: rotate(45deg); }
.faq-item p {
  padding: 0 2rem 1.5rem;
  color: var(--charcoal);
  font-size: .92rem;
  line-height: 1.8;
}

/* ============================================================
   QUOTE FORM
   ============================================================ */
.quote-section {
  padding: 3rem 2rem;
  background: var(--cream);
}

.form-container {
  max-width: 680px;
  margin: 0 auto;
  background: var(--white);
  border: 1px solid var(--blush);
  border-radius: 24px;
  padding: 3rem;
  box-shadow: var(--shadow-lg);
}

.form-step { display: none; }
.form-step.active { display: block; animation: fadeUp .4s ease; }

.step-title {
  font-family: var(--font-display);
  font-size: 1.6rem;
  margin-bottom: 2rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--blush);
}

.field-group { margin-bottom: 1.5rem; }
.field-group label {
  display: block;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--charcoal);
  margin-bottom: .5rem;
}
.req { color: var(--rose); }

.field-group input[type="text"],
.field-group input[type="email"],
.field-group input[type="tel"],
.field-group input[type="number"],
.field-group input[type="date"],
.field-group textarea {
  width: 100%;
  background: var(--ivory);
  border: 1.5px solid var(--blush);
  border-radius: 10px;
  padding: .85rem 1rem;
  font-family: var(--font-body);
  font-size: .92rem;
  color: var(--black);
  transition: border-color .2s, box-shadow .2s;
  outline: none;
}
.field-group input:focus,
.field-group textarea:focus {
  border-color: var(--rose);
  box-shadow: 0 0 0 3px rgba(201,129,106,.12);
}
textarea { resize: vertical; }

/* Service Picker */
.service-picker {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.service-btn {
  background: var(--ivory);
  border: 1.5px solid var(--blush);
  border-radius: 12px;
  padding: 1.1rem 1rem;
  font-family: var(--font-body);
  font-size: .88rem;
  cursor: pointer;
  text-align: left;
  transition: border-color .2s, background .2s, transform .15s;
  color: var(--black);
  font-weight: 500;
}
.service-btn:hover {
  border-color: var(--rose);
  background: var(--blush);
  transform: translateY(-2px);
}

/* Radio */
.radio-group { display: flex; flex-direction: column; gap: .6rem; }
.radio-label {
  display: flex !important;
  align-items: center;
  gap: .6rem;
  font-size: .9rem !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  cursor: pointer;
  font-weight: 400 !important;
  color: var(--charcoal) !important;
}
.radio-label input[type="radio"] { accent-color: var(--rose); }

/* File Drop */
.file-drop {
  position: relative;
  background: var(--ivory);
  border: 1.5px dashed var(--blush-deep);
  border-radius: 12px;
  padding: 1.5rem;
  text-align: center;
  cursor: pointer;
  transition: border-color .2s;
}
.file-drop:hover { border-color: var(--rose); }
.file-input {
  position: absolute; inset: 0;
  opacity: 0; cursor: pointer;
  width: 100%; height: 100%;
}
.file-drop-ui { pointer-events: none; }
.file-icon { font-size: 1.4rem; display: block; margin-bottom: .4rem; }
.file-text { font-size: .8rem; color: var(--charcoal); display: block; }
.file-name { font-size: .75rem; color: var(--rose); margin-top: .4rem; display: block; }

/* Back button */
.back-btn {
  background: none;
  border: none;
  font-family: var(--font-body);
  font-size: .75rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--charcoal);
  cursor: pointer;
  padding: 0;
  margin-bottom: 1.5rem;
  transition: color .2s;
  font-weight: 500;
}
.back-btn:hover { color: var(--rose); }

/* Submit */
.btn-submit { width: 100%; text-align: center; padding: 1.1rem; font-size: .85rem; margin-top: .5rem; border-radius: 50px; }

/* Success */
.success-content { text-align: center; padding: 2rem 1rem; }
.success-icon { font-size: 3.5rem; margin-bottom: 1.5rem; }
.success-content h3 { font-size: 2rem; margin-bottom: 1rem; }
.success-content p { color: var(--charcoal); margin-bottom: 1rem; }
.success-socials { display: flex; gap: 1rem; justify-content: center; margin-top: 2rem; flex-wrap: wrap; }
.success-socials a {
  padding: .6rem 1.4rem;
  border: 1.5px solid var(--rose);
  color: var(--rose);
  border-radius: 50px;
  font-size: .75rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  transition: background .2s, color .2s;
}
.success-socials a:hover { background: var(--rose); color: var(--white); }

/* ============================================================
   CONTACT
   ============================================================ */
.contact {
  padding: 3rem 2rem;
  background: var(--blush);
}
.contact-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 6rem;
  align-items: center;
}
.contact .section-eyebrow { color: var(--rose-dark); }
.contact .section-title { color: var(--black); }
.contact p { color: var(--charcoal); margin-bottom: 1.5rem; }
.contact-details { margin-bottom: 2rem; display: flex; flex-direction: column; gap: 1rem; }
.contact-item { display: flex; align-items: center; gap: .75rem; }
.contact-icon { font-size: 1.1rem; }
.contact-item a { color: var(--charcoal); transition: color .2s; font-weight: 500; }
.contact-item a:hover { color: var(--rose); }
.contact-item span { color: var(--charcoal); }

.social-links { display: flex; gap: .75rem; flex-wrap: wrap; }
.social-link {
  display: flex; align-items: center; gap: .5rem;
  padding: .6rem 1.2rem;
  border: 1.5px solid var(--blush-deep);
  border-radius: 50px;
  color: var(--charcoal);
  font-size: .75rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  transition: border-color .2s, color .2s, background .2s;
  font-weight: 500;
  background: var(--white);
}
.social-link svg { width: 16px; height: 16px; }
.social-link:hover { border-color: var(--rose); color: var(--rose); }

.contact-logo img { opacity: .2; width: 100%; max-width: 340px; margin: 0 auto; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer {
  background: var(--ivory);
  border-top: 1px solid var(--blush);
  text-align: center;
  padding: 2rem 2rem;
}
.footer-inner { max-width: 700px; margin: 0 auto; }
.footer-logo { height: 52px; width: auto; margin: 0 auto 1.25rem; opacity: .75; }
.footer-tagline { font-family: var(--font-display); font-style: italic; color: var(--charcoal); font-size: 1rem; margin-bottom: 1.75rem; }
.footer-links {
  display: flex;
  gap: 2rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}
.footer-links a {
  font-size: .72rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--charcoal);
  font-weight: 500;
  transition: color .2s;
}
.footer-links a:hover { color: var(--rose); }
.footer-copy {
  font-size: .75rem;
  color: var(--charcoal);
  opacity: .6;
  line-height: 1.9;
}
.footer-copy a { color: var(--rose); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 1fr); max-width: 900px; }
  .why-inner { grid-template-columns: 1fr; gap: 4rem; }
  .why-text p { max-width: none; }
}
@media (max-width: 900px) {
  .about-grid { grid-template-columns: 1fr; gap: 4rem; }
  .services-grid { grid-template-columns: repeat(2, 1fr); max-width: 700px; }
  .about-accent-box { right: 1rem; bottom: -1.5rem; }
  .gallery-grid { grid-template-columns: repeat(2, 1fr); }
  .contact-inner { grid-template-columns: 1fr; gap: 3rem; }
  .contact-logo { display: none; }
  .hero-logo-float { display: none; }
  .steps-grid { gap: .5rem; }
  .step-arrow { display: none; }
  .step { max-width: 220px; }
}
@media (max-width: 640px) {
  .nav-links { display: none; }
  .hamburger { display: flex; }
  .gallery-grid { grid-template-columns: 1fr 1fr; }
  .service-picker { grid-template-columns: 1fr; }
  .services-grid { grid-template-columns: 1fr !important; max-width: 500px; margin: 0 auto; }
  .delivery-highlights { grid-template-columns: 1fr !important; }
  .form-container { padding: 1.75rem; }
  .hero-buttons { flex-direction: column; }
  .hero-trust { gap: .75rem; }
  .about-stats { gap: 1.5rem; }
  .why-cards { grid-template-columns: 1fr; }
  .steps-grid { flex-direction: column; align-items: stretch; }
  .step { max-width: none; width: 100%; }
  .step--featured { max-width: none !important; transform: none !important; width: 100%; }
}
@media (max-width: 420px) {
  .gallery-grid { grid-template-columns: 1fr; }
}

/* ---- PRICING SECTION ---- */
.pricing-section {
  background: var(--ivory);
  padding: 3rem 2rem;
}
.pricing-inner {
  max-width: 1100px;
  margin: 0 auto;
}
.pricing-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  margin-bottom: 3rem;
}
@media (max-width: 768px) {
  .pricing-grid { grid-template-columns: 1fr; }
}
.pricing-you-choose,
.pricing-example,
.pricing-includes,
.pricing-addons {
  background: var(--white);
  border-radius: 16px;
  padding: 2rem;
  box-shadow: var(--shadow);
}
.pricing-you-choose h3,
.pricing-example h3,
.pricing-includes h3,
.pricing-addons h3 {
  font-family: var(--font-display);
  font-size: 1.15rem;
  color: var(--rose-dark);
  margin-bottom: 1rem;
  padding-bottom: .6rem;
  border-bottom: 1px solid var(--blush);
}
.pricing-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.pricing-list li {
  padding: .45rem 0 .45rem 1.4rem;
  position: relative;
  color: var(--charcoal);
  font-size: .95rem;
  line-height: 1.6;
}
.pricing-list li::before {
  content: '✦';
  position: absolute;
  left: 0;
  color: var(--rose);
  font-size: .65rem;
  top: .65rem;
}
.pricing-note {
  margin-top: 1.2rem;
  font-size: .85rem;
  color: var(--charcoal);
  font-style: italic;
  background: var(--blush);
  border-radius: 8px;
  padding: .75rem 1rem;
  line-height: 1.6;
}
.example-scenario { margin-top: .25rem; }
.example-label {
  font-size: .88rem;
  color: var(--charcoal);
  margin-bottom: 1rem;
  font-style: italic;
}
.price-breakdown { width: 100%; }
.price-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: .6rem 0;
  border-bottom: 1px solid var(--blush);
  font-size: .95rem;
  color: var(--charcoal);
}
.price-row:last-child { border-bottom: none; }
.price-total {
  font-family: var(--font-display);
  font-size: 1.1rem;
  color: var(--black);
  font-weight: 700;
  margin-top: .25rem;
  padding-top: .75rem;
  border-top: 2px solid var(--rose-light) !important;
}
.addons-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.addons-list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: .55rem 0;
  border-bottom: 1px solid var(--blush);
  font-size: .92rem;
  color: var(--charcoal);
}
.addons-list li:last-child { border-bottom: none; }
.addons-list li span:last-child {
  font-weight: 600;
  color: var(--rose-dark);
  white-space: nowrap;
  margin-left: 1rem;
}
.addons-list small {
  font-size: .75rem;
  color: var(--charcoal);
  opacity: .75;
  display: block;
}
.pricing-footer {
  text-align: center;
  margin-top: 1rem;
}
.pricing-payment {
  font-size: .9rem;
  color: var(--charcoal);
  background: var(--blush);
  border-radius: 8px;
  padding: .9rem 1.5rem;
  display: inline-block;
  margin-bottom: 1.5rem;
  max-width: 600px;
}
.pricing-quote {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.1rem;
  color: var(--rose-dark);
  margin-bottom: 2rem;
  max-width: 580px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.7;
}

/* ============================================================
   V4 UPDATES
   ============================================================ */

/* 1. Minimum font size - ensure nothing below 12px */
body { font-size: 14px; }
.section-eyebrow { font-size: .82rem; } /* was .72 */
.hero-eyebrow { font-size: .82rem; }
.ribbon-track { font-size: .82rem; }
.nav-links a { font-size: .82rem; }
.footer-links a { font-size: .78rem; }
.footer-copy { font-size: .8rem; }
.gallery-label { font-size: .8rem; }
.service-highlights li { font-size: .88rem; }
.service-link { font-size: .82rem; }
.btn-primary, .btn-ghost { font-size: .88rem; }
.back-btn { font-size: .8rem; }
.stat-label { font-size: .78rem; }
.field-group label { font-size: .8rem; }
.field-group input, .field-group textarea { font-size: .95rem; }
.pricing-list li { font-size: 1rem; }
.addons-list li { font-size: .95rem; }
.faq-item p { font-size: .95rem; }
.why-card p { font-size: .92rem; }
.step p { font-size: .9rem; }
.service-body p { font-size: .95rem; }
.about-location { font-size: .85rem; }
.pricing-note { font-size: .88rem; }
.example-label { font-size: .9rem; }
.price-row { font-size: 1rem; }
.file-text { font-size: .83rem; }
.file-name { font-size: .8rem; }
.radio-label { font-size: .95rem !important; }

/* 2. Mobile centering fixes */
@media (max-width: 640px) {
  .hero-content {
    margin-left: 0;
    text-align: center;
    width: 100%;
  }
  .hero-buttons { justify-content: center; }
  .hero-trust { justify-content: center; }
  .hero-sub { margin-left: auto; margin-right: auto; text-align: center; }
  .about-text { text-align: center; }
  .about-stats { justify-content: center; }
  .why-text { text-align: center; }
  .why-text p { max-width: none; margin-left: auto; margin-right: auto; }
  .why-text .btn-primary { display: block; width: fit-content; margin: 1.5rem auto 0; }
}

/* 3. Reduce section padding */
.hero { padding: 4rem 2rem 3rem; }
.about { padding: 3rem 2rem; }
.services { padding: 3rem 2rem; }
.why-section { padding: 3rem 2rem; }
.gallery { padding: 3rem 2rem; }
.how-section { padding: 3rem 2rem; }
.faq-section { padding: 3rem 2rem; }
.quote-section { padding: 3rem 2rem; }
.contact { padding: 3rem 2rem; }
.pricing-section { padding: 3rem 2rem; }
.footer { padding: 3rem 2rem; }
.section-header { margin-bottom: 1.5rem; }

/* 7. How It Works - one line heading */
.how-title { white-space: nowrap; }
@media (max-width: 480px) {
  .how-title { white-space: normal; }
}

/* 8. Step numbers - full white */
.step-num { opacity: 1; color: var(--white); }

/* 10. Hero trust badges - 20-30% bigger */
.hero-trust { font-size: 1rem; }
.hero-trust span { padding: .55rem 1.2rem; font-size: 1rem; }

/* 11. Custom Lab - description white */
.service-card--custom-lab .service-body > p { color: rgba(255,255,255,0.9) !important; }

/* 12. Payment notice - one line on desktop, less padding */
.pricing-payment {
  white-space: nowrap;
  padding: .65rem 1.2rem;
  font-size: .92rem;
  margin-bottom: 1rem;
}
@media (max-width: 768px) {
  .pricing-payment { white-space: normal; }
}

/* 14. FAQ title - one line */
.faq-title { white-space: nowrap; }
@media (max-width: 600px) {
  .faq-title { white-space: normal; }
}

/* 15. Form - email + phone side by side, address field */
.field-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.field-row .field-group { margin-bottom: 0; }
@media (max-width: 480px) {
  .field-row { grid-template-columns: 1fr; }
}

/* 16. Contact logo - more visible */
.contact-logo-img { opacity: 0.85 !important; width: 100%; max-width: 300px; margin: 0 auto; filter: none; }
.contact-logo { display: flex; align-items: center; justify-content: center; }

/* 17. Footer socials */
.footer-socials {
  display: flex;
  gap: 1rem;
  justify-content: center;
  margin-bottom: 1.75rem;
}
.footer-social-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1.5px solid var(--blush-deep);
  color: var(--charcoal);
  background: var(--white);
  transition: border-color .2s, color .2s, background .2s;
}
.footer-social-link:hover { border-color: var(--rose); color: var(--rose); background: var(--blush); }

/* 18. Why Us - replace emoji icons with better SVG-styled icons */
.why-icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: var(--blush);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
  margin-bottom: .75rem;
}

/* Override old .contact-logo img rule */
.contact-logo img { opacity: 1; }


/* 16 fix - make logo visible on desktop, keep hidden on mobile */
@media (min-width: 901px) {
  .contact-logo { display: flex !important; align-items: center; justify-content: center; }
}

/* ============================================================
   V4.1 UPDATES
   ============================================================ */

/* Fix: pricing-payment not overflowing its container / sitting on shape */
.pricing-payment {
  display: block !important;
  width: 100%;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
  white-space: normal !important;
  box-sizing: border-box;
  border-radius: 12px;
  padding: .75rem 1.5rem !important;
  margin-bottom: 1.2rem;
  text-align: center;
}

/* Pricing quote - single line on desktop */
.pricing-quote--oneline {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
@media (max-width: 700px) {
  .pricing-quote--oneline { white-space: normal; }
}

/* Meet Toni bio - 15% bigger text */
.about-text p {
  font-size: 1.07rem;
  line-height: 1.85;
}

/* Custom Lab - checklist text full white */
.service-card--custom-lab .service-highlights li {
  color: rgba(255,255,255,0.95) !important;
  border-bottom-color: rgba(255,255,255,0.15) !important;
}
.service-card--custom-lab .service-highlights li::before {
  color: var(--rose-light) !important;
}

/* How It Works - all text full white */
.how-section .section-eyebrow { color: rgba(255,255,255,0.9) !important; }
.how-section .section-title,
.how-section em,
.how-section .step h4,
.how-section .step p,
.how-section .step-arrow { color: #ffffff !important; opacity: 1 !important; }
.step p { color: #ffffff !important; }

/* Contact section - 20% bigger text */
.contact p { font-size: 1.1rem; }
.contact-item a,
.contact-item span { font-size: 1.05rem; }
.contact-icon { font-size: 1.3rem; }

/* Footer copyright - 20% bigger */
.footer-copy { font-size: .95rem !important; opacity: 0.8; }


/* Hide fallback text when image loads successfully */
.svc-img-loaded .svc-img-fallback { display: none !important; }
.svc-img-fallback { display: none; } /* hide by default, only show if image fails */
.gallery-placeholder { display: none; } /* hide by default */
.img-placeholder-text { display: none; } /* hide about placeholder by default */

/* Gallery social buttons */
.gallery-socials { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; margin-top: 1.2rem; }
.gallery-social-btn {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .75rem 1.8rem;
  border: 1.5px solid var(--charcoal);
  border-radius: 50px;
  background: transparent;
  color: var(--charcoal);
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  transition: border-color .2s, color .2s, background .2s;
}
.gallery-social-btn:hover {
  border-color: var(--rose);
  color: var(--rose);
}

/* Photo note under upload fields */
.photo-note {
  font-size: .82rem;
  color: var(--charcoal);
  margin-top: .6rem;
  line-height: 1.6;
  opacity: .8;
}
.photo-note a { color: var(--rose); font-weight: 500; }
.photo-note a:hover { text-decoration: underline; }

/* $ prefix on budget/cash inputs */
.input-prefix-wrap {
  display: flex;
  align-items: center;
  background: var(--ivory);
  border: 1.5px solid var(--blush);
  border-radius: 10px;
  overflow: hidden;
  transition: border-color .2s, box-shadow .2s;
}
.input-prefix-wrap:focus-within {
  border-color: var(--rose);
  box-shadow: 0 0 0 3px rgba(201,129,106,.12);
}
.input-prefix {
  padding: .85rem .75rem .85rem 1rem;
  font-family: var(--font-body);
  font-size: .95rem;
  color: var(--rose);
  font-weight: 600;
  background: transparent;
  flex-shrink: 0;
}
.input-with-prefix {
  flex: 1;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: .85rem 1rem .85rem .25rem !important;
  box-shadow: none !important;
  outline: none;
}

/* ============================================================
   GALLERY CATEGORY CARDS
   ============================================================ */
.gallery-categories {
  max-width: 1200px;
  margin: 0 auto 3rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.gallery-cat-card {
  cursor: pointer;
  border-radius: 16px;
  overflow: hidden;
  background: var(--blush);
  transition: transform .3s, box-shadow .3s;
}
.gallery-cat-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.gallery-cat-img {
  aspect-ratio: 1;
  position: relative;
  overflow: hidden;
}
.gallery-cat-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s;
}
.gallery-cat-card:hover .gallery-cat-img img { transform: scale(1.07); }
.gallery-cat-overlay {
  position: absolute;
  inset: 0;
  background: rgba(28,20,16,0);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  transition: background .3s;
}
.gallery-cat-card:hover .gallery-cat-overlay { background: rgba(28,20,16,.5); }
.gallery-cat-count, .gallery-cat-view {
  color: #fff;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .3s, transform .3s;
  font-family: var(--font-body);
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.gallery-cat-count { font-size: .75rem; }
.gallery-cat-view { font-size: .8rem; }
.gallery-cat-card:hover .gallery-cat-count,
.gallery-cat-card:hover .gallery-cat-view { opacity: 1; transform: translateY(0); }
.gallery-cat-card .gallery-label {
  padding: .75rem 1rem;
  text-align: center;
  font-size: .82rem;
}

@media (max-width: 768px) { .gallery-categories { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 420px) { .gallery-categories { grid-template-columns: 1fr; } }

/* ============================================================
   LIGHTBOX
   ============================================================ */
.lightbox-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(10,6,4,.92);
  z-index: 1000;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.lightbox-overlay.active { display: flex; }

.lightbox-modal {
  background: var(--ivory);
  border-radius: 20px;
  width: 100%;
  max-width: 900px;
  max-height: 92vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(0,0,0,.5);
}

.lightbox-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.2rem 1.5rem;
  border-bottom: 1px solid var(--blush);
  flex-shrink: 0;
}
.lightbox-title {
  font-family: var(--font-display);
  font-size: 1.2rem;
  color: var(--black);
}
.lightbox-close {
  background: none;
  border: none;
  font-size: 1.3rem;
  cursor: pointer;
  color: var(--charcoal);
  line-height: 1;
  padding: .25rem .5rem;
  border-radius: 6px;
  transition: background .2s;
}
.lightbox-close:hover { background: var(--blush); }

.lightbox-stage {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: 1rem;
  flex: 1;
  min-height: 0;
}
.lightbox-img-wrap {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  min-height: 300px;
}
.lightbox-img-wrap img {
  max-width: 100%;
  max-height: 55vh;
  object-fit: contain;
  border-radius: 10px;
  transition: opacity .25s;
}
.lightbox-spinner {
  position: absolute;
  font-size: 1.5rem;
  display: none;
}
.lightbox-arrow {
  background: var(--white);
  border: 1.5px solid var(--blush-deep);
  border-radius: 50%;
  width: 44px;
  height: 44px;
  font-size: 1.8rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--charcoal);
  flex-shrink: 0;
  transition: background .2s, border-color .2s, color .2s;
  line-height: 1;
  padding-bottom: 2px;
}
.lightbox-arrow:hover { background: var(--rose); border-color: var(--rose); color: #fff; }

.lightbox-counter {
  text-align: center;
  font-size: .8rem;
  color: var(--charcoal);
  letter-spacing: .1em;
  padding: 0 1rem .5rem;
  flex-shrink: 0;
}

.lightbox-thumbs {
  display: flex;
  gap: .5rem;
  padding: .75rem 1rem 1rem;
  overflow-x: auto;
  flex-shrink: 0;
  border-top: 1px solid var(--blush);
  scrollbar-width: thin;
  scrollbar-color: var(--blush-deep) transparent;
}
.lightbox-thumb {
  width: 60px;
  height: 60px;
  object-fit: cover;
  border-radius: 8px;
  cursor: pointer;
  flex-shrink: 0;
  border: 2px solid transparent;
  opacity: .65;
  transition: opacity .2s, border-color .2s;
}
.lightbox-thumb:hover { opacity: 1; }
.lightbox-thumb.active { border-color: var(--rose); opacity: 1; }

@media (max-width: 600px) {
  .lightbox-arrow { width: 36px; height: 36px; font-size: 1.4rem; }
  .lightbox-img-wrap img { max-height: 45vh; }
  .lightbox-thumb { width: 48px; height: 48px; }
}

/* ============================================================
   DELIVERY POLICY SECTION
   ============================================================ */
.delivery-section {
  padding: 3rem 2rem;
  background: var(--blush);
}
.delivery-inner {
  max-width: 1100px;
  margin: 0 auto;
}
.delivery-content {
  background: var(--white);
  border-radius: 20px;
  padding: 2.5rem;
  box-shadow: var(--shadow);
}
.delivery-lead {
  font-size: 1.05rem;
  line-height: 1.8;
  color: var(--charcoal);
  margin-bottom: 2rem;
  text-align: center;
}
.delivery-highlights {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
  margin-bottom: 2rem;
}
.delivery-highlight {
  background: var(--blush);
  border-radius: 14px;
  padding: 1.25rem 1.5rem;
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}
.delivery-icon { font-size: 1.4rem; flex-shrink: 0; margin-top: .1rem; }
.delivery-highlight p { font-size: .95rem; line-height: 1.7; color: var(--charcoal); margin: 0; }
.delivery-notes {
  border-top: 1px solid var(--blush-deep);
  padding-top: 1.5rem;
  margin-bottom: 2rem;
}
.delivery-notes h4 {
  font-family: var(--font-display);
  font-size: 1rem;
  color: var(--rose-dark);
  margin-bottom: 1rem;
}
.delivery-notes ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: .65rem;
}
.delivery-notes ul li {
  font-size: .97rem;
  color: var(--charcoal);
  line-height: 1.6;
  padding-left: .25rem;
}
.delivery-closing {
  border-top: 1px solid var(--blush-deep);
  padding-top: 1.5rem;
  text-align: center;
}
.delivery-closing p { font-size: .97rem; color: var(--charcoal); margin-bottom: .5rem; }
.delivery-quote {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.05rem !important;
  color: var(--rose-dark) !important;
  margin-top: .75rem !important;
}

@media (max-width: 600px) {
  .delivery-highlights { grid-template-columns: 1fr; }
  .delivery-content { padding: 1.75rem 1.25rem; }
}

/* Gallery mobile - single column vertical */
@media (max-width: 900px) { .gallery-categories { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) {
  .gallery-categories {
    grid-template-columns: 1fr !important;
    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
  }
  .gallery-cat-img { aspect-ratio: 4/3; }
}

/* View Full Portfolio button */
.btn-portfolio {
  display: inline-block;
  background: var(--rose);
  color: var(--white);
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .95rem 2.5rem;
  border-radius: 50px;
  margin-bottom: 2rem;
  transition: background .2s, transform .2s, box-shadow .2s;
  box-shadow: 0 4px 16px rgba(201,129,106,.3);
}
.btn-portfolio:hover {
  background: var(--rose-dark);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(201,129,106,.4);
}

/* Remove pointer cursor from category cards since no click action */
.gallery-cat-card { cursor: default; }

/* Footer inline links with bullet separators */
.footer-links--inline {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0;
  margin-bottom: 1.5rem;
}
.footer-links--inline a {
  display: inline;
  padding: 0 .4rem;
  font-size: .85rem;
}
.footer-sep {
  color: var(--blush-deep);
  font-size: .85rem;
  line-height: 1;
}

/* Footer email */
.footer-contact-row {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: .5rem 1rem;
  margin-bottom: 1rem;
}
.footer-contact-sep {
  color: var(--blush-deep);
  font-size: 1rem;
  opacity: .6;
}
.footer-email,
.footer-phone {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  color: var(--rose);
  font-size: .9rem;
  font-weight: 500;
  transition: color .2s;
}
.footer-email:hover,
.footer-phone:hover { color: var(--rose-dark); }

/* Remove hover scale on gallery cards since no click */
.gallery-cat-card:hover { transform: none; box-shadow: var(--shadow); }
.gallery-cat-card:hover .gallery-cat-img img { transform: none; }

/* ============================================================
   SERVICE CARD — Styling variant
   ============================================================ */
.service-card--styling {
  background: linear-gradient(135deg, var(--ivory) 0%, #FFF0EC 100%);
  border-color: var(--rose-light);
  border-width: 2px;
}
.service-limited-badge {
  display: inline-flex;
  align-items: center;
  background: var(--rose);
  color: var(--white);
  font-size: .68rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-weight: 600;
  padding: .3rem 1rem;
  border-radius: 50px;
  margin-bottom: 1rem !important;
  white-space: nowrap;
  max-width: fit-content;
}
.svc-banner-placeholder {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem;
  background: linear-gradient(135deg, var(--blush) 0%, var(--blush-deep) 100%);
  color: var(--charcoal);
  font-weight: 500;
  text-align: center;
  padding: 1rem;
}
.service-img-wrap--banner-placeholder {
  background: linear-gradient(135deg, var(--blush) 0%, var(--blush-deep) 100%);
}

/* ============================================================
   STYLING SECTION (Senior Pics Portfolio)
   ============================================================ */
.styling-section {
  padding: 3rem 2rem;
  background: var(--cream);
  border-top: 1px solid var(--blush);
}
.styling-inner { max-width: 1200px; margin: 0 auto; }
.styling-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
.styling-photo-card { border-radius: 16px; overflow: hidden; }
.styling-photo-wrap {
  position: relative;
  aspect-ratio: 3/4;
  background: var(--blush);
  border-radius: 16px;
  overflow: hidden;
}
.styling-photo-wrap--landscape {
  aspect-ratio: 4/3;
}
.styling-main-title {
  font-style: normal !important;
  text-transform: uppercase;
  letter-spacing: .18em;
}
.styling-subsection {
  margin-bottom: 2rem;
}
.styling-sub-heading {
  text-align: center;
  text-transform: uppercase;
  letter-spacing: .18em;
  font-size: 1rem;
  font-weight: 700;
  color: #000000;
  margin-bottom: 1.5rem;
}
.styling-photo-wrap img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .5s;
}
.styling-photo-card:hover .styling-photo-wrap img { transform: scale(1.05); }
.styling-photo-overlay {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: linear-gradient(transparent, rgba(28,20,16,.6));
  padding: 1.5rem 1rem .75rem;
  opacity: 0;
  transition: opacity .3s;
}
.styling-photo-card:hover .styling-photo-overlay { opacity: 1; }
.styling-photo-overlay span {
  color: var(--white);
  font-size: .72rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 500;
}
.styling-photo-placeholder {
  width: 100%; height: 100%;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
  color: var(--charcoal); opacity: .6;
  gap: .5rem;
}
.styling-photo-placeholder span { font-size: 2rem; }
.styling-photo-placeholder p { font-size: .8rem; line-height: 1.5; }

/* ============================================================
   GALLERY — New Expandable Category System
   ============================================================ */
.gallery-categories-new {
  max-width: 1200px;
  margin: 0 auto 4rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.gallery-cat-block {
  border: 1.5px solid var(--blush-deep);
  border-radius: 20px;
  overflow: hidden;
  background: var(--white);
  transition: box-shadow .3s;
}
.gallery-cat-block:has(.cat-panel.open) {
  box-shadow: var(--shadow-lg);
  border-color: var(--rose-light);
}

.cat-toggle-btn {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 1.25rem;
  padding: 1.1rem 1.75rem;
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 600;
  color: var(--black);
  text-align: left;
  transition: background .2s;
}
.cat-toggle-btn:hover { background: var(--cream); }
.cat-toggle-btn--featured {
  background: linear-gradient(90deg, var(--ivory) 0%, rgba(201,129,106,.06) 100%);
}
.cat-toggle-btn--featured:hover {
  background: linear-gradient(90deg, var(--blush) 0%, rgba(201,129,106,.12) 100%);
}

.cat-btn-thumb {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  overflow: hidden;
  flex-shrink: 0;
  background: var(--blush);
}
.cat-btn-thumb img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.cat-btn-thumb--empty {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
}

.cat-btn-label {
  flex: 1;
  font-size: .98rem;
  font-weight: 600;
  letter-spacing: .02em;
  display: flex;
  align-items: center;
  gap: .6rem;
}
.limited-tag {
  background: var(--rose);
  color: var(--white);
  font-size: .62rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: .2rem .6rem;
  border-radius: 50px;
  font-weight: 600;
  vertical-align: middle;
}

.cat-btn-arrow {
  font-size: .7rem;
  color: var(--rose);
  transition: transform .3s;
  flex-shrink: 0;
  margin-left: auto;
}
.cat-panel.open ~ * .cat-btn-arrow,
.gallery-cat-block.is-open .cat-btn-arrow { transform: rotate(180deg); }
.gallery-cat-block.is-open .cat-btn-arrow { transform: rotate(180deg); }

/* Panel */
.cat-panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height .5s cubic-bezier(.4,0,.2,1);
  border-top: 0px solid var(--blush);
}
.cat-panel.open {
  max-height: 2000px;
  border-top-width: 1px;
}

.cat-panel-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 1.25rem;
  padding: 2rem;
}

.cat-item {
  border-radius: 14px;
  overflow: hidden;
  background: var(--ivory);
  border: 1px solid var(--blush);
  transition: transform .3s, box-shadow .3s;
}
.cat-item:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow);
}
.cat-item img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  display: block;
}
.cat-item p {
  font-size: .72rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--charcoal);
  font-weight: 500;
  text-align: center;
  padding: .65rem .5rem;
}

.cat-item--add {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1;
  border: 1.5px dashed var(--blush-deep);
  background: var(--cream);
  color: var(--charcoal);
  opacity: .5;
  gap: .4rem;
  cursor: default;
}
.cat-item--add span { font-size: 1.5rem; display: block; }
.cat-item--add p {
  font-size: .72rem;
  text-align: center;
  letter-spacing: .06em;
  text-transform: none;
  padding: 0 .5rem;
  line-height: 1.4;
}

/* ============================================================
   PAYMENT NOTICE (in quote form)
   ============================================================ */
.payment-notice {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  background: var(--ivory);
  border: 1.5px solid var(--blush-deep);
  border-radius: 12px;
  padding: 1.1rem 1.25rem;
  margin-bottom: 1.5rem;
}
.payment-notice span { font-size: 1.2rem; flex-shrink: 0; margin-top: .1rem; }
.payment-notice p { font-size: .88rem; color: var(--charcoal); line-height: 1.6; margin: 0; }

/* ============================================================
   EVENT STYLING LIMITED NOTE (in form)
   ============================================================ */
.styling-limited-note {
  background: linear-gradient(135deg, var(--ivory) 0%, #FFF0EC 100%);
  border: 1.5px solid var(--rose-light);
  border-radius: 12px;
  padding: 1rem 1.25rem;
  margin-bottom: 1.75rem;
}
.styling-limited-note p {
  font-size: .88rem;
  color: var(--charcoal);
  line-height: 1.65;
  font-style: italic;
}

/* ============================================================
   DELIVERY HIGHLIGHT GRID — updated for 3 items
   ============================================================ */
.delivery-highlights {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin: 2.5rem 0;
}

/* ============================================================
   GALLERY SOCIAL BUTTONS
   ============================================================ */
.btn-portfolio {
  display: inline-block;
  background: var(--black);
  color: var(--white);
  padding: .9rem 2.4rem;
  border-radius: 50px;
  font-family: var(--font-body);
  font-size: .82rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  transition: background .25s, transform .2s;
  margin-bottom: 1.5rem;
  display: inline-block;
}
.btn-portfolio:hover { background: var(--rose); transform: translateY(-2px); }

.gallery-social-btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .6rem 1.3rem;
  border: 1.5px solid var(--blush-deep);
  border-radius: 50px;
  color: var(--charcoal);
  font-size: .75rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  transition: border-color .2s, color .2s;
  background: var(--white);
  font-weight: 500;
}
.gallery-social-btn:hover { border-color: var(--rose); color: var(--rose); }

/* ============================================================
   FOOTER INLINE LINKS
   ============================================================ */
.footer-links--inline {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .5rem 0;
  margin-bottom: 2rem;
}
.footer-sep { color: var(--rose); margin: 0 .4rem; opacity: .5; }
.footer-contact-row {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: .4rem .75rem;
  margin-bottom: 1.25rem;
}
.footer-email,
.footer-phone {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  color: var(--charcoal);
  font-size: .8rem;
  opacity: .7;
  transition: color .2s;
}
.footer-email:hover,
.footer-phone:hover { color: var(--rose); opacity: 1; }
.footer-socials {
  display: flex; gap: .75rem; justify-content: center;
  margin-bottom: 1.5rem;
}
.footer-social-link {
  width: 38px; height: 38px;
  display: flex; align-items: center; justify-content: center;
  border: 1.5px solid var(--blush-deep);
  border-radius: 50%;
  color: var(--charcoal);
  transition: border-color .2s, color .2s;
}
.footer-social-link:hover { border-color: var(--rose); color: var(--rose); }

/* ============================================================
   RESPONSIVE UPDATES
   ============================================================ */
@media (max-width: 900px) {
  .styling-grid { grid-template-columns: repeat(2, 1fr); }
  /* keep 2-col at 900 */
  .delivery-highlights { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .styling-grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
  .cat-panel-grid { grid-template-columns: repeat(2, 1fr); padding: 1.25rem; }
  .service-picker { grid-template-columns: 1fr; }
}

/* ============================================================
   GALLERY — Grid-of-cards layout (matches screenshot)
   ============================================================ */
.gcat-grid {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  grid-auto-rows: auto;
}

.gcat-wrap {
  /* no expand behavior */
}

.gcat-card {
  border-radius: 12px;
  overflow: hidden;
  background: var(--white);
  border: 1.5px solid var(--blush);
  cursor: default;
}

.gcat-img {
  aspect-ratio: 4/3;
  background: var(--blush);
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.gcat-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.gcat-img--empty img { display: none; }
.gcat-empty-icon {
  font-size: 2rem;
  position: absolute;
}
.gcat-img:not(.gcat-img--empty) .gcat-empty-icon { display: none; }

.gcat-card--featured { border-color: var(--rose-light); border-width: 2px; }

/* Hide all panels — no expand */
.gcat-wrap .cat-panel { display: none !important; }

@media (max-width: 700px) {
  .gcat-grid { grid-template-columns: repeat(2, 1fr); gap: .75rem; }
}
@media (max-width: 420px) {
  .gcat-grid { grid-template-columns: repeat(2, 1fr); gap: .6rem; }
}

/* ============================================================
   limited badge — 2-line version fix
   ============================================================ */
.service-limited-badge {
  white-space: normal !important;
  max-width: 220px;
  line-height: 1.4;
  font-size: .65rem !important;
  letter-spacing: .08em;
  text-align: center;
  display: inline-block;
}

/* Limited availability — bold red in checklist */
.highlight-limited {
  font-weight: 700 !important;
  color: #c0392b !important;
}

/* Styling photo label below card */
.styling-photo-label {
  text-align: center;
  font-size: .75rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--charcoal);
  margin-top: .6rem;
  opacity: .8;
}

/* ============================================================
   GALLERY GRID — 2 per line desktop/tablet, 1 per line mobile
   ============================================================ */
.gcat-grid {
  grid-template-columns: repeat(2, 1fr) !important;
}
@media (max-width: 600px) {
  .gcat-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Portrait panel grid — 2 per line desktop, 2 mobile with centering, no crop */
.cat-panel-grid--portrait {
  grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 600px) {
  .cat-panel-grid--portrait {
    grid-template-columns: repeat(2, 1fr);
  }
  /* Center any item that ends up alone on a row (odd-positioned last child) */
  .cat-panel-grid--portrait > .cat-item--portrait:last-of-type:nth-of-type(odd),
  .cat-panel-grid--portrait > .cat-item--add:last-child:nth-child(odd) {
    grid-column: 1 / -1;
    max-width: 55%;
    margin: 0 auto;
  }
}

/* Portrait cat-item — full image, no crop */
.cat-item--portrait img {
  width: 100%;
  aspect-ratio: unset !important;
  height: auto;
  object-fit: contain;
  background: var(--cream);
}

/* Portrait cover card */
.gcat-img--portrait {
  aspect-ratio: 4/3 !important;
}
.gcat-img--portrait img {
  object-fit: cover;
  object-position: center;
}

/* ============================================================
   v9 UPDATES
   ============================================================ */

/* Service image links */
.service-img-link {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
}
.service-img-link::after {
  content: "View Gallery →";
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: rgba(28,20,16,.65);
  color: #fff;
  font-size: .75rem;
  letter-spacing: .08em;
  text-align: center;
  padding: .5rem;
  opacity: 0;
  transition: opacity .3s;
  font-family: var(--font-body);
}
.service-img-link:hover::after { opacity: 1; }

/* How It Works – step 4 featured / visually prominent */
.step--featured {
  background: rgba(255,255,255,.26) !important;
  border: 2px solid rgba(255,255,255,.55) !important;
  padding: 3rem 2.2rem !important;
  max-width: 270px !important;
  box-shadow: 0 0 0 4px rgba(255,255,255,.12), 0 8px 32px rgba(0,0,0,.22);
  position: relative;
  z-index: 1;
  align-self: center;
  justify-content: center;
}
.step--featured .step-num { opacity: .7; font-size: 3.6rem; color: #fff !important; }
.step--featured h4 { font-size: 1.1rem; font-weight: 700; }
.step--featured p { font-size: .9rem !important; }

/* Styling section image links */
.styling-img-link {
  display: block;
  width: 100%;
  height: 100%;
}

/* Styling grid: 2-col tablet, 1-col mobile */
@media (max-width: 900px) {
  .styling-grid--3 {
    grid-template-columns: repeat(2, 1fr);
  }
  .styling-grid--3 .styling-photo-card--third {
    grid-column: 1 / -1;
    max-width: 360px;
    margin: 0 auto;
    width: 100%;
  }
}
@media (max-width: 640px) {
  .styling-grid,
  .styling-grid--3 {
    grid-template-columns: 1fr !important;
  }
  .styling-grid--3 .styling-photo-card--third {
    grid-column: auto;
    max-width: 100%;
  }
}

/* Reviews section */
.reviews-section {
  padding: 3rem 2rem;
  background: var(--blush, #fdf6f3);
}
.reviews-inner {
  max-width: 860px;
  margin: 0 auto;
}
.reviews-placeholder {
  text-align: center;
  padding: 3rem 2rem;
  background: #fff;
  border-radius: 20px;
  border: 1px solid rgba(180,130,100,.15);
}
.reviews-note {
  font-size: 1rem;
  color: var(--charcoal, #4a3728);
  opacity: .7;
}

/* Policies section */
.policies-section {
  padding: 3rem 2rem;
  background: var(--white, #fff);
}
.policies-inner {
  max-width: 860px;
  margin: 0 auto;
}
.policies-content {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
.policy-block {
  background: var(--blush, #fdf6f3);
  border-radius: 20px;
  padding: 2.5rem 2.5rem;
  border: 1px solid rgba(180,130,100,.15);
}
.policy-block h3 {
  font-family: var(--font-display);
  font-size: 1.3rem;
  color: var(--dark, #1c1410);
  margin-bottom: 1rem;
}
.policy-block p {
  color: var(--charcoal, #4a3728);
  line-height: 1.8;
  margin-bottom: .9rem;
  font-size: .97rem;
}
.policy-list {
  margin: 1rem 0 0 1.2rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
.policy-list li {
  color: var(--charcoal, #4a3728);
  font-size: .93rem;
  line-height: 1.7;
  list-style: disc;
}


/* Gallery Drive links under category cards */
.gcat-card {
  position: relative;
}
.gallery-drive-link {
  display: block;
  text-align: center;
  font-size: .72rem;
  letter-spacing: .06em;
  color: var(--rose-dark, #8b4a3a);
  text-decoration: none;
  margin-top: .35rem;
  padding-bottom: .2rem;
  font-family: var(--font-body);
  font-weight: 600;
  transition: opacity .2s;
}
.gallery-drive-link:hover { opacity: .7; text-decoration: underline; }

/* Delivery section – wider content */
.delivery-content {
  max-width: 100%;
}
.delivery-highlights {
  grid-template-columns: repeat(3, 1fr);
}

/* ============================================================
   REVIEWS / TESTIMONIALS
   ============================================================ */
.reviews-section {
  padding: 5rem 2rem 6rem;
  background: var(--ivory);
}
.reviews-inner {
  max-width: 1100px;
  margin: 0 auto;
}
.reviews-stars-overall {
  font-size: 1.07rem;
  color: #c8952a;
  letter-spacing: .06em;
  margin-top: .4rem;
  font-family: var(--font-body);
}
.reviews-grid {
  columns: 3;
  column-gap: 2.5rem;
  margin-top: 3rem;
}
.review-item {
  break-inside: avoid;
  margin-bottom: 2.5rem;
}
.review-quote {
  font-family: var(--font-display);
  font-size: .97rem;
  line-height: 1.85;
  color: var(--charcoal);
  font-style: italic;
  margin: 0 0 .65rem;
}
.review-name {
  display: block;
  font-family: var(--font-body);
  font-size: .75rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--rose);
  font-weight: 600;
}

@media (max-width: 860px) {
  .reviews-grid {
    columns: 2;
    column-gap: 2rem;
  }
}
@media (max-width: 540px) {
  .reviews-grid {
    columns: 1;
  }
  .reviews-section {
    padding: 3.5rem 1.25rem 4rem;
  }
  .review-quote {
    font-size: .93rem;
  }
}

/* ---- CLIENT GALLERY ---- */
.client-gallery-section {
  background: var(--cream);
  padding: 5rem 2rem;
}
.client-gallery-inner {
  max-width: 1100px;
  margin: 0 auto;
}
.client-gallery-masonry {
  columns: 3;
  column-gap: 12px;
}
.client-gallery-photo {
  width: 100%;
  display: block;
  margin-bottom: 12px;
  border-radius: 14px;
  break-inside: avoid;
  cursor: pointer;
  transition: opacity .25s, transform .25s;
  object-fit: cover;
}
.client-gallery-photo:hover {
  opacity: .88;
  transform: scale(1.01);
}

/* Lightbox */
.cg-lightbox {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(28,20,16,.92);
  z-index: 9999;
  align-items: center;
  justify-content: center;
}
.cg-lightbox.open { display: flex; }
.cg-lightbox-img {
  max-width: 88vw;
  max-height: 88vh;
  border-radius: 12px;
  object-fit: contain;
  display: block;
}
.cg-close {
  position: fixed;
  top: 1.2rem;
  right: 1.4rem;
  background: none;
  border: none;
  color: #fff;
  font-size: 2.4rem;
  cursor: pointer;
  line-height: 1;
  opacity: .8;
  transition: opacity .2s;
}
.cg-close:hover { opacity: 1; }
.cg-nav {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255,255,255,.12);
  border: none;
  color: #fff;
  font-size: 2.8rem;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .2s;
  line-height: 1;
  padding: 0;
}
.cg-nav:hover { background: rgba(255,255,255,.25); }
.cg-prev { left: 1rem; }
.cg-next { right: 1rem; }

@media (max-width: 768px) {
  .client-gallery-masonry { columns: 2; }
}
@media (max-width: 480px) {
  .client-gallery-masonry {
    columns: unset;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .client-gallery-photo {
    margin-bottom: 0;
    border-radius: 10px;
    break-inside: unset;
  }
  .client-gallery-photo:last-child:nth-child(odd) {
    grid-column: 1 / -1;
    max-width: 50%;
    margin: 0 auto;
    display: block;
  }
}

/* Money Bouquet Disclaimer in Delivery Section */
.delivery-disclaimer {
  margin-top: 1.5rem;
  padding: 1.25rem 1.5rem;
  border-radius: 12px;
  background: #fdf8f3;
  border: 1px solid #e5d9cc;
}
.delivery-disclaimer h4 {
  font-family: var(--font-serif);
  font-size: 1rem;
  color: var(--deep-rose);
  margin-bottom: .6rem;
}
.delivery-disclaimer p {
  font-size: .9rem;
  color: var(--charcoal);
  line-height: 1.6;
}
