/* ============ BIRDY'S PLUMBING & GAS LANDER ============
   Built on the Day Night template. Brand from the Birdy's logo: navy #0b2a52 (dark panels),
   green #5cb840 (accent/buttons), blue #0a5cb8 (text accent). AA: ink on green 9.1:1,
   green on navy 5.6:1, blue #0a5cb8 on cream 5.9:1, white on navy 14.2:1. */
:root{
  /* Template light: cream ground, ink text, brand orange #f17c51 primary,
     sky-blue secondary. AA: ink on #faf9f6 15.2:1; sky text #0b7fae 4.6:1;
     orange buttons carry ink labels 6.9:1. */
  --bg: #faf9f6;
  --bg-2: #f1efe9;
  --card: #ffffff;
  --ink: #0b0d10;
  --dim: #4a5058;
  --faint: #868d95;
  --blue: #24262b;
  --blue-lift: #c04a10;
  --orange: #f06624;
  --border: rgba(11,13,16,0.13);
  --r: 10px;
  --font: "Outfit", -apple-system, sans-serif;
  --ease: cubic-bezier(0.16,1,0.3,1);
}
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ background: var(--bg); scroll-behavior:smooth; overflow-x: clip; }
body{
  background: var(--bg); color: var(--dim);
  font-family: var(--font); font-size: 16.5px; line-height: 1.65;
  overflow-x: hidden; overflow-x: clip; -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul,ol{ list-style:none; }
button{ font:inherit; cursor:pointer; border:none; background:none; color:inherit; }

h1,h2,h3{ font-weight: 700; text-transform: uppercase; color: var(--ink); line-height: 1.15; letter-spacing: 0.01em; }
.section{ padding: 90px 0; }
.container{ max-width: 1140px; margin: 0 auto; padding: 0 32px; }
.center{ text-align:center; }
.kicker{
  display:inline-block; font-size: 13px; font-weight: 700; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--blue-lift); margin-bottom: 14px;
}
.section-title{ font-size: clamp(26px, 3.4vw, 40px); margin-bottom: 16px; }
.section-title .em{ color: var(--blue-lift); font-style: italic; }
.lead{ max-width: 62ch; }

/* ============ BUTTONS (reference: 10px radius blocks) ============ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  border-radius: var(--r); padding: 16px 30px; font-weight: 700; font-size: 15px;
  text-transform: uppercase; letter-spacing: 0.04em;
  transition: transform .25s var(--ease), background .25s, filter .25s;
}
.btn:hover{ transform: translateY(-2px); filter: brightness(1.08); }
.btn-blue{ background: var(--blue); color: var(--orange); }
.btn-orange{ background: var(--orange); color: #0b0d10; }
.btn-ghost{ border: 2px solid var(--border); color: var(--ink); }
.btn-ghost:hover{ border-color: var(--ink); }

/* ============ HEADER ============ */
.site-header{
  position: absolute; top:0; left:0; right:0; z-index: 100;
  background: rgba(250,249,246,0.85); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom:1px solid var(--border);
}
.header-inner{
  max-width: 1140px; margin:0 auto; padding: 16px 32px;
  display:flex; align-items:center; justify-content:space-between; gap: 18px;
}
.wordmark img{ height: 42px; width:auto; }
.main-nav{ display:flex; gap: 24px; }
.main-nav a{ font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink); }
.main-nav a:hover{ color: var(--blue-lift); }
.header-cta{ display:flex; gap: 12px; align-items:center; }
.header-phone{
  background: var(--blue); color: var(--orange); border-radius: var(--r); border: 1px solid rgba(255,255,255,0.14);
  padding: 10px 16px; font-weight: 800; font-size: 15px; line-height: 1.2; text-align:center;
}
.header-quote{
  background: var(--orange); color: #171310; border-radius: var(--r);
  padding: 10px 16px; font-weight: 800; font-size: 13px; text-transform: uppercase; text-align:center;
}

/* ============ HERO (video, staggered uppercase headline) ============ */
.hero{ position:relative; min-height: 92vh; display:flex; align-items:center; overflow:hidden; }
.hero-bg{ position:absolute; inset:0; }
.hero-bg video, .hero-bg img{ width:100%; height:100%; object-fit:cover; }
.hero-bg::after{ content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(11,13,16,0.55) 0%, rgba(11,13,16,0.4) 60%, rgba(11,13,16,0.25) 100%); }
.hero-inner{ position:relative; z-index:1; width:100%; padding: 140px 0 90px; }
.hero-lines{ text-align: right; display:flex; flex-direction:column; gap: 14px; }
.hero-lines .line{
  font-size: clamp(30px, 4.6vw, 58px); font-weight: 800; text-transform: uppercase;
  color: #ffffff; line-height: 1.05; text-shadow: 0 2px 24px rgba(11,13,16,0.35);
}
.hero-lines .line .em{ color: var(--blue); font-style: italic; padding-right: 0.14em; }
.hero-cta-row{ display:flex; justify-content:flex-end; gap: 14px; margin-top: 34px; }
.hero-grating-row{ display:flex; justify-content:flex-end; margin-top: 20px; }
.hero-grating{
  display:inline-flex; align-items:center; gap: 10px;
  background: rgba(11,13,16,0.5); border: 1.5px solid rgba(255,255,255,0.35); border-radius: 50px;
  padding: 9px 18px; font-weight: 700; font-size: 14px; color: #ffffff;
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  transition: border-color .25s, transform .25s var(--ease);
}
.hero-grating:hover{ border-color: var(--blue-lift); transform: translateY(-2px); }
.hero-grating img{ height: 20px; width:auto; }
.hero-grating .hg-score{ margin-left: 2px; }
.hero-grating .hg-stars{ color: var(--orange); letter-spacing: 2px; margin-left: 4px; }
.hero-grating .hg-arrow{ color: var(--blue-lift); margin-left: 4px; }
.hero-grating .hg-count{ color: rgba(255,255,255,0.75); font-weight: 600; font-size: 0.92em; margin-left: 4px; white-space:nowrap; }
.rv-sub{ margin-top: -4px; color: var(--dim); font-weight: 600; }
.rv-sub .rv-sub-stars{ color: var(--orange); letter-spacing: 2px; margin-right: 6px; }

/* ============ OFFER TICKER ============ */
.ticker{ background: var(--blue); color: var(--orange); padding: 24px 0; overflow:hidden; }
.ticker-track{
  display:flex; gap: 0; width:max-content; white-space:nowrap;
  font-weight: 800; text-transform: uppercase; font-size: 19px; letter-spacing: 0.06em;
  animation: tick 75s linear infinite;
}
@keyframes tick{ to{ transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce){ .ticker-track{ animation:none; } }

/* ============ WHY CHOOSE US (split) ============ */
.why-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items:center; }
.why-photo{ border-radius: var(--r); overflow:hidden; }
.why-photo img{ width:100%; height:100%; object-fit:cover; aspect-ratio: 1.15/1; }

/* ============ SERVICES TILES ============ */
.svc-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap: 22px; margin-top: 46px; }
.svc-tile{
  position:relative; border-radius: var(--r); overflow:hidden; aspect-ratio: 1/1.05;
  display:flex; flex-direction:column; justify-content:flex-end;
}
.svc-tile img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition: transform .6s var(--ease); }
.svc-tile:hover img{ transform: scale(1.06); }
.svc-tile::after{ content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(20,20,20,0) 30%, rgba(20,20,20,0.9) 100%); }
.svc-tile-body{ position:relative; z-index:1; padding: 22px; }
.svc-tile h3{ font-size: 19px; margin-bottom: 8px; color:#fff; }
.svc-desc{
  color: rgba(255,255,255,0.92); font-size: 14px; line-height: 1.55;
  max-height: 0; opacity: 0; overflow: hidden; margin: 0 auto; max-width: 34ch;
  transition: max-height .45s var(--ease), opacity .35s, margin .45s var(--ease);
}
.svc-tile:hover .svc-desc, .svc-tile:focus-visible .svc-desc{
  max-height: 140px; opacity: 1; margin-bottom: 12px;
}
.svc-tile:hover::after{ background: linear-gradient(180deg, rgba(20,20,20,0.1) 0%, rgba(20,20,20,0.96) 78%); }
.svc-tile::after{ transition: background .4s; }
@media (hover: none){
  .svc-desc{ max-height: none; opacity: 1; margin-bottom: 12px; }
}
.svc-tile .svc-cta{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-weight: 800; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase;
  background: var(--blue); color: #fff; border-radius: var(--r); padding: 12px 22px;
  transition: background .25s, transform .25s var(--ease);
}
.svc-tile:hover .svc-cta{ background: var(--orange); color: #171310; transform: translateY(-2px); }

/* ============ CHECKLIST BAND ============ */
.check-band{ background: var(--bg-2); }
.check-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items:center; }
.check-list{ display:flex; flex-direction:column; gap: 14px; margin-top: 8px; }
.check-list li{ display:flex; gap: 12px; align-items:flex-start; font-weight: 600; color: var(--ink); font-size: 17px; }
.check-list .tick{
  width: 26px; height: 26px; border-radius: 50%; background: var(--blue); color:#fff;
  display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size: 14px; font-weight:800; margin-top:1px;
}
.check-ctas{ display:flex; gap: 14px; margin-top: 28px; flex-wrap:wrap; }
.check-photo{ border-radius: var(--r); overflow:hidden; }
.check-photo img{ width:100%; object-fit:cover; aspect-ratio: 0.95/1; }

/* ============ FEATURE CARDS ============ */
.feat-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap: 20px; margin-top: 46px; }
.feat-card{
  background: var(--card); border: 1px solid var(--border); border-radius: var(--r);
  padding: 28px 24px;
}
.feat-ic{
  width: 52px; height: 52px; border-radius: var(--r); background: rgba(11,133,251,0.16);
  display:flex; align-items:center; justify-content:center; margin-bottom: 18px;
}
.feat-ic svg{ width: 24px; height: 24px; stroke: var(--blue-lift); }
.feat-card h3{ font-size: 16.5px; margin-bottom: 8px; text-transform:none; }
.feat-card p{ font-size: 14.5px; }

