/* ============================================================
   PLACEHOLDER NOTE
   Text, logo, avatar photos and the video are placeholders.
   Swap them for your own in the HTML below (search for "SWAP").
   ============================================================ */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:100%;-webkit-text-size-adjust:100%}
html,body{background:#000}
body{
  font-family:"Inter Tight",sans-serif;
  color:#fff;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
a{text-decoration:none;color:inherit}
p{margin:0}

/* ---------- animated gradient angle for the CTA hover ---------- */
@property --btn-angle{syntax:"<angle>";inherits:false;initial-value:90deg}

/* =========================== HEADER =========================== */
.nav-wrap{
  position:fixed;top:20px;left:50%;transform:translateX(-50%);
  width:1240px;z-index:8;
}
.nav{
  position:relative;display:flex;align-items:center;justify-content:space-between;
  width:100%;padding:8px 11.6px 8px 18px;border-radius:16px;   /* right gap = gap above/below the button */
}
/* the glass lives on a background layer, so the dropdown (a child) can run its own backdrop blur over the page */
.nav::before{
  content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;
  background:rgba(255,255,255,.06);
  -webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);
  box-shadow:rgba(255,255,255,.1) 0 0 40px 0 inset;
}
.nav::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  border:1px solid rgba(255,255,255,.09);
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;flex:1 0 0;width:1px;min-height:49.6px}   /* keeps the bar at its original height */

.logo{display:flex;align-items:center;gap:10px;flex:none}
.logo-img{height:42px;width:auto;display:block;flex:none}   /* header logo height (tweak here) */

.menu{display:flex;align-items:center;justify-content:center;gap:10px}
.menu > a,.has-menu > a{
  position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:5px 10px;overflow:hidden;cursor:pointer;
  font-size:17px;font-weight:500;line-height:20.4px;letter-spacing:.2px;
  color:rgba(255,255,255,.8);white-space:pre;
}
.menu > a span,.has-menu > a span{display:flex;align-items:center;transition:transform .38s cubic-bezier(.2,.75,.2,1)}
.menu > a span:nth-child(2),.has-menu > a span:nth-child(2){position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(4px)}
.menu > a:hover span:nth-child(1),.has-menu:hover > a span:nth-child(1){transform:translateY(calc(-100% - 4px))}
.menu > a:hover span:nth-child(2),.has-menu:hover > a span:nth-child(2){transform:translateX(-50%) translateY(-100%)}

/* Services dropdown */
.has-menu{position:relative}
.chev{display:inline-block;width:7px;height:7px;margin-left:7px;margin-top:-3px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(45deg);opacity:.8}
/* Fade rule for glass panels: nothing that FADES may contain the blur. While an ancestor sits below 100% opacity the blur
   can only see that ancestor, not the page, and it "pops" when the fade finishes. So the panel itself never fades: its
   blur ramps 0 → 25px, its tint/edge fade on a pseudo-element, and the links fade as children. Hidden state = clip-path. */
.dropdown{
  position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(6px);padding-top:28px;z-index:9;   /* panel clears the bottom of the header bar; the padding keeps the hover alive on the way down */
  visibility:hidden;pointer-events:none;   /* visibility (unlike opacity/clip-path/filter) does not wall off the blur */
  transition:transform .25s ease,visibility 0s linear .25s;   /* hides only after the fade-out finishes */
}
.has-menu:hover .dropdown,.has-menu:focus-within .dropdown{visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0);transition:transform .25s ease,visibility 0s}
.dropdown-panel{
  position:relative;display:flex;flex-direction:column;min-width:200px;padding:8px;border-radius:12px;
  -webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px);
  transition:backdrop-filter .25s ease,-webkit-backdrop-filter .25s ease;
}
.has-menu:hover .dropdown-panel,.has-menu:focus-within .dropdown-panel{-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px)}   /* exact same glass as the header bar */
.dropdown-panel::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .25s ease;
  background:rgba(255,255,255,.06);box-shadow:rgba(255,255,255,.1) 0 0 40px 0 inset;border:1px solid rgba(255,255,255,.16)}   /* a touch brighter than the header edge so it reads the same on the smaller panel */
