/* =========================================================
   ROARING DETAIL — Core Stylesheet
   Design system: variables -> base -> layout -> components -> sections
   Mobile-first. Breakpoints: 560 / 768 / 1020 / 1320
   ========================================================= */

/* ---------- 1. DESIGN TOKENS ---------- */
:root{
  /* colors */
  --black:        #0B0C0E;
  --black-soft:   #101216;
  --charcoal:     #191b20;
  --charcoal-lt:  #24262d;
  --line:         rgba(246,247,248,0.09);
  --line-strong:  rgba(246,247,248,0.16);
  --white:        #F6F7F8;
  --white-dim:    rgba(246,247,248,0.70);
  --white-faint:  rgba(246,247,248,0.46);
  --blue:         #C41420;
  --blue-bright:  #F51D2C;
  --blue-deep:    #4A0812;
  --blue-glow:    rgba(196,20,32,0.35);

  /* type */
  --font-display: 'Saira Condensed', 'Arial Narrow', sans-serif;
  --font-body: 'Barlow', -apple-system, BlinkMacSystemFont, sans-serif;

  /* spacing */
  --sp-1: .25rem; --sp-2: .5rem; --sp-3: .75rem; --sp-4: 1rem;
  --sp-5: 1.5rem; --sp-6: 2rem; --sp-7: 3rem; --sp-8: 4rem;
  --sp-9: 6rem; --sp-10: 8rem;

  /* radius / shape */
  --r-sm: 6px; --r-md: 12px; --r-lg: 20px; --r-full: 999px;
  --skew-btn: polygon(14px 0, 100% 0, calc(100% - 14px) 100%, 0 100%);
  --skew-tag: polygon(9px 0, 100% 0, calc(100% - 9px) 100%, 0 100%);

  /* motion */
  --ease: cubic-bezier(.22,.85,.32,1);
  --t-fast: .18s;
  --t-med: .4s;

  --container: 1240px;
  --nav-h: 76px;
}

/* ---------- 2. RESET / BASE ---------- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
[hidden]{ display:none !important; }
html{
  scroll-behavior:smooth;
  scroll-padding-top: calc(var(--nav-h) + 12px);
  -webkit-text-size-adjust:100%;
}
body{
  background:var(--black);
  color:var(--white);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.6;
  overflow-x:hidden;
  min-height:100vh;
}
img,svg,video{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
input,select,textarea{ font:inherit; color:inherit; }
ul{ list-style:none; }
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:800; line-height:1.02; letter-spacing:.01em; text-wrap:balance; }
p{ text-wrap:pretty; }

/* subtle film-grain overlay for depth on dark bg */
body::before{
  content:'';
  position:fixed; inset:0;
  pointer-events:none;
  z-index:2000;
  opacity:.035;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='90'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

:focus-visible{ outline:2px solid var(--blue-bright); outline-offset:3px; border-radius:2px; }
::selection{ background:var(--blue); color:var(--white); }

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.skip-link{
  position:absolute; left:1rem; top:-60px; z-index:3000;
  background:var(--blue); color:#fff; padding:.75rem 1.25rem; border-radius:var(--r-sm);
  transition:top var(--t-fast) var(--ease);
}
.skip-link:focus{ top:1rem; }

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-delay:0s !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
  .hero-video{ display:none; }
}

/* ---------- 3. LAYOUT ---------- */
.container{
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline: clamp(1.25rem, 5vw, 2.5rem);
}
.section{ padding-block: var(--sp-9); position:relative; }
.section--alt{ background:var(--black-soft); }
.section-head{ max-width:640px; margin-bottom: var(--sp-7); }
.section-head--center{ margin-inline:auto; text-align:center; }

.eyebrow{
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:var(--font-body); font-weight:700; font-size:.8rem;
  letter-spacing:.14em; text-transform:uppercase; color:var(--blue-bright);
  margin-bottom:var(--sp-3);
}
.eyebrow::before{
  content:''; width:20px; height:2px; background:var(--blue-bright);
}
.section-head--center .eyebrow{ justify-content:center; }
.section-head--center .eyebrow::before{ display:none; }

h2.h-lg{ font-size:clamp(2.1rem, 5.2vw, 3.4rem); }
.section-sub{ color:var(--white-dim); font-size:1.05rem; max-width:52ch; margin-top:var(--sp-4); }
.section-head--center .section-sub{ margin-inline:auto; }

/* ---------- 4. BUTTONS ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-family:var(--font-body); font-weight:700; font-size:.92rem;
  letter-spacing:.05em; text-transform:uppercase;
  padding: 1.05rem 2.1rem;
  clip-path:var(--skew-btn);
  transition: transform var(--t-fast) var(--ease), background var(--t-fast), box-shadow var(--t-fast);
  white-space:nowrap;
}
@property --race-angle{
  syntax:'<angle>'; inherits:false; initial-value:0deg;
}
.btn--primary{
  position:relative; overflow:hidden;
  border:2px solid transparent;
  background:
    linear-gradient(135deg, #ff2f3f, var(--blue-bright) 45%, var(--blue) 90%) padding-box,
    conic-gradient(from var(--race-angle),
      rgba(255,45,60,0) 0deg,
      rgba(255,45,60,0) 268deg,
      rgba(255,45,60,.5) 290deg,
      #ff2d3c 306deg,
      #fff 316deg,
      #ff2d3c 326deg,
      rgba(255,45,60,.5) 340deg,
      rgba(255,45,60,0) 360deg
    ) border-box;
  color:#fff;
  box-shadow: 0 12px 34px -6px rgba(245,29,44,.85), 0 0 0 1px rgba(245,29,44,.3);
  animation: btn-pulse 2s ease-in-out infinite, btn-race 3.6s linear infinite;
}
@keyframes btn-race{ to{ --race-angle:360deg; } }
@media (prefers-reduced-motion: reduce){
  .btn--primary{ animation:none; }
}
.btn--primary::before{
  content:''; position:absolute; top:0; left:-65%; width:35%; height:100%;
  background:linear-gradient(120deg, transparent, rgba(255,255,255,.55), transparent);
  transform:skewX(-20deg);
  transition:left .6s ease;
  pointer-events:none;
}
.btn--primary:hover::before{ left:130%; }
.btn--primary:hover{
  background:linear-gradient(135deg, #ff3b4a, var(--blue-bright) 75%);
  transform:translateY(-3px) scale(1.03);
  box-shadow:0 18px 40px -8px rgba(245,29,44,.85), 0 0 0 1px rgba(245,29,44,.4);
  animation-play-state:paused;
}
.btn--primary:active{ transform:translateY(-1px) scale(1.0); }
@keyframes btn-pulse{
  0%,100%{ transform:translateY(0) scale(1); box-shadow: 0 12px 34px -6px rgba(245,29,44,.85), 0 0 0 1px rgba(245,29,44,.3); }
  50%{ transform:translateY(-2px) scale(1.035); box-shadow: 0 16px 40px -4px rgba(245,29,44,1), 0 0 0 7px rgba(245,29,44,.16); }
}
.btn--ghost{
  background:rgba(255,255,255,.045); color:var(--white);
  box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.4);
}
.btn--ghost:hover{ background:rgba(255,255,255,.07); box-shadow: inset 0 0 0 1.5px var(--blue-bright); color:var(--blue-bright); transform:translateY(-2px); }
.btn--block{ width:100%; }
.btn--lg{ padding:1.25rem 2.6rem; font-size:1rem; }
.btn--sm{ padding:.7rem 1.4rem; font-size:.78rem; }
.btn[disabled]{ opacity:.45; cursor:not-allowed; transform:none !important; }

/* ---------- 5. LOGO MARK ---------- */
.logo-full-img{ height:34px; width:auto; display:block; }

