/* Shared styles for the niche, location and Insights pages.
   Same tokens and motion rules as the homepage and case study:
   animate transform/opacity only, never filter: blur(). */
:root{
  --ink:#0b0b0d; --ink-2:#15171a; --cream:#f6ead6; --muted:#9b9488; --muted-2:#5f5e5a;
  --copper:#ff9d52; --copper-2:#ff7a45; --pink:#c95a7c; --teal:#5dcaa5; --champagne:#e9b98a;
  --teal-bg:rgba(95,202,170,0.08); --teal-line:rgba(95,202,170,0.25);
  --line:rgba(246,234,214,0.1);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;color:var(--cream);background:var(--ink);
     font-family:Almarai,ui-sans-serif,system-ui,-apple-system,sans-serif;
     line-height:1.6;overflow-x:hidden;cursor:none;}
a{color:inherit;text-decoration:none;}
input,textarea,select,[contenteditable]{cursor:auto;}
.cursor-dot{position:fixed;top:0;left:0;width:22px;height:22px;border-radius:50%;
  background:radial-gradient(circle,var(--copper) 0%,transparent 70%);pointer-events:none;
  z-index:999;transform:translate(-50%,-50%);transition:width .2s,height .2s;mix-blend-mode:screen;}
@media (hover:none){body{cursor:auto;}.cursor-dot{display:none;}}

.blobs{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;}
.blob{position:absolute;width:68vw;height:68vw;border-radius:50%;opacity:.3;
      background:radial-gradient(circle,var(--blob-color) 0%,transparent 65%);will-change:transform;
      animation:drift 18s ease-in-out infinite alternate;}
.blob.one{--blob-color:var(--copper-2);top:-22%;left:-20%;}
.blob.two{--blob-color:var(--teal);bottom:-28%;right:-20%;opacity:.22;animation-delay:-6s;}
.blob.three{--blob-color:var(--pink);top:24%;right:12%;opacity:.16;animation-delay:-3s;}
@keyframes drift{0%{transform:translate(0,0) scale(1);}50%{transform:translate(5%,7%) scale(1.12);}100%{transform:translate(-4%,-5%) scale(.95);}}

.content{position:relative;z-index:1;}
.wrap{width:min(820px,calc(100% - 32px));margin:0 auto;}
.wrap-wide{width:min(1100px,calc(100% - 32px));margin:0 auto;}

nav.topbar{display:flex;align-items:center;justify-content:space-between;padding:26px 0;gap:12px;}
nav.topbar .wordmark{font-size:19px;font-weight:800;letter-spacing:-.01em;display:flex;align-items:center;gap:10px;}
nav.topbar .wordmark img{width:30px;height:30px;}
nav.topbar .links{display:flex;gap:22px;align-items:center;font-size:14px;font-weight:700;}
nav.topbar .links a.home:hover{color:var(--copper);}
.btn{display:inline-block;background:linear-gradient(90deg,var(--copper-2),var(--copper));color:var(--ink);
     font-weight:800;border-radius:100px;transition:transform .2s ease;white-space:nowrap;}
.btn:hover{transform:translateY(-2px);}
.btn.sm{padding:11px 22px;font-size:13px;}
.btn.lg{padding:16px 32px;font-size:15px;}
.btn.ghost{background:transparent;color:var(--cream);border:1px solid rgba(233,185,138,.4);}

.crumbs{font-size:13px;color:var(--muted);margin:10px 0 0;}
.crumbs a:hover{color:var(--copper);}
header.hero{position:relative;padding:34px 0 10px;}
.eyebrow{font-size:12px;letter-spacing:.14em;color:var(--copper);font-weight:800;text-transform:uppercase;margin-bottom:14px;}
h1{font-size:clamp(32px,6vw,54px);line-height:1.08;font-weight:800;letter-spacing:-.015em;margin:0 0 16px;}
.grad{background:linear-gradient(120deg,var(--copper) 0%,var(--copper-2) 45%,var(--pink) 100%);
      -webkit-background-clip:text;background-clip:text;color:transparent;}