.has-menu:hover .dropdown-panel::before,.has-menu:focus-within .dropdown-panel::before{opacity:1}
.dropdown-panel a{
  position:relative;display:block;padding:10px 14px;border-radius:8px;white-space:pre;opacity:0;text-align:center;
  font-size:16px;font-weight:500;line-height:20px;letter-spacing:.2px;color:rgba(255,255,255,.8);
  transition:background .2s ease,color .2s ease,opacity .25s ease;
}
.has-menu:hover .dropdown-panel a,.has-menu:focus-within .dropdown-panel a{opacity:1}
.dropdown-panel a:hover{background:rgba(255,255,255,.1);color:#fff}

.btn-nav{
  position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:6px;padding:11px 18px;border-radius:8px;overflow:hidden;cursor:pointer;flex:none;   /* ~42px tall, matches the logo */
  background:linear-gradient(90deg,#ffd400 0%,#e0b800 100%);
  box-shadow:rgba(255,255,255,.5) 0 2px 5px 0 inset,#fff0a0 0 -3px 10px 0 inset;
  font-size:17px;font-weight:500;line-height:20.4px;letter-spacing:.2px;color:#111;white-space:pre;   /* same type as the menu links */
}
.btn-nav .swap{position:relative;display:flex;flex-direction:column;align-items:center;overflow:hidden}
.btn-nav .swap span{display:block;transition:transform .38s cubic-bezier(.2,.75,.2,1)}
.btn-nav .swap span:nth-child(2){position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(8px)}
.btn-nav:hover .swap span:nth-child(1){transform:translateY(calc(-100% - 8px))}
.btn-nav:hover .swap span:nth-child(2){transform:translateX(-50%) translateY(-100%)}

/* ============================ HERO ============================ */
.hero{
  position:relative;z-index:1;overflow:hidden;
  display:flex;flex-direction:column;align-items:center;
  width:100%;padding:170px 0 100px;
  background:linear-gradient(#0e0e0e 0%,#000 100%);
}
.stars{
  position:absolute;top:0;left:calc(50% - 600px);width:1200px;height:28%;
  z-index:0;pointer-events:none;overflow:hidden;
}
.stars canvas{position:absolute;inset:0;width:100%;height:100%}

.hero-content{
  position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;
  width:100%;padding:0 16px;gap:70px;
}
.hero-top{
  position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;
  width:100%;max-width:840px;gap:40px;
}
.hero-title-group{display:flex;flex-direction:column;align-items:center;width:100%;gap:24px}
.hero-caption-title{display:flex;flex-direction:column;align-items:center;width:100%;gap:24px}

/* badge */
.badge{
  position:relative;display:flex;align-items:center;justify-content:center;gap:8px;
  padding:8px 17px 8px 10px;border-radius:30px;
  background:rgba(255,255,255,.06);   /* same glass as the header bar */
  -webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);
  box-shadow:rgba(255,255,255,.1) 0 0 40px 0 inset;
}
.badge::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:1px solid rgba(255,255,255,.09)}
.avatars{position:relative;display:flex;align-items:center;height:32px;width:124px;flex:none}
.avatar{
  position:absolute;top:0;width:32px;height:32px;border-radius:90px;overflow:hidden;
  box-shadow:#242424 0 0 0 1.4px;z-index:1;
  display:grid;place-items:center;font-size:12px;font-weight:600;color:#fff;
}
.avatar:nth-child(1){left:0;background:linear-gradient(135deg,#ffd400,#8a7200)}
.avatar:nth-child(2){left:23px;background:linear-gradient(135deg,#ffb700,#7a5200)}
.avatar:nth-child(3){left:46px;background:linear-gradient(135deg,#ffe670,#9c8a00)}
.avatar:nth-child(4){left:69px;background:linear-gradient(135deg,#f5c400,#6b5300)}
.avatar:nth-child(5){left:92px;background:linear-gradient(135deg,#ffdc3d,#8f7300)}
.avatar:nth-child(5) img,.avatar img{width:100%;height:100%;object-fit:cover;display:block;background:#fff}
.badge-text{display:flex;align-items:center;gap:5px;border-radius:52px}
.badge-icon{width:20px;height:20px;display:grid;place-items:center;font-size:16px;line-height:1}
.badge-text p{
  font-size:17px;font-weight:400;line-height:18px;letter-spacing:.2px;color:#efefef;text-align:center;
}

/* headline */
.h1-wrap{position:relative;width:1160px;max-width:none;white-space:pre-wrap;word-break:break-word}
h1,.final-title{
  font-family:"Inter Tight",sans-serif;font-weight:600;
  font-size:80px;line-height:88px;letter-spacing:-.03em;
  color:rgba(255,255,255,.94);text-align:center;
}
h1 em,.final-title em{
  font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:600;
  font-size:100px;color:#ffd400;white-space:nowrap;
}
.desc-wrap{width:100%;max-width:760px}
.desc{
  font-size:20px;font-weight:400;line-height:31px;letter-spacing:.03em;
  color:#ededed;text-align:center;
}

/* CTA */
.cta-group{display:flex;flex-direction:column;align-items:center;width:100%;gap:24px}
.btn-cta{
  position:relative;display:flex;align-items:center;justify-content:center;gap:10px;
  padding:3px;border-radius:18px;overflow:hidden;cursor:pointer;
  background:linear-gradient(#ffe97a 20%,#ffd400 53.1374%,#e0b800 100%);
  --lx:7.07%;--ly:30%;--la:310deg;
}
.btn-cta .border-light{
  position:absolute;top:0;bottom:0;left:-1.68px;right:-1.59px;z-index:1;pointer-events:none;
  background:conic-gradient(from var(--la) at var(--lx) var(--ly),transparent 268deg,#fff 320deg,transparent 370deg);
}
.btn-cta .btn-inner{
  position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:8px;
  padding:16px 20px 16px 23px;border-radius:16px;overflow:hidden;
  background:linear-gradient(var(--btn-angle),#ffd400 0%,#e0b800 100%);
  box-shadow:rgba(255,255,255,.5) 0 2px 5px 0 inset,#fff0a0 0 -3px 10px 0 inset;
  transition:--btn-angle .45s ease;
}
.btn-cta:hover .btn-inner{--btn-angle:130.884deg}
.btn-cta .btn-text{
  font-size:22px;font-weight:500;line-height:40px;letter-spacing:.02em;color:#111;text-align:center;white-space:pre;
}
.btn-cta .arrow{width:28px;height:28px;display:block;flex:none;z-index:1}
.btn-cta .arrow svg{width:100%;height:100%;display:block}
.cta-caption{
  width:100%;font-size:16px;font-weight:500;font-style:italic;line-height:15px;letter-spacing:.02em;
  color:#ccc;text-align:center;
}

/* video */
.vsl-wrap{
  position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;
  width:100%;max-width:1240px;gap:50px;margin-top:30px;   /* extra space above the video (tweak here) */
}
.vsl{
  position:relative;z-index:2;display:flex;align-items:center;justify-content:center;
  width:100%;padding:5px;border-radius:28px;overflow:hidden;background:#000;
  box-shadow:#fff6c2 0 -12px 16px 0,#ffe680 0 -30px 30px -12px,#f0c400 0 -30px 30px 0,#ffdb4d 0 -40px 40px -30px,#d9ad00 0 -40px 200px 1px;
}
.vsl-inner{
  position:relative;width:100%;aspect-ratio:1109.59/631.48;border-radius:24px;overflow:hidden;
  background:#0a0a12;display:grid;place-items:center;
}
.vsl-inner iframe,.vsl-inner video{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.vsl-placeholder{display:flex;flex-direction:column;align-items:center;gap:18px;color:rgba(255,255,255,.55);font-size:18px;letter-spacing:.2px}
.vsl-placeholder .play{
  width:84px;height:84px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(90deg,#ffd400,#e0b800);
  box-shadow:rgba(255,255,255,.5) 0 2px 5px 0 inset,#fff0a0 0 -3px 10px 0 inset;
}
.vsl-placeholder .play svg{width:34px;height:34px;margin-left:5px}
.glow-shadow{
  position:absolute;left:22px;right:22px;height:140px;bottom:6px;z-index:0;border-radius:28px;
  background:#000;padding:5px;overflow:hidden;
  box-shadow:#fff6c2 0 12px 16px 0,#ffe680 0 30px 30px -12px,#f0c400 0 30px 30px 0,#ffdb4d 0 40px 40px -30px,#d9ad00 0 40px 200px 1px;
}

/* ---------- box-grid pattern behind the reviews heading ---------- */
.grid-pattern{
  position:absolute;left:7%;width:86%;height:380px;bottom:401px;z-index:1;pointer-events:none;
  opacity:0;transition:opacity 1.2s ease;overflow:hidden;
  -webkit-mask-image:radial-gradient(ellipse 62% 78% at 50% 42%,#000 18%,rgba(0,0,0,.55) 45%,transparent 76%);
  mask-image:radial-gradient(ellipse 62% 78% at 50% 42%,#000 18%,rgba(0,0,0,.55) 45%,transparent 76%);
}
.grid-pattern.in{opacity:.5}
.grid-pattern::before{
  content:"";position:absolute;left:-15%;right:-15%;top:-30%;bottom:-10%;
  background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.42) 0 1px,transparent 1px 44px),
    repeating-linear-gradient(0deg,rgba(255,255,255,.42) 0 1px,transparent 1px 44px);
  transform:perspective(900px) rotateX(38deg);transform-origin:50% 100%;
}
@media (max-width:1199.98px){.grid-pattern{bottom:381px}}
@media (max-width:833.98px){.grid-pattern{display:none}}

/* ====================== BREAKPOINTS ====================== */
/* 1200 - 1439 */
@media (max-width:1439.98px){
  .nav-wrap{width:90%}
  .hero{padding:160px 0 100px}
  .hero-content{gap:50px;padding:0 20px 0 16px}
  .hero-top{gap:30px}
  .hero-title-group{gap:10px}
  .h1-wrap{width:847px}
  h1,.final-title{line-height:80px}
  h1 em,.final-title em{font-size:90px}
  .desc{line-height:30px}
}
/* 834 - 1199 (tablet) */
@media (max-width:1199.98px){
  .nav{padding:10px 13.6px 10px 18px;border-radius:14px}
  .logo-img{height:42px}
  .menu{display:none}
  .hero{padding:170px 0 80px}
  .hero-content{gap:60px;padding:0 30px}
  .hero-top{gap:30px}
  .hero-title-group{gap:16px}
  .h1-wrap{width:100%;max-width:90%}
  h1,.final-title{line-height:81px}
  h1 em,.final-title em{font-size:100px}
}
/* < 834 (phone) */
@media (max-width:833.98px){
  .nav-wrap{width:90%;top:16px}
  .nav{padding:7px 9.6px 7px 10px;border-radius:14px}
  .logo-img{height:40px}
  .btn-nav{padding:10px 14px}
  .nav-inner{min-height:45.6px}
  .stars{display:none}
  .hero{padding:130px 0 10px}
  .hero-content{gap:40px;padding:0 16px}
  .hero-top{gap:30px}
  .hero-title-group{gap:20px}
  .badge{padding:7px 13px 7px 9px;gap:7px}
  .avatars{height:26px;width:80px}
  .avatar{width:26px;height:26px;font-size:10px}
  .avatar:nth-child(2){left:18px}
  .avatar:nth-child(3){left:36px}
  .avatar:nth-child(4){left:54px}
  .avatar:nth-child(5){display:none}
  .badge-icon{display:none}
  .only-wide{display:none}
  .badge-text p{font-size:15px}
  .h1-wrap{width:100%;max-width:none}
  h1,.final-title{font-size:40px;line-height:45px;letter-spacing:-1.2px}
  h1 em,.final-title em{font-size:50px;letter-spacing:-1.32px}
  .desc{font-size:17px;line-height:27px;letter-spacing:.02em}
  .cta-group{gap:10px}
  .btn-cta{padding:2px;border-radius:15px}
  .btn-cta .btn-inner{padding:16px 16px 16px 20px;border-radius:13px;gap:6px}
  .btn-cta .btn-text{font-size:17px;line-height:24px}
  .btn-cta .arrow{width:20px;height:20px}
  .cta-caption{font-size:12px}
  .vsl-wrap{gap:30px;margin-top:20px}
  .vsl{padding:2px;border-radius:12px}
  .vsl-inner{border-radius:10px}
  .vsl-placeholder{font-size:14px;gap:12px}
  .vsl-placeholder .play{width:56px;height:56px}
  .vsl-placeholder .play svg{width:22px;height:22px;margin-left:3px}
  .glow-shadow{left:7px;right:7px}
}

/* ====================== REVIEWS CAROUSEL ====================== */
.reviews{
  position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;
  width:100%;max-width:1240px;gap:50px;
}
.reviews-title{
  margin:0;font-family:"Inter",sans-serif;font-weight:600;font-size:48px;line-height:64px;letter-spacing:-2.3px;
  color:rgba(255,255,255,.94);text-align:center;
}
.reviews-title em{
  font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:600;font-size:60px;letter-spacing:-.5px;line-height:64px;
  color:#ffd400;
}
.carousel{
  position:relative;width:810px;max-width:100%;height:430px;
  perspective:1200px;user-select:none;-webkit-user-select:none;touch-action:pan-y;
}
.carousel.dragging{cursor:grabbing}
.track{
  position:absolute;inset:0;display:flex;flex-direction:row;align-items:center;gap:30px;
  margin:0;padding:0;list-style:none;cursor:grab;will-change:transform;
  transition:transform .7s cubic-bezier(.22,.75,.2,1);
}
.track.no-anim{transition:none}
.slide{
  flex:none;width:100%;height:100%;
  transform:scale(.84);transition:transform .7s cubic-bezier(.22,.75,.2,1);
}
.slide.is-active{transform:none}
.slide.is-prev{transform-origin:100% 50%}
.slide.is-next{transform-origin:0% 50%}
.card{
  position:relative;width:100%;height:100%;overflow:hidden;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:60px;
  padding:60px 50px;border-radius:24px;
  background:rgba(10,10,10,.5);
  box-shadow:rgba(255,255,255,.12) 0 0 90px 0 inset;
}
.card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:1px solid rgba(255,255,255,.09)}
.review{display:flex;flex-direction:column;align-items:center;gap:34px;width:710px;max-width:100%}
.rating{width:150px;height:27px;display:block;flex:none}
.rating svg{width:100%;height:100%;display:block}
.quote{
  margin:0;width:100%;font-family:"Inter Tight",sans-serif;font-weight:500;font-size:26px;line-height:36px;letter-spacing:-.01em;
  color:#ededed;text-align:center;white-space:pre-wrap;
}
.author{display:flex;align-items:center;gap:14px;width:228px;max-width:100%}
.author-photo{
  width:64px;height:64px;border-radius:90px;overflow:hidden;flex:none;
  display:grid;place-items:center;font-size:20px;font-weight:600;color:#111;
  background:linear-gradient(135deg,#ffe14d,#d9b300);
}
.author-photo img{width:100%;height:100%;object-fit:cover;display:block;background:#fff}
.author-text{display:flex;flex-direction:column;align-items:flex-start;gap:4px;flex:1 0 0}
.author-name{font-family:"Inter Tight",sans-serif;font-weight:500;font-size:20px;line-height:24px;color:#eaeaea;white-space:pre}
.author-role{font-family:"Inter Tight",sans-serif;font-weight:500;font-size:17px;line-height:20.4px;letter-spacing:.01em;color:rgba(235,235,235,.4);white-space:pre}

/* scroll-in reveal (fade + slide up), as on the original */
.reveal{opacity:0;transform:translateY(120px);transition:opacity .7s cubic-bezier(.2,.65,.25,1),transform .7s cubic-bezier(.2,.65,.25,1)}
.reveal.in{opacity:1;transform:none}

@media (max-width:1199.98px){
  .reviews-title{font-size:36px;line-height:50px;letter-spacing:-1.8px}
  .reviews-title em{font-size:46px;line-height:50px}
  .carousel{width:600px;height:309px}
  .card{padding:28px 24px;gap:10px}
  .review{gap:20px;width:100%}
  .rating{width:111px;height:20px}
  .quote{font-weight:400;font-size:18px;line-height:26px;letter-spacing:.01em}
  .author-photo{width:52px;height:52px;font-size:17px}
  .author-name{font-size:17px;line-height:20.4px}
  .author-role{font-size:15px;line-height:18px}
}
@media (max-width:833.98px){
  .reviews{gap:30px}
  .reviews-title{font-size:30px;line-height:36px;letter-spacing:-1.7px}
  .reviews-title em{font-size:39px;line-height:36px}
  .carousel{width:100%;height:382px}
  .slide{height:350px}
}

/* ====================== CLIENT LOGO STRIP (from thundermediaco.com, restyled) ====================== */
.clients{position:relative;z-index:1;background:#000;padding:0 0 60px;margin-top:-50px;display:flex;flex-direction:column;align-items:center}   /* margin-top pulls the strip up under the reviews (tweak here) */
.chip{
  position:relative;display:inline-flex;align-items:center;justify-content:center;padding:11px 12px;border-radius:10px;
  background:rgba(255,255,255,.03);   /* header glass, but a bit more transparent for the section chips */
  -webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);
  box-shadow:rgba(255,255,255,.06) 0 0 40px 0 inset;
  font-family:"Inter Tight",sans-serif;font-size:17px;font-weight:500;line-height:17px;color:#999;white-space:pre;
}
.chip::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:1px solid rgba(255,255,255,.09)}
.client-strip{
  width:100%;padding:8px 0;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%);
}
.client-track{display:flex;align-items:center;gap:72px;width:max-content;animation:client-scroll 50s linear infinite}
.client-track img{height:128px;width:auto;opacity:.85;flex-shrink:0;display:block}
.client-strip:hover .client-track{animation-play-state:paused}
@keyframes client-scroll{0%{transform:translateX(0)}100%{transform:translateX(calc(-50% - 36px))}}
@media (max-width:833.98px){
  .clients{padding:0 0 40px;margin-top:0}
  .client-track{gap:40px}
  .client-track img{height:92px}
  @keyframes client-scroll{0%{transform:translateX(0)}100%{transform:translateX(calc(-50% - 20px))}}
}
@media (prefers-reduced-motion:reduce){.client-track{animation:none}}

/* ====================== SHARED SECTION HEADING STYLE (from the design we're matching) ====================== */
.section{position:relative;z-index:1;background:#000;padding:100px 0;display:flex;flex-direction:column;align-items:center}
.section-inner{width:100%;max-width:1240px;padding:0 20px}
.section-head{position:relative;width:100%;display:flex;flex-direction:column;align-items:center;gap:24px;text-align:center}
.section-head > .chip,.section-head > .section-title,.section-head > .section-desc{position:relative;z-index:2}
.section-head .chip{align-self:center}
.section-title{
  margin:0;font-family:"Inter",sans-serif;font-weight:600;font-size:48px;line-height:64px;letter-spacing:-2.3px;
  color:rgba(255,255,255,.94);text-align:center;
}
.section-title em{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:600;font-size:60px;letter-spacing:-.5px;line-height:64px;color:#ffd400}
.section-desc{margin:0;max-width:760px;font-family:"Inter Tight",sans-serif;font-size:20px;font-weight:400;line-height:36px;letter-spacing:.02em;color:#fff;text-align:center}
.glass{
  position:relative;border-radius:24px;background:rgba(10,10,10,.5);
  box-shadow:rgba(255,255,255,.12) 0 0 90px 0 inset;
}
.glass::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:1px solid rgba(255,255,255,.09)}

/* ====================== SERVICES ====================== */
#services{padding-top:0}   /* sits right under the logo strip (tweak here) */
.services-content{display:flex;flex-direction:column;align-items:center;gap:60px;width:100%}
.services-head{gap:30px;position:relative;width:100%}
.services-head > .chip,.services-head > .section-title,.services-head > .section-desc{position:relative;z-index:2}
.service-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;width:100%;max-width:1240px}
.service-card{
  position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:26px;padding:36px 32px 34px;
  font-family:"Inter Tight",sans-serif;
}
.service-top{display:flex;align-items:center;justify-content:space-between;width:100%}
.service-num{font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#ffd400;opacity:.9}
.service-icon{width:60px;height:60px;border-radius:12px;display:grid;place-items:center;flex:none;background:linear-gradient(135deg,#ffe14d 0%,#d9b300 100%);box-shadow:rgba(255,255,255,.5) 0 2px 5px 0 inset,#fff0a0 0 -3px 10px 0 inset}
.service-icon svg{width:30px;height:30px;stroke:#111;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.service-copy{display:flex;flex-direction:column;gap:12px;flex:1}
.service-copy h3{margin:0;font-size:24px;font-weight:600;line-height:1.2;letter-spacing:-.02em;color:#fff}
.service-copy p{margin:0;font-size:16px;font-weight:400;line-height:26px;letter-spacing:.2px;color:#b3b3b3}
.service-link{
  display:inline-flex;align-items:center;gap:8px;margin-top:4px;font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#ffd400;
  transition:gap .25s ease,opacity .25s ease;
}
.service-link svg{width:14px;height:14px;fill:#ffd400}
.service-link:hover{gap:12px}
@media (max-width:1199.98px){.service-cards{gap:16px}.service-card{padding:28px 24px 28px}.service-copy h3{font-size:21px}}
@media (max-width:833.98px){#services{padding-top:0}.services-content{gap:36px}.services-head{gap:20px}.service-cards{grid-template-columns:1fr;gap:16px}.service-card{padding:30px 26px}}

/* ====================== WE HANDLE EVERYTHING (modelled on the original's "Tools" section) ====================== */
#tools{padding:100px 0 150px;clip-path:inset(-400px 0 -400px 0)}   /* clips edge tiles left/right only, so glows can spill above/below */
.tools-content{position:relative;width:100%;max-width:1152px;height:550px;display:flex;align-items:center;justify-content:center}
.tools-dots{position:absolute;left:50%;top:50%;width:1002px;height:440px;transform:translate(-50%,-50%);max-width:100%;z-index:0;pointer-events:none;overflow:hidden;--o:.7}
.tools-dots canvas{position:absolute;inset:0;width:100%;height:100%}
.tools-content > .bg-grid{top:285px;bottom:auto}
.tools-head{position:relative;z-index:2;max-width:800px;gap:30px}
.tools-head .section-title{max-width:720px}
.tools-head .section-desc{max-width:800px}
.tile{
  position:absolute;z-index:1;width:100px;height:106px;border-radius:20px;display:grid;place-items:center;
  background:linear-gradient(180deg,rgba(255,255,255,.07) 0%,rgba(10,10,10,.5) 100%);
  box-shadow:rgba(255,255,255,.1) 0 0 40px 0 inset,rgba(0,0,0,.5) 0 20px 40px -20px;
  opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.65,.25,1);
}
.tile::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:1px solid rgba(255,255,255,.09)}
.tile svg{width:42%;height:42%;stroke:#ffd400;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tile svg{stroke:#ffd400}   /* icons are yellow */
.tile.in{opacity:1;transform:none;animation:tile-float var(--dur,6s) ease-in-out var(--delay,0s) infinite}
@keyframes tile-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
/* positions measured off the original, relative to the 1152px content box */
.tile.t1{left:80px;top:0px;width:96px;height:104px;border-radius:19px;--dur:6.5s;--delay:-1s}
.tile.t2{left:-6px;top:150px;width:140px;height:150px;border-radius:26px;--dur:7s;--delay:-3s}
.tile.t3{left:-56px;top:392px;width:70px;height:76px;border-radius:14px;--dur:6s;--delay:-2s}
.tile.t4{left:179px;top:520px;width:84px;height:90px;border-radius:16px;--dur:7.5s;--delay:-4s}
.tile.t5{left:399px;top:568px;width:128px;height:138px;border-radius:24px;--dur:6.2s;--delay:-.5s}
.tile.t6{left:654px;top:560px;width:66px;height:72px;border-radius:14px;--dur:6.8s;--delay:-2.5s}
.tile.t7{left:870px;top:530px;width:110px;height:118px;border-radius:21px;--dur:7.2s;--delay:-1.5s}
.tile.t8{right:-50px;top:389px;width:134px;height:144px;border-radius:25px;--dur:6.4s;--delay:-3.5s}
.tile.t9{right:-30px;top:95px;width:74px;height:80px;border-radius:15px;--dur:7s;--delay:-.8s}
.tile.t10{right:101px;top:-5px;width:100px;height:108px;border-radius:20px;--dur:6.6s;--delay:-2.2s}
.tiles-row{display:none}
@media (max-width:1199.98px){
  #tools{padding:80px 0 120px}
  .tile{width:84px;height:90px;border-radius:16px}
  .tile.t1,.tile.t2,.tile.t3,.tile.t4,.tile.t5,.tile.t6,.tile.t7,.tile.t8,.tile.t9,.tile.t10{width:84px;height:90px;border-radius:16px}
  .tile.t2,.tile.t5,.tile.t8{width:110px;height:118px;border-radius:20px}
  .tile.t3,.tile.t6,.tile.t9{width:60px;height:64px;border-radius:12px}
  .tile.t2{left:-20px}.tile.t3{left:-24px}.tile.t8{right:-20px}.tile.t9{right:-10px}
  .tile.t4{left:120px;top:500px}.tile.t5{left:330px;top:540px}.tile.t6{left:560px;top:535px}.tile.t7{left:760px;top:505px}
}
@media (max-width:833.98px){
  #tools{padding:70px 0 70px}
  .tools-content{height:auto;flex-direction:column;gap:36px}
  .tools-dots{display:none}
  .tile{display:none}
  .tiles-row{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;width:100%;position:relative;z-index:2}
  .tiles-row .tile{display:grid;position:relative;left:auto;right:auto;top:auto;width:64px;height:68px;border-radius:14px;opacity:1;transform:none;animation:none}
}

/* ====================== OUR PROMISE (layout modelled on the "Unique Mechanism" section) ====================== */
#promise{padding-top:30px}   /* sits closer to the section above (tweak here) */
.promise-content{display:flex;flex-direction:column;align-items:center;gap:100px;width:100%}
.promise-head{gap:30px}
.promise-head .section-title{max-width:1048px}
.promise-head .section-desc{max-width:1070px}
.promise-box{display:flex;align-items:flex-start;gap:70px;width:100%;max-width:1240px}
.promise-photo{flex:none;width:514px;border-radius:16px;overflow:hidden}
.promise-photo img{display:block;width:100%;height:643px;object-fit:cover;object-position:center top;border-radius:16px}
.promise-text{flex:1 1 0;display:flex;flex-direction:column;gap:26px;font-family:"Inter Tight",sans-serif}
.promise-text p{margin:0;font-size:20px;font-weight:400;line-height:33px;letter-spacing:.02em;color:#d6d6d6}
.promise-text p strong{font-weight:600;color:#fff}
.promise-sign{display:flex;flex-direction:column;gap:8px;margin-top:0}
.promise-sign img{width:120px;height:auto;display:block;filter:invert(1)}
.promise-sign span{font-family:"Inter Tight",sans-serif;font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#ffd400}
.promise-sign .sign-role{margin-top:-4px;font-weight:500;letter-spacing:.16em;color:rgba(235,235,235,.5)}   /* title line under the name */
.biab .promise-sign img{margin-bottom:10px}   /* a little more air between the signature and the name */
.promise-bottom{display:flex;flex-direction:column;align-items:center;gap:40px;width:100%;max-width:1240px}
.promise-bottom-title{margin:0;font-family:"Inter Tight",sans-serif;font-size:34px;font-weight:600;line-height:1.2;letter-spacing:-.01em;color:#e6e6e6;text-align:center}
.partner-cards{display:grid;grid-template-columns:repeat(3,364px);justify-content:center;gap:16px;width:100%}
.partner-card{
  position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:40px;padding:30px 30px 34px;border-radius:16px;
  background:#0d0d0d;box-shadow:rgba(255,255,255,.1) 0 0 50px 0 inset;font-family:"Inter Tight",sans-serif;
}
.partner-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:1px solid rgba(255,255,255,.08)}
.partner-icon{width:60px;height:60px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#ffe14d 0%,#d9b300 100%);box-shadow:rgba(255,255,255,.5) 0 2px 5px 0 inset,#fff0a0 0 -3px 10px 0 inset}
.partner-icon svg{width:30px;height:30px;stroke:#111;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.partner-copy{display:flex;flex-direction:column;gap:11px}
.partner-copy h3{margin:0;font-size:20px;font-weight:500;line-height:30px;letter-spacing:.55px;color:#e6e6e6}
.partner-copy p{margin:0;font-size:16px;font-weight:400;line-height:26px;letter-spacing:.55px;color:#b3b3b3}


/* ---------- background layers behind the Promise heading (dots + corner glows + square grid) ---------- */
.promise-head{position:relative;width:100%}
.promise-head > .chip,.promise-head > .section-title,.promise-head > .section-desc{position:relative;z-index:2}
.bg-fade{opacity:0;transition:opacity 1.2s ease}
.bg-fade.in{opacity:var(--o,1)}
.bg-dots{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;--o:.7}
.bg-dots canvas{position:absolute;inset:0;width:100%;height:100%}
.bg-glow{position:absolute;top:0;width:340px;height:180px;z-index:1;pointer-events:none;border-radius:16px;background:#6b5600;filter:blur(112px)}
.bg-glow.left{left:0}
.bg-glow.right{right:0}
.bg-grid{
  position:absolute;left:0;width:100%;height:380px;bottom:-250px;z-index:0;pointer-events:none;overflow:hidden;--o:.26;
  -webkit-mask-image:radial-gradient(ellipse 62% 78% at 50% 42%,#000 18%,rgba(0,0,0,.55) 45%,transparent 76%);
  mask-image:radial-gradient(ellipse 62% 78% at 50% 42%,#000 18%,rgba(0,0,0,.55) 45%,transparent 76%);
}
.bg-grid::before{
  content:"";position:absolute;left:-15%;right:-15%;top:-30%;bottom:-10%;
  background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.42) 0 1px,transparent 1px 44px),
    repeating-linear-gradient(0deg,rgba(255,255,255,.42) 0 1px,transparent 1px 44px);
  transform:perspective(900px) rotateX(38deg);transform-origin:50% 100%;
}
@media (max-width:833.98px){.bg-dots,.bg-grid{display:none}.bg-glow{width:220px;height:140px}}

/* ====================== PRICING (refined layout on the site's glass surfaces) ====================== */
.tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;width:100%;margin-top:56px;align-items:stretch}
.tier{
  position:relative;display:flex;flex-direction:column;gap:0;padding:40px 32px 34px;border-radius:24px;
  background:rgba(10,10,10,.5);box-shadow:rgba(255,255,255,.12) 0 0 90px 0 inset;   /* same glass as the review cards */
  font-family:"Inter Tight",sans-serif;
}
.tier::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:1px solid rgba(255,255,255,.09)}
.tier-tag{min-height:30px;font-size:11px;font-weight:600;line-height:15px;letter-spacing:.22em;text-transform:uppercase;color:#ffd400;opacity:.9}   /* two-line min-height keeps the tier names aligned across cards */
.tier h3{margin:14px 0 0;font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:600;font-size:38px;line-height:1;letter-spacing:-.01em;color:#fff}
.tier-price{display:flex;align-items:baseline;gap:6px;margin-top:26px;padding-bottom:26px;font-size:42px;font-weight:500;letter-spacing:-.035em;line-height:1;color:#fff}
.tier-price span{font-size:14px;font-weight:500;letter-spacing:.02em;color:rgba(235,235,235,.5)}
.tier ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;flex:1;border-top:1px solid rgba(255,255,255,.09)}
.tier li{position:relative;padding:13px 0 13px 26px;font-size:15px;font-weight:400;line-height:22px;color:rgba(235,235,235,.82);border-bottom:1px solid rgba(255,255,255,.07)}
.tier li:last-child{border-bottom:0}
.tier li::before{content:"";position:absolute;left:1px;top:19px;width:11px;height:6px;border-left:1.6px solid #ffd400;border-bottom:1.6px solid #ffd400;transform:rotate(-45deg)}
/* buttons use the header's glass style; the featured one uses the site's yellow gradient button */
.tier-btn{
  display:flex;align-items:center;justify-content:center;margin-top:28px;padding:13px 18px;border-radius:8px;position:relative;
  font-size:16px;font-weight:500;letter-spacing:.2px;color:#fff;
  background:rgba(255,255,255,.06);box-shadow:rgba(255,255,255,.1) 0 0 40px 0 inset;transition:background .25s ease;
}
.tier-btn::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:1px solid rgba(255,255,255,.09)}
.tier-btn:hover{background:rgba(255,255,255,.11)}
.tier.featured::after{border-color:rgba(255,212,0,.55)}
.tier.featured{box-shadow:rgba(255,255,255,.12) 0 0 90px 0 inset,#fff6c2 0 0 14px -6px,#ffe680 0 0 26px -10px,#f0c400 0 0 30px -4px,#ffdb4d 0 0 40px -22px,#d9ad00 0 0 140px -6px}   /* same glow recipe as the video box, wrapped all the way round */
.tier-inner{display:contents}
.featured-flag{
  position:absolute;top:-16px;left:50%;transform:translateX(-50%);z-index:3;padding:9px 12px;border-radius:10px;white-space:nowrap;
  background:#0a0a0a;box-shadow:rgba(255,255,255,.1) 0 -4px 10px 0 inset;color:#ffd400;
  font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
}
.featured-flag::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:1px solid rgba(255,212,0,.45)}
.tier.featured .tier-btn{background:linear-gradient(90deg,#ffd400 0%,#e0b800 100%);color:#111;box-shadow:rgba(255,255,255,.5) 0 2px 5px 0 inset,#fff0a0 0 -3px 10px 0 inset}
.tier.featured .tier-btn::after{display:none}
.tier.featured .tier-btn:hover{filter:brightness(1.06)}

@media (max-width:1199.98px){
  .tiers{grid-template-columns:repeat(2,1fr)}
  .promise-content{gap:70px}
  .promise-box{gap:40px}
  .promise-photo{width:380px}
  .promise-photo img{height:500px}
  .promise-text p{font-size:18px;line-height:30px}
  .partner-cards{grid-template-columns:repeat(3,1fr)}
  .partner-card{padding:24px 22px 28px;gap:28px}
  .section-title{font-size:36px;line-height:50px;letter-spacing:-1.8px}
  .section-title em{font-size:46px;line-height:50px}
}
@media (max-width:833.98px){
  .section{padding:70px 0}
  #promise{padding-top:20px}
  .section-inner{padding:0 16px}
  .section-title{font-size:30px;line-height:36px;letter-spacing:-1.7px}
  .section-title em{font-size:39px;line-height:36px}
  .section-desc{font-size:17px;line-height:27px}
  .promise-content{gap:50px}
  .promise-head{gap:20px}
  .promise-box{flex-direction:column;align-items:center;gap:28px}
  .promise-photo{width:100%;max-width:420px}
  .promise-photo img{height:auto}
  .promise-text{gap:22px}
  .promise-text p{font-size:17px;line-height:27px}
  .promise-bottom{gap:26px}
  .promise-bottom-title{font-size:26px}
  .partner-cards{grid-template-columns:1fr}
  .tiers{grid-template-columns:1fr;gap:18px;margin-top:36px}
  .tier{padding:34px 26px 30px}
  .tier h3{font-size:34px}
  .tier-price{font-size:38px}
}

/* ====================== FINAL CALL TO ACTION (hero type + hero button) ====================== */
.final-cta{position:relative;z-index:1;background:#000;padding:40px 16px 140px;   /* top padding pulls it closer to Pricing (tweak here) */ display:flex;flex-direction:column;align-items:center;overflow:hidden}
.final-inner{position:relative;display:flex;flex-direction:column;align-items:center;gap:40px;width:100%;max-width:840px}
.final-inner > .bg-dots{inset:-60px 0 -40px 0}
.final-inner > .final-wrap,.final-inner > .desc-wrap,.final-inner > .cta-group{position:relative;z-index:2}
.final-wrap{position:relative;width:1160px;max-width:none;white-space:pre-wrap;word-break:break-word}
.final-title{margin:0}
@media (max-width:1439.98px){.final-wrap{width:847px}}
@media (max-width:1199.98px){.final-wrap{width:100%;max-width:90%}}
@media (max-width:833.98px){.final-cta{padding:30px 16px 90px}.final-inner{gap:30px}.final-wrap{width:100%;max-width:none}}

/* ====================== FOOTER (layout from thundermediaco.com, restyled to the new palette) ====================== */
.site-footer{position:relative;z-index:1;background:#000;color:#fff;font-family:"Inter Tight",sans-serif}
.footer-grid{
  display:grid;grid-template-columns:2fr 1fr 1fr 1.4fr;gap:40px;
  max-width:1240px;margin:0 auto;padding:64px 48px 48px;
}
.footer-brand img{height:64px;width:auto;display:block;margin:0 0 18px}
.footer-brand p{margin:0;color:rgba(235,235,235,.55);font-size:15px;font-weight:400;line-height:1.65;letter-spacing:.01em;max-width:34ch}
.footer-grid h4{margin:0 0 18px;font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#ffd400}
.footer-grid ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.footer-grid li{font-size:16px;font-weight:500;line-height:1.5;letter-spacing:.2px;color:rgba(255,255,255,.8)}
.footer-grid a{color:rgba(255,255,255,.8);font-size:16px;font-weight:500;letter-spacing:.2px;transition:color .2s ease}
.footer-grid a:hover{color:#ffd400}
.footer-bottom{
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;
  max-width:1240px;margin:0 auto;padding:22px 48px;border-top:1px solid rgba(255,255,255,.09);
  font-size:12px;font-weight:500;line-height:1.6;letter-spacing:.1em;text-transform:uppercase;color:rgba(235,235,235,.4);
}
.footer-bottom a{color:rgba(235,235,235,.4);transition:color .2s ease}
.footer-bottom a:hover{color:#ffd400}
@media (max-width:1020px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:760px){.footer-grid{grid-template-columns:1fr;gap:32px;padding:56px 24px 40px}.footer-bottom{padding:22px 24px}}

/* ====================== ABOUT PAGE ====================== */
.page-hero{padding-bottom:120px}
.page-hero .hero-content{gap:0}
.page-hero .desc-wrap{max-width:820px}
.page-hero .page-grid{bottom:auto;top:calc(100% - 300px)}
.mindset-content{display:flex;flex-direction:column;align-items:center;gap:70px;width:100%}
.mindset-head{gap:30px}
.mindset-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:stretch;width:100%;max-width:1160px}
.mindset-photo{border-radius:24px;overflow:hidden;min-height:420px}
.mindset-photo img{display:block;width:100%;height:100%;object-fit:cover;border-radius:24px}
.mindset-cards{display:flex;flex-direction:column;gap:18px}
.mindset-card{display:flex;align-items:center;gap:22px;padding:26px 28px;flex:1;font-family:"Inter Tight",sans-serif}
.mindset-copy{display:flex;flex-direction:column;gap:6px}
.mindset-copy h3{margin:0;font-size:22px;font-weight:600;letter-spacing:-.02em;color:#fff}
.mindset-copy p{margin:0;font-size:16px;line-height:26px;letter-spacing:.2px;color:#b3b3b3}
#founder{padding-top:100px}
@media (max-width:1199.98px){.mindset-grid{gap:24px}.mindset-card{padding:22px 22px;gap:18px}}
@media (max-width:833.98px){
  .page-hero{padding-bottom:70px}
  .page-hero .page-grid{display:none}
  .mindset-content{gap:40px}
  .mindset-grid{grid-template-columns:1fr;gap:18px}
  .mindset-photo{min-height:0;max-width:480px;margin:0 auto}
  #founder{padding-top:70px}
}

/* ====================== SERVICE PAGES ====================== */
.hero-btns{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}
.btn-glass{
  display:inline-flex;align-items:center;justify-content:center;position:relative;padding:0 28px;height:78px;border-radius:18px;
  font-family:"Inter Tight",sans-serif;font-size:22px;font-weight:500;letter-spacing:.02em;color:#fff;
  background:rgba(255,255,255,.06);box-shadow:rgba(255,255,255,.1) 0 0 40px 0 inset;transition:background .25s ease;
}
.btn-glass::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:1px solid rgba(255,255,255,.09)}
.btn-glass:hover{background:rgba(255,255,255,.11)}
.statement-head{gap:30px}
.statement-head .section-title{max-width:1000px}
#ownership{padding:60px 0 80px}
.work-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;width:100%;max-width:1240px}
.work-card{display:flex;flex-direction:column;overflow:hidden;font-family:"Inter Tight",sans-serif}
.work-shot{padding:14px 14px 0}
.work-shot img{display:block;width:100%;height:auto;border-radius:14px}
.work-copy{display:flex;flex-direction:column;gap:12px;padding:22px 28px 30px}
.work-copy h3{margin:0;font-size:24px;font-weight:600;line-height:1.2;letter-spacing:-.02em;color:#fff}
.work-copy p{margin:0;font-size:16px;line-height:26px;letter-spacing:.2px;color:#b3b3b3}
.checks{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column}
.checks li{position:relative;padding:11px 0 11px 26px;font-size:15px;line-height:22px;color:rgba(235,235,235,.82);border-top:1px solid rgba(255,255,255,.07)}
.checks li::before{content:"";position:absolute;left:1px;top:17px;width:11px;height:6px;border-left:1.6px solid #ffd400;border-bottom:1.6px solid #ffd400;transform:rotate(-45deg)}
@media (max-width:1199.98px){.work-cards{grid-template-columns:1fr 1fr;gap:16px}}
@media (max-width:833.98px){
  .btn-glass{height:60px;padding:0 22px;font-size:17px;border-radius:15px}
  .hero-btns{gap:12px}
  #ownership{padding:40px 0 60px}
  .work-cards{grid-template-columns:1fr;gap:16px}
}

/* ====================== MOBILE MENU (hamburger) ====================== */
.nav-toggle{
  display:none;position:relative;width:42px;height:42px;border-radius:8px;border:0;cursor:pointer;flex:none;padding:0;
  background:rgba(255,255,255,.06);box-shadow:rgba(255,255,255,.1) 0 0 40px 0 inset;
}
.nav-toggle::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:1px solid rgba(255,255,255,.12)}
.nav-toggle span{position:absolute;left:11px;right:11px;height:2px;border-radius:2px;background:#fff;transition:transform .3s ease,opacity .3s ease,top .3s ease}
.nav-toggle span:nth-child(1){top:13px}
.nav-toggle span:nth-child(2){top:20px}
.nav-toggle span:nth-child(3){top:27px}
.nav-toggle[aria-expanded="true"] span:nth-child(1){top:20px;transform:rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){top:20px;transform:rotate(-45deg)}
.nav-right{display:flex;align-items:center;gap:10px}
.mobile-menu{
  position:absolute;left:0;right:0;top:calc(100% + 10px);padding:10px;border-radius:16px;
  -webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px);
  visibility:hidden;pointer-events:none;transform:translateY(-8px);
  transition:transform .25s ease,backdrop-filter .25s ease,-webkit-backdrop-filter .25s ease,visibility 0s linear .25s;
  font-family:"Inter Tight",sans-serif;
}
.mobile-menu::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .25s ease;
  background:rgba(12,12,12,.82);box-shadow:rgba(255,255,255,.1) 0 0 40px 0 inset,rgba(0,0,0,.5) 0 20px 40px 0;border:1px solid rgba(255,255,255,.09)}
.mobile-menu > *{position:relative;opacity:0;transition:opacity .25s ease}
.mobile-menu.open{visibility:visible;pointer-events:auto;transform:none;-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);transition:transform .25s ease,backdrop-filter .25s ease,-webkit-backdrop-filter .25s ease,visibility 0s}
.mobile-menu.open::before,.mobile-menu.open > *{opacity:1}
.mobile-menu a{display:block;padding:13px 14px;border-radius:10px;font-size:17px;font-weight:500;letter-spacing:.2px;color:#fff;transition:background .2s ease}
.mobile-menu a:hover{background:rgba(255,255,255,.08)}
.mobile-menu .sub{position:relative;padding-left:44px;font-size:16px;color:rgba(255,255,255,.55)}   /* indented under the Services label */
.mobile-menu .mm-label{display:flex;align-items:center;gap:8px;width:100%;padding:13px 14px;border:0;background:none;border-radius:10px;cursor:pointer;text-align:left;font-family:"Inter Tight",sans-serif;font-size:17px;font-weight:500;letter-spacing:.2px;color:#fff;transition:background .2s ease}   /* same as the other items; tap to open the services */
.mobile-menu .mm-label:hover{background:rgba(255,255,255,.08)}
.mobile-menu .mm-chev{display:inline-block;width:7px;height:7px;margin-top:-3px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(45deg);opacity:.8;transition:transform .25s ease}
.mobile-menu .mm-label[aria-expanded="true"] .mm-chev{transform:rotate(-135deg);margin-top:3px}
.mobile-menu .mm-subs{overflow:hidden;max-height:0;transition:max-height .3s ease}
.mobile-menu .mm-subs.open{max-height:240px}
.mobile-menu .mm-book{
  display:flex;align-items:center;justify-content:center;margin:8px 4px 4px;padding:13px 18px;border-radius:8px;
  background:linear-gradient(90deg,#ffd400 0%,#e0b800 100%);color:#111;font-size:17px;font-weight:500;
  box-shadow:rgba(255,255,255,.5) 0 2px 5px 0 inset,#fff0a0 0 -3px 10px 0 inset;
}
@media (max-width:1199.98px){.nav-toggle{display:block}}
@media (max-width:833.98px){.btn-nav{display:none}.nav-toggle{width:40px;height:40px}.mobile-menu{top:calc(100% + 8px)}}

/* ====================== BUSINESS IN A BOX (hidden Google-Ads landing page) ====================== */
.biab-hero .hero-caption-title{gap:30px}
.biab-hero .hero-top{gap:34px}
.biab-hero .h1-wrap{max-width:900px}
.hero-btns .btn-glass{height:78px}
.hero-stats{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:6px}
.hero-stats .chip{gap:9px;color:#d6d6d6;font-size:15px;padding:10px 14px}
.ck{display:inline-block;width:12px;height:7px;margin-top:-4px;border-left:1.8px solid #ffd400;border-bottom:1.8px solid #ffd400;transform:rotate(-45deg);flex:none}
.biab-content{display:flex;flex-direction:column;align-items:center;gap:60px;width:100%}
.biab-head{gap:30px}
.biab-head .section-title{max-width:900px}

/* hero showcase image: reuses the home page's glowing video frame */
.biab-hero{padding-bottom:120px;overflow:visible}   /* no clipping: the glow under the image fades out on its own instead of being cut at the hero edge */
.biab-hero .stars{left:0;width:100%}   /* the hero no longer clips, so keep the dust canvas inside the viewport */
.biab #box{background:transparent;padding-top:0}   /* see-through, so the hero glow can bleed into it (body is black anyway) */
.biab-hero .hero-content{gap:70px}
.showcase-wrap{max-width:1000px}
.vsl-inner > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}

/* landing page: 3-column footer (no Company / Services columns) */
.biab .footer-grid{grid-template-columns:2fr 1fr 1.4fr}
@media (max-width:1020px){.biab .footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:760px){.biab .footer-grid{grid-template-columns:1fr}}

/* testimonials as a stand-alone section (the home page keeps them inside the hero) */
.reviews-inner{display:flex;justify-content:center}
#reviews{padding-top:60px;overflow:hidden}   /* clips the carousel side cards like the home-page hero does */
.biab .section{padding:60px 0}   /* tighter section rhythm on the landing page (120px between sections) */
.biab #promise{padding-top:60px}
@media (max-width:833.98px){.biab .section{padding:45px 0}.biab #promise{padding-top:45px}#reviews{padding-top:45px}}

/* our work: one row of five small cards; each shows the top of the site, tap opens the full capture */
.mini-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;width:100%;max-width:1100px}
.mini-card{position:relative;display:flex;flex-direction:column;gap:12px;padding:0;text-align:left;font-family:"Inter Tight",sans-serif;color:#fff}
.mini-window{position:relative;width:100%;aspect-ratio:4/5;overflow:hidden;border-radius:14px;background:#111;
  box-shadow:rgba(255,255,255,.12) 0 0 60px 0 inset,rgba(0,0,0,.5) 0 20px 40px -20px;transition:transform .35s cubic-bezier(.2,.65,.25,1),box-shadow .35s ease}
.mini-window::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;border:1px solid rgba(255,255,255,.12);transition:border-color .3s ease}
.mini-window img{position:absolute;left:0;top:0;width:100%;height:auto;display:block;transition:transform .9s cubic-bezier(.2,.65,.25,1)}   /* snaps back up quickly when the mouse leaves */
.mini-card:hover .mini-window{transform:translateY(-6px);box-shadow:rgba(255,255,255,.12) 0 0 60px 0 inset,rgba(0,0,0,.6) 0 30px 50px -20px,rgba(255,212,0,.18) 0 0 40px 0}
.mini-card:hover .mini-window::after{border-color:rgba(255,212,0,.5)}
.mini-card:hover .mini-window img{transform:translateY(-38%);transition-duration:7s;transition-timing-function:linear}   /* slow drift down while hovered */
.mini-meta{display:flex;flex-direction:column;gap:2px;padding:0 4px}
.mini-meta strong{font-size:15px;font-weight:600;letter-spacing:-.01em;line-height:1.25}
.mini-meta span{font-size:12px;color:#9a9a9a}
@media (max-width:1199.98px){.mini-row{gap:12px}.mini-meta strong{font-size:14px}}
@media (max-width:833.98px){
  /* phones: a swipeable row of small cards instead of a tall stack */
  .mini-row{display:flex;gap:12px;width:calc(100% + 32px);margin:0 -16px;padding:4px 16px 12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:16px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .mini-row::-webkit-scrollbar{display:none}
  .mini-card{flex:0 0 58%;scroll-snap-align:start}
  .mini-card:hover .mini-window{transform:none}
  .mini-card:hover .mini-window img{transform:none}
}
@media (max-width:1199.98px){.show-tab{min-width:0;flex:1 1 calc(33% - 10px)}}
@media (max-width:833.98px){
  .showcase{gap:24px}
  .show-frame{padding:2px;border-radius:14px}
  .show-bar{padding:8px 10px 6px;border-radius:12px 12px 0 0}
  .show-bar i{width:7px;height:7px}
  .show-bar span{font-size:11px;padding:4px 10px}
  .show-window{aspect-ratio:4/3;border-radius:0 0 12px 12px}
  .show-hint{opacity:1;right:12px;bottom:12px;font-size:10px}
  .show-glow{left:7px;right:7px}
  .show-tabs{gap:8px}
  .show-tab{flex:1 1 calc(50% - 8px);padding:10px 12px}
  .show-tab strong{font-size:14px}
  .show-tab span{font-size:11px}
  .work-scroll{padding:64px 10px 30px}
}

/* what's in the box: 3 x 3 grid of glass tiles */
.box-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;width:100%;max-width:1100px}
.box-item{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:28px 26px 26px;border-radius:20px;font-family:"Inter Tight",sans-serif}
.box-top{display:flex;align-items:center;justify-content:space-between;width:100%;gap:8px}
.box-icon{width:48px;height:48px;border-radius:11px;display:grid;place-items:center;flex:none;background:linear-gradient(135deg,#ffe14d 0%,#d9b300 100%);box-shadow:rgba(255,255,255,.5) 0 2px 5px 0 inset,#fff0a0 0 -3px 10px 0 inset}
.box-icon svg{width:24px;height:24px;stroke:#111;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.box-tag{padding:5px 8px;border-radius:6px;border:1px solid rgba(255,212,0,.4);font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#ffd400;white-space:nowrap}
.box-item.wide{grid-column:1 / -1;flex-direction:row;align-items:center;gap:22px}   /* 10th tile spans the last row */
.box-copy{display:flex;flex-direction:column;gap:8px;flex:1;min-width:0}
.box-copy .box-top{width:auto;justify-content:flex-start;gap:12px}
.box-item h3{margin:0;font-size:20px;font-weight:600;line-height:1.25;letter-spacing:-.01em;color:#fff}
.box-item p{margin:0;font-size:16px;line-height:25px;letter-spacing:.1px;color:#b3b3b3}

/* packages: three one-time tiers with a strike-through regular price */
.tiers.tiers-3{grid-template-columns:repeat(3,1fr);max-width:1100px;margin-left:auto;margin-right:auto}
.tier-was{margin-top:22px;font-size:15px;font-weight:500;letter-spacing:.01em;color:rgba(235,235,235,.45)}
.tier-was s{text-decoration:line-through;text-decoration-thickness:1.5px;text-decoration-color:rgba(255,212,0,.7)}
.tiers-3 .tier-price{margin-top:8px}
.tier li.hi{color:#fff;font-weight:500}
.pay-notes{display:flex;justify-content:center;gap:16px;width:100%;max-width:1100px;margin:22px auto 0}
.pay-note{max-width:720px}
.pay-note{display:flex;align-items:center;gap:16px;padding:18px 22px;border-radius:16px;font-family:"Inter Tight",sans-serif;font-size:15px;line-height:24px;color:#b3b3b3}
.pay-note strong{font-weight:600;color:#fff}
.pay-icon{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;flex:none;background:rgba(255,255,255,.06);box-shadow:rgba(255,255,255,.1) 0 0 40px 0 inset}
.pay-icon svg{width:20px;height:20px;stroke:#ffd400;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* how it works: three numbered steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;width:100%}
.step{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:34px 32px 36px;font-family:"Inter Tight",sans-serif}
.step-shot{width:calc(100% + 36px);margin:-20px -18px 8px;border-radius:14px;overflow:hidden}   /* sits 14px inside the card edge, like the case-study cards */
.step-shot img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.step-num{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:600;font-size:56px;line-height:1;color:#ffd400}
.step h3{margin:6px 0 0;font-size:24px;font-weight:600;line-height:1.2;letter-spacing:-.02em;color:#fff}
.step p{margin:0;font-size:16px;line-height:26px;letter-spacing:.2px;color:#b3b3b3}

/* what you'll need: copy on the left, checklist panel on the right */
.needs-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:stretch;width:100%;max-width:1100px}
.needs-copy{display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.needs-copy .section-title,.needs-copy .section-desc{text-align:left}
.needs-photo{width:100%;min-height:0;border-radius:24px;overflow:hidden}
.needs-photo img{display:block;width:100%;height:100%;object-fit:cover}   /* fills the checklist's height */
.needs-panel{display:flex;flex-direction:column;justify-content:center;padding:20px 34px 28px;font-family:"Inter Tight",sans-serif}
.needs-panel .checks li{font-size:17px;line-height:26px;padding:15px 0 15px 30px}
.needs-panel .checks li:first-child{border-top:0}
.needs-panel .checks li::before{top:20px;width:12px;height:7px}
.needs-foot{margin:18px 0 0;font-size:15px;font-weight:500;letter-spacing:.02em;color:#ffd400}

/* faq: glass accordion rows */
.faq-list{display:flex;flex-direction:column;gap:12px;width:100%;max-width:860px}
.faq{border-radius:16px;font-family:"Inter Tight",sans-serif}
.faq summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 26px;cursor:pointer;font-size:19px;font-weight:500;line-height:1.3;letter-spacing:-.01em;color:#fff}
.faq summary::-webkit-details-marker{display:none}
.faq-plus{position:relative;width:20px;height:20px;flex:none}
.faq-plus::before,.faq-plus::after{content:"";position:absolute;left:50%;top:50%;background:#ffd400;border-radius:2px;transform:translate(-50%,-50%);transition:transform .25s ease}
.faq-plus::before{width:14px;height:2px}
.faq-plus::after{width:2px;height:14px}
.faq[open] .faq-plus::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq-body{padding:0 26px 24px}
.faq-body p{margin:0;font-size:16px;line-height:26px;letter-spacing:.2px;color:#b3b3b3;max-width:720px}

/* closing section: dust spans the full page width and fades at the edges instead of stopping at the text column */
.biab .final-inner > .bg-dots{left:50%;right:auto;width:100vw;max-width:none;transform:translateX(-50%);
  -webkit-mask-image:radial-gradient(ellipse 55% 80% at 50% 50%,#000 30%,transparent 100%);
  mask-image:radial-gradient(ellipse 55% 80% at 50% 50%,#000 30%,transparent 100%)}

/* closing section: less dead air below the button and before the footer */
.biab .final-cta{padding:40px 16px 60px}
.biab .final-inner{gap:30px}
.biab .footer-grid{padding-top:48px}
@media (max-width:833.98px){.biab .final-cta{padding:30px 16px 40px}.biab .final-inner{gap:24px}}

/* small print under the final button */
.legal{position:relative;z-index:2;max-width:760px;margin:10px 0 0;font-family:"Inter Tight",sans-serif;font-size:12px;line-height:20px;letter-spacing:.02em;color:rgba(235,235,235,.4);text-align:center}

@media (max-width:1199.98px){
  .box-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tiers.tiers-3{grid-template-columns:repeat(3,1fr);gap:14px}
  .tiers-3 .tier{padding:34px 22px 30px}
  .tiers-3 .tier h3{font-size:34px}
  .tiers-3 .tier-price{font-size:36px}
  .steps{gap:14px}
  .step{padding:28px 24px 30px}
  .step-shot{width:calc(100% + 20px);margin:-14px -10px 6px}
  .biab-hero .hero-content{gap:56px}
  .step h3{font-size:21px}
  .needs-grid{gap:14px}
}
@media (max-width:833.98px){
  .biab-hero .hero-top{gap:28px}
  .biab-hero .hero-caption-title > .chip{white-space:normal;text-align:center;font-size:14px;line-height:16px;padding:9px 12px;max-width:100%}
  /* stacked buttons: identical width and height */
  .hero-btns{flex-direction:column;align-items:stretch;width:100%;max-width:340px;gap:12px}
  .hero-btns .btn-cta,.hero-btns .btn-glass{width:100%;min-height:62px}
  .hero-btns .btn-cta .btn-inner{width:100%;min-height:58px}
  .hero-btns .btn-glass{height:auto}
  .hero-stats{gap:8px}
  .hero-stats .chip{font-size:14px;padding:9px 12px}
  .biab-content{gap:36px}
  .biab-head{gap:20px}
  .box-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .box-item.wide{flex-direction:column;align-items:flex-start;gap:14px}
  .box-item:nth-last-child(2){grid-column:1 / -1}   /* phones: the Google Ads tile (9th of 10) would sit alone beside an empty slot, so it spans the row */
  .box-copy .box-top{flex-wrap:wrap;gap:8px}
  .box-top{flex-wrap:wrap}
  .box-tag{padding:4px 6px;font-size:9px}
  .box-item{padding:20px 16px 18px;border-radius:16px}
  .box-item h3{font-size:16px}
  .box-item p{font-size:14px;line-height:21px}
  .tiers.tiers-3{grid-template-columns:1fr;gap:18px}
  .tiers-3 .tier{padding:34px 26px 30px}
  .pay-notes{gap:12px}
  .steps{grid-template-columns:1fr;gap:14px}
  .step{padding:26px 22px 28px}
  .step-shot{width:calc(100% + 20px);margin:-14px -10px 6px;border-radius:12px}
  .biab-hero .hero-content{gap:40px}
  .biab-hero{padding-bottom:90px}
  .needs-grid{grid-template-columns:1fr;gap:14px}
  .needs-photo{border-radius:16px}
  .needs-photo img{height:auto;aspect-ratio:4/3}
  .needs-panel{padding:8px 22px 24px}
  .needs-panel .checks li{font-size:16px;line-height:24px;padding:13px 0 13px 28px}
  .faq summary{padding:18px 20px;font-size:17px}
  .faq-body{padding:0 20px 20px}
  .faq-body p{font-size:15px;line-height:24px}
}

/* ====================== INNER PAGES (about / services / pricing / contact / schedule / legal) ====================== */
.menu > a.is-current{color:#fff}
.inline-link{color:#ffd400;text-decoration:underline;text-underline-offset:3px}
.inline-link:hover{color:#ffe14d}
.tiers.tiers-2{grid-template-columns:repeat(2,1fr);max-width:760px;margin-left:auto;margin-right:auto}
.tiers.tiers-1{grid-template-columns:1fr;max-width:420px;margin-left:auto;margin-right:auto}
.box-grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.page-hero .hero-btns{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}
.page-hero .hero-btns .btn-glass{height:78px}
.steps .step-num{font-size:48px}
.needs-panel .needs-foot{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:600;font-size:24px;letter-spacing:0;text-transform:none}

/* forms (contact + schedule): glass panels, header-glass inputs, the site's yellow button */
.contact-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:22px;align-items:start;width:100%}
.contact-form{padding:36px 36px 34px;font-family:"Inter Tight",sans-serif}
.form-title{margin:0 0 22px;font-family:"Inter",sans-serif;font-weight:600;font-size:30px;line-height:1.2;letter-spacing:-1.2px;color:rgba(255,255,255,.94)}
.form-title em{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:600;font-size:38px;letter-spacing:0;color:#ffd400}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:flex;flex-direction:column;gap:7px}
.field.full{grid-column:1 / -1}
.field label{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#ffd400}
.field input,.field select,.field textarea{width:100%;padding:13px 14px;border-radius:8px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);box-shadow:rgba(255,255,255,.06) 0 0 30px 0 inset;
  font-family:"Inter Tight",sans-serif;font-size:16px;color:#fff;outline:none;transition:border-color .2s ease,background .2s ease;-webkit-appearance:none;appearance:none}
.field input::placeholder,.field textarea::placeholder{color:rgba(235,235,235,.35)}
.field input:focus,.field select:focus,.field textarea:focus{border-color:rgba(255,212,0,.6);background:rgba(255,255,255,.08)}
.field select{background-image:linear-gradient(45deg,transparent 50%,#bbb 50%),linear-gradient(135deg,#bbb 50%,transparent 50%);background-position:calc(100% - 20px) 55%,calc(100% - 14px) 55%;background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:40px}
.field select option{background:#111;color:#fff}
.field textarea{min-height:130px;resize:vertical}
.hp{display:none}
.btn-submit{display:flex;align-items:center;justify-content:center;width:100%;padding:15px 18px;border-radius:8px;border:0;cursor:pointer;
  background:linear-gradient(90deg,#ffd400 0%,#e0b800 100%);color:#111;font-family:"Inter Tight",sans-serif;font-size:17px;font-weight:500;letter-spacing:.2px;
  box-shadow:rgba(255,255,255,.5) 0 2px 5px 0 inset,#fff0a0 0 -3px 10px 0 inset;transition:filter .2s ease}
.btn-submit:hover{filter:brightness(1.06)}
.form-note{margin:14px 0 0;font-size:14px;line-height:22px;color:#9a9a9a;text-align:center}
.form-note a{color:#ffd400}
.contact-side{display:flex;flex-direction:column;gap:14px}
.side-card{padding:22px 24px;font-family:"Inter Tight",sans-serif}
.side-card p{margin:0;font-size:16px;line-height:26px;color:#d6d6d6}
.side-card p a{color:#fff}
.side-card p a:hover{color:#ffd400}
.side-label{margin:0 0 8px;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#ffd400}
.side-btn{margin-top:14px}

/* scheduler: calendar + time slots + form, three glass columns */
.scheduler{display:grid;grid-template-columns:1.1fr .8fr 1.4fr;gap:18px;align-items:start;width:100%;font-family:"Inter Tight",sans-serif}
.sched-col{padding:22px 22px 24px}
.cal-head{display:flex;align-items:center;justify-content:space-between;margin:6px 0 12px}
.cal-title{font-size:17px;font-weight:600;color:#fff}
.cal-prev,.cal-next{width:36px;height:36px;border-radius:8px;border:0;cursor:pointer;color:#fff;font-size:22px;line-height:1;background:rgba(255,255,255,.06);box-shadow:rgba(255,255,255,.1) 0 0 30px 0 inset}
.cal-prev:hover,.cal-next:hover{background:rgba(255,255,255,.12)}
.cal-prev:disabled,.cal-next:disabled{opacity:.3;cursor:default}
.cal-dow{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:4px;text-align:center;font-size:11px;font-weight:600;letter-spacing:.1em;color:#777}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;max-width:440px;margin:0 auto}   /* keeps day cells a sane size when the calendar is the only column */
.cal-dow{max-width:440px;margin-left:auto;margin-right:auto}
.cal-pad{aspect-ratio:1}
.cal-day{aspect-ratio:1;border-radius:8px;border:0;background:none;color:rgba(255,255,255,.3);font-family:"Inter Tight",sans-serif;font-size:14px;cursor:default}
.cal-day.is-open{color:#fff;cursor:pointer;background:rgba(255,255,255,.05);box-shadow:rgba(255,255,255,.06) 0 0 20px 0 inset}
.cal-day.is-open:hover{background:rgba(255,212,0,.14)}
.cal-day.is-today{outline:1px solid rgba(255,255,255,.25);outline-offset:-1px}
.cal-day.is-selected{background:linear-gradient(90deg,#ffd400,#e0b800);color:#111;font-weight:600}
.slots-hint{margin:8px 0 12px;font-size:13px;line-height:20px;color:#9a9a9a}
.slots{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.slot{padding:11px 8px;border-radius:8px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:#fff;font-family:"Inter Tight",sans-serif;font-size:14px;cursor:pointer;transition:background .2s ease,border-color .2s ease}
.slot:hover{background:rgba(255,212,0,.14);border-color:rgba(255,212,0,.4)}
.slot.is-selected{background:linear-gradient(90deg,#ffd400,#e0b800);border-color:transparent;color:#111;font-weight:600}
.sched-summary{margin:6px 0 16px;font-size:15px;line-height:24px;color:#9a9a9a}
.sched-summary strong{color:#ffd400;font-weight:600}
.sched-form-wrap .form-grid{opacity:.35;pointer-events:none;transition:opacity .3s ease}
.sched-form-wrap.is-ready .form-grid{opacity:1;pointer-events:auto}
.sched-error{margin:0 0 12px;font-size:14px;color:#ffb3b3}

/* legal text */
.prose{max-width:860px;margin:0 auto;padding:44px 48px;font-family:"Inter Tight",sans-serif;color:#d6d6d6}
.prose h2{margin:34px 0 12px;font-family:"Inter",sans-serif;font-size:22px;font-weight:600;letter-spacing:-.5px;color:#fff}
.prose p{margin:0 0 14px;font-size:16px;line-height:27px}
.prose .effective{color:#ffd400;font-weight:500}
.prose ul{margin:0 0 14px;padding-left:22px}
.prose li{margin:0 0 8px;font-size:16px;line-height:26px}

@media (max-width:1199.98px){
  .box-grid.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .contact-grid{grid-template-columns:1.4fr 1fr;gap:16px}
  .contact-form{padding:28px 26px 26px}
  .scheduler{grid-template-columns:1fr 1fr;gap:14px}
  .sched-form-wrap{grid-column:1 / -1}
}
@media (max-width:833.98px){
  .tiers.tiers-2,.tiers.tiers-1{grid-template-columns:1fr}
  .box-grid.cols-4{grid-template-columns:1fr 1fr}
  .page-hero .hero-btns{flex-direction:column;align-items:stretch;width:100%;max-width:340px;gap:12px}
  .page-hero .hero-btns .btn-cta,.page-hero .hero-btns .btn-glass{width:100%;min-height:62px}
  .page-hero .hero-btns .btn-cta .btn-inner{width:100%;min-height:58px}
  .page-hero .hero-btns .btn-glass{height:auto}
  .contact-grid{grid-template-columns:1fr}
  .contact-form{padding:24px 18px 22px}
  .form-title{font-size:26px}
  .form-title em{font-size:32px}
  .form-grid{grid-template-columns:1fr;gap:14px}
  .scheduler{grid-template-columns:1fr}
  .sched-col{padding:18px 16px 20px}
  .slots{grid-template-columns:repeat(3,1fr)}
  .prose{padding:28px 20px}
  .inner h1 em,.inner .final-title em{white-space:normal}   /* long gold phrases (e.g. "Recommended by AI.") may wrap on phones instead of running off the edge */
}