/* ---------- 6. NAV ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  height:var(--nav-h);
  display:flex; align-items:center;
  background:rgba(11,12,14,0);
  border-bottom:1px solid transparent;
  transition: background var(--t-med) var(--ease), border-color var(--t-med) var(--ease), backdrop-filter var(--t-med);
}
.nav.is-scrolled{
  background:rgba(11,12,14,0.88);
  backdrop-filter:blur(10px);
  border-bottom-color:var(--line);
}
.nav .container{ display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.logo{ display:flex; align-items:center; gap:.6rem; font-family:var(--font-display); z-index:1100; }

.nav-links{ display:none; align-items:center; gap:var(--sp-6); }
.nav-links a{
  font-size:.92rem; font-weight:600; letter-spacing:.02em; color:var(--white-dim);
  position:relative; padding-block:.3rem;
  transition:color var(--t-fast);
}
.nav-links a::after{
  content:''; position:absolute; left:0; bottom:-2px; width:0; height:2px; background:var(--blue-bright);
  transition:width var(--t-fast) var(--ease);
}
.nav-links a:hover{ color:var(--white); }
.nav-links a:hover::after{ width:100%; }
.nav-links a.is-active{ color:var(--white); }
.nav-links a.is-active::after{ width:100%; }
.nav-cta{ display:none; }
.nav-burger{
  display:flex; flex-direction:column; justify-content:center; gap:5px;
  width:44px; height:44px; align-items:center; z-index:1100;
}
.nav-burger span{ width:24px; height:2px; background:var(--white); transition:transform var(--t-fast) var(--ease), opacity var(--t-fast); }
.nav-burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav-burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.mobile-menu{
  position:fixed; inset:0; z-index:1050;
  background:var(--black);
  display:flex; flex-direction:column;
  padding: calc(var(--nav-h) + 1rem) var(--sp-6) var(--sp-6);
  transform:translateX(100%);
  transition:transform var(--t-med) var(--ease);
}
.mobile-menu.is-open{ transform:translateX(0); }
.mobile-menu a{
  font-family:var(--font-display); font-size:2rem; font-weight:800;
  padding-block:.6rem; border-bottom:1px solid var(--line); color:var(--white);
}
.mobile-menu .btn{ margin-top:var(--sp-6); }
.mobile-menu-meta{ margin-top:auto; color:var(--white-faint); font-size:.85rem; }

@media (min-width:1020px){
  .nav-links{ display:flex; }
  .nav-cta{ display:inline-flex; }
  .nav-burger,.mobile-menu{ display:none; }
}

/* ---------- 7. HERO ---------- */
.hero{
  position:relative;
  min-height:100svh;
  display:flex; align-items:center;
  padding-top:var(--nav-h);
  overflow:hidden;
  background:
    radial-gradient(120% 90% at 85% -10%, rgba(196,20,32,.28), transparent 55%),
    radial-gradient(90% 70% at -10% 110%, rgba(74,8,18,.4), transparent 60%),
    var(--black);
}
.hero-video{
  position:absolute; inset:0; z-index:0; overflow:hidden;
}
.hero-video video{
  width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity 1.2s var(--ease);
}
.hero-video video.is-playing{ opacity:.72; }
.hero-video__overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(100deg, var(--black) 14%, rgba(11,12,14,.4) 45%, rgba(11,12,14,.5) 100%),
    linear-gradient(0deg, var(--black), transparent 35%);
}
.hero-streaks{
  position:absolute; top:0; right:0; height:100%; width:60%; z-index:1;
  display:flex; gap:clamp(1rem,3vw,2.2rem); justify-content:flex-end;
  padding-right:clamp(0px, 4vw, 4rem);
  opacity:.5;
  pointer-events:none;
}
.hero-streaks span{
  width:clamp(30px,6vw,90px);
  background:linear-gradient(180deg, rgba(245,29,44,.35), rgba(245,29,44,0));
  clip-path:polygon(45% 0,100% 0,55% 100%,0 100%);
}
.hero-streaks span:nth-child(2){ background:linear-gradient(180deg, rgba(196,20,32,.24),rgba(196,20,32,0)); margin-top:8%; }
.hero-streaks span:nth-child(3){ background:linear-gradient(180deg, rgba(74,8,18,.5),rgba(74,8,18,0)); margin-top:16%; }