.lead{font-size:18px;color:#d9d2c4;max-width:640px;margin:0 0 24px;}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap;}
header.hero .eyebrow, header.hero h1, header.hero .lead, header.hero .hero-ctas, header.hero .meta{position:relative;z-index:1;}

section{padding:34px 0;}
h2{font-size:clamp(24px,4vw,32px);line-height:1.2;font-weight:800;letter-spacing:-.01em;margin:0 0 14px;}
h3{font-size:18px;font-weight:800;margin:0 0 6px;color:#fff;}
p{margin:10px 0;font-size:16px;color:#d9d2c4;}
p b, li b{color:#fff;}
ul.dots{margin:12px 0;padding-left:0;list-style:none;}
ul.dots li{position:relative;padding-left:24px;margin:12px 0;font-size:16px;color:#d9d2c4;line-height:1.6;}
ul.dots li::before{content:"";position:absolute;left:0;top:10px;width:9px;height:9px;border-radius:50%;
           background:linear-gradient(120deg,var(--copper),var(--copper-2));}
.content a.inline{color:var(--copper);border-bottom:1px solid rgba(255,157,82,.35);}
.content a.inline:hover{border-bottom-color:var(--copper);}

/* Highlighted example / callout */
.callout{margin:16px 0;background:var(--teal-bg);border:1px solid var(--teal-line);
        border-radius:16px;padding:22px 26px;color:#e9f5ef;}
.callout p{color:#e9f5ef;margin:6px 0;}
.callout .k{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--teal);}

/* Card grid */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin:16px 0;}
.card{background:rgba(246,234,214,.04);border:1px solid var(--line);border-radius:16px;padding:22px;
      transition:transform .3s ease,border-color .3s ease;}
.card:hover{transform:translateY(-4px);border-color:rgba(233,185,138,.45);}
.card p{font-size:15px;margin:0;}
a.card .more{display:block;margin-top:12px;font-size:14px;font-weight:700;color:var(--copper);}

/* Numbered steps with a rail that grows on scroll */
.timeline{position:relative;margin:18px 0 0;padding-left:56px;}
.timeline .rail{position:absolute;left:17px;top:6px;bottom:6px;width:2px;background:var(--line);}
.timeline .rail i{position:absolute;inset:0;background:linear-gradient(180deg,var(--copper),var(--pink));
                  transform:scaleY(var(--grow,0));transform-origin:top;will-change:transform;}
.step{position:relative;margin:0 0 26px;}
.step .n{position:absolute;left:-56px;top:-2px;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;
         font-size:13px;font-weight:800;color:var(--ink);background:linear-gradient(135deg,var(--copper),var(--copper-2));}
.step p{margin:0;}

/* Metrics */
.metrics{display:flex;gap:16px;margin:12px 0;flex-wrap:wrap;}
.metric{flex:1;min-width:200px;background:rgba(255,243,219,.04);border:1px solid var(--line);
        border-radius:16px;padding:24px;}
.metric .big{font-size:36px;font-weight:800;letter-spacing:-.02em;color:var(--copper);line-height:1;}
.metric .lbl{font-size:14px;color:var(--muted);margin-top:10px;line-height:1.45;}

/* Client value calculator */
.calc{border:1px solid rgba(233,185,138,.28);border-radius:18px;padding:26px;background:rgba(246,234,214,.03);margin:16px 0;}
.calc-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;}
.calc label{display:block;font-size:13px;color:var(--muted);font-weight:700;margin-bottom:6px;}
.calc input{width:100%;background:var(--ink-2);border:1px solid var(--line);border-radius:10px;color:var(--cream);
            font:inherit;font-size:18px;padding:10px 12px;}
.calc input:focus{outline:2px solid var(--copper);outline-offset:1px;}
.calc-out{margin-top:20px;font-size:15px;color:var(--muted);}
.calc-out .v{display:block;font-size:44px;font-weight:800;color:var(--copper);line-height:1.1;}
.calc-note{font-size:13px;color:var(--muted-2);margin-top:10px;}

/* Offer box */
.offer{border:1px solid rgba(233,185,138,.28);border-radius:18px;padding:26px;background:rgba(246,234,214,.04);}
.offer .price{font-size:40px;font-weight:800;}
.offer .price small{font-size:14px;color:var(--muted);font-weight:400;margin-left:6px;}

/* FAQ */
.faq details{border-bottom:1px solid var(--line);padding:16px 0;}
.faq summary{font-weight:700;font-size:16px;list-style:none;display:flex;justify-content:space-between;gap:16px;cursor:none;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";color:var(--copper);font-weight:800;}
.faq details[open] summary::after{content:"-";}
.faq details p{color:var(--muted);font-size:15px;line-height:1.7;margin:10px 0 0;}
@media (hover:none){.faq summary{cursor:auto;}}

/* Closing call to action */
.cta{margin:24px 0 0;background:linear-gradient(120deg,var(--ink-2),#1c1f24);border:1px solid var(--line);
     border-radius:18px;padding:28px 30px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;}
.cta .h{font-size:21px;font-weight:800;}
.cta .s{font-size:14px;color:var(--muted);margin-top:5px;max-width:460px;}

/* Article (Insights) */
.meta{font-size:14px;color:var(--muted);}
.prose h2{margin-top:34px;}
.prose p, .prose li{font-size:17px;line-height:1.75;}
.toc{border-left:2px solid rgba(233,185,138,.4);padding:4px 0 4px 18px;margin:18px 0;}
.toc a{display:block;color:var(--muted);font-size:15px;margin:6px 0;}
.toc a:hover{color:var(--copper);}

/* Footer with link groups */
footer.site{border-top:1px solid var(--line);margin-top:48px;padding:34px 0 44px;color:var(--muted-2);font-size:13px;}
footer.site .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:22px;margin-bottom:24px;}
footer.site .h{font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:var(--champagne);margin-bottom:10px;}
footer.site .cols a{display:block;color:var(--muted);margin:6px 0;font-size:14px;}
footer.site .cols a:hover{color:var(--copper);}
footer.site .legal a{color:var(--teal);}

/* Scroll progress bar */
.progress{position:fixed;top:0;left:0;height:3px;width:100%;z-index:998;transform:scaleX(0);transform-origin:0 50%;
          background:linear-gradient(90deg,var(--copper-2),var(--copper));will-change:transform;}

/* Reveal on scroll */
.reveal{opacity:0;transform:translateY(40px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1);}
.reveal.visible{opacity:1;transform:none;}

/* Hero bubbles (decorative) */
.bubbles{position:absolute;inset:-20px -40px;pointer-events:none;}
.bubble{position:absolute;left:var(--x);top:var(--y);transform:translate3d(0,var(--py,0px),0);will-change:transform;}
.bubble span{display:block;font-size:12px;font-weight:700;padding:8px 14px;border-radius:40px;white-space:nowrap;color:var(--cream);
             background:rgba(246,234,214,.05);border:1px solid rgba(233,185,138,.28);animation:bob 5s ease-in-out infinite alternate;}
.bubble.t span{color:var(--teal);border-color:var(--teal-line);background:var(--teal-bg);}
.bubble:nth-child(2) span{animation-delay:-2s;} .bubble:nth-child(3) span{animation-delay:-3.5s;}
@keyframes bob{from{transform:translateY(0);}to{transform:translateY(-9px);}}
@media (max-width:900px){.bubbles{display:none;}}

@media (max-width:600px){
  nav.topbar .links a.home{display:none;}
  nav.topbar .wordmark{font-size:16px;}
  .lead{font-size:16px;}
  .cta{padding:22px;}
  .calc-out .v{font-size:36px;}
}
@media (prefers-reduced-motion: reduce){
  .blob{animation:none;} .bubble span{animation:none;}
  .reveal{opacity:1;transform:none;transition:none;}
  .timeline .rail i{transform:scaleY(1);}
}

/* Two-up card grid (Insights hub) and numbered lists without dot markers */
.cards.two{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));}
ul.dots.num li{padding-left:0;}
ul.dots.num li::before{display:none;}