/* ============ GALLERY ============ */
.gal-grid{
  display:grid; grid-template-columns: repeat(4,1fr); grid-auto-rows: 210px;
  gap: 14px; margin-top: 42px;
}
.gal-grid img{
  width:100%; height:100%; object-fit:cover; border-radius: var(--r);
  border: 1px solid var(--border); transition: transform .5s var(--ease), filter .5s;
}
.gal-grid img:hover{ transform: scale(1.03); filter: brightness(1.08); }
.gal-grid .gal-wide{ grid-column: span 2; }

/* ============ REVIEWS (marquee, dark) ============ */
.rv-marquee{ overflow:hidden; margin-top: 42px;
  mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.rv-track{ display:flex; gap: 20px; width:max-content; animation: rvscroll 60s linear infinite; }
.rv-track.rv-rev{ animation-direction: reverse; }
.rv-track:hover{ animation-play-state: paused; }
@keyframes rvscroll{ to{ transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce){ .rv-track{ animation:none; flex-wrap:wrap; width:auto; } }
.rv-card{
  width: 360px; background: #ffffff; border:1px solid rgba(0,0,0,0.06); border-radius: var(--r);
  padding: 24px; position: relative;
  box-shadow: 0 8px 24px rgba(11,13,16,0.10);
}
.rv-top{ display:flex; align-items:center; gap: 12px; margin-bottom: 10px; }
.rv-avatar{
  width: 42px; height: 42px; border-radius:50%; background: var(--blue); color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:800;
}
.rv-card:nth-child(even) .rv-avatar{ background: var(--orange); color:#171310; }
.rv-name{ font-weight: 700; font-size: 15px; color: #202124; }
.rv-date{ font-size: 12.5px; color: #5f6368; }
.rv-stars{ color: #fbbc04; letter-spacing: 2px; margin-bottom: 8px; }
.rv-text{ font-size: 14.5px; color: #3c4043; }
.rv-more-row{ margin-top: 18px; }
.rv-more-row[hidden]{ display:none; }
.rv-cta{ text-align:center; margin-top: 36px; }

/* ============ SAME DAY BAND ============ */
.sameday{ position:relative; overflow:hidden; }
.sameday-bg{ position:absolute; left:0; right:0; top:-130px; bottom:-130px; will-change:transform; }
.sameday-bg img{ width:100%; height:100%; object-fit:cover; }
.sameday-bg::after{ content:""; position:absolute; inset:0; background: rgba(20,20,20,0.78); }
.sameday .container{ position:relative; z-index:1; text-align:center; padding-top: 90px; padding-bottom: 90px; }
.sameday .section-title{ color:#fff; }
.sameday .lead{ color:rgba(255,255,255,0.88); }

/* ============ FORM / GET IN TOUCH ============ */
.book-grid{ display:grid; grid-template-columns: 1.05fr 0.95fr; gap: 60px; align-items:start; }
.form-card{
  background: #ffffff; border: 1px solid var(--border);
  border-radius: var(--r); padding: 30px 30px 34px; color: var(--ink);
  position: relative; overflow: hidden;
  box-shadow: 0 14px 40px rgba(11,13,16,0.08);
}
.form-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height: 4px;
  background: linear-gradient(90deg, var(--blue), var(--orange));
}
.form-card h3{ color: var(--ink); font-size: 22px; margin-bottom: 6px; }
.form-card p{ color: var(--dim); font-size: 14px; margin-bottom: 12px; }
.form-crop{ overflow:hidden; height: 745px; border-radius: 8px; }
.git-list{ display:flex; flex-direction:column; gap: 18px; margin-top: 26px; }
.git-list li{ display:flex; gap: 14px; align-items:flex-start; color: var(--ink); font-weight:600; }
.git-list svg{ width: 20px; height: 20px; stroke: var(--blue-lift); flex-shrink:0; margin-top: 3px; }
.git-list small{ display:block; color: var(--faint); font-weight:500; }

/* ============ VIDEOS (replaces reference map) ============ */
.vid-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,240px)); gap:16px; margin-top:42px; justify-content:center; }
.vid-card{ aspect-ratio:9/16; border-radius: var(--r); overflow:hidden; background:#000; border:1px solid var(--border); }
.vid-card iframe{ width:100%; height:100%; border:0; display:block; }
.vid-card video{ width:100%; height:100%; object-fit:contain; background:#000; display:block; }
.vid-feature{ margin-top:16px; display:flex; justify-content:center; }
.vid-card-wide{ aspect-ratio:16/9; width:min(720px,100%); }

/* ============ FOOTER ============ */
.footer{ background: #0b0d10; padding: 60px 0 36px; color: rgba(255,255,255,0.75); }
.footer h4{ color:#fff; }
.footer p{ color: rgba(255,255,255,0.75); }
.footer-grid{ display:flex; justify-content:space-between; gap: 44px; flex-wrap:wrap; }
.footer .f-logo{ height: 40px; width:auto; margin-bottom: 16px; }
.footer p{ font-size: 14px; max-width: 44ch; }
.footer h4{ font-size: 14px; letter-spacing: 0.1em; margin-bottom: 14px; }
.footer li{ margin-bottom: 8px; font-size: 14.5px; }
.footer a:hover{ color: var(--ink); }
.footer-bottom{ border-top: 1px solid var(--border); margin-top: 44px; padding-top: 20px; font-size: 13px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; }

/* ============ REVEAL ============ */
.reveal{ opacity:0; transform: translateY(22px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

/* ============ RESPONSIVE ============ */
@media (max-width: 1000px){
  .main-nav{ display:none; }
  .hero-lines{ text-align:left; }
  .hero-cta-row{ justify-content:flex-start; }
  .hero-grating-row{ justify-content:flex-start; }
  .why-grid, .check-grid, .book-grid{ grid-template-columns: 1fr; gap: 44px; }
  .svc-grid{ grid-template-columns: repeat(2,1fr); }
  .feat-grid{ grid-template-columns: repeat(2,1fr); }
  .gal-grid{ grid-template-columns: repeat(2,1fr); grid-auto-rows: 190px; }
}
@media (max-width: 640px){
  .section{ padding: 64px 0; }
  .container{ padding: 0 20px; }
  .header-inner{ padding: 12px 20px; }
  .wordmark img{ height: 34px; }
  .header-quote{ display:none; }
  .hero{ min-height: 84vh; }
  .hero-inner{ padding: 120px 20px 70px; }
  .hero-lines .line{ font-size: clamp(26px, 8vw, 34px); }
  .hero-grating{ font-size: 12px; padding: 8px 12px; gap: 7px; max-width: 100%; }
  .hero-grating img{ height: 16px; }
  .hero-grating .hg-stars{ letter-spacing: 1px; }
  .svc-grid{ grid-template-columns: 1fr; }
  .feat-grid{ grid-template-columns: 1fr; }
  .gal-grid{ grid-auto-rows: 150px; gap: 10px; }
  .vid-grid{ grid-template-columns: 1fr 1fr; }
  .rv-card{ width: 300px; }
}

/* Per-service detail rows (RSA keyword depth) */
.svc-detail{ display:grid; grid-template-columns: 1.15fr 0.85fr; gap: 48px; align-items:center; padding: 34px 0; border-top: 1px solid var(--border); }
.svc-detail:first-child{ border-top: 0; }
.svc-detail.flip > div{ order: 2; }
.svc-detail.flip > figure{ order: 1; }
.svc-det-title{ font-size: clamp(22px, 3vw, 30px); margin: 4px 0 12px; }
.svc-det-title .em{ color: var(--blue-lift); font-style: italic; }
.svc-detail p{ color: var(--muted, #555); line-height: 1.65; max-width: 58ch; }
.svc-detail figure{ margin:0; }
.svc-detail img{ width:100%; height:100%; max-height: 300px; object-fit: cover; border-radius: var(--r); display:block; }
@media (max-width: 860px){
  .svc-detail{ grid-template-columns: 1fr; gap: 18px; padding: 26px 0; }
  .svc-detail.flip > div{ order: 1; }
  .svc-detail.flip > figure{ order: 2; }
  .svc-detail img{ max-height: 220px; }
}

/* Circular team portrait above features heading */
.team-round{ width: 440px; height: 440px; margin: 0 auto 26px; border-radius: 50%; overflow: hidden; border: 4px solid var(--blue); box-shadow: 0 14px 34px rgba(0,0,0,.16); }
.team-round img{ width:100%; height:100%; object-fit: cover; display:block; }
@media (max-width: 860px){ .team-round{ width: 300px; height: 300px; max-width: 80vw; max-height: 80vw; } }

/* ============ FAQ ============ */
.faq-section .center{ text-align:center; }
.faq-list{ max-width: 860px; margin: 38px auto 0; display:flex; flex-direction:column; gap: 14px; text-align:left; }
.faq-item{
  background: var(--card); border: 1px solid var(--border); border-radius: 14px;
  transition: border-color .3s, box-shadow .3s;
}
.faq-item:hover{ border-color: var(--orange); }
.faq-item[open]{ box-shadow: 0 14px 32px rgba(11,13,16,0.08); }
.faq-item summary{
  list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between;
  gap: 20px; padding: 20px 24px; font-weight: 600; font-size: 17px;
}
.faq-item summary::-webkit-details-marker{ display: none; }
.faq-item summary::after{
  content: "+"; flex-shrink: 0;
  width: 30px; height: 30px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(255,196,12,0.18); font-size: 20px; line-height: 1;
  transition: transform .3s var(--ease), background .3s;
}
.faq-item[open] summary::after{ transform: rotate(45deg); background: var(--orange); }
.faq-a{ display: grid; grid-template-rows: 0fr; transition: grid-template-rows .4s var(--ease); }
.faq-item[open] .faq-a{ grid-template-rows: 1fr; }
.faq-a > div{ overflow: hidden; }
.faq-a p{ padding: 0 24px 22px; font-size: 15px; line-height: 1.65; max-width: 72ch; }

/* enquire form */
.form-or{ text-align:center; margin:16px 0 8px; font-weight:600; color:#666; font-size:14px; }
.ghl-form-wrap iframe{ height: 715px !important; display:block; } /* measured: submit button bottom at 700px (both 520w and 380w); declared 671 was clipping it */

/* Photo under the Get In Touch text (enquire section, right column) */
.git-photo{ margin: 30px 0 0; border-radius: var(--r); overflow: hidden; box-shadow: 0 14px 34px rgba(0,0,0,.12); }
.git-photo img{ width:100%; height: 560px; object-fit: cover; object-position: center 30%; display:block; }
@media (max-width: 860px){ .git-photo img{ height: 340px; } }

/* Static hero image (no client video for this build) */
.hero-bg img{ width:100%; height:100%; object-fit: cover; display:block; }
/* Hero CTAs: keep each button's label on one line on phones */
@media (max-width: 640px){
  .hero-cta-row{ flex-wrap: nowrap; gap: 10px; }
  .hero-cta-row .btn{ white-space: nowrap; padding: 14px 14px; font-size: 13px; letter-spacing: 0.02em; flex: 1 1 0; }
}

/* Hero: keep the crew's faces clear - image anchored high, text sits low */
.hero{ align-items: flex-end; }
.hero-bg img{ object-position: center 22%; }
.hero-inner{ padding: 200px 0 64px; }
@media (max-width: 640px){ .hero-inner{ padding: 200px 20px 48px; } }

/* Charcoal header with the white/lime logo, larger */
.site-header{ background: rgba(40,43,40,0.92); border-bottom: 1px solid rgba(255,255,255,0.08); }
.header-inner{ padding: 14px 32px; }
.wordmark img{ height: 96px; }
.main-nav a{ color: #f2f3ef; }
.main-nav a:hover{ color: var(--orange); }
.header-phone{ color: #ffffff; border-color: rgba(255,255,255,0.35); }
@media (max-width: 640px){ .wordmark img{ height: 64px; } .header-inner{ padding: 10px 20px; } }

/* Hero accent words in the brighter brand lime */
.hero-lines .line .em{ color: var(--orange); }

/* Google review badge stars in gold */
.hero-grating .hg-stars{ color: #fbbc04; }
.rv-sub-stars{ color: #fbbc04; }

/* Bigger, more visible Google review badge in the hero */
.hero-grating{ font-size: 17px; padding: 14px 26px; gap: 12px; background: rgba(11,13,16,0.62); }
.hero-grating img{ height: 24px; }
.hero-grating .hg-score{ font-size: 19px; }
.hero-grating .hg-stars{ font-size: 18px; letter-spacing: 3px; }
@media (max-width: 640px){
  .hero-grating{ font-size: 13px; padding: 10px 14px; gap: 8px; }
  .hero-grating img{ height: 18px; }
  .hero-grating .hg-stars{ font-size: 14px; letter-spacing: 2px; }
}

/* Mobile hero uses the portrait crop */
.hero-bg picture{ display:block; width:100%; height:100%; }
@media (max-width: 640px){ .hero-bg img{ object-position: center top; } }

/* Mobile: headline pinned to the top of the hero, buttons/badge stay at the bottom */
@media (max-width: 640px){
  .hero-inner{ display:flex; flex-direction:column; min-height: 84vh; padding: 100px 20px 48px; }
  .hero-lines{ margin-bottom: auto; }
  .hero-bg img{ object-position: center 55%; }
}

/* ===== sticky header, all viewports (portfolio standard, 10 Sep 2026) ===== */
.site-header{ position: fixed; }
/* anchor targets clear the fixed header */
section[id], div[id], footer[id]{ scroll-margin-top: 132px; }
@media (max-width: 640px){ section[id], div[id], footer[id]{ scroll-margin-top: 96px; } }

/* mobile sticky phone standard: ring + pulse on the header number */
.site-header a[href^="tel:"]{ animation: phone-ring 5s ease-in-out infinite; position: relative; }
.site-header a[href^="tel:"]::after{
  content:""; position:absolute; inset:-3px; border-radius: inherit;
  animation: phone-pulse 5s ease-in-out infinite; pointer-events:none;
}
@keyframes phone-ring{
  0%,86%,100%{ transform: rotate(0); }
  88%,92%,96%{ transform: rotate(-2deg); }
  90%,94%{ transform: rotate(2deg); }
}
@keyframes phone-pulse{
  0%,84%,100%{ box-shadow: 0 0 0 0 rgba(255,255,255,0); }
  88%{ box-shadow: 0 0 0 6px rgba(255,255,255,0.18); }
  96%{ box-shadow: 0 0 0 0 rgba(255,255,255,0); }
}
@media (prefers-reduced-motion: reduce){
  .site-header a[href^="tel:"], .site-header a[href^="tel:"]::after{ animation: none; }
}

/* ===== auto-scrolling team carousel: full-bleed, tall, no edge fades ===== */
.gal-carousel{
  overflow:hidden; margin-top: 42px; position:relative;
  width: 100vw; margin-left: calc(50% - 50vw);
}
.gal-track{
  display:flex; gap:16px; width:max-content;
  animation: gal-scroll 55s linear infinite;
}
.gal-carousel:hover .gal-track{ animation-play-state: paused; }
.gal-card{ flex:0 0 auto; height: 460px; aspect-ratio: 3/2; border-radius: var(--r); overflow:hidden; }
.gal-card img{ width:100%; height:100%; object-fit:cover; display:block; }
@keyframes gal-scroll{ to{ transform: translateX(-50%); } }
@media (max-width: 640px){ .gal-card{ height: 300px; } .gal-track{ gap:12px; animation-duration: 38s; } }
@media (prefers-reduced-motion: reduce){
  .gal-track{ animation:none; }
  .gal-carousel{ overflow-x:auto; }
}

/* Pricing tier cards */
.tier-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 38px; text-align:left; }
.tier-card{ background:#ffffff; border:1px solid var(--border); border-radius: var(--r); padding: 30px 26px; display:flex; flex-direction:column; gap: 12px; }
.tier-card.tier-featured{ border: 2px solid var(--orange); box-shadow: 0 18px 40px rgba(0,0,0,.10); }
.tier-name{ font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--blue-lift); margin:0; }
.tier-card h3{ font-size: 22px; margin:0; }
.tier-price{ font-size: 34px; font-weight: 800; color: var(--ink); margin: 2px 0 0; }
.tier-price small{ display:block; font-size: 12px; font-weight: 600; color: var(--muted, #667); text-transform: uppercase; letter-spacing:.06em; }
.tier-desc{ margin:0; }
.tier-list{ list-style:none; margin:0 0 6px; padding:0; display:flex; flex-direction:column; gap:8px; }
.tier-list li{ padding-left: 22px; position:relative; }
.tier-list li::before{ content:"\2713"; position:absolute; left:0; color: var(--blue-lift); font-weight:800; }
.tier-card .btn{ margin-top:auto; text-align:center; justify-content:center; }
@media (max-width: 900px){ .tier-grid{ grid-template-columns: 1fr; } }

/* Header: never wrap nav items or the phone chip */
.header-inner{ flex-wrap: nowrap; }
.main-nav{ flex-wrap: nowrap; }
.main-nav a, .header-phone, .header-quote{ white-space: nowrap; }
@media (max-width: 1100px){
  .main-nav{ gap: 14px; }
  .main-nav a{ font-size: 12px; letter-spacing: 0.03em; }
  .header-inner{ gap: 12px; padding: 14px 20px; }
  .wordmark img{ height: 72px; }
}
@media (max-width: 900px){
  .main-nav{ display:none; }
}

/* Why-us cutout image: keep natural aspect, feathered edges, no crop */
.why-photo.why-cutout{ background: transparent; box-shadow: none; border: none; }
.why-photo.why-cutout img{ aspect-ratio: auto; height: auto; object-fit: contain; border-radius: 0; }

/* Service-detail icon panels (replace repeated photos) */
.svc-det-icon{
  display:flex; align-items:center; justify-content:center;
  background: var(--blue); border-radius: var(--r); min-height: 240px;
  background-image: radial-gradient(circle at 78% 22%, rgba(128,176,32,0.16), transparent 55%);
}
.svc-det-icon svg{ width: 110px; height: 110px; color: var(--orange); }
@media (max-width: 860px){ .svc-det-icon{ min-height: 160px; } .svc-det-icon svg{ width: 80px; height: 80px; } }

/* Equal columns so flipped icon panels match width side to side (desktop only) */
@media (min-width: 861px){ .svc-detail{ grid-template-columns: 1fr 1fr; } }


/* Google G watermark on review cards (real Google reviews) */
.rv-card::after{
  content:""; position:absolute; top: 22px; right: 20px; width: 22px; height: 22px;
  background: url("../assets/images/real/google-g.webp") center/contain no-repeat;
}
.rv-sub-stars{ color: #fbbc04; }
.hero-grating .hg-stars{ color: #fbbc04; }

/* Mobile hero: keep Christian in the crop, clear space below the header */
@media (max-width: 640px){
  .hero-bg img{ object-position: 16% top; }
  .hero-inner{ padding: 150px 20px 48px; }
  .hero{ min-height: 88vh; }
}

/* Review badge: single-line label on phones */
@media (max-width: 640px){
  .hero-grating{ flex-wrap: nowrap; }
  .hero-grating .hg-label{ white-space: nowrap; font-size: 12px; }
  .hero-grating .hg-count{ white-space: nowrap; }
}

/* Mobile: hero starts below the opaque header so the photo's top (his head) isn't hidden */
@media (max-width: 640px){
  .site-header{ position: relative; }
  .hero{ min-height: 76vh; }
  .hero-inner{ padding: 210px 20px 44px; }
}


/* ===== template: photo-free brand styling ===== */
.hero-brand{ background: radial-gradient(circle at 78% 18%, rgba(240,102,36,0.35), transparent 50%), radial-gradient(circle at 15% 85%, rgba(240,102,36,0.18), transparent 45%), linear-gradient(160deg, #1c1e22 0%, #24262b 55%, #1a1c20 100%); }
.hero-brand .hero-bg{ display:none; }
.why-photo.why-logo-panel{ display:flex; align-items:center; justify-content:center; background: var(--blue); border-radius: var(--r); min-height: 340px; aspect-ratio:auto; background-image: radial-gradient(circle at 75% 25%, rgba(240,102,36,0.22), transparent 55%); box-shadow: 0 18px 40px rgba(0,0,0,.14); }
.why-photo.why-logo-panel img{ width: 68%; height:auto; object-fit: contain; aspect-ratio: auto; }
.svc-tile-ic .svc-ic-head{ display:flex; align-items:center; justify-content:center; background: var(--blue); min-height: 170px; background-image: radial-gradient(circle at 78% 22%, rgba(240,102,36,0.2), transparent 55%); }
.svc-tile-ic .svc-ic-head svg{ width: 74px; height: 74px; color: var(--orange); }
.check-photo.svc-det-icon{ min-height: 320px; color: var(--orange); }
.sameday-brand{ background: radial-gradient(circle at 70% 30%, rgba(240,102,36,0.3), transparent 55%), linear-gradient(160deg, #1c1e22, #24262b); }

/* template mobile hero crop */
@media (max-width: 640px){
  .hero-bg img{ object-position: 70% center; }
}

/* template mobile: headline pinned top under header */
@media (max-width: 640px){
  .hero-inner{ display:flex; flex-direction:column; min-height: 78vh; padding: 24px 20px 40px; }
  .hero-lines{ margin-bottom: auto; }
  .hero-bg img{ object-position: 70% 65%; }
}

/* ===== Oct 2026 refresh: banner callouts ===== */
.hero-callouts{ display:flex; justify-content:flex-end; gap:10px; flex-wrap:wrap; margin-bottom:20px; }
.callout{
  display:inline-flex; align-items:center; gap:8px; padding:9px 16px; border-radius:999px;
  background:rgba(11,13,16,0.6); border:1.5px solid rgba(255,255,255,0.4); color:#fff;
  font-weight:800; font-size:14px; text-transform:uppercase; letter-spacing:0.05em;
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
.callout svg{ width:17px; height:17px; flex-shrink:0; color:var(--orange); }
.callout-orange{ background:var(--orange); border-color:var(--orange); color:#0b0d10; }
.callout-orange svg{ color:#0b0d10; }
h1.hero-lines{ font-weight:inherit; text-transform:none; color:inherit; line-height:inherit; letter-spacing:normal; }
@media (max-width:1000px){ .hero-callouts{ justify-content:flex-start; } }
@media (max-width:640px){ .hero-callouts{ gap:8px; margin-bottom:14px; } .callout{ font-size:11.5px; padding:7px 11px; gap:6px; letter-spacing:0.03em; } .callout svg{ width:14px; height:14px; } }

/* ===== services: photo-free numbered cards + CTA bar ===== */
.svc-section{ padding-top:0; }
.svc-head{ display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:end; }
.svc-head .lead{ margin-bottom:16px; }
.sv-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:40px; }
.sv-card{
  position:relative; display:flex; flex-direction:column; gap:12px; overflow:hidden;
  background:#24262b; color:rgba(255,255,255,0.8); border-radius:14px; padding:30px 28px 28px;
  border:1px solid rgba(255,255,255,0.06);
  transition:transform .35s var(--ease), box-shadow .35s, background .35s;
}
.sv-card::before{ content:""; position:absolute; left:0; top:0; height:4px; width:100%; background:var(--orange); transform:scaleX(0.18); transform-origin:left; transition:transform .45s var(--ease); }
.sv-card:hover{ transform:translateY(-6px); box-shadow:0 22px 44px rgba(11,13,16,0.25); background:#2b2e34; }
.sv-card:hover::before{ transform:scaleX(1); }
.sv-num{ position:absolute; right:22px; top:16px; font-size:54px; font-weight:800; line-height:1; color:rgba(255,255,255,0.06); }
.sv-ic{ width:62px; height:62px; border-radius:14px; display:flex; align-items:center; justify-content:center; background:rgba(240,102,36,0.14); color:var(--orange); }
.sv-ic svg{ width:34px; height:34px; }
.sv-card h3{ color:#fff; font-size:20px; margin-top:6px; }
.sv-card p{ font-size:15px; line-height:1.6; flex:1; }
.sv-link{ display:inline-flex; align-items:center; gap:8px; margin-top:6px; font-weight:800; font-size:13.5px; text-transform:uppercase; letter-spacing:0.06em; color:var(--orange); }
.sv-card:hover .sv-link span{ transform:translateX(4px); }
.sv-link span{ transition:transform .3s var(--ease); }
.sv-ctabar{
  margin-top:28px; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
  background:var(--orange); border-radius:14px; padding:26px 30px; color:#0b0d10;
}
.sv-ctabar-copy strong{ display:block; font-size:22px; font-weight:800; text-transform:uppercase; }
.sv-ctabar-copy span{ font-weight:600; }
.sv-ctabar-btns{ display:flex; gap:12px; flex-wrap:wrap; }
.btn-dark{ background:#0b0d10; color:#fff; }
.btn-light{ background:#fff; color:#0b0d10; }
@media (max-width:1000px){ .sv-grid{ grid-template-columns:repeat(2,1fr); } .svc-head{ grid-template-columns:1fr; gap:0; } }
@media (max-width:640px){ .sv-grid{ grid-template-columns:1fr; } .sv-ctabar{ padding:22px 20px; } .sv-ctabar-btns, .sv-ctabar-btns .btn{ width:100%; } }

/* ===== why choose: dark band, stats + cards ===== */
.wc-band{ background:radial-gradient(circle at 85% 10%, rgba(240,102,36,0.22), transparent 45%), linear-gradient(160deg,#1c1e22,#24262b); color:rgba(255,255,255,0.8); }
.wc-band .section-title{ color:#fff; }
.wc-band .section-title .em, .wc-band .kicker{ color:var(--orange); }
.wc-top{ display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:center; }
.wc-stats{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.wc-stat{ background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:14px; padding:22px 20px; }
.wc-stat b{ display:block; font-size:42px; font-weight:800; line-height:1; color:#fff; }
.wc-stat b i{ font-style:normal; color:#fbbc04; font-size:0.7em; margin-left:4px; }
.wc-stat span{ display:block; margin-top:8px; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; color:var(--orange); }
.wc-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:50px; }
.wc-card{ background:#fff; border-radius:14px; padding:28px 24px; border-top:4px solid var(--orange); color:var(--dim); }
.wc-ic{ width:50px; height:50px; border-radius:50%; background:#24262b; display:flex; align-items:center; justify-content:center; margin-bottom:16px; }
.wc-ic svg{ width:24px; height:24px; stroke:var(--orange); }
.wc-card h3{ font-size:17px; margin-bottom:8px; }
.wc-card p{ font-size:14.5px; }
.wc-cta{ display:flex; justify-content:center; gap:14px; flex-wrap:wrap; margin-top:40px; }
.btn-outline-light{ border:2px solid rgba(255,255,255,0.5); color:#fff; }
.btn-outline-light:hover{ border-color:#fff; }
@media (max-width:1000px){ .wc-top{ grid-template-columns:1fr; gap:30px; } .wc-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .wc-grid{ grid-template-columns:1fr; } .wc-stat b{ font-size:34px; } .wc-cta .btn{ flex:1 1 100%; } }

/* ===== floating Google reviews badge ===== */
.g-float{ position:fixed; left:18px; bottom:18px; z-index:70; display:flex; align-items:center; gap:10px; background:#fff; border-radius:999px; padding:9px 16px 9px 10px; box-shadow:0 14px 40px rgba(11,13,16,.22); border:1.5px solid rgba(11,13,16,.06); transition:transform .2s; }
.g-float:hover{ transform:translateY(-3px); }
.g-float img{ height:26px; width:auto; }
.g-float span{ display:flex; flex-direction:column; line-height:1.15; }
.g-float b{ font-size:15px; color:var(--ink); }
.g-float .stars{ font-size:12px; font-style:normal; color:#fbbc04; margin-left:4px; letter-spacing:1px; }
.g-float small{ font-size:11px; color:var(--dim); font-weight:700; }
@media (max-width:640px){ .g-float{ left:12px; bottom:12px; padding:7px 12px 7px 8px; } .g-float img{ height:20px; } .g-float b{ font-size:13px; } .g-float small{ font-size:10px; } }

/* ===== services dropdown + mobile pill strip ===== */
.main-nav{ align-items:center; }
.nav-dd{ position:relative; }
.nav-dd .dd-caret{ font-size:10px; margin-left:2px; }
.nav-dd-menu{
  position:absolute; top:100%; left:-16px; min-width:240px; padding:10px; margin-top:10px;
  background:#24262b; border-radius:12px; box-shadow:0 18px 40px rgba(0,0,0,.3);
  display:flex; flex-direction:column; opacity:0; visibility:hidden; transform:translateY(6px); transition:opacity .2s, transform .2s, visibility .2s;
}
.nav-dd-menu::before{ content:""; position:absolute; left:0; right:0; top:-14px; height:14px; }
.nav-dd:hover .nav-dd-menu, .nav-dd:focus-within .nav-dd-menu{ opacity:1; visibility:visible; transform:none; }
.nav-dd-menu a{ padding:10px 12px; border-radius:8px; }
.nav-dd-menu a:hover{ background:rgba(240,102,36,0.14); }
.mobile-svc-nav{ display:none; }
@media (max-width:900px){
  .mobile-svc-nav{ display:flex; gap:8px; overflow-x:auto; padding:0 20px 10px; scrollbar-width:none; }
  .mobile-svc-nav::-webkit-scrollbar{ display:none; }
  .mobile-svc-nav a{ flex:0 0 auto; padding:7px 13px; border-radius:999px; border:1px solid rgba(255,255,255,0.25); color:#fff; font-size:12.5px; font-weight:700; white-space:nowrap; }
}
.footer-bottom a{ text-decoration:underline; }
.footer a:hover{ color:var(--orange); }

/* ===== service pages ===== */
.svc-hero{ min-height:78vh; }
.svc-hero .hero-inner{ padding-top:190px; padding-bottom:70px; position:relative; }
.svc-hero-sub{ text-align:right; color:rgba(255,255,255,0.88); font-size:18px; font-weight:500; max-width:52ch; margin:18px 0 0 auto; }
.svc-hero-ic{ position:absolute; left:32px; bottom:40px; color:rgba(240,102,36,0.16); pointer-events:none; }
.svc-hero-ic svg{ width:300px; height:300px; }
.svc-intro{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; align-items:center; }
.svc-intro p + p{ margin-top:14px; }
.svc-intro-panel{ background:radial-gradient(circle at 80% 15%, rgba(240,102,36,0.25), transparent 55%), #24262b; border-radius:16px; padding:36px; color:#fff; }
.svc-intro-ic{ display:flex; width:84px; height:84px; border-radius:18px; background:rgba(240,102,36,0.15); color:var(--orange); align-items:center; justify-content:center; margin-bottom:24px; }
.svc-intro-ic svg{ width:48px; height:48px; }
.svc-intro-facts{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.svc-intro-facts li{ background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:12px; padding:16px; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; color:rgba(255,255,255,0.75); }
.svc-intro-facts b{ display:block; font-size:26px; color:#fff; letter-spacing:0; margin-bottom:4px; }
.sv-grid-4{ grid-template-columns:repeat(4,1fr); }
.sv-card-static:hover{ transform:none; }
.types-list{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; max-width:980px; margin:30px auto 0; text-align:left; }
.types-list li{ background:#fff; border:1px solid var(--border); border-radius:12px; padding:16px 18px; align-items:center; }
.process-band{ background:var(--bg-2); }
.step-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:40px; text-align:left; }
.step-card{ background:#fff; border:1px solid var(--border); border-radius:14px; padding:26px 22px; }
.step-n{ display:inline-flex; width:44px; height:44px; border-radius:50%; background:var(--orange); color:#0b0d10; font-weight:800; font-size:18px; align-items:center; justify-content:center; margin-bottom:14px; }
.step-card h3{ font-size:16.5px; margin-bottom:6px; }
.step-card p{ font-size:14.5px; }
.legal{ padding-top:200px; }
.legal p{ max-width:70ch; margin-top:14px; }
.legal a{ color:var(--blue-lift); text-decoration:underline; }
@media (max-width:1000px){
  .svc-hero-sub{ text-align:left; margin-left:0; }
  .svc-intro{ grid-template-columns:1fr; gap:36px; }
  .sv-grid-4{ grid-template-columns:repeat(2,1fr); }
  .types-list{ grid-template-columns:repeat(2,1fr); }
  .step-grid{ grid-template-columns:repeat(2,1fr); }
  .svc-hero-ic{ display:none; }
}
@media (max-width:640px){
  .svc-hero{ min-height:auto; }
  .svc-hero .hero-inner{ min-height:0; padding-top:40px; padding-bottom:48px; }
  .svc-hero-sub{ font-size:16px; }
  .sv-grid-4, .types-list, .step-grid{ grid-template-columns:1fr; }
  .legal{ padding-top:60px; }
}

/* service-page heroes: real photo, darker toward the right-aligned copy */
.svc-hero .hero-bg::after{ background: linear-gradient(90deg, rgba(11,13,16,0.35) 0%, rgba(11,13,16,0.62) 50%, rgba(11,13,16,0.82) 100%); }
@media (max-width:1000px){ .svc-hero .hero-bg::after{ background: linear-gradient(180deg, rgba(11,13,16,0.5) 0%, rgba(11,13,16,0.82) 100%); } }
@media (max-width:640px){ .svc-hero .hero-bg img{ object-position:center top !important; } .svc-hero .hero-inner{ padding-top:220px; } }

/* ===== Google-style reviews ===== */
.g-summary{ display:inline-flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:center; background:#fff; border:1px solid #dadce0; border-radius:999px; padding:10px 22px; box-shadow:0 4px 14px rgba(60,64,67,.12); font-family:Arial, Helvetica, sans-serif; }
.g-word{ font-size:22px; font-weight:700; letter-spacing:-0.5px; }
.g-word b{ font-weight:700; } .gb{ color:#4285f4; } .gr{ color:#ea4335; } .gy{ color:#fbbc05; } .gg{ color:#34a853; }
.g-sum-txt{ font-size:18px; color:#5f6368; }
.g-sum-score{ font-size:20px; font-weight:700; color:#202124; margin-left:4px; }
.g-sum-stars{ color:#fbbc04; font-size:18px; letter-spacing:2px; }
.g-sum-count{ font-size:14px; color:#5f6368; }
.rv-card{ font-family:Arial, Helvetica, sans-serif; border:1px solid #dadce0; box-shadow:0 1px 3px rgba(60,64,67,.15), 0 6px 18px rgba(60,64,67,.08); padding-bottom:18px; }
.rv-card::after{ width:26px; height:26px; top:20px; right:18px; }
.rv-avatar{ font-family:Arial, Helvetica, sans-serif; font-weight:500; }
.rv-card:nth-child(4n+1) .rv-avatar{ background:#1a73e8; color:#fff; }
.rv-card:nth-child(4n+2) .rv-avatar{ background:#e8710a; color:#fff; }
.rv-card:nth-child(4n+3) .rv-avatar{ background:#188038; color:#fff; }
.rv-card:nth-child(4n+4) .rv-avatar{ background:#a142f4; color:#fff; }
.rv-name::after{ content:""; display:inline-block; width:14px; height:14px; margin-left:6px; vertical-align:-2px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='%231a73e8'/%3E%3Cpath d='M7 12.5l3.2 3.2L17 9' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat; }
.rv-stars{ font-size:17px; }
.rv-text::after{ content:"Posted on Google"; display:flex; align-items:center; gap:6px; margin-top:14px; padding-top:12px; border-top:1px solid #e8eaed; font-size:12.5px; font-weight:700; color:#5f6368; padding-left:22px; background:url("../assets/images/real/google-g.webp") left 12px/16px 16px no-repeat; }
@media (max-width:640px){ .g-summary{ padding:10px 16px; gap:6px 8px; } .g-word{ font-size:19px; } .g-sum-count{ flex-basis:100%; text-align:center; } }

/* ===== service areas band ===== */
.areas-band{ background:var(--bg-2); }
.areas-head{ display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:end; }
.areas-head .lead{ margin-bottom:16px; }
.areas-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:40px; }
.area-card{ background:#fff; border:1px solid var(--border); border-radius:14px; padding:24px 22px; border-top:4px solid var(--orange); }
.area-card h3{ display:flex; align-items:center; gap:8px; font-size:16px; margin-bottom:14px; }
.area-card h3 svg{ width:20px; height:20px; color:var(--orange); flex-shrink:0; }
.area-chips{ display:flex; flex-wrap:wrap; gap:7px; }
.area-chips li{ font-size:13px; font-weight:600; color:var(--ink); background:var(--bg); border:1px solid var(--border); border-radius:999px; padding:5px 11px; }
.area-chips li.here{ background:var(--orange); border-color:var(--orange); color:#0b0d10; }
.areas-cta{ display:flex; justify-content:center; gap:14px; flex-wrap:wrap; margin-top:34px; }
@media (max-width:1000px){ .areas-head{ grid-template-columns:1fr; gap:0; } .areas-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .areas-grid{ grid-template-columns:1fr; } .areas-cta .btn{ flex:1 1 100%; } }

/* ===== Birdy's brand overrides ===== */
:root{ --blue:#0b2a52; --orange:#5cb840; --blue-lift:#0a5cb8; }
.site-header{ background:rgba(255,255,255,0.97); border-bottom:1px solid var(--border); }
.main-nav a{ color:var(--ink); }
.main-nav a:hover{ color:var(--blue-lift); }
.wordmark img{ height:64px; }
@media (max-width:1100px){ .wordmark img{ height:54px; } }
@media (max-width:640px){ .wordmark img{ height:46px; } }
.header-phone{ background:var(--blue); color:#fff; border-color:var(--blue); }
.site-header a[href^="tel:"]::after{ animation-name:phone-pulse-b; }
@keyframes phone-pulse-b{ 0%,84%,100%{ box-shadow:0 0 0 0 rgba(92,184,64,0); } 88%{ box-shadow:0 0 0 6px rgba(92,184,64,0.35); } 96%{ box-shadow:0 0 0 0 rgba(92,184,64,0); } }
.mobile-svc-nav a{ color:var(--ink); border-color:var(--border); }
.nav-dd-menu{ background:var(--blue); }
.nav-dd-menu a{ color:#fff; }
.nav-dd-menu a:hover{ background:rgba(92,184,64,0.18); }
.btn-blue{ background:var(--blue); color:#fff; }
.btn-orange{ background:var(--orange); color:#0b0d10; }
.ticker{ background:var(--blue); color:var(--orange); }
.sv-card{ background:var(--blue); }
.sv-card:hover{ background:#0e3466; }
.sv-ic{ background:rgba(92,184,64,0.16); color:var(--orange); }
.sv-ctabar{ background:var(--orange); }
.wc-band{ background:radial-gradient(circle at 85% 10%, rgba(92,184,64,0.22), transparent 45%), linear-gradient(160deg,#08203f,#0b2a52); }
.wc-ic{ background:var(--blue); }
.svc-det-icon{ background:var(--blue); background-image:radial-gradient(circle at 78% 22%, rgba(92,184,64,0.2), transparent 55%); }
.sameday-brand{ background:radial-gradient(circle at 70% 30%, rgba(92,184,64,0.28), transparent 55%), linear-gradient(160deg,#08203f,#0b2a52); }
.svc-intro-panel{ background:radial-gradient(circle at 80% 15%, rgba(92,184,64,0.25), transparent 55%), var(--blue); }
.svc-intro-ic{ background:rgba(92,184,64,0.16); }
.check-list .tick{ background:var(--orange); color:#0b0d10; }
.rv-card:nth-child(4n+2) .rv-avatar{ background:var(--orange); }
.f-logo-chip{ display:inline-block; background:#fff; border-radius:10px; padding:10px 14px; margin-bottom:16px; }
.f-logo-chip .f-logo{ height:48px; margin:0; }
.rv-tbc{ max-width:440px; margin:36px auto 0; text-align:left; }
.tbc-note, .form-tbc{ margin-top:14px; background:#fff7d6; border:1px dashed #d4b23a; border-radius:10px; padding:14px 16px; font-size:14px; color:#5a4a0c; font-weight:600; }
.form-tbc{ min-height:220px; display:flex; align-items:center; justify-content:center; text-align:center; }
/* hero: white header is not fixed on mobile, keep crop on the crew */
.hero-bg img{ object-position:40% 30%; }
@media (max-width:640px){ .hero-bg img{ object-position:30% 40%; } }
@media (max-width:640px){ .hero:not(.svc-hero) .hero-bg img{ object-position:28% 8%; } }

/* ===== video strip (portrait ads) ===== */
.vid-section{ background:var(--bg-2); }
.vid-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,260px)); gap:22px; justify-content:center; margin-top:40px; }
.vid-item{ margin:0; }
.vid-card{ aspect-ratio:9/16; border-radius:14px; overflow:hidden; background:#000; box-shadow:0 14px 34px rgba(11,13,16,.16); border:0; }
.vid-card video{ width:100%; height:100%; object-fit:cover; display:block; background:#000; }
.vid-item figcaption{ margin-top:12px; font-weight:700; font-size:14px; color:var(--ink); text-transform:uppercase; letter-spacing:.04em; }
@media (max-width:700px){
  .vid-grid{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:14px; margin-left:-20px; margin-right:-20px; padding:0 20px 6px; justify-content:flex-start; scrollbar-width:none; grid-template-columns:none; }
  .vid-grid::-webkit-scrollbar{ display:none; }
  .vid-item{ flex:0 0 62vw; scroll-snap-align:start; }
}
/* home hero video: hands-on montage, centre crop */
.hero:not(.svc-hero) .hero-bg video{ object-position:center center; }
@media (max-width:640px){ .hero:not(.svc-hero) .hero-bg video{ object-position:60% center; } }

/* ===== "Punch" layer (9 Oct 2026): Anton display type + a few ink-template touches on the light design ===== */
h1, h2, .section-title, .hero-lines .line, .sv-card h3, .wc-card h3, .step-card h3, .area-card h3, .sv-ctabar-copy strong, .wc-stat b, .svc-det-title, .crew-card b{
  font-family:"Anton", Impact, "Arial Narrow", sans-serif; font-weight:400; letter-spacing:.02em; text-transform:uppercase;
}
.section-title{ font-size:clamp(32px,4.4vw,56px); line-height:1.02; }
.section-title .em, .hero-lines .line .em{ font-style:normal; }
.hero-lines .line{ font-size:clamp(44px,6.4vw,92px); line-height:.98; }
@media (max-width:640px){ .hero-lines .line{ font-size:clamp(36px,11vw,52px); } }
.kicker::before{ content:"\2726  "; }
.btn{ font-family:"Anton", Impact, sans-serif; font-weight:400; letter-spacing:.08em; font-size:16px; border-radius:6px; }
.wc-stat b{ font-size:52px; }
.sv-card h3{ font-size:24px; }
.wc-card h3, .step-card h3{ font-size:20px; }
.sv-num{ color:transparent; -webkit-text-stroke:1px rgba(92,184,64,.6); font-family:"Anton", Impact, sans-serif; font-weight:400; font-size:62px; }
/* ticker as a tilted tape */
.ticker{ background:var(--orange); color:#0b0d10; transform:rotate(-1deg); margin:-14px -10px 0; position:relative; z-index:3; box-shadow:0 10px 30px rgba(0,0,0,.18); }
.ticker-track{ font-family:"Anton", Impact, sans-serif; font-weight:400; font-size:24px; letter-spacing:.06em; }
/* photos: hard green offset frame */
.why-photo, .check-photo, .git-photo{ border-radius:0; box-shadow:14px 14px 0 var(--orange); }
/* crew */
.crew-sec{ background:var(--blue); }
.crew-sec .section-title{ color:#fff; }
.crew-sec .section-title .em, .crew-sec .kicker{ color:var(--orange); }
.crew-sec .lead{ color:rgba(255,255,255,.82); }
.crew-head{ max-width:760px; }
.crew-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:44px; align-items:end; }
.crew-card{ margin:0; position:relative; overflow:hidden; background:#000; border-radius:6px; }
.crew-card img{ width:100%; aspect-ratio:2/4.2; object-fit:cover; object-position:center top; display:block; transition:transform .8s var(--ease); }
.crew-card:hover img{ transform:scale(1.03); }
.crew-card figcaption{ position:absolute; left:0; right:0; bottom:0; padding:60px 18px 18px; background:linear-gradient(180deg,transparent,rgba(5,18,36,.92)); display:flex; flex-direction:column; }
.crew-card b{ font-size:28px; color:#fff; }
.crew-card span{ color:var(--orange); font-weight:700; font-size:13px; letter-spacing:.14em; text-transform:uppercase; }
.crew-lead{ transform:translateY(-28px); outline:3px solid var(--orange); outline-offset:6px; }
@media (max-width:900px){ .crew-grid{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; margin-left:-20px; margin-right:-20px; padding:10px 20px 30px; scrollbar-width:none; } .crew-grid::-webkit-scrollbar{ display:none; } .crew-card{ flex:0 0 66vw; scroll-snap-align:start; } .crew-lead{ transform:none; } }
.why-photo.why-portrait img{ aspect-ratio:0.9/1; object-position:center top; }

/* ===== subtle scroll motion (js/motion.js) ===== */
.motion .rv{ opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease) var(--d,0ms), transform .8s var(--ease) var(--d,0ms); }
.motion .rv.on{ opacity:1; transform:none; }
.motion .section-title .em{ background:linear-gradient(var(--orange),var(--orange)) no-repeat 0 92% / 0 0.12em; transition:background-size .9s var(--ease) .35s; }
.motion .section-title.on .em{ background-size:100% 0.12em; }
.crew-sec .section-title .em, .wc-band .section-title .em{ background-image:linear-gradient(rgba(255,255,255,.85),rgba(255,255,255,.85)); }
.motion .rv-frame{ box-shadow:0 0 0 var(--orange); transition:box-shadow .9s var(--ease) .25s; }
.motion .rv-frame.on{ box-shadow:14px 14px 0 var(--orange); }
.motion .rv-frame img{ transform:scale(1.08); transition:transform 1.4s var(--ease); }
.motion .rv-frame.on img{ transform:scale(1); }
.hero .hero-bg video, .hero .hero-bg img{ will-change:transform; }
.site-header{ transition:box-shadow .3s, background .3s; }
.site-header.scrolled{ box-shadow:0 8px 24px rgba(11,13,16,.10); }
.site-header .wordmark img{ transition:height .3s var(--ease); }
@media (min-width:901px){ .site-header.scrolled .wordmark img{ height:50px; } }
.sv-card .sv-ic{ transition:transform .4s var(--ease); }
.sv-card:hover .sv-ic{ transform:rotate(-8deg) scale(1.08); }

/* ===== CTA + Google pill "wow" (12 Oct 2026): glow + light sweep, off under reduced motion ===== */
.btn, .header-quote, .header-phone{ position:relative; overflow:hidden; isolation:isolate; }
.btn::after, .header-quote::after{
  content:""; position:absolute; top:0; bottom:0; left:-60%; width:45%; z-index:1; pointer-events:none;
  background:linear-gradient(105deg, transparent 0%, rgba(255,255,255,.55) 50%, transparent 100%);
  transform:skewX(-20deg); opacity:0;
}
.btn:hover::after, .header-quote:hover::after{ animation:btn-shine .75s ease forwards; }
/* primary CTAs: soft green glow + an automatic shine every few seconds */
.btn-orange, .header-quote{ box-shadow:0 6px 20px rgba(92,184,64,.38), 0 0 0 0 rgba(92,184,64,.5); animation:cta-glow 3.2s ease-in-out infinite; }
.btn-orange::after, .header-quote::after{ animation:btn-shine-auto 4.8s ease-in-out infinite; }
.btn-blue{ box-shadow:0 6px 18px rgba(11,42,82,.30); }
.btn:hover{ transform:translateY(-3px); }
.btn-orange:hover{ box-shadow:0 10px 28px rgba(92,184,64,.55); }
@keyframes btn-shine{ 0%{ left:-60%; opacity:1; } 100%{ left:130%; opacity:1; } }
@keyframes btn-shine-auto{ 0%,62%{ left:-60%; opacity:0; } 64%{ opacity:1; } 86%{ left:130%; opacity:1; } 87%,100%{ left:130%; opacity:0; } }
@keyframes cta-glow{ 0%,100%{ box-shadow:0 6px 20px rgba(92,184,64,.35), 0 0 0 0 rgba(92,184,64,.45); } 50%{ box-shadow:0 8px 26px rgba(92,184,64,.55), 0 0 0 7px rgba(92,184,64,0); } }

/* Google pills: animated gradient ring in Google colours + gold star twinkle */
.hero-grating, .g-float, .g-summary{ position:relative; isolation:isolate; }
.hero-grating::before, .g-float::before, .g-summary::before{
  content:""; position:absolute; inset:-2px; border-radius:inherit; z-index:-1; padding:2px;
  background:conic-gradient(from var(--ga,0deg), #4285f4, #34a853, #fbbc05, #ea4335, #4285f4);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude;
  animation:g-spin 5s linear infinite; opacity:.9;
}
.hero-grating{ border-color:transparent; box-shadow:0 0 22px rgba(66,133,244,.35); }
.g-float{ box-shadow:0 14px 40px rgba(11,13,16,.22), 0 0 18px rgba(251,188,5,.35); }
.g-summary{ box-shadow:0 4px 14px rgba(60,64,67,.12), 0 0 20px rgba(66,133,244,.18); }
.hg-stars, .g-float .stars, .g-sum-stars{ background:linear-gradient(90deg,#fbbc04 0%,#fbbc04 40%,#fff6c8 50%,#fbbc04 60%,#fbbc04 100%); background-size:250% 100%; -webkit-background-clip:text; background-clip:text; color:transparent !important; animation:star-shine 3.5s linear infinite; }
@property --ga{ syntax:"<angle>"; inherits:false; initial-value:0deg; }
@keyframes g-spin{ to{ --ga:360deg; } }
@keyframes star-shine{ 0%{ background-position:100% 0; } 100%{ background-position:-150% 0; } }
@media (prefers-reduced-motion: reduce){
  .btn-orange, .header-quote, .btn::after, .header-quote::after, .hero-grating::before, .g-float::before, .g-summary::before, .hg-stars, .g-float .stars, .g-sum-stars{ animation:none !important; }
}

/* ===== CTA wow, round 2: every CTA shines and glows, stronger ===== */
.btn::after, .header-quote::after, .header-phone::after{ animation:btn-shine-auto 4.2s ease-in-out infinite; width:55%; background:linear-gradient(105deg, transparent 0%, rgba(255,255,255,.75) 50%, transparent 100%); }
.btn-blue::after, .btn-dark::after, .header-phone::after{ background:linear-gradient(105deg, transparent 0%, rgba(140,230,110,.55) 50%, transparent 100%); animation-delay:1.4s; }
.btn-light::after, .btn-ghost::after{ background:linear-gradient(105deg, transparent 0%, rgba(92,184,64,.45) 50%, transparent 100%); animation-delay:2.1s; }
.btn-orange, .header-quote{ animation:cta-glow2 2.6s ease-in-out infinite; }
.btn-blue, .btn-dark, .header-phone{ animation:cta-glow-navy 2.6s ease-in-out infinite; animation-delay:1.3s; }
@keyframes cta-glow2{ 0%,100%{ box-shadow:0 6px 18px rgba(92,184,64,.45), 0 0 0 0 rgba(92,184,64,.6); } 50%{ box-shadow:0 10px 34px rgba(92,184,64,.8), 0 0 0 9px rgba(92,184,64,0); } }
@keyframes cta-glow-navy{ 0%,100%{ box-shadow:0 6px 18px rgba(11,42,82,.35), 0 0 0 0 rgba(92,184,64,.45); } 50%{ box-shadow:0 10px 30px rgba(11,42,82,.5), 0 0 0 8px rgba(92,184,64,0); } }
.btn:hover{ transform:translateY(-3px) scale(1.03); }
.btn-orange:hover, .header-quote:hover{ box-shadow:0 12px 40px rgba(92,184,64,.9); filter:brightness(1.08) saturate(1.1); }
.btn-blue:hover, .btn-dark:hover{ box-shadow:0 12px 34px rgba(92,184,64,.45); }
/* site-header tel ring animation uses transform; keep its pulse but let the glow show */
.site-header a.header-phone{ overflow:hidden; }
@media (prefers-reduced-motion: reduce){ .btn, .header-quote, .header-phone, .btn::after, .header-quote::after, .header-phone::after{ animation:none !important; } }

/* Google pills: replace the multi-colour ring with a single soft gold glint (Kevin, 12 Oct) */
.hero-grating::before, .g-float::before, .g-summary::before{
  background:conic-gradient(from var(--ga,0deg), transparent 0deg, transparent 250deg, rgba(251,188,4,.95) 310deg, transparent 360deg);
  opacity:1; animation:g-spin 3.6s linear infinite;
}
.hero-grating{ box-shadow:0 0 18px rgba(251,188,4,.25); }
.g-float{ box-shadow:0 14px 40px rgba(11,13,16,.22), 0 0 16px rgba(251,188,4,.28); }
.g-summary{ box-shadow:0 4px 14px rgba(60,64,67,.12), 0 0 16px rgba(251,188,4,.2); }
/* faster, longer gold glint on the Google pills */
.hero-grating::before, .g-float::before, .g-summary::before{
  background:conic-gradient(from var(--ga,0deg), transparent 0deg, transparent 200deg, rgba(251,188,4,.35) 250deg, rgba(255,226,120,1) 300deg, transparent 330deg, transparent 360deg);
  animation:g-spin 1.6s linear infinite;
}
/* Google pills: glint uses background-position (works in every browser, no @property needed) */
.hero-grating::before, .g-float::before, .g-summary::before{
  background:linear-gradient(110deg, transparent 0%, transparent 35%, rgba(251,188,4,.5) 45%, rgba(255,230,140,1) 50%, rgba(251,188,4,.5) 55%, transparent 65%, transparent 100%);
  background-size:300% 100%; background-repeat:no-repeat;
  animation:g-glint 1.8s linear infinite;
}
@keyframes g-glint{ 0%{ background-position:100% 0; } 100%{ background-position:0% 0; } }
@media (prefers-reduced-motion: reduce){ .hero-grating::before, .g-float::before, .g-summary::before{ animation:none !important; } }
/* Google pills, take 3: visible gold edge glint + a light sweep across the pill */
.hero-grating, .g-float, .g-summary{ overflow:hidden; }
.hero-grating::before, .g-float::before, .g-summary::before{ inset:0; padding:2.5px; background-size:250% 100%; animation:g-glint 1.6s linear infinite; }
.hero-grating::after, .g-float::after, .g-summary::after{
  content:""; position:absolute; top:0; bottom:0; left:-40%; width:30%; z-index:2; pointer-events:none;
  background:linear-gradient(105deg, transparent, rgba(255,255,255,.45), transparent); transform:skewX(-20deg);
  animation:pill-sweep 2.8s ease-in-out infinite;
}
.g-summary::after, .g-float::after{ background:linear-gradient(105deg, transparent, rgba(251,188,4,.35), transparent); }
@keyframes pill-sweep{ 0%{ left:-40%; } 60%,100%{ left:130%; } }
@media (prefers-reduced-motion: reduce){ .hero-grating::after, .g-float::after, .g-summary::after{ animation:none !important; display:none; } }
/* header phone: back to its own clean look (ring + pulse only), no shine/glow from the CTA rules */
.site-header .header-phone{ overflow:visible; animation:phone-ring 5s ease-in-out infinite; box-shadow:none; }
.site-header .header-phone::after{
  content:""; position:absolute; inset:-3px; top:-3px; bottom:-3px; left:-3px; width:auto; border-radius:inherit; transform:none; opacity:1;
  background:none; animation:phone-pulse-b 5s ease-in-out infinite; pointer-events:none;
}
@media (prefers-reduced-motion: reduce){ .site-header .header-phone, .site-header .header-phone::after{ animation:none !important; } }
/* Birdy's GHL form iG05Q56W5F1jlIuxBML8: measured submit bottom 700px, box bottom ~745px at 335px and 471px wide */
iframe#inline-iG05Q56W5F1jlIuxBML8{ height:752px !important; display:block; }
/* fix: the glow rules set position:relative on .g-float, which un-pinned it. Keep it floating. */
.g-float{ position:fixed !important; left:18px; bottom:18px; z-index:90; }
@media (max-width:640px){ .g-float{ left:12px; bottom:12px; } }
/* crew: smiling headshots, no name captions */
.crew-smile .crew-card img{ aspect-ratio:2/3; object-position:center top; }

/* service hero with an upright video card (blocked drains) */
.svc-hero.has-reel{ background:radial-gradient(circle at 18% 40%, rgba(92,184,64,.28), transparent 45%), linear-gradient(160deg,#08203f,#0b2a52); }
.svc-hero.has-reel .hero-bg{ display:none; }
.hero-reel{ position:absolute; left:max(32px, calc(50% - 540px)); top:50%; transform:translateY(-44%) rotate(-2deg); width:min(300px,26vw); aspect-ratio:9/16; border-radius:22px; overflow:hidden; z-index:1;
  box-shadow:0 30px 60px rgba(0,0,0,.45), 0 0 0 6px rgba(255,255,255,.08); border:3px solid var(--orange); }
.hero-reel video{ width:100%; height:100%; object-fit:cover; display:block; }
.svc-hero.has-reel .hero-inner{ position:relative; z-index:2; }
@media (max-width:1000px){
  .hero-reel{ position:relative; left:auto; top:auto; transform:rotate(-2deg); width:min(230px,58vw); margin:110px auto -40px; display:block; }
  .svc-hero.has-reel{ flex-direction:column; }
}
@media (max-width:640px){ .hero-reel{ margin:24px auto -10px; width:min(200px,55vw); } }
@media (max-width:1000px){
  .svc-hero.has-reel{ min-height:auto; align-items:stretch; }
  .svc-hero.has-reel .hero-inner{ order:1; padding-bottom:10px; }
  .svc-hero.has-reel .hero-reel{ order:2; margin:10px auto 40px; }
}
@media (max-width:640px){ .svc-hero.has-reel .hero-inner{ padding-top:30px; } .svc-hero.has-reel .hero-reel{ width:min(190px,52vw); } }

/* ---- polaroid gallery ---- */
.gal-section{ padding-top:clamp(56px,7vw,90px); overflow:hidden; }
.gal-note{ font-family:'Caveat',cursive; font-size:26px; color:#5cb840; margin-top:6px; transform:rotate(-1.5deg); display:inline-block; }
.polaroid-field{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:10px 6px; margin-top:34px; padding-bottom:20px; }
.polaroid{ margin:0; background:#fff; padding:12px 12px 52px; border-radius:3px; box-shadow:0 14px 34px rgba(11,42,82,.22); width:clamp(210px,22vw,280px); position:relative; cursor:zoom-in; transition:transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s; }
.polaroid img{ width:100%; aspect-ratio:1/1; object-fit:cover; display:block; filter:saturate(1.08) contrast(1.03); }
.polaroid figcaption{ position:absolute; left:0; right:0; bottom:10px; text-align:center; color:#0b2a52; font-family:'Caveat',cursive; font-size:25px; font-weight:700; }
.polaroid::before{ content:""; position:absolute; top:-12px; left:50%; width:92px; height:26px; margin-left:-46px; background:rgba(92,184,64,.55); box-shadow:0 2px 4px rgba(0,0,0,.08); transform:rotate(-3deg); z-index:2; }
.polaroid:nth-child(even)::before{ background:rgba(255,236,170,.75); transform:rotate(4deg); }
.polaroid:nth-child(1){ transform:rotate(-5deg) translateY(8px); }
.polaroid:nth-child(2){ transform:rotate(3.5deg) translateY(-12px); z-index:1; }
.polaroid:nth-child(3){ transform:rotate(-2.5deg) translateY(14px); }
.polaroid:nth-child(4){ transform:rotate(5deg) translateY(-6px); }
.polaroid:nth-child(5){ transform:rotate(-3.5deg) translateY(-4px); }
.polaroid:nth-child(6){ transform:rotate(2.5deg) translateY(10px); }
.polaroid:hover{ transform:rotate(0) translateY(-14px) scale(1.06); z-index:5; box-shadow:0 30px 60px rgba(11,42,82,.32); }
.gal-lb{ position:fixed; inset:0; z-index:9999; background:rgba(5,18,38,.92); display:none; align-items:center; justify-content:center; padding:24px; }
.gal-lb.open{ display:flex; opacity:1 !important; }
.gal-lb img{ max-width:min(92vw,700px); max-height:86vh; border-radius:6px; border:10px solid #fff; box-shadow:0 30px 80px rgba(0,0,0,.5); }
.gal-lb p{ position:absolute; bottom:18px; left:0; right:0; text-align:center; color:#fff; font-family:'Caveat',cursive; font-size:28px; }
.gal-lb button{ position:absolute; background:rgba(255,255,255,.12); border:0; color:#fff; width:48px; height:48px; border-radius:50%; font-size:22px; cursor:pointer; }
.gal-lb .x{ top:18px; right:18px; } .gal-lb .p{ left:18px; top:50%; } .gal-lb .n{ right:18px; top:50%; }
@media (max-width:760px){
  .polaroid-field{ flex-wrap:nowrap; justify-content:flex-start; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; padding:18px 20px 24px; gap:18px; scrollbar-width:none; }
  .polaroid-field::-webkit-scrollbar{ display:none; }
  .polaroid{ flex:0 0 66vw; width:66vw; scroll-snap-align:center; }
}
@media (prefers-reduced-motion: reduce){ .polaroid, .polaroid:hover{ transform:none; } }

/* ---- reel rail (On Time pattern) ---- */
.reel-rail-section{ overflow:hidden; }
.reel-rail{ display:flex; gap:18px; justify-content:safe center; overflow-x:auto; scrollbar-width:none; padding:34px 20px 34px; max-width:1240px; margin:0 auto; }
.reel-phone{ position:relative; margin:0; flex:0 0 200px; aspect-ratio:9/16; border-radius:26px; overflow:hidden; background:#0b2a52; border:6px solid #0b2a52; box-shadow:0 24px 50px rgba(11,42,82,.25); transition:transform .45s var(--ease), box-shadow .45s var(--ease); }
.reel-phone:nth-child(even){ transform:translateY(26px); }
.reel-phone:hover{ transform:translateY(-6px) scale(1.02); box-shadow:0 34px 70px rgba(11,42,82,.32); z-index:1; }
.reel-phone video{ width:100%; height:100%; object-fit:cover; display:block; cursor:pointer; }
.reel-phone figcaption{ position:absolute; left:10px; right:10px; bottom:10px; color:#fff; font-size:12px; font-weight:700; line-height:1.3; text-shadow:0 2px 8px rgba(0,0,0,.7); pointer-events:none; opacity:0; transition:opacity .3s; }
.reel-phone:hover figcaption{ opacity:1; }
.reel-sound{ position:absolute; top:10px; right:10px; width:34px; height:34px; border-radius:50%; border:1px solid rgba(255,255,255,.5); background:rgba(11,42,82,.55); color:#fff; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; backdrop-filter:blur(6px); }
.reel-sound .rs-on{ display:none; } .reel-phone.is-loud .reel-sound .rs-on{ display:block; } .reel-phone.is-loud .reel-sound .rs-off{ display:none; }
.reel-phone.is-loud{ outline:3px solid #5cb840; outline-offset:-3px; }
@media (max-width:760px){
  .reel-rail{ justify-content:flex-start; overflow-x:auto; scroll-snap-type:x mandatory; gap:12px; padding:26px 20px 12px; scrollbar-width:none; }
  .reel-rail::-webkit-scrollbar{ display:none; }
  .reel-phone, .reel-phone:nth-child(even){ flex:0 0 56vw; transform:none; scroll-snap-align:center; }
}
@media (prefers-reduced-motion: reduce){ .reel-phone, .reel-phone:hover{ transform:none; } }

/* crew: real photos, not cutouts */
.crew-smile .crew-card img{ aspect-ratio:4/5; object-position:center top; }
.crew-smile .crew-card{ box-shadow:0 24px 50px -20px rgba(0,0,0,.6); }