.hero .container{ position:relative; z-index:2; padding-block:var(--sp-8); width:100%; }
.hero-badge{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size:.78rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--blue-bright);
  padding:.5rem 1rem; border:1px solid rgba(245,29,44,.35); border-radius:var(--r-full);
  background:rgba(196,20,32,.08);
  margin-bottom:var(--sp-5);
  opacity:0; transform:translateY(14px);
  animation: reveal-up .7s var(--ease) .1s forwards;
}
.hero h1{
  font-size:clamp(2.7rem, 9.2vw, 6.4rem);
  text-transform:uppercase;
  max-width:16ch;
  opacity:0; transform:translateY(22px);
  animation: reveal-up .8s var(--ease) .25s forwards;
}
.hero h1 em{
  font-style:normal; color:var(--blue-bright);
}
.hero-sub{
  margin-top:var(--sp-5);
  font-size:clamp(1.02rem,2vw,1.2rem);
  color:var(--white-dim);
  max-width:46ch;
  opacity:0; transform:translateY(18px);
  animation: reveal-up .8s var(--ease) .4s forwards;
}
.hero-ctas{
  display:flex; flex-wrap:wrap; gap:1rem;
  margin-top:var(--sp-7);
  opacity:0; transform:translateY(18px);
  animation: reveal-up .8s var(--ease) .55s forwards;
}
.hero-trust{
  display:flex; flex-wrap:wrap; gap: var(--sp-6);
  margin-top:var(--sp-8);
  padding-top:var(--sp-6);
  border-top:1px solid var(--line);
  opacity:0; transform:translateY(18px);
  animation: reveal-up .8s var(--ease) .7s forwards;
}
.hero-trust div{ display:flex; align-items:center; gap:.6rem; font-size:.88rem; font-weight:600; color:var(--white-dim); }
.hero-trust svg{ width:18px; height:18px; flex:none; color:var(--blue-bright); }

@keyframes reveal-up{ to{ opacity:1; transform:translateY(0); } }

.scroll-cue{
  position:absolute; bottom:clamp(1rem,4vh,2.4rem); left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:.5rem;
  color:var(--white-faint); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase;
  z-index:2;
}
.scroll-cue::after{
  content:''; width:1px; height:34px;
  background:linear-gradient(var(--blue-bright), transparent);
  animation: scroll-cue-move 1.8s ease-in-out infinite;
}
@keyframes scroll-cue-move{ 0%,100%{ transform:scaleY(.6); opacity:.5; } 50%{ transform:scaleY(1); opacity:1; } }
@media (max-height:900px){ .scroll-cue{ display:none; } }

@media (min-width:1020px){
  .hero h1{ max-width:20ch; }
}

/* ---------- 8. SCROLL REVEAL ---------- */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-visible{ opacity:1; transform:translateY(0); }
.reveal-stagger > *{ opacity:0; transform:translateY(24px); transition:opacity .6s var(--ease), transform .6s var(--ease); }
.reveal-stagger.is-visible > *{ opacity:1; transform:translateY(0); }
.reveal-stagger.is-visible > *:nth-child(1){ transition-delay:.02s; }
.reveal-stagger.is-visible > *:nth-child(2){ transition-delay:.12s; }
.reveal-stagger.is-visible > *:nth-child(3){ transition-delay:.22s; }
.reveal-stagger.is-visible > *:nth-child(4){ transition-delay:.32s; }
.reveal-stagger.is-visible > *:nth-child(5){ transition-delay:.42s; }
.reveal-stagger.is-visible > *:nth-child(6){ transition-delay:.52s; }

/* ---------- Scroll progress bar ---------- */
.scroll-progress{
  position:fixed; top:0; left:0; height:3px; width:100%; z-index:999;
  background:transparent; pointer-events:none;
}
.scroll-progress::after{
  content:''; display:block; height:100%; width:var(--scroll-pct, 0%);
  background:linear-gradient(90deg, var(--blue), var(--blue-bright));
  box-shadow:0 0 8px rgba(245,29,44,.6);
  transition:width .08s linear;
}

/* ---------- Directional reveals (used alongside .reveal) ---------- */
.reveal-left{ opacity:0; transform:translate(-40px, 12px) scale(.98); transition:opacity .75s var(--ease), transform .75s var(--ease); }
.reveal-left.is-visible{ opacity:1; transform:translate(0,0) scale(1); }
.reveal-right{ opacity:0; transform:translate(40px, 12px) scale(.98); transition:opacity .75s var(--ease), transform .75s var(--ease); }
.reveal-right.is-visible{ opacity:1; transform:translate(0,0) scale(1); }
.reveal-scale{ opacity:0; transform:scale(.9); transition:opacity .65s var(--ease), transform .65s var(--ease); }
.reveal-scale.is-visible{ opacity:1; transform:scale(1); }

/* ---------- Hero parallax layers ---------- */
.hero-video video{ transform:scale(1.18); will-change:transform; }
.hero-video, .hero-streaks, .hero .container{ will-change:transform; }

/* ---------- 9. HOW IT WORKS / CONVENIENCE ---------- */
.steps{ display:grid; gap:var(--sp-8); counter-reset:step; }
.step{ position:relative; padding-left:5.2rem; }
.step__num{
  position:absolute; left:0; top:-.4rem;
  font-family:var(--font-display); font-weight:800; font-size:3.4rem; line-height:1;
  color:transparent;
  -webkit-text-stroke:1.5px rgba(245,29,44,.55);
}
.step:not(:last-child)::before{
  content:''; position:absolute; left:1.55rem; top:3.6rem; bottom:-3rem; width:1px;
  background:linear-gradient(var(--blue-bright), transparent);
}
.step h3{ font-size:1.3rem; text-transform:uppercase; margin-bottom:.5rem; }
.step p{ color:var(--white-dim); max-width:42ch; }

@media (min-width:860px){
  .steps{ grid-template-columns:repeat(3,1fr); gap:var(--sp-6); }
  .step{ padding-left:0; padding-top:4.6rem; }
  .step__num{ left:0; top:0; font-size:4rem; }
  .step:not(:last-child)::before{ display:none; }
  .step:nth-child(2){ margin-top:2.2rem; }
  .step:not(:last-child)::after{
    content:''; position:absolute; top:1.9rem; right:-1.6rem; width:1.2rem; height:1px;
    background:var(--line-strong);
  }
}

/* ---------- 10. SERVICES / PACKAGES ---------- */
.packages{ display:grid; gap:var(--sp-6); }
.pkg-card{
  position:relative;
  background:var(--charcoal);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  padding: var(--sp-7) var(--sp-6);
  display:flex; flex-direction:column;
  transition:transform var(--t-med) var(--ease), border-color var(--t-med);
}
.pkg-card--featured{
  border-color:var(--blue-bright);
  background:linear-gradient(160deg,var(--charcoal-lt),var(--charcoal));
  box-shadow:0 0 0 1px var(--blue-bright), 0 20px 40px -20px rgba(196,20,32,.45);
}
.pkg-badge{
  position:absolute; top:0; right:var(--sp-6); transform:translateY(-50%);
  background:var(--blue); color:#fff; font-size:.72rem; font-weight:800; letter-spacing:.08em;
  text-transform:uppercase; padding:.4rem .9rem; border-radius:var(--r-full);
}
.pkg-name{ font-size:1.5rem; text-transform:uppercase; }
.pkg-tag{ color:var(--white-faint); font-size:.9rem; margin-top:.3rem; }
.pkg-price-toggle{
  display:flex; margin-top:var(--sp-5); background:rgba(255,255,255,.04);
  border:1px solid var(--line); border-radius:var(--r-full); padding:4px;
}
.pkg-price-toggle button{
  flex:1; padding:.5rem .6rem; font-size:.76rem; font-weight:700; letter-spacing:.03em;
  text-transform:uppercase; border-radius:var(--r-full); color:var(--white-dim);
  transition:background var(--t-fast), color var(--t-fast);
}
.pkg-price-toggle button[aria-pressed="true"]{ background:var(--blue); color:#fff; }
.pkg-price{
  display:flex; align-items:baseline; gap:.4rem; margin-top:var(--sp-5);
}
.pkg-price .amount{ font-family:var(--font-display); font-size:3.2rem; font-weight:800; }
.pkg-price .amount::before{ content:'$'; font-size:1.6rem; vertical-align:top; margin-right:2px; }
.pkg-price .amount::after{ content:'+'; font-size:1.6rem; vertical-align:top; margin-left:1px; }
.pkg-price .per{ color:var(--white-faint); font-size:.85rem; }
.pkg-savings{ font-size:.85rem; font-weight:700; color:var(--blue-bright); margin-top:.5rem; }
.pkg-list{ margin-top:var(--sp-6); display:grid; gap:.65rem; flex:1; }
.pkg-list li{ display:flex; align-items:flex-start; gap:.6rem; font-size:.92rem; color:var(--white-dim); }
.pkg-list svg{ flex:none; width:18px; height:18px; margin-top:2px; color:var(--blue-bright); }
.pkg-list__more{ color:var(--white-faint) !important; font-style:italic; padding-left:1.75rem; font-size:.88rem !important; }
@media (min-width:520px){ .pkg-list--cols{ grid-template-columns:1fr 1fr; column-gap:1rem; } }

.pkg-split{ margin-top:var(--sp-6); display:grid; grid-template-columns:1fr; gap:var(--sp-5); flex:1; }
@media (min-width:480px){ .pkg-split{ grid-template-columns:1fr 1fr; } }
.pkg-split__group h4{
  font-family:var(--font-display); font-size:.8rem; letter-spacing:.08em; text-transform:uppercase;
  color:var(--white-faint); padding-bottom:.5rem; margin-bottom:.6rem; border-bottom:1px solid var(--line);
}
.pkg-list--sm{ margin-top:0; gap:.5rem; }
.pkg-list--sm li{ font-size:.85rem; }
.pkg-list--sm svg{ width:16px; height:16px; }
.pkg-included{
  margin-top:var(--sp-5); font-size:.9rem; font-weight:700; color:var(--white);
  padding-top:var(--sp-5); border-top:1px solid var(--line);
}
.pkg-card .btn{ margin-top:var(--sp-7); }

@media (min-width:700px){ .packages{ grid-template-columns:1fr 1fr; } .pkg-card--featured{ grid-column:1 / -1; } }
@media (min-width:960px){ .packages{ grid-template-columns:repeat(3,1fr); } .pkg-card--featured{ grid-column:auto; } }

/* ---------- 12. BEFORE / AFTER SPLIT VIEW ---------- */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:3px; border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); }
.split__pane{
  position:relative; aspect-ratio:3/4;
  background:
    radial-gradient(120% 100% at 20% 0%, rgba(70,74,82,.9), transparent 60%),
    linear-gradient(150deg,#2b2d33,#111318 70%);
}
.split__pane--after{
  background:
    radial-gradient(120% 100% at 80% 0%, rgba(76,140,255,.35), transparent 55%),
    linear-gradient(150deg,#1c2230,#0b0c0e 70%);
}
.split__pane img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.split__label{
  position:absolute; top:.75rem; left:.75rem;
  padding:.35rem .8rem; font-size:.7rem; font-weight:800; letter-spacing:.1em;
  background:rgba(11,12,14,.55); backdrop-filter:blur(4px); border-radius:var(--r-full);
  text-transform:uppercase;
}
.split__pane--after .split__label{ left:auto; right:.75rem; color:var(--blue-bright); }

.results-grid{ display:grid; gap:1.75rem; margin-top:var(--sp-2); }
.compare-card__tag{
  display:block; margin-bottom:.6rem; font-size:.72rem; font-weight:800;
  letter-spacing:.1em; text-transform:uppercase; color:var(--white-faint);
}
@media (min-width:700px){ .results-grid{ grid-template-columns:1fr 1fr; gap:2.25rem; } }

/* ---------- 13. REVIEWS ---------- */
.reviews-placeholder{
  max-width:560px; margin:0 auto; text-align:center; display:flex; flex-direction:column; align-items:center; gap:1rem;
  padding:var(--sp-6) var(--sp-5); border:1.5px dashed var(--line-strong); border-radius:var(--r-md);
  color:var(--white-faint);
}
.reviews-placeholder svg{ color:var(--blue-bright); }
.reviews-placeholder p{ font-size:.98rem; line-height:1.6; }

.insta-placeholder{
  max-width:560px; margin:0 auto; text-align:center; display:flex; flex-direction:column; align-items:center; gap:1rem;
  padding:var(--sp-6) var(--sp-5); border:1.5px dashed var(--line-strong); border-radius:var(--r-md);
  color:var(--white-faint);
}
.insta-placeholder svg{ color:var(--blue-bright); }
.insta-placeholder p{ font-size:.98rem; line-height:1.6; }
.insta-grid{ display:grid; gap:var(--sp-5); grid-template-columns:1fr; justify-items:center; }
@media (min-width:700px){ .insta-grid{ grid-template-columns:repeat(3, 1fr); } }
.insta-grid .instagram-media{ margin:0 auto !important; }
.insta-follow{ text-align:center; margin-top:var(--sp-6); }

/* ---------- 14. PET HAIR ---------- */
.pethair{
  display:grid; gap:var(--sp-7); align-items:center;
  background:linear-gradient(150deg, var(--charcoal), var(--black-soft));
  border:1px solid var(--line); border-radius:var(--r-lg);
  padding: var(--sp-7) var(--sp-6);
  position:relative; overflow:hidden;
}
.pethair::after{
  content:''; position:absolute; width:340px; height:340px; border-radius:50%;
  background:radial-gradient(circle, rgba(196,20,32,.25), transparent 70%);
  right:-120px; top:-120px; pointer-events:none;
}
.pethair-icon{
  width:64px; height:64px; border-radius:var(--r-md);
  background:rgba(245,29,44,.1); border:1px solid rgba(245,29,44,.3);
  display:flex; align-items:center; justify-content:center; margin-bottom:var(--sp-5);
}
.pethair-icon svg{ width:32px; height:32px; color:var(--blue-bright); }
.pethair h2{ font-size:clamp(1.9rem,4.4vw,2.6rem); text-transform:uppercase; max-width:16ch; }
.pethair p{ color:var(--white-dim); margin-top:var(--sp-4); max-width:52ch; }
.pethair-note{
  margin-top:var(--sp-5); display:flex; gap:.7rem; align-items:flex-start;
  font-size:.85rem; color:var(--white-faint); border-top:1px solid var(--line); padding-top:var(--sp-5);
}
.pethair-note svg{ width:16px; height:16px; flex:none; margin-top:2px; color:var(--blue-bright); }

@media (min-width:900px){ .pethair{ grid-template-columns:1fr auto; padding:var(--sp-8); } }

/* ---------- 15. SERVICE AREA ---------- */
.area-wrap{ display:grid; gap:var(--sp-8); align-items:center; }
.area-map{
  border-radius:var(--r-md); overflow:hidden; border:1px solid var(--line-strong);
  filter:grayscale(.15) contrast(1.05);
}
.area-map iframe{ display:block; }
.area-cities{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:var(--sp-6); }
.area-inquire{ margin-top:var(--sp-6); }
.area-city{
  font-size:.85rem; font-weight:600; padding:.55rem 1rem;
  border:1px solid var(--line-strong); border-radius:var(--r-full); color:var(--white-dim);
}
.area-counties{ display:flex; gap:1rem; flex-wrap:wrap; margin-top:var(--sp-4); }
.area-county{
  font-family:var(--font-display); font-size:1.4rem; text-transform:uppercase;
  padding:.3rem .9rem; border-left:2px solid var(--blue-bright);
}
@media (min-width:900px){ .area-wrap{ grid-template-columns:.85fr 1fr; } }

/* ---------- 16. WHY US ---------- */

/* ---------- 17. ABOUT ---------- */
.about-wrap{ display:grid; gap:var(--sp-7); align-items:center; }
.about-copy h2{ font-size:clamp(2rem,4.6vw,2.9rem); text-transform:uppercase; max-width:14ch; }
.about-copy p{ color:var(--white-dim); margin-top:var(--sp-5); max-width:56ch; font-size:1.02rem; }
.about-pills{ display:flex; flex-wrap:wrap; gap:.7rem; margin-top:var(--sp-6); }
.about-pill{
  font-family:var(--font-display); font-size:1.05rem; text-transform:uppercase;
  padding:.6rem 1.2rem; background:var(--charcoal); border:1px solid var(--line); border-radius:var(--r-full);
}
.about-visual{
  position:relative; border-radius:var(--r-lg); overflow:hidden;
  background:linear-gradient(150deg,var(--charcoal-lt),var(--black) 75%);
  border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  padding:var(--sp-8) var(--sp-6);
  min-height:260px;
}
.about-visual::before{
  content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:70%; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle, rgba(196,20,32,.32), transparent 72%);
}
.about-visual__img{
  position:relative; width:100%; max-width:420px; height:auto;
  filter:drop-shadow(0 20px 35px rgba(0,0,0,.5));
}
@media (min-width:960px){ .about-wrap{ grid-template-columns:1.1fr .9fr; } }

/* ---------- 18. FAQ ---------- */
.faq-list{ display:grid; gap:.8rem; max-width:800px; }
.faq-item{ border:1px solid var(--line); border-radius:var(--r-md); background:var(--black-soft); overflow:hidden; }
.faq-q{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:1.25rem 1.4rem; text-align:left; font-weight:700; font-size:1rem;
}
.faq-q svg{ flex:none; width:20px; height:20px; color:var(--blue-bright); transition:transform var(--t-fast) var(--ease); }
.faq-item[data-open="true"] .faq-q svg{ transform:rotate(45deg); }
.faq-a{
  display:grid; grid-template-rows:0fr; transition:grid-template-rows var(--t-med) var(--ease);
}
.faq-item[data-open="true"] .faq-a{ grid-template-rows:1fr; }
.faq-a-inner{ overflow:hidden; }
.faq-a p{ padding:0 1.4rem 1.25rem; color:var(--white-dim); font-size:.95rem; max-width:64ch; }

/* ---------- 19. FINAL CTA ---------- */
.final-cta{
  position:relative; overflow:hidden; text-align:center;
  background:
    radial-gradient(80% 120% at 50% 100%, rgba(196,20,32,.35), transparent 60%),
    var(--black-soft);
  padding-block:var(--sp-10);
  border-top:1px solid var(--line);
}
.final-cta h2{ font-size:clamp(2.2rem,7vw,4rem); text-transform:uppercase; max-width:20ch; margin-inline:auto; }
.final-cta p{ color:var(--white-dim); margin:var(--sp-4) auto 0; max-width:48ch; font-size:1.05rem; }
.final-cta .btn{ margin-top:var(--sp-7); }
.final-cta .container{ position:relative; z-index:1; }
.final-cta__mark{
  position:absolute; top:50%; right:-8%; transform:translateY(-50%);
  width:clamp(280px,42vw,560px); height:auto; opacity:.08; z-index:0; pointer-events:none;
}

/* ---------- 20. FOOTER ---------- */
.site-footer{ padding-block:var(--sp-8) var(--sp-6); border-top:1px solid var(--line); }
.footer-top{ display:grid; gap:var(--sp-7); padding-bottom:var(--sp-7); }
.footer-brand .logo{ margin-bottom:var(--sp-4); }
.footer-brand p{ color:var(--white-faint); font-size:.9rem; max-width:34ch; }
.footer-cols{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-6); }
.footer-col h4{ font-family:var(--font-body); font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:var(--white-faint); margin-bottom:var(--sp-3); }
.footer-col a,.footer-col li{ display:block; color:var(--white-dim); font-size:.92rem; padding-block:.35rem; }
.footer-col a:hover{ color:var(--blue-bright); }
.footer-social{ display:flex; gap:.7rem; margin-top:var(--sp-3); }
.footer-social a{
  width:38px; height:38px; border:1px solid var(--line-strong); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
}
.footer-social svg{ width:17px; height:17px; }
.footer-contact-line{ display:flex; flex-wrap:wrap; gap:1.4rem; margin-top:1.1rem; }
.footer-contact-line a{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size:.88rem; color:var(--white-dim); font-weight:500;
  transition:color var(--t-fast);
}
.footer-contact-line a:hover{ color:var(--blue-bright); }
.footer-contact-line svg{ flex:none; opacity:.7; }
.footer-bottom{
  padding-top:var(--sp-6); border-top:1px solid var(--line);
  display:flex; flex-direction:column; gap:.6rem;
  font-size:.8rem; color:var(--white-faint);
}
@media (min-width:760px){
  .footer-top{ grid-template-columns:1.3fr 1fr; }
  .footer-cols{ grid-template-columns:repeat(3,1fr); }
  .footer-bottom{ flex-direction:row; justify-content:space-between; }
}

/* ---------- 21. STICKY MOBILE CTA ---------- */
.mobile-cta-bar{
  position:fixed; left:0; right:0; bottom:0; z-index:900;
  padding: .7rem var(--sp-4);
  padding-bottom: calc(.7rem + env(safe-area-inset-bottom));
  background:rgba(11,12,14,.9); backdrop-filter:blur(10px);
  border-top:1px solid var(--line);
  transform:translateY(110%);
  transition:transform var(--t-med) var(--ease);
}
.mobile-cta-bar.is-visible{ transform:translateY(0); }
.mobile-cta-bar .btn{ width:100%; }
@media (min-width:1020px){ .mobile-cta-bar{ display:none; } }

/* ---------- 22. MISC UTIL ---------- */

@media (min-width:1020px){ body{ font-size:16.5px; } }

/* ---------- 23. BOOKING PAGE ---------- */
.booking-header{ padding-block:1.3rem; border-bottom:1px solid var(--line); }
.booking-header .container{ display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.booking-back{ font-size:.85rem; font-weight:600; color:var(--white-dim); display:flex; align-items:center; gap:.4rem; transition:color var(--t-fast); }
.booking-back:hover{ color:var(--blue-bright); }

.booking-main{ padding-block:calc(var(--sp-8) + 60px) var(--sp-9); min-height:70vh; }
.booking-container{ max-width:720px; }

.booking-progress{ margin-bottom:var(--sp-8); }
.booking-progress__bar{ height:4px; background:var(--line); border-radius:var(--r-full); overflow:hidden; margin-bottom:var(--sp-4); }
.booking-progress__bar span{ display:block; height:100%; background:var(--blue); width:16.6%; transition:width var(--t-med) var(--ease); }
.booking-progress__current{ font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--blue-bright); }
.booking-progress__steps{ display:none; justify-content:space-between; gap:.25rem; }
@media (min-width:560px){
  .booking-progress__current{ display:none; }
  .booking-progress__steps{ display:flex; }
}
.booking-progress__steps li{ font-size:.64rem; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--white-faint); flex:1; text-align:center; transition:color var(--t-fast); }
.booking-progress__steps li:first-child{ text-align:left; }
.booking-progress__steps li:last-child{ text-align:right; }
.booking-progress__steps li.is-active,.booking-progress__steps li.is-done{ color:var(--blue-bright); }
.b-welcome-back{ display:flex; align-items:center; justify-content:space-between; gap:1rem; background:rgba(245,29,44,.08); border:1px solid rgba(245,29,44,.25); border-radius:var(--r-sm); padding:.85rem 1.1rem; margin-bottom:var(--sp-6); font-size:.88rem; color:var(--white-dim); }
.b-welcome-back button{ background:none; border:none; color:var(--blue-bright); font-weight:700; font-size:.82rem; cursor:pointer; text-decoration:underline; white-space:nowrap; }
.b-step__divider{ height:1px; background:var(--line); margin-block:var(--sp-8); }
.b-step__subhead{ font-family:var(--font-display); font-size:1.3rem; text-transform:uppercase; letter-spacing:.03em; margin-bottom:var(--sp-2); }

.b-step h2{ font-size:clamp(1.6rem,4vw,2.1rem); text-transform:uppercase; }
.b-step__sub{ color:var(--white-dim); margin-top:.5rem; margin-bottom:var(--sp-6); font-size:.95rem; }

.b-options{ display:grid; gap:1rem; }
.b-option{ display:block; cursor:pointer; }
.b-option input{ position:absolute; opacity:0; width:1px; height:1px; }
.b-option__card{
  position:relative; display:flex; flex-direction:column; gap:.4rem;
  padding:var(--sp-5) var(--sp-6); border:1.5px solid var(--line-strong); border-radius:var(--r-md);
  background:var(--charcoal); transition:border-color var(--t-fast), background var(--t-fast);
}
.b-option input:checked + .b-option__card{ border-color:var(--blue-bright); background:linear-gradient(160deg,var(--charcoal-lt),var(--charcoal)); box-shadow:0 0 0 1px var(--blue-bright), 0 12px 28px -14px rgba(196,20,32,.5); }
.b-option input:focus-visible + .b-option__card{ outline:2px solid var(--blue-bright); outline-offset:2px; }
.b-option__name{ font-family:var(--font-display); font-size:1.3rem; text-transform:uppercase; }
.b-option__desc{ font-size:.85rem; color:var(--white-faint); }
.b-option__price{ font-weight:700; color:var(--blue-bright); font-size:.95rem; margin-top:.2rem; }

.b-field{ margin-bottom:var(--sp-5); }
.b-field label{ display:block; font-size:.85rem; font-weight:700; margin-bottom:.5rem; }
.b-field__optional{ font-weight:400; color:var(--white-faint); }
.b-field__hint{ font-size:.82rem; color:var(--white-faint); margin-top:.5rem; }
.b-field--autocomplete{ position:relative; }
.b-address-suggestions{
  position:absolute; top:100%; left:0; right:0; z-index:20; margin-top:.4rem;
  background:var(--charcoal-lt); border:1px solid var(--line-strong); border-radius:var(--r-sm);
  overflow:hidden; box-shadow:0 16px 32px -12px rgba(0,0,0,.6);
}
.b-address-suggestions li{
  padding:.7rem 1rem; font-size:.9rem; color:var(--white-dim); cursor:pointer;
  border-bottom:1px solid var(--line);
}
.b-address-suggestions li:last-child{ border-bottom:0; }
.b-address-suggestions li:hover,.b-address-suggestions li.is-active{ background:rgba(196,20,32,.12); color:var(--white); }
.b-field input[type="text"],.b-field input[type="tel"],.b-field input[type="email"],.b-field input[type="date"],.b-field select,.b-field textarea{
  width:100%; padding:.85rem 1rem; background:var(--charcoal); border:1.5px solid var(--line-strong); border-radius:var(--r-sm);
  color:var(--white); font-size:.98rem; transition:border-color var(--t-fast);
}
.b-field input:focus,.b-field select:focus,.b-field textarea:focus{ border-color:var(--blue-bright); outline:none; }
.b-field textarea{ resize:vertical; min-height:90px; font-family:inherit; }
.b-field select{
  appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%238a8d94' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 1rem center; padding-right:2.6rem; cursor:pointer;
}
.b-field select:invalid{ color:var(--white-faint); }
.b-field select option{ background:var(--charcoal); color:var(--white); }

.b-calendar{ border:1.5px solid var(--line-strong); border-radius:var(--r-sm); overflow:hidden; margin-bottom:var(--sp-5); background:var(--white); }
.b-calendar iframe{ display:block; width:100%; height:600px; border:0; }
@media (max-width:560px){ .b-calendar iframe{ height:760px; } }
.b-calendar-fallback{
  display:flex; align-items:flex-start; gap:.7rem; padding:1rem 1.1rem; margin-bottom:var(--sp-5);
  background:var(--black-soft); border:1px solid var(--line); border-radius:var(--r-sm);
  color:var(--white-faint); font-size:.9rem; line-height:1.5;
}
.b-calendar-fallback svg{ flex-shrink:0; margin-top:.1rem; color:var(--blue-bright); }
.b-row{ display:grid; gap:var(--sp-4); grid-template-columns:1fr; }
@media (min-width:560px){ .b-row{ grid-template-columns:1fr 1fr; } .b-row--3{ grid-template-columns:1fr 1fr 1fr; } }

.b-checkbox{ display:flex; align-items:center; gap:.7rem; cursor:pointer; font-weight:600; }
.b-checkbox input{ width:20px; height:20px; accent-color:var(--blue); }
.b-checkbox--calendar{ gap:.9rem; }
.b-checkbox--calendar input{ width:28px; height:28px; flex:none; }
.b-checkbox--calendar span{ font-size:.95rem; font-weight:800; text-transform:uppercase; letter-spacing:.03em; line-height:1.35; }

.b-summary{ background:var(--black-soft); border:1px solid var(--line); border-radius:var(--r-md); padding:var(--sp-5) var(--sp-6); display:grid; gap:.65rem; margin-bottom:var(--sp-5); }
.b-summary-row{ display:flex; justify-content:space-between; gap:1rem; font-size:.92rem; border-bottom:1px solid var(--line); padding-bottom:.65rem; }
.b-summary-row:last-child{ border-bottom:0; padding-bottom:0; }
.b-summary-row dt{ color:var(--white-faint); }
.b-summary-row dd{ font-weight:600; text-align:right; }
.b-summary-total{ display:flex; justify-content:space-between; align-items:baseline; padding-top:.4rem; }
.b-summary-total dt{ font-family:var(--font-display); font-size:1.1rem; text-transform:uppercase; color:var(--white); }
.b-summary-total dd{ font-family:var(--font-display); font-size:1.8rem; color:var(--blue-bright); }

.b-disclaimer{ display:flex; gap:.6rem; align-items:flex-start; font-size:.85rem; color:var(--white-faint); background:rgba(196,20,32,.06); border:1px solid rgba(245,29,44,.2); border-radius:var(--r-md); padding:var(--sp-4); }
.b-disclaimer + .b-disclaimer{ margin-top:.75rem; }
.b-disclaimer--warn{ background:rgba(245,29,44,.1); border-color:rgba(245,29,44,.4); color:var(--white-dim); }
.b-disclaimer--warn strong{ color:var(--white); }
.b-disclaimer svg{ width:18px; height:18px; flex:none; margin-top:1px; color:var(--blue-bright); }

.b-terms{ margin-top:.75rem; background:var(--black-soft); border:1px solid var(--line); border-radius:var(--r-md); padding:var(--sp-5) var(--sp-6); }
.b-terms__title{ font-family:var(--font-display); font-size:1rem; text-transform:uppercase; letter-spacing:.02em; color:var(--white); margin:0 0 .75rem; }
.b-terms__list{ margin:0 0 var(--sp-4); padding-left:1.1rem; display:grid; gap:.5rem; font-size:.88rem; color:var(--white-dim); }
.b-terms__list li{ padding-left:.2rem; }
.b-terms__agree{ margin:0; font-size:.85rem; font-weight:600; color:var(--white-dim); }

.b-expect{ background:var(--black-soft); border:1px solid var(--line); border-radius:var(--r-md); padding:var(--sp-5) var(--sp-6); margin-bottom:var(--sp-5); }
.b-expect__title{ font-family:var(--font-display); font-size:1rem; text-transform:uppercase; letter-spacing:.02em; color:var(--white); margin:0 0 var(--sp-4); }
.b-expect__list{ list-style:none; margin:0; padding:0; display:grid; gap:var(--sp-4); }
.b-expect__list li{ display:flex; gap:.9rem; align-items:flex-start; font-size:.88rem; color:var(--white-dim); }
.b-expect__list strong{ color:var(--white); }
.b-expect__num{
  flex:none; width:26px; height:26px; border-radius:50%; background:var(--blue);
  color:#fff; font-family:var(--font-display); font-size:.85rem;
  display:flex; align-items:center; justify-content:center; margin-top:1px;
}

.b-nav{ display:flex; justify-content:space-between; gap:1rem; margin-top:var(--sp-7); }
.b-nav .btn{ flex:1; }

.b-complete{ text-align:center; padding-block:var(--sp-7) 0; }
.b-complete__icon{ width:64px; height:64px; border-radius:50%; background:rgba(196,20,32,.12); border:1.5px solid var(--blue-bright); display:flex; align-items:center; justify-content:center; margin:0 auto var(--sp-5); }
.b-complete__icon svg{ width:30px; height:30px; color:var(--blue-bright); }
.b-complete h2{ font-size:clamp(1.6rem,4vw,2.2rem); text-transform:uppercase; }
.b-complete > p{ color:var(--white-dim); max-width:52ch; margin:var(--sp-4) auto var(--sp-6); }
.b-complete .b-summary{ text-align:left; max-width:480px; margin-inline:auto; }
.b-complete .btn{ margin-top:var(--sp-6); }

.b-sticky-summary{
  position:fixed; left:0; right:0; top:0; z-index:800;
  display:flex; justify-content:space-between; align-items:center; gap:1rem;
  padding:.85rem var(--sp-4); padding-top:calc(.85rem + env(safe-area-inset-top));
  background:rgba(11,12,14,.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--line);
  transform:translateY(-100%); transition:transform var(--t-med) var(--ease);
  font-size:.85rem;
}
.b-sticky-summary.is-visible{ transform:translateY(0); }
.b-sticky-summary strong{ font-family:var(--font-display); font-size:1.3rem; color:var(--blue-bright); }

/* ---------- 24. PRELOADER ---------- */
#preloader{
  position:fixed; inset:0; z-index:9999; background:var(--black);
  display:flex; align-items:center; justify-content:center;
  transition:opacity .5s ease, visibility .5s ease;
}
#preloader.is-hidden{ opacity:0; visibility:hidden; pointer-events:none; }
.preloader__scene{ display:flex; flex-direction:column; align-items:center; gap:1.4rem; }
.preloader__logo2{
  width:210px; height:auto; opacity:0; transform:scale(.94);
  animation:logo-fade .8s ease forwards;
}
@keyframes logo-fade{ to{ opacity:1; transform:scale(1); } }
.preloader__bar{ width:160px; height:4px; background:rgba(255,255,255,.12); border-radius:99px; overflow:hidden; }
.preloader__bar-fill{
  display:block; height:100%; width:0%; background:var(--blue); border-radius:99px;
  animation:bar-fill 1.6s ease forwards;
}
@keyframes bar-fill{ 0%{ width:0%; } 70%{ width:88%; } 100%{ width:100%; } }
@media (prefers-reduced-motion: reduce){
  .preloader__logo2{ animation:none; opacity:1; transform:none; }
  .preloader__bar-fill{ animation:none; width:100%; }
}

/* ---------- 25. CUSTOM CURSOR (desktop / fine pointer only) ---------- */
.cursor-dot,.cursor-ring{ display:none; }
@media (pointer: fine){
  .cursor-dot,.cursor-ring{
    display:block; position:fixed; top:0; left:0; pointer-events:none; z-index:10000;
    border-radius:50%; opacity:0; transition:opacity .25s;
  }
  .cursor-dot{ width:6px; height:6px; background:var(--blue-bright); }
  .cursor-ring{
    width:34px; height:34px; margin:-17px 0 0 -17px;
    border:1.5px solid rgba(246,247,248,.45);
    transition:opacity .25s, width .2s var(--ease), height .2s var(--ease), margin .2s var(--ease), border-color .2s, background .2s;
  }
  .cursor-dot{ margin:-3px 0 0 -3px; }
  .cursor-dot.is-visible,.cursor-ring.is-visible{ opacity:1; }
  .cursor-ring.is-hover{
    width:52px; height:52px; margin:-26px 0 0 -26px;
    border-color:var(--blue-bright); background:rgba(196,20,32,.12);
  }
  body.has-custom-cursor, body.has-custom-cursor a, body.has-custom-cursor button,
  body.has-custom-cursor select, body.has-custom-cursor label{ cursor:none; }
}

/* ---------- 26. MICRO-INTERACTIONS ---------- */
.pkg-card,.compare-card,.b-option__card{
  transition:transform .25s var(--ease), box-shadow .25s var(--ease);
}
.compare-card:hover,.b-option__card:hover,.pkg-card:hover{ transform:translateY(-4px); }
.btn{ transition: transform var(--t-fast) var(--ease), background var(--t-fast), box-shadow var(--t-fast); }
.btn:active{ transform:scale(.96); }
@media (prefers-reduced-motion: reduce){
  .pkg-card,.compare-card,.b-option__card,.btn{ transition:none !important; }
}

/* ---------- 27. CONFETTI ---------- */
@keyframes confetti-fall{
  to{ transform:translateY(115vh) translateX(var(--drift)) rotate(var(--rot)); opacity:0; }
}