/*
Theme Name: Avada Child
Description: Child theme for Avada theme
Author: ThemeFusion
Author URI: https://theme-fusion.com
Template: Avada
Version: 1.0.0
Text Domain:  Avada
*/

/* =====================================================================
   Craig Ashcroft — Avada child theme CSS (v3 design)
   ===================================================================== */
/* Font: select "Plus Jakarta Sans" in Avada > Options > Typography so Avada loads it. */

:root{
  /* ===== Colours: controlled from Avada > Options > Colours (Color Palette) =====
     Color 1 = light text      Color 2 = light sections   Color 3 = muted text
     Color 4 = Dojo green      Color 5 = cards            Color 6 = alternate dark
     Color 7 = main ink blue   Color 8 = footer / darkest
     (the hex after each comma is only a fallback) */
  --text:var(--awb-color1,#eef2ff);
  --stone:var(--awb-color2,#eef1f6);
  --muted:var(--awb-color3,#9ba9cc);
  --green:var(--awb-color4,#00d980);
  --ink-3:var(--awb-color5,#112148);
  --ink-2:var(--awb-color6,#0b1735);
  --ink-1:var(--awb-color7,#071027);
  --ink-0:var(--awb-color8,#040a18);
  /* shades worked out automatically from the palette */
  --ink-4:color-mix(in srgb,var(--ink-3),#fff 9%);
  --stone-2:color-mix(in srgb,var(--stone),#000 5%);
  --ink-txt:var(--ink-1);
  --muted-lt:color-mix(in srgb,var(--ink-1) 62%,#fff);
  --line:color-mix(in srgb,var(--muted) 14%,transparent);
  --line-lt:color-mix(in srgb,var(--stone),#000 11%);
  --green-dk:color-mix(in srgb,var(--green),#000 22%);
  --green-hover:color-mix(in srgb,var(--green),#fff 18%);
  --green-ink:color-mix(in srgb,var(--green),#000 90%);
  --green-glow:color-mix(in srgb,var(--green) 35%,transparent);
  --wa:#25d366;
  --font:"Plus Jakarta Sans","Helvetica Neue",Arial,sans-serif;
  --pill:999px; --r:22px; --max:1240px; --ease:cubic-bezier(.2,.75,.15,1);
}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{font-family:var(--font);background:var(--ink-1);-webkit-font-smoothing:antialiased;overflow-x:hidden}
.ca-sec,.ca-footer{color:var(--text);font-size:17px;line-height:1.6}
:where(.ca-sec img,.ca-footer img){display:block;max-width:100%}
.chev{flex:none}
:where(.ca-sec a:not(.fusion-button),.ca-footer a){color:inherit;text-decoration:none}
:where(.ca-sec button:not(.fusion-button)){font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--green);outline-offset:3px;border-radius:6px}
.ca-sec{position:relative}
.ca-sec h1,.ca-sec h2,.ca-sec h3,.ca-sec h4,.ca-footer h4{font-family:var(--font)!important;font-weight:700!important;letter-spacing:-.035em!important;line-height:1.04!important;color:var(--text)!important;margin:0;padding:0;text-transform:none!important}
.light h1,.light h2,.light h3,.light h4{color:var(--ink-txt)!important}
.ca-sec .green,.ca-sec h2 .green,.ca-sec h1 .green{color:var(--green)!important}
.light .green,.light h2 .green{color:var(--green-dk)!important}
:where(.ca-sec p,.ca-sec blockquote,.ca-footer p){margin:0;padding:0}
.ca-sec h2{font-size:clamp(2.1rem,4.2vw,3.6rem)!important}
.ca-sec h3{font-size:clamp(1.2rem,1.6vw,1.45rem)!important;letter-spacing:-.02em!important;line-height:1.15!important}
.ca-sec h4,.ca-footer h4{font-size:1.05rem!important;letter-spacing:-.01em!important}
:where(.ca-sec p){max-width:62ch}
.lead{font-size:clamp(1.02rem,1.3vw,1.17rem);color:var(--muted);margin-top:18px}
.green{color:var(--green)}
.center{text-align:center}.center p{margin-inline:auto}
.eyebrow{display:inline-flex;align-items:center;gap:10px;padding:7px 14px 7px 8px;border:1px solid var(--line);border-radius:var(--pill);font-size:.82rem;font-weight:600;color:var(--muted);background:rgba(255,255,255,.03);margin-bottom:20px}
.eyebrow i{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px color-mix(in srgb,var(--green) 18%,transparent)}
/* light sections */
.light{background:var(--stone);color:var(--ink-txt)}
.light .lead,.light .muted{color:var(--muted-lt)}
.light .eyebrow{border-color:var(--line-lt);color:var(--muted-lt);background:#fff}
.light .green{color:var(--green-dk)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 25px;border-radius:var(--pill);font-weight:700;font-size:.97rem;white-space:nowrap;transition:transform .35s var(--ease),background .3s,box-shadow .3s,color .3s,border-color .3s}
.btn:hover{transform:translateY(-2px)}
.btn .ar{transition:transform .35s var(--ease)}.btn:hover .ar{transform:translateX(4px)}
.btn-green{background:var(--green);color:var(--green-ink);box-shadow:0 10px 30px -10px var(--green-glow)}
.btn-ghost{border:1px solid rgba(255,255,255,.28);color:#fff;background:rgba(255,255,255,.04)}
.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.1)}
.btn-dark{background:var(--ink-1);color:#fff}.btn-dark:hover{background:var(--ink-3)}
.light .btn-ghost{border-color:var(--line-lt);color:var(--ink-txt);background:#fff}
.link{font-weight:700;display:inline-flex;gap:8px;align-items:center;color:var(--green)}
.light .link{color:var(--ink-txt)}
.link .ar{transition:transform .35s var(--ease)}.link:hover .ar{transform:translateX(4px)}
.play-ic{width:24px;height:24px;border-radius:50%;background:#fff;display:grid;place-items:center}
.play-ic::after{content:"";border-left:8px solid var(--ink-1);border-top:5px solid transparent;border-bottom:5px solid transparent;margin-left:2px}

/* ================= HERO (compact) ================= */
.hero{overflow:hidden;background:
  radial-gradient(800px 520px at 80% 40%,color-mix(in srgb,var(--green) 14%,transparent),transparent 60%),
  radial-gradient(700px 500px at 8% 100%,rgba(60,110,255,.14),transparent 60%),var(--ink-1)}
.hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(color-mix(in srgb,var(--muted) 5%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--muted) 5%,transparent) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse at 60% 40%,#000 20%,transparent 70%);pointer-events:none}
.hero > .fusion-builder-row{position:relative;z-index:2}
.hero-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:40px;align-items:center}
.hero h1{font-size:clamp(2.5rem,4.6vw,4.2rem)!important;font-weight:800!important;max-width:14ch}
.hero h1 .ln{display:block;overflow:hidden;padding-bottom:.05em}
.hero h1 .ln>span{display:block}
.hero .lead{max-width:47ch;color:color-mix(in srgb,var(--text) 78%,transparent)}
.ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.hero-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:34px 0 0}
.chip{padding:15px 18px;border-radius:18px;background:color-mix(in srgb,var(--ink-2) 60%,transparent);border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);display:flex;gap:13px;align-items:center}
.chip .ic{width:38px;height:38px;border-radius:12px;background:color-mix(in srgb,var(--green) 12%,transparent);display:grid;place-items:center;flex:none}
.chip .ic svg{width:19px;height:19px;stroke:var(--green)}
.chip b{display:block;font-size:.95rem;line-height:1.3}.chip span{font-size:.8rem;color:var(--muted)}
/* hero visual: arch portrait + machine + toast + ring */
.stage{position:relative;height:452px;max-width:460px;margin-left:auto;width:100%}
.stage .disc{position:absolute;right:4%;top:6%;width:84%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--green) 55%,transparent),color-mix(in srgb,var(--green) 8%,transparent) 60%,transparent 72%)}
.stage .ring{position:absolute;border-radius:50%;border:1px solid color-mix(in srgb,var(--muted) 18%,transparent)}
.stage .ring.r1{right:-6%;top:-4%;width:104%;aspect-ratio:1}
.stage .ring.r2{right:10%;top:14%;width:70%;aspect-ratio:1;border-style:dashed;border-color:color-mix(in srgb,var(--green) 30%,transparent)}
.arch{position:absolute;right:6%;top:0;width:68%;height:100%;border-radius:200px 200px 28px 28px;overflow:hidden;border:1.5px solid color-mix(in srgb,var(--green) 45%,transparent);box-shadow:0 0 0 8px rgba(255,255,255,.03),0 50px 90px -30px rgba(0,0,0,.85)}
.arch img{width:100%;height:100%;object-fit:cover;object-position:62% 18%;transform:scale(1.18);transform-origin:62% 30%}
.arch::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,color-mix(in srgb,var(--ink-1) 85%,transparent),color-mix(in srgb,var(--ink-1) 0%,transparent) 34%)}
.arch .tag{position:absolute;left:22px;right:22px;bottom:18px;z-index:2}
.arch .tag b{display:block;font-size:1.08rem}.arch .tag span{font-size:.8rem;color:var(--muted)}
.machine{position:absolute;left:-2%;bottom:-4%;width:46%;z-index:4;transform:rotate(-10deg);filter:drop-shadow(0 30px 40px rgba(0,0,0,.6))}
.machine img{width:100%}
.toast{position:absolute;left:4%;bottom:44%;z-index:5;display:flex;gap:10px;align-items:center;padding:10px 14px 10px 10px;border-radius:16px;background:#fff;color:var(--ink-txt);box-shadow:0 20px 40px -12px rgba(0,0,0,.55);font-size:.8rem;line-height:1.25}
.toast .tick{width:30px;height:30px;border-radius:50%;background:var(--green);display:grid;place-items:center;flex:none}
.toast .tick svg{width:16px;height:16px}
.toast b{display:block;font-size:.9rem}.toast small{color:var(--muted-lt)}
.seal{position:absolute;right:-2%;top:-2%;z-index:5;width:118px;height:118px}
.seal svg{width:100%;height:100%}
.seal .center{position:absolute;inset:30px;border-radius:50%;background:var(--green);color:var(--green-ink);display:grid;place-items:center;font-size:1.5rem;font-weight:900;box-shadow:0 10px 30px -8px var(--green-glow)}
.wave{display:block;width:100%;height:70px;margin-top:30px}
@media(max-width:960px){
  .hero{padding-top:120px}.hero-grid{grid-template-columns:1fr}
  .stage{margin:30px auto 0;height:420px}
  .hero-strip{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){.stage{height:360px}.seal{width:96px;height:96px}.seal .center{inset:24px}.hero-strip{grid-template-columns:1fr}}

/* ================= BENTO (light) ================= */
.bento{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:minmax(150px,auto);gap:16px;margin-top:54px}
.tile{position:relative;border-radius:28px;padding:30px;overflow:hidden;background:#fff;border:1px solid var(--line-lt);display:flex;flex-direction:column;gap:10px;transition:transform .5s var(--ease),box-shadow .4s}
.tile:hover{transform:translateY(-4px);box-shadow:0 30px 60px -30px color-mix(in srgb,var(--ink-1) 35%,transparent)}
.tile p{color:var(--muted-lt);font-size:.96rem}
.tile .k{font-size:.74rem;font-weight:800;letter-spacing:.12em;color:var(--green-dk)}
.t-pay{grid-column:span 7;grid-row:span 2;background:var(--ink-1);color:var(--text);border:0;justify-content:flex-end;min-height:440px}
.t-pay p{color:var(--muted)}
.t-pay .k{color:var(--green)}
.t-pay h3{font-size:clamp(1.8rem,2.8vw,2.6rem)}
.t-pay .bgimg{position:absolute;inset:0;background:url("https://a.storyblok.com/f/267449/1080x904/52f733fc50/home-capture-max.jpg") center/cover;opacity:.55;transition:transform 1.2s var(--ease)}
.t-pay:hover .bgimg{transform:scale(1.05)}
.t-pay::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--ink-1) 22%,color-mix(in srgb,var(--ink-1) 10%,transparent) 75%);z-index:1}
.t-pay>*:not(.bgimg){position:relative;z-index:2}
.t-pay .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.t-pay .chips span{padding:8px 14px;border-radius:var(--pill);background:rgba(255,255,255,.1);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:.84rem;font-weight:600}
.t-fund{grid-column:span 5;background:var(--green);border:0;color:var(--green-ink)}
.t-fund p{color:color-mix(in srgb,var(--green-ink) 72%,transparent)}.t-fund .k{color:var(--green-ink)}
.t-fund .blob{position:absolute;right:-50px;bottom:-60px;width:200px;height:200px;border-radius:50%;border:30px solid rgba(255,255,255,.25)}
.t-grow{grid-column:span 5}
.t-grow .bars{display:flex;align-items:flex-end;gap:8px;height:70px;margin-top:auto}
.t-grow .bars i{flex:1;border-radius:8px 8px 3px 3px;background:var(--stone-2);transform-origin:bottom}
.t-grow .bars i:last-child{background:var(--green)}
.t-stat{grid-column:span 4;align-items:flex-start;justify-content:space-between}
.t-stat b{font-size:clamp(2.6rem,4vw,3.6rem);font-weight:800;letter-spacing:-.05em;line-height:1}
.t-stat b em{font-style:normal;color:var(--green-dk)}
.t-quote{grid-column:span 4;background:var(--stone-2);border:0;justify-content:space-between}
.t-quote blockquote{font-size:1.2rem;font-weight:700;letter-spacing:-.02em;line-height:1.3}
.t-quote cite{font-style:normal;font-size:.88rem;color:var(--muted-lt)}
.t-tap{grid-column:span 4;flex-direction:row;align-items:center;gap:18px}
.t-tap img{width:96px;height:96px;border-radius:20px;object-fit:cover;flex:none}
@media(max-width:1000px){.t-pay,.t-fund,.t-grow{grid-column:span 12}.t-stat,.t-quote,.t-tap{grid-column:span 6}}
@media(max-width:640px){.t-stat,.t-quote,.t-tap{grid-column:span 12}.t-pay{min-height:380px}}

/* ================= TIMELINE (dark) ================= */
.process{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;align-items:start}
.process .sticky{position:sticky;top:130px}
.tl{position:relative;padding-left:70px}
.tl::before{content:"";position:absolute;left:23px;top:10px;bottom:10px;width:2px;background:var(--line)}
.tl .fill{position:absolute;left:23px;top:10px;width:2px;height:0;background:var(--green);box-shadow:0 0 12px var(--green-glow)}
.tl-step{position:relative;padding:0 0 60px}
.tl-step:last-child{padding-bottom:0}
.tl-step .n{position:absolute;left:-70px;top:0;width:48px;height:48px;border-radius:50%;background:var(--ink-1);border:2px solid var(--line);display:grid;place-items:center;font-weight:800;font-size:.95rem;transition:background .4s,border-color .4s,color .4s}
.tl-step.on .n{background:var(--green);border-color:var(--green);color:var(--green-ink)}
.tl-step .k{font-size:.74rem;font-weight:800;letter-spacing:.12em;color:var(--green)}
.tl-step h3{font-size:clamp(1.5rem,2.2vw,2rem);margin:8px 0 10px}
.tl-step p{color:var(--muted)}
@media(max-width:900px){.process{grid-template-columns:1fr;gap:40px}.process .sticky{position:static}}

/* ================= MACHINES rail (light) ================= */
.rail-head{display:flex;justify-content:space-between;align-items:end;gap:30px;flex-wrap:wrap}
.rail-nav{display:flex;gap:10px}
.rail-nav button{width:52px;height:52px;border-radius:50%;border:1px solid var(--line-lt);background:#fff;font-size:1.2rem;transition:.3s}
.rail-nav button:hover{background:var(--ink-1);color:#fff;border-color:var(--ink-1)}
.rail{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:44px 0 10px;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.mc{flex:0 0 min(380px,82vw);scroll-snap-align:start;border-radius:30px;background:#fff;border:1px solid var(--line-lt);overflow:hidden;display:flex;flex-direction:column;transition:transform .5s var(--ease),box-shadow .4s}
.mc:hover{transform:translateY(-6px);box-shadow:0 30px 60px -30px color-mix(in srgb,var(--ink-1) 35%,transparent)}
.mc .img{aspect-ratio:1.12;overflow:hidden;background:var(--stone-2)}
.mc .img img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.mc:hover .img img{transform:scale(1.05)}
.mc .body{padding:26px;display:flex;flex-direction:column;gap:8px;flex:1}
.mc .best{font-size:.8rem;font-weight:700;color:var(--muted-lt)}
.mc p{color:var(--muted-lt);font-size:.95rem;flex:1}
.mc .meta{display:flex;justify-content:space-between;align-items:center;margin-top:12px}
.mc .offer{padding:6px 12px;border-radius:var(--pill);background:var(--green);color:var(--green-ink);font-size:.8rem;font-weight:800}
.mc .go{width:44px;height:44px;border-radius:50%;background:var(--ink-1);color:#fff;display:grid;place-items:center;transition:transform .4s var(--ease),background .3s}
.mc:hover .go{transform:rotate(-45deg);background:var(--green-dk)}
.powered{display:flex;flex-wrap:wrap;gap:30px 50px;margin-top:40px;padding-top:30px;border-top:1px solid var(--line-lt);align-items:center}
.powered .lbl{font-size:.82rem;font-weight:700;color:var(--muted-lt);max-width:140px;line-height:1.35}
.powered b{display:block;font-size:1.8rem;font-weight:800;letter-spacing:-.04em;line-height:1}
.powered span{font-size:.85rem;color:var(--muted-lt)}

/* ================= TAGLINE MARQUEE ================= */
.tagline{padding:44px 0;width:100%;overflow:hidden;background:var(--ink-1);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tagline-track{display:flex;gap:40px;width:max-content;align-items:center;font-size:clamp(2.4rem,5.4vw,4.8rem);font-weight:800;letter-spacing:-.04em;white-space:nowrap}
.tagline-track span{color:transparent;-webkit-text-stroke:1.5px color-mix(in srgb,var(--text) 35%,transparent)}
.tagline-track span.f{color:var(--text);-webkit-text-stroke:0}
.tagline-track i{width:22px;height:22px;border-radius:50%;background:var(--green);flex:none}

/* ================= INDUSTRIES (dark) ================= */
.inds{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;height:520px}
.ind{position:relative;border-radius:28px;overflow:hidden;isolation:isolate;display:flex;flex-direction:column;justify-content:flex-end;padding:26px;transition:flex .7s var(--ease)}
.ind img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1.2s var(--ease)}
.ind::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,color-mix(in srgb,var(--ink-1) 95%,transparent) 10%,color-mix(in srgb,var(--ink-1) 0%,transparent) 60%)}
.ind:hover img{transform:scale(1.07)}
.ind .num{position:absolute;top:22px;left:24px;font-weight:800;font-size:.85rem;color:var(--green)}
.ind h3{font-size:1.4rem}
.ind p{color:color-mix(in srgb,var(--text) 75%,transparent);font-size:.9rem;margin-top:6px}
.ind .go{position:absolute;top:18px;right:18px;width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.14);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:grid;place-items:center;transition:.4s var(--ease)}
.ind:hover .go{background:var(--green);color:var(--green-ink);transform:rotate(-45deg)}
@media(max-width:960px){.inds{grid-template-columns:1fr 1fr;height:auto}.ind{min-height:300px}}
@media(max-width:560px){.inds{grid-template-columns:1fr}}

/* ================= ESTIMATOR (light) ================= */
.est-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center}
.est{position:relative;border-radius:32px;background:var(--ink-1);color:var(--text);padding:clamp(26px,4vw,44px);overflow:hidden}
.est::before{content:"";position:absolute;right:-90px;top:-90px;width:260px;height:260px;border-radius:50%;border:40px solid color-mix(in srgb,var(--green) 12%,transparent)}
.est>*{position:relative}
.field{margin-bottom:26px}
.field label{display:flex;justify-content:space-between;font-weight:700;font-size:.95rem;margin-bottom:12px}
.field output{font-weight:800}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:6px;background:linear-gradient(90deg,var(--green) var(--p,30%),rgba(255,255,255,.12) var(--p,30%));outline:none}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border-radius:50%;background:#fff;border:5px solid var(--green);cursor:grab}
input[type=range]::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:#fff;border:5px solid var(--green);cursor:grab}
.est-out{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px}
.est-out div{padding:16px 18px;border-radius:18px;background:rgba(255,255,255,.05);border:1px solid var(--line)}
.est-out span{font-size:.8rem;color:var(--muted)}
.est-out b{display:block;font-size:1.3rem;font-weight:800}
.est-big{margin-top:12px;padding:22px;border-radius:20px;background:var(--green);color:var(--green-ink);display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.est-big b{font-size:clamp(2.2rem,4vw,3rem);font-weight:800;letter-spacing:-.04em;line-height:1}
.est small{display:block;color:var(--muted);font-size:.76rem;margin-top:14px;line-height:1.5}
@media(max-width:900px){.est-wrap{grid-template-columns:1fr}}

/* ================= CRAIG (dark) ================= */
.craig-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.recog{position:relative}
.recog .ph{position:relative;border-radius:28px;overflow:hidden;aspect-ratio:4/3;border:1px solid var(--line)}
.recog .ph img{width:100%;height:100%;object-fit:cover}
.recog .hl{position:absolute;left:45%;top:15%;width:54%;height:11.5%;border:2px solid var(--green);border-radius:12px;box-shadow:0 0 0 6px color-mix(in srgb,var(--green) 15%,transparent),0 0 40px color-mix(in srgb,var(--green) 35%,transparent);transform:rotate(-4deg)}
.recog .card{position:absolute;right:-24px;bottom:-34px;max-width:300px;padding:18px 20px;border-radius:20px;background:#fff;color:var(--ink-txt);box-shadow:0 30px 60px -20px rgba(0,0,0,.6);display:flex;gap:14px}
.recog .card .star{width:40px;height:40px;border-radius:12px;background:var(--green);display:grid;place-items:center;font-weight:900;flex:none}
.recog .card b{display:block;font-size:.98rem;line-height:1.3}
.recog .card small{color:var(--muted-lt);font-size:.82rem;line-height:1.4;display:block;margin-top:4px}
.recog .shape{position:absolute;left:-40px;top:-40px;width:140px;height:140px;border-radius:50%;border:1px dashed color-mix(in srgb,var(--green) 40%,transparent);z-index:-1}
.quotes{margin-top:34px;position:relative;min-height:190px}
.q{position:absolute;inset:0 0 auto 0;opacity:0;visibility:hidden;transition:opacity .6s,transform .6s var(--ease);transform:translateY(10px)}
.q.on{opacity:1;visibility:visible;transform:none;position:relative}
.q blockquote{font-size:clamp(1.25rem,1.9vw,1.6rem);font-weight:700;letter-spacing:-.02em;line-height:1.3}
.q blockquote::before{content:"\201C";display:block;color:var(--green);font-size:3rem;line-height:.6;margin-bottom:8px}
.q cite{display:flex;align-items:center;gap:12px;margin-top:20px;font-style:normal}
.q cite img{width:44px;height:44px;border-radius:50%;object-fit:cover;background:var(--ink-3)}
.q cite b{display:block;font-size:.95rem}.q cite span{font-size:.85rem;color:var(--muted)}
.qdots{display:flex;gap:8px;margin-top:24px}
.qdots button{width:28px;height:6px;border-radius:6px;background:var(--line);transition:background .3s,width .3s}
.qdots button.on{background:var(--green);width:44px}
@media(max-width:900px){.craig-grid{grid-template-columns:1fr;gap:70px}.recog .card{right:10px}}

/* ================= FUNDING (light split) ================= */
.fund-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center}
.fund-cards{display:grid;gap:16px}
.fc{display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;padding:28px;border-radius:26px;background:#fff;border:1px solid var(--line-lt);transition:transform .5s var(--ease),box-shadow .4s}
.fc:hover{transform:translateX(6px);box-shadow:0 30px 60px -30px color-mix(in srgb,var(--ink-1) 30%,transparent)}
.fc .ic{width:62px;height:62px;border-radius:18px;background:var(--ink-1);display:grid;place-items:center;color:var(--green);font-size:1.6rem;font-weight:800}
.fc p{color:var(--muted-lt);font-size:.95rem;margin-top:4px}
.fc .go{width:44px;height:44px;border-radius:50%;border:1px solid var(--line-lt);display:grid;place-items:center;transition:.4s var(--ease)}
.fc:hover .go{background:var(--green);border-color:var(--green)}
@media(max-width:900px){.fund-grid{grid-template-columns:1fr}.fc{grid-template-columns:auto 1fr}.fc .go{display:none}}

/* ================= FAQ (dark) ================= */
.faq-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px}
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:22px 56px 22px 0;font-weight:700;font-size:1.08rem;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:0;top:50%;width:38px;height:38px;margin-top:-19px;border-radius:50%;border:1px solid var(--line);background:linear-gradient(var(--green),var(--green)) center/12px 2px no-repeat,linear-gradient(var(--green),var(--green)) center/2px 12px no-repeat;transition:transform .35s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .ans{color:var(--muted);padding:0 50px 22px 0}
@media(max-width:900px){.faq-wrap{grid-template-columns:1fr;gap:30px}}

/* ================= CTA ================= */
.cta-box > .fusion-column-wrapper{position:relative;border-radius:40px;padding:clamp(30px,5vw,64px)!important;overflow:hidden;background:linear-gradient(135deg,var(--ink-3),var(--ink-1));border:1px solid var(--line)}
.cta-box > .fusion-column-wrapper::before{content:"";position:absolute;left:-120px;bottom:-160px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--green) 25%,transparent),transparent 65%);pointer-events:none}
.cta-box > .fusion-column-wrapper::after{content:"";position:absolute;right:-80px;top:-80px;width:240px;height:240px;border-radius:50%;border:1px solid color-mix(in srgb,var(--muted) 18%,transparent);pointer-events:none}
.cta-box .fusion-builder-row-inner{position:relative;z-index:1}
.contact-big a{display:block;font-size:clamp(1.4rem,2.4vw,2rem);font-weight:800;letter-spacing:-.03em;margin-top:6px}
.contact-big a:hover{color:var(--green)}
form.lead-form{padding:clamp(22px,3vw,34px);border-radius:28px;background:color-mix(in srgb,var(--ink-1) 60%,transparent);border:1px solid rgba(255,255,255,.1);display:grid;gap:12px}
form.lead-form .two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
form.lead-form input,form.lead-form select{width:100%;padding:15px 17px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#fff;font:inherit;font-size:.95rem}
form.lead-form select option{color:var(--ink-1)}
form.lead-form input::placeholder{color:var(--muted)}
form.lead-form .btn{justify-content:center}
form.lead-form .ok{display:none;color:var(--green);font-weight:700;text-align:center}
@media(max-width:900px){.cta-box{grid-template-columns:1fr}form.lead-form .two{grid-template-columns:1fr}}

/* ================= FOOTER ================= */
.ca-footer{font-size:.93rem;color:var(--muted)}
.f-top{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:36px}
.f-top h4{color:#fff;font-size:.95rem;margin-bottom:16px}
.f-top a{display:block;padding:4px 0;transition:color .2s}.f-top a:hover{color:var(--green)}
.f-brand img{height:50px;width:auto;margin-bottom:20px}
.dojo-partner{display:inline-flex;align-items:center;gap:10px;margin-top:22px;padding:10px 16px;border-radius:var(--pill);border:1px solid var(--line);color:#fff;font-weight:700;font-size:.85rem}
.dojo-partner i{width:8px;height:8px;border-radius:50%;background:var(--green)}
.legal{margin-top:60px;padding-top:28px;border-top:1px solid var(--line);font-size:.78rem;line-height:1.65;display:grid;gap:12px}
.legal p{max-width:none}
.legal .row{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
.legal nav{display:flex;gap:20px}
@media(max-width:900px){.f-top{grid-template-columns:1fr 1fr}.f-top>div:first-child{grid-column:1/-1}}


/* ===== Motion: only applied when the visitor allows animation ===== */
@media (prefers-reduced-motion:no-preference){
  .hero h1 .ln>span{transform:translateY(105%);animation:up 1s var(--ease) forwards}
  .hero h1 .ln:nth-child(2)>span{animation-delay:.1s}.hero h1 .ln:nth-child(3)>span{animation-delay:.2s}
  .ca-fade{opacity:0;animation:fade .9s var(--ease) .4s forwards}
  .arch{animation:archin 1.2s var(--ease) .15s both}
  .machine{animation:machin 1.2s var(--ease) .55s both, bobm 7s ease-in-out 1.8s infinite}
  .toast{animation:toast 6s var(--ease) 1.4s infinite both}
  .seal svg{animation:spin 22s linear infinite}
  .stage .ring.r2{animation:spin 60s linear infinite}
  .rv{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
  .rv.in{opacity:1;transform:none}
  .d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}
  .tagline-track{animation:marq 40s linear infinite}
  .t-grow .bars i{transform:scaleY(.2);transition:transform 1s var(--ease)}
  .t-grow.in .bars i{transform:none}
  .t-grow.in .bars i:nth-child(2){transition-delay:.08s}.t-grow.in .bars i:nth-child(3){transition-delay:.16s}.t-grow.in .bars i:nth-child(4){transition-delay:.24s}.t-grow.in .bars i:nth-child(5){transition-delay:.32s}
}
@keyframes up{to{transform:none}}
@keyframes fade{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes archin{from{opacity:0;clip-path:inset(100% 0 0 0 round 200px 200px 28px 28px)}to{opacity:1;clip-path:inset(0 0 0 0 round 200px 200px 28px 28px)}}
@keyframes machin{from{opacity:0;transform:translate(-40px,60px) rotate(-24deg)}to{opacity:1;transform:rotate(-10deg)}}
@keyframes bobm{0%,100%{transform:rotate(-10deg) translateY(0)}50%{transform:rotate(-8deg) translateY(-12px)}}
@keyframes toast{0%{opacity:0;transform:translateY(14px) scale(.92)}8%,70%{opacity:1;transform:none}80%,100%{opacity:0;transform:translateY(-8px) scale(.96)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes marq{to{transform:translateX(-50%)}}

/* =====================================================================
   AVADA ADAPTERS
   ===================================================================== */
/* Header pill */
.ca-header > .fusion-builder-row{max-width:1240px;margin:0 auto!important;padding:6px 9px 6px 22px;border-radius:999px;background:color-mix(in srgb,var(--ink-1) 72%,transparent);border:1px solid rgba(255,255,255,.12);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);transition:background .3s,box-shadow .3s}
.fusion-sticky-transition .ca-header > .fusion-builder-row,.ca-header.fusion-sticky-transition > .fusion-builder-row{background:color-mix(in srgb,var(--ink-1) 92%,transparent);box-shadow:0 20px 50px -20px rgba(0,0,0,.6)}
.ca-grow{flex:1 1 auto!important}
.ca-menu .awb-menu__main-a,.ca-menu > ul > li > a{border-radius:999px!important;font-weight:600!important;font-family:var(--font)!important}
.ca-menu .awb-menu__sub-ul,.ca-menu .fusion-megamenu-wrapper{border-radius:22px!important;overflow:hidden;border:1px solid rgba(255,255,255,.1)!important;box-shadow:0 40px 80px -20px rgba(0,0,0,.7)!important;background:var(--ink-2)!important}
.ca-announce p{margin:0;text-align:center;font-weight:700;font-size:14px;color:var(--green-ink)}
.ca-announce a{color:var(--green-ink)!important;text-decoration:underline;text-underline-offset:3px;margin-left:6px}
/* Text elements */
.ca-lead p{font-size:clamp(1.02rem,1.3vw,1.17rem);color:var(--muted);margin-top:18px;max-width:50ch}
.light .ca-lead p{color:var(--muted-lt)}
.hero .ca-lead p{color:color-mix(in srgb,var(--text) 78%,transparent);max-width:47ch}
.ca-eyebrow-wrap{margin-bottom:0}
.eyebrow i{font-size:0;line-height:0;display:block;flex:none}
.ca-gap{height:18px}
.ca-sec .fusion-builder-row-inner{margin-left:0!important;margin-right:0!important}
.ca-sec .fusion-title{margin-bottom:0!important}
.ca-sec .fusion-title .title-sep-container{display:none}
/* Buttons */
.ca-btn{transition:transform .35s var(--ease)!important;font-family:var(--font)!important;font-weight:700!important;white-space:nowrap}
.ca-btn:hover{transform:translateY(-2px)}
.ca-btn-green{box-shadow:0 10px 30px -10px var(--green-glow)}
/* Sticky column + spacing */
@media(min-width:1025px){.ca-sticky{position:sticky!important;top:130px;align-self:flex-start}}
.ca-sec .fusion-code{margin:0}
/* FAQ toggles */
.ca-faq .panel-title a,.ca-faq .fusion-toggle-heading{font-family:var(--font)!important;font-weight:700!important;font-size:18px!important;color:var(--text)!important}
.ca-faq .panel-body,.ca-faq .toggle-content{color:var(--muted)!important}
.ca-faq .fusion-panel{border-color:var(--line)!important}
/* Form */
.ca-formbox .fusion-form input,.ca-formbox .fusion-form select,.ca-formbox .fusion-form textarea{background:rgba(255,255,255,.04)!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:14px!important;color:#fff!important}
.ca-formbox .fusion-form .fusion-button{width:100%;border-radius:999px!important;background:var(--green)!important;color:var(--green-ink)!important;justify-content:center}
.ca-contact a{font-size:clamp(24px,2.4vw,32px);font-weight:800;letter-spacing:-.03em;color:var(--text)!important;margin-top:20px;display:inline-block}
.ca-contact a.ca-contact-sm{font-size:clamp(16px,1.5vw,20px);color:var(--muted)!important;margin-top:4px}
.ca-contact a:hover{color:var(--green)!important}
/* Lightbox */
.ca-modal{position:fixed;inset:0;z-index:100000;background:rgba(2,6,16,.82);display:grid;place-items:center;padding:16px;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.ca-modal.open{opacity:1;visibility:visible}
/* "Watch Craig's story" popup: 400 x 400, no border or padding (shrinks to fit small phones) */
.ca-modal-box{position:relative;width:min(400px,calc(100vw - 32px));aspect-ratio:1/1;background:#000;overflow:hidden;box-shadow:0 30px 80px -20px rgba(0,0,0,.7);transform:scale(.96);transition:transform .3s cubic-bezier(.2,.75,.15,1)}
.ca-modal.open .ca-modal-box{transform:none}
.ca-modal-box video{display:block;width:100%;height:100%;object-fit:cover;border:0;padding:0;margin:0;border-radius:0}
.ca-modal-x{position:absolute;top:10px;right:10px;z-index:2;width:36px;height:36px;border-radius:50%;border:0;padding:0;display:grid;place-items:center;background:rgba(7,16,39,.72);color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:background .2s,transform .2s}
.ca-modal-x:hover{background:#00d980;color:#02160d;transform:rotate(90deg)}

/* Dark/green tiles inside light sections keep their own text colours */
.light .t-pay h3,.light .t-pay{color:var(--text)!important}
.light .t-pay .chips span{color:#fff}
.light .t-fund h3{color:var(--green-ink)!important}
.light .est h3,.light .est{color:var(--text)}

/* =====================================================================
   FIXES after first install (v3.1)
   ===================================================================== */
/* Page and content backgrounds are set natively:
   Avada > Options > Background (site default) and Page Options > Background Color For Page (per page) */
.page-template-100-width #main{padding-top:0!important;padding-bottom:0!important}
.fusion-tb-header .ca-sec.fusion-fullwidth[class*="ca-"]{margin:0!important}
/* Sticky header wrapper must stay transparent so only the pill shows */
.fusion-sticky-container,.fusion-sticky-spacer,.ca-header.fusion-sticky-transition{background:transparent!important;box-shadow:none!important}
/* Announcement bar */
.ca-announce-bar{background-color:var(--green)!important}
/* Pill buttons everywhere */
.fusion-button.ca-btn{border-radius:999px!important}
/* Plus Jakarta Sans across all custom sections (icons excluded) */
/* Font: set on the section roots and text elements only, so Avada builder/icon fonts are untouched */
.ca-sec,.ca-footer,.ca-header{font-family:var(--font)!important}
:is(.ca-sec,.ca-footer,.ca-header) :is(p,li,label,small,b,strong,blockquote,cite,input:not([type=submit]),select,h1,h2,h3,h4,h5,.fusion-button-text,.awb-menu__main-a){font-family:var(--font)!important}
/* Avada's default blockquote styling off inside our quotes */
.ca-sec blockquote{border:0!important;background:none!important;padding:0!important;margin:0!important;font-style:normal!important;quotes:none}
.ca-sec .t-quote blockquote{font-size:1.2rem!important;font-weight:700!important;color:var(--ink-txt)!important;line-height:1.3!important}
.ca-sec .q blockquote{font-size:clamp(1.25rem,1.9vw,1.6rem)!important;font-weight:700!important;color:var(--text)!important;line-height:1.3!important}
/* Headings: spacing under titles inside native Avada columns */
.ca-sec .fusion-title + .fusion-text.ca-lead p{margin-top:18px}
.ca-sec .ca-eyebrow-wrap p{margin:0}
/* Hide broken-image alt text while images load/fail */
.ca-sec img{color:transparent;font-size:0}

/* v3.2 */
.ca-announce,.ca-announce p{text-align:center!important;max-width:none!important}
.ca-lead p{font-weight:400!important}
.ca-sec .tile p,.ca-sec .tl-step p,.ca-sec .mc p,.ca-sec .ind p,.ca-sec .fc p{font-weight:400}

/* v3.3 */
.ca-footer .f-top a,.ca-footer .legal a{color:var(--muted)!important}
.ca-footer .f-top a:hover,.ca-footer .legal a:hover{color:var(--green)!important}
.ca-footer .f-top h4{color:#fff!important}
.ca-footer .f-brand p{color:var(--muted)}

/* ---------- Header menu items ---------- */
.ca-menu .awb-menu__main-ul{gap:2px}
.ca-menu .awb-menu__main-a{padding:10px 15px!important;border-radius:999px;color:color-mix(in srgb,var(--text) 86%,transparent)!important;font-size:15px;font-weight:600}
.ca-menu .awb-menu__main-a span{color:inherit!important}
.ca-menu .awb-menu__main-a:hover,.ca-menu .current-menu-item>.awb-menu__main-a{color:#fff!important;background:rgba(255,255,255,.08)}

/* =====================================================================
   Header (desktop) + mega menus — REPLACES mega-menu.css / mega-menu-visual.css
   Works with BOTH mega menu versions (Code Block or visual elements)
   ===================================================================== */

/* ---------- Desktop header: keep everything on ONE line ---------- */
@media(min-width:1025px){
  .ca-header > .fusion-builder-row{flex-wrap:nowrap!important;align-items:center!important}
  .ca-header > .fusion-builder-row > .fusion-layout-column:first-child{width:auto!important;flex:0 0 auto!important;max-width:220px}
  .ca-header > .fusion-builder-row > .fusion-layout-column:first-child img{max-height:82px!important;width:auto!important}
  .ca-header .ca-grow{flex:1 1 auto!important;min-width:0;width:auto!important}
  .ca-header > .fusion-builder-row > .fusion-layout-column:not(:first-child):not(.ca-grow){flex:0 0 auto!important;width:auto!important}
  .ca-menu .awb-menu__main-ul{flex-wrap:nowrap!important;justify-content:flex-end!important}
  .ca-menu .awb-menu__main-a{padding:10px 11px!important;font-size:15px!important;white-space:nowrap}
}
/* Not enough room for the phone pill on smaller laptops: hide it, keep "Get a free quote" */
@media(min-width:1025px) and (max-width:1439px){
  .ca-header a[href^="tel:"]{display:none!important}
  .ca-header .fusion-layout-column:has(> .fusion-column-wrapper > div > a[href^="tel:"]){display:none!important}
  .ca-menu .awb-menu__main-a{padding:10px 8px!important;font-size:14.5px!important}
}

/* ---------- Menu labels + chevrons ---------- */
.ca-menu .awb-menu__main-a{color:rgba(255,255,255,.85)!important;letter-spacing:-.01em;font-weight:600}
.ca-menu .awb-menu__main-a:hover{color:#fff!important}
.ca-menu .awb-menu__open-nav-submenu-hover,.ca-menu .awb-menu__sub-arrow{color:rgba(255,255,255,.5)!important}

/* ---------- Avada's mega menu wrapper: invisible ---------- */
.awb-menu__mega-wrap,.fusion-megamenu-wrapper{background:transparent!important;box-shadow:none!important;border:0!important;padding:0!important}
.awb-menu__mega-wrap{margin-top:14px!important}
.awb-menu__mega-wrap .ca-mm-container,.awb-menu__mega-wrap .ca-mm-container .fusion-builder-row,.awb-menu__mega-wrap .ca-mm-container .fusion-column-wrapper{background:transparent!important;padding-left:0!important;padding-right:0!important}

/* ---------- The glass panel (both versions) ---------- */
div.ca-mm:not(.fusion-fullwidth),.fusion-fullwidth.ca-mm{
  border-radius:26px!important;background:color-mix(in srgb,var(--ink-2) 95%,transparent)!important;
  -webkit-backdrop-filter:blur(26px) saturate(150%);backdrop-filter:blur(26px) saturate(150%);
  border:1px solid rgba(255,255,255,.12)!important;box-shadow:0 40px 80px -24px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.06);overflow:hidden}
div.ca-mm:not(.fusion-fullwidth){padding:32px 34px 28px}
.ca-mm,.ca-mm p,.ca-mm b,.ca-mm strong,.ca-mm small{font-family:"Plus Jakarta Sans","Helvetica Neue",Arial,sans-serif!important}
.ca-mm p{margin:0!important}
.ca-mm-label,.ca-mm-label p{margin:0 0 18px!important;font-size:13px!important;font-weight:800!important;letter-spacing:.12em!important;color:var(--green)!important;line-height:1!important;text-transform:uppercase}
.ca-mm-grid{display:grid;gap:6px 26px}
.ca-mm-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ca-mm-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}

/* ---------- Items (Code Block version: <a class="ca-mm-item">) ---------- */
a.ca-mm-item{display:flex!important;align-items:center;gap:14px;padding:10px 12px;margin:0 -12px;border-radius:16px;text-decoration:none!important;transition:background .25s}
a.ca-mm-item:hover{background:rgba(255,255,255,.07)}
/* ---------- Items (visual version: column.ca-mm-item) ---------- */
.fusion-layout-column.ca-mm-item > .fusion-column-wrapper{flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;gap:14px;border-radius:16px;transition:background .25s}
.fusion-layout-column.ca-mm-item:hover > .fusion-column-wrapper{background:rgba(255,255,255,.07)!important}

/* thumbnails (both) — hard size so nothing can blow up */
.ca-mm .ca-mm-thumb{display:block!important;flex:0 0 50px!important;width:50px!important;height:50px!important;max-width:50px!important;margin:0!important;border-radius:12px;overflow:hidden;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12)}
.ca-mm .ca-mm-thumb img,.ca-mm .ca-mm-thumb a{display:block!important;width:50px!important;height:50px!important;max-width:none!important;object-fit:cover!important;border-radius:0!important}
.ca-mm .ca-mm-item:hover .ca-mm-thumb img{transform:scale(1.08);transition:transform .5s cubic-bezier(.2,.75,.15,1)}

/* text (both) */
.ca-mm .ca-mm-txt{display:flex;flex-direction:column;flex:1 1 auto!important;min-width:0}
.ca-mm .ca-mm-txt b,.ca-mm .ca-mm-txt strong{display:block;color:#fff!important;font-size:15px!important;font-weight:700!important;letter-spacing:-.01em;line-height:1.3!important}
.ca-mm .ca-mm-txt small,.ca-mm .ca-mm-txt p{color:color-mix(in srgb,var(--text) 60%,transparent)!important;font-size:13px!important;line-height:1.45!important}

/* CTA strip (both) */
a.ca-mm-cta,.fusion-layout-column.ca-mm-cta > .fusion-column-wrapper{display:flex!important;flex-direction:row!important;justify-content:space-between!important;align-items:center!important;gap:16px;margin-top:18px;padding:16px 18px;border-radius:16px;background:color-mix(in srgb,var(--green) 10%,transparent)!important;border:1px solid color-mix(in srgb,var(--green) 25%,transparent);text-decoration:none!important}
.ca-mm-cta b,.ca-mm-cta strong{display:block;color:#fff!important;font-size:15px}
.ca-mm-cta small{color:color-mix(in srgb,var(--text) 65%,transparent)!important;font-size:13px}
.ca-mm-go,.ca-mm-go p{width:38px;height:38px;flex:none;border-radius:50%;background:var(--green);color:var(--green-ink)!important;display:grid!important;place-items:center;font-weight:800}

@media (prefers-reduced-motion:no-preference){
  .awb-menu__mega-wrap .ca-mm{animation:ca-mm-in .35s cubic-bezier(.2,.75,.15,1)}
  @keyframes ca-mm-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
}

/* ===== Homepage mobile polish ===== */
@media(max-width:1024px){ .ca-sticky{position:static!important} .hero h1{max-width:none} .stage{margin:28px auto 0!important} }
@media(max-width:640px){
  .ca-sec h2{font-size:clamp(1.9rem,8vw,2.4rem)!important}
  .hero h1{font-size:clamp(2.3rem,10.5vw,3rem)!important}
  .ca-sec .ca-btn{padding:14px 20px!important;font-size:15px!important}
  .tagline-track{font-size:2.2rem}
  .cta-box > .fusion-column-wrapper{border-radius:28px;padding:26px 20px!important}
  .recog .card{position:relative;right:auto;bottom:auto;margin:-28px 14px 0;max-width:none}
}

/* ===== Hero: Dojo machine with seal, payment toast and CTA badge ===== */
.ca-dev{position:relative;width:100%;max-width:480px;height:500px;margin-left:auto}
.ca-dev-glow{position:absolute;left:50%;top:50%;width:78%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 40% 35%,color-mix(in srgb,var(--green) 45%,transparent),color-mix(in srgb,var(--green) 8%,transparent) 58%,transparent 72%)}
.ca-dev-ring{position:absolute;left:50%;top:50%;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}
.ca-dev-ring1{width:100%;aspect-ratio:1;border:1px solid color-mix(in srgb,var(--muted) 16%,transparent)}
.ca-dev-ring2{width:72%;aspect-ratio:1;border:1px dashed color-mix(in srgb,var(--green) 35%,transparent)}
.ca-dev-machine{position:absolute;left:50%;top:50%;width:62%;max-width:300px;height:auto;transform:translate(-50%,-50%) rotate(4deg);filter:drop-shadow(0 40px 50px rgba(0,0,0,.55));z-index:2}
.ca-dev-seal{position:absolute;right:0;top:4%;width:118px;height:118px;z-index:3}
.ca-dev-seal svg{width:100%;height:100%;display:block}
.ca-dev-star{position:absolute;inset:30px;border-radius:50%;background:var(--green);color:var(--green-ink);display:grid;place-items:center;font-size:24px;font-weight:900;box-shadow:0 10px 30px -8px color-mix(in srgb,var(--green) 45%,transparent)}
.ca-dev-toast{position:absolute;left:0;top:34%;z-index:4;display:flex;gap:10px;align-items:center;padding:10px 14px 10px 10px;border-radius:16px;background:#fff;color:var(--ink-1);box-shadow:0 20px 40px -12px rgba(0,0,0,.55);font-size:13px;line-height:1.25}
.ca-dev-tick{width:30px;height:30px;border-radius:50%;background:var(--green);display:grid;place-items:center;flex:none}
.ca-dev-tick svg{width:16px;height:16px}
.ca-dev-toast b{display:block;font-size:14px;color:var(--ink-1)}
.ca-dev-toast small{color:var(--muted-lt);font-size:12px}
.ca-dev-cta{position:absolute;right:2%;bottom:4%;z-index:4;display:flex;align-items:center;gap:12px;padding:12px 12px 12px 12px;border-radius:20px;background:color-mix(in srgb,var(--ink-2) 82%,transparent);border:1px solid color-mix(in srgb,var(--green) 35%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 24px 50px -18px rgba(0,0,0,.7);text-decoration:none!important;transition:transform .35s cubic-bezier(.2,.75,.15,1),border-color .3s}
.ca-dev-cta:hover{transform:translateY(-3px);border-color:var(--green)}
.ca-dev-cta-ic{width:38px;height:38px;border-radius:12px;background:color-mix(in srgb,var(--green) 14%,transparent);color:var(--green);display:grid;place-items:center;font-weight:800;font-size:17px;flex:none}
.ca-dev-cta b{display:block;color:#fff!important;font-size:14px;line-height:1.25}
.ca-dev-cta small{display:block;color:color-mix(in srgb,var(--text) 65%,transparent)!important;font-size:12px}
.ca-dev-cta-go{width:32px;height:32px;border-radius:50%;background:var(--green);color:var(--green-ink)!important;display:grid;place-items:center;font-weight:800;flex:none;transition:transform .35s}
.ca-dev-cta:hover .ca-dev-cta-go{transform:rotate(-45deg)}
/* Hero animations always run */
.ca-dev-machine{animation:caDevIn 1.1s cubic-bezier(.2,.75,.15,1) .2s both,caDevBob 7s ease-in-out 1.4s infinite}
.ca-dev-seal svg{animation:caDevSpin 22s linear infinite}
.ca-dev-ring2{animation:caDevSpin2 60s linear infinite}
.ca-dev-toast{animation:caDevToast 6s cubic-bezier(.2,.75,.15,1) 1.2s infinite both}
.ca-dev-cta{animation:caDevFade .9s cubic-bezier(.2,.75,.15,1) .9s both}
@keyframes caDevIn{from{opacity:0;transform:translate(-50%,-40%) rotate(10deg)}to{opacity:1;transform:translate(-50%,-50%) rotate(4deg)}}
@keyframes caDevBob{0%,100%{transform:translate(-50%,-50%) rotate(4deg)}50%{transform:translate(-50%,-53%) rotate(3deg)}}
@keyframes caDevSpin{to{transform:rotate(360deg)}}
@keyframes caDevSpin2{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes caDevToast{0%{opacity:0;transform:translateY(14px) scale(.92)}8%,70%{opacity:1;transform:none}80%,100%{opacity:0;transform:translateY(-8px) scale(.96)}}
@keyframes caDevFade{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(max-width:1024px){.ca-dev{margin:30px auto 0;height:460px}}
@media(max-width:480px){.ca-dev{height:400px}.ca-dev-seal{width:92px;height:92px}.ca-dev-star{inset:23px;font-size:19px}.ca-dev-machine{width:66%}.ca-dev-cta{right:0;left:0;bottom:0;margin:auto;width:max-content;max-width:100%}}

/* Give headline descenders (y, g, p) room inside the slide-up mask */
.hero h1 .ln{padding-bottom:.14em!important;margin-bottom:-.1em!important}

/* ===== Mega menu: solid panel, fade only ===== */
div.ca-mm:not(.fusion-fullwidth),.fusion-fullwidth.ca-mm{background:var(--ink-2)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.awb-menu__mega-wrap{transition:opacity .25s ease,visibility .25s ease!important}
.awb-menu__mega-wrap .ca-mm{animation:none!important}

/* Menu sits on the right from first paint */
.ca-header .awb-menu__main-ul{justify-content:flex-end!important;flex-wrap:nowrap!important}
.ca-header .awb-menu{justify-content:flex-end!important}

/* ===== Mobile hero: machine, seal, pop-up and badge sized for phones ===== */
@media(max-width:600px){
  .ca-dev{height:420px!important;margin-top:10px!important}
  .ca-dev-machine{width:58%!important}
  .ca-dev-seal{width:90px!important;height:90px!important;top:2%!important;right:2%!important}
  .ca-dev-star{inset:22px!important;font-size:18px!important}
  .ca-dev-toast{top:26%!important;padding:8px 12px 8px 8px!important;gap:8px!important}
  .ca-dev-toast b{font-size:13px!important}
  .ca-dev-toast small{font-size:11px!important}
  .ca-dev-tick{width:26px!important;height:26px!important}
  .ca-dev-cta{left:0!important;right:0!important;bottom:0!important;margin:0 auto!important;width:fit-content!important;max-width:94%!important;padding:10px!important}
  .ca-dev-cta small{white-space:nowrap}
}

/* ===== Mobile: less space down the left and right edges ===== */
@media(max-width:640px){
  .fusion-fullwidth.ca-sec{padding-left:14px!important;padding-right:14px!important}
  .fusion-tb-header .fusion-fullwidth{padding-left:10px!important;padding-right:10px!important}
}

/* ===== Mobile logo size (change the two height values) ===== */
@media(max-width:1024px){
  html body .fusion-tb-header .ca-mrow .ca-mlogo .fusion-imageframe{max-width:none!important;width:auto!important}
  html body .fusion-tb-header .ca-mrow .ca-mlogo img{height:60px!important;max-height:none!important;width:auto!important;max-width:none!important}
}
@media(max-width:480px){
  html body .fusion-tb-header .ca-mrow .ca-mlogo img{height:52px!important}
}

/* =====================================================================
   PALETTE CONTROL — makes builder containers, buttons and inline SVGs
   follow the Avada colour palette (overrides colours typed into elements)
   ===================================================================== */
.fusion-fullwidth.ca-sec{background-color:var(--ink-1)!important}
.fusion-fullwidth.ca-sec.light{background-color:var(--stone)!important}
.fusion-fullwidth.ca-footer{background-color:var(--ink-0)!important}
.fusion-fullwidth.ca-announce-bar{background-color:var(--green)!important}
.ca-announce p,.ca-announce a{color:var(--green-ink)!important}
.wave path{fill:var(--stone)!important}
/* Buttons */
.fusion-button.ca-btn-green{--button_gradient_top_color:var(--green)!important;--button_gradient_bottom_color:var(--green)!important;--button_gradient_top_color_hover:var(--green-hover)!important;--button_gradient_bottom_color_hover:var(--green-hover)!important;--button_accent_color:var(--green-ink)!important;--button_accent_hover_color:var(--green-ink)!important;background:var(--green)!important;color:var(--green-ink)!important}
.fusion-button.ca-btn-green:hover{background:var(--green-hover)!important}
.fusion-button.ca-btn-green .fusion-button-text,.fusion-button.ca-btn-green i{color:var(--green-ink)!important}
.fusion-button.ca-btn-dark{background:var(--ink-1)!important;color:#fff!important}
.fusion-button.ca-btn-dark:hover{background:var(--ink-3)!important}
.fusion-button.ca-btn-ghost{background:color-mix(in srgb,#fff 4%,transparent)!important;border-color:color-mix(in srgb,#fff 28%,transparent)!important;color:#fff!important}
/* Hero seal + pop-up tick (colours written inside the SVG code) */
.ca-dev-seal circle{fill:color-mix(in srgb,var(--ink-2) 88%,transparent)!important}
.ca-dev-seal text{fill:var(--text)!important}
.ca-dev-tick svg,.ca-dev-tick svg path{stroke:var(--green-ink)!important}
.seal circle{fill:color-mix(in srgb,var(--ink-2) 85%,transparent)!important}
.seal text{fill:var(--text)!important}

/* =====================================================================
   INSIGHTS / BLOG: kept to a minimum. Colours, spacing, text and post
   settings are all set in the Avada elements themselves.
   ===================================================================== */
/* Post cards: rounded corners, consistent image shape, sensible title size
   (the Blog element otherwise uses the full H2 size from Avada Typography) */
.ca-posts .fusion-post-wrapper,.ca-posts .fusion-post-medium{border-radius:18px;overflow:hidden}
.ca-posts .fusion-image-wrapper img{width:100%;aspect-ratio:16/10;object-fit:cover}
.ca-posts .entry-title,.ca-posts .blog-shortcode-post-title{font-size:19px!important;line-height:1.3!important;letter-spacing:-.01em!important}
.ca-posts .fusion-post-medium .entry-title{font-size:28px!important;line-height:1.15!important}
.ca-links a{color:inherit!important;font-weight:700}

/* =====================================================================
   HOMEPAGE HERO: full-width photo of Craig with the text on the left (v9, wider phone crop).
   Desktop: the photo, its position and the navy fade are set in Avada:
     edit the homepage → Hero container → Background (image + gradient).
   Tablet and phone: the photo sits as a band at the top, fading into
     navy, with the text below. Those photos are set here (the two
     url(...) lines) because Avada uses one fade for every screen size.
   ===================================================================== */
/* let Avada's background settings show (the general .hero style paints its own) */
.ca-hero.hero{background-color:var(--awb-background-color,var(--ink-1));background-image:var(--awb-background-image);background-position:var(--awb-background-position);background-size:var(--awb-background-size);background-repeat:var(--awb-background-repeat)}
.ca-hero.hero::before{display:none}
/* the hero tucks up behind the transparent header: Avada clips the main area
   ("overflow: hidden"), so on the homepage only it clips sideways, not upwards */
.home #main{overflow:visible!important;overflow-x:clip!important}
.home .fusion-tb-header{position:relative;z-index:100;background:transparent!important}
.home .fusion-tb-header .fusion-sticky-container,.home .fusion-tb-header .fusion-sticky-spacer{background:transparent!important}
/* desktop: full-screen, text at the top, the four pills along the bottom */
@media(min-width:1025px){
  .ca-hero.fusion-fullwidth{min-height:100vh;display:flex!important;flex-direction:row!important;justify-content:center!important;align-items:stretch!important}
  .admin-bar .ca-hero.fusion-fullwidth{min-height:calc(100vh - 32px)}
  .ca-hero > .fusion-builder-row{align-content:space-between!important}
}
.ca-hero h1{text-shadow:0 2px 28px rgba(4,10,24,.35)}
/* the small "Approved Dojo partner" pill: a little more solid over the photo */
.ca-hero .eyebrow{background:rgba(7,16,39,.6)!important;color:#dfe5f7!important;border-color:rgba(255,255,255,.22)!important}
/* tablet: wide photo as a band across the top */
@media(max-width:1024px){
  .ca-hero.hero{background-image:linear-gradient(180deg,rgba(7,16,39,.7) 0,rgba(7,16,39,0) 110px,rgba(7,16,39,0) 54vw,var(--ink-1) 82vw),url("/wp-content/uploads/2026/10/craig-hero-wide-v3.jpg")!important;background-size:100% 82vw,100% auto!important;background-position:right top!important;background-repeat:no-repeat!important;padding-top:calc(82vw - 120px)!important}
  .ca-hero .ca-hero-text{margin-bottom:28px!important}
}
/* phones: a wider square crop of Craig (head to knees, with the laptop) in a band just below
   the menu pill (100px down, so the pill never covers his head); the photo fades into navy
   behind the start of the text. 60vw sets where the text starts: lower = text higher. */
@media(max-width:600px){
  .ca-hero.hero{background-image:linear-gradient(180deg,rgba(7,16,39,0) 0,rgba(7,16,39,0) calc(100px + 48vw),var(--ink-1) calc(100px + 78vw)),url("/wp-content/uploads/2026/10/craig-hero-mobile-v4.jpg")!important;background-size:100% 100%,100% auto!important;background-position:center top,center 100px!important;background-repeat:no-repeat!important;padding-top:calc(100px + 60vw)!important}
  .ca-hero .fusion-builder-row-inner .fusion-layout-column{width:100%!important}
  .ca-hero .fusion-button.ca-btn{display:flex!important;width:100%;justify-content:center}
}

/* =====================================================================
   INNER PAGES (products, industries, funding, stories): images fill their
   column; card images share one shape so rows line up
   ===================================================================== */
.fusion-imageframe.ca-img,.fusion-imageframe.ca-img img{display:block;width:100%;max-width:100%}
.fusion-imageframe.ca-img img{height:auto;object-fit:cover}
.fusion-imageframe.ca-img-card img{aspect-ratio:4/3}

/* =====================================================================
   HOMEPAGE CARD MACHINE CAROUSEL (native Avada cards in the container
   with CSS class "ca-rail"). Add, clone or delete cards in the builder.
   ===================================================================== */
.ca-rail > .fusion-builder-row{flex-wrap:nowrap!important;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:8px}
.ca-rail > .fusion-builder-row::-webkit-scrollbar{display:none}
.ca-rail > .fusion-builder-row > .fusion-layout-column{flex:0 0 min(380px,82vw)!important;width:min(380px,82vw)!important;max-width:none!important;scroll-snap-align:start}
.ca-rail-nav > .fusion-column-wrapper{align-items:flex-end}
.ca-rail-nav .fusion-builder-row-inner{justify-content:flex-end}
@media(max-width:1024px){.ca-rail-nav .fusion-builder-row-inner{justify-content:flex-start}}
.ca-offer p{display:inline-block;padding:6px 12px;border-radius:999px;background:var(--green)}
/* "Powered by Dojo" stats row */
.ca-stats > .fusion-builder-row{border-top:1px solid var(--line-lt);padding-top:30px}
/* Calculator settings: visible in the builder, hidden on the live site */
body:not(.fusion-builder-live):not(.fusion-builder-live-preview) .ca-est-settings{display:none!important}
.ca-est-settings{padding:14px 16px;border:2px dashed #00a862;border-radius:12px;background:#fff}
.ca-est-settings p{margin:0 0 4px!important}

/* FOOTER (native Avada elements) and forms on dark backgrounds */
.ca-footer .ca-footer-logo img{width:auto;max-width:190px}
.ca-footer h4{color:#fff!important}
.cta-box .fusion-form label,.cta-box .fusion-form .fusion-form-field-label,.cta-box .fusion-form-checkbox label{color:#eef2ff!important}

/* Dark card inside a light section (Contact page) and footer link colours */
.light .ca-dark-card h1,.light .ca-dark-card h2,.light .ca-dark-card h3,.light .ca-dark-card h4{color:#eef2ff!important}
.ca-dark-card .fusion-text a{color:#eef2ff!important}.ca-dark-card .fusion-text a:hover{color:var(--green)!important}
.ca-footer .fusion-text a{color:#9ba9cc!important}.ca-footer .fusion-text a:hover{color:var(--green)!important}
.ca-footer p{max-width:none!important}

/* "Find Craig online" row on the About page: Google reviews button lines up under the icons */
@media(min-width:1025px){.ca-social-right .fusion-builder-row-inner{justify-content:flex-end}}

/* Pull quotes in posts (video posts and case studies) */
.ca-pullquote blockquote{margin:0;padding:4px 0 4px 22px;border-left:4px solid #00d980;font-style:normal;background:none}
.ca-pullquote blockquote p{margin:0 0 6px}
.ca-pullquote cite{display:block;font-size:14px;font-style:normal;opacity:.7}

/* =====================================================================
   SAVINGS CALCULATOR: turnover bands and the bespoke panel.
   The labels, savings and slider ranges come from the "Turnover band" lines
   in the calculator's settings box (Avada Library → Savings calculator).
   ===================================================================== */
.est-bands{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.est-bands button{padding:12px 10px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--text);font:inherit;font-weight:700;font-size:.9rem;line-height:1.25;cursor:pointer;transition:background .2s,border-color .2s}
.est-bands button:hover{border-color:var(--green)}
.est-bands button.on{background:var(--green);border-color:var(--green);color:var(--green-ink)}
.est-bands button:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.est-bespoke{margin-top:8px;padding:22px;border-radius:20px;background:rgba(255,255,255,.05);border:1px solid var(--line)}
.est-bespoke[hidden]{display:none!important}
.est-bespoke b{display:block;font-size:1.3rem;font-weight:800;margin-bottom:6px}
.est-bespoke p{margin:0 0 16px!important;color:var(--muted)}
.est-bespoke-btn{display:inline-flex;align-items:center;gap:8px;padding:14px 22px;border-radius:999px;background:var(--green);color:var(--green-ink)!important;font-weight:700;text-decoration:none!important}
@media(max-width:480px){.est-bands{grid-template-columns:1fr}}

/* =====================================================================
   SAVINGS CALCULATOR: compact layout, so the whole calculator fits on a
   laptop or tablet screen and stays tidy on phones.
   ===================================================================== */
.est{padding:clamp(20px,2.6vw,32px)!important;border-radius:26px}
.est::before{width:200px;height:200px;border-width:32px;right:-70px;top:-70px}
.est .field{margin-bottom:16px}
.est .field label{margin-bottom:8px;font-size:.9rem}
.est .est-band{margin-bottom:18px}
.est-bands button{padding:9px 8px;font-size:.85rem;border-radius:12px}
.est-out{gap:10px;margin-top:4px}
.est-out div{padding:11px 14px;border-radius:16px}
.est-out b{font-size:1.15rem}
.est-big{margin-top:10px;padding:14px 20px;border-radius:18px}
.est-big b{font-size:clamp(1.9rem,3.2vw,2.5rem)}
.est small{margin-top:10px;font-size:.72rem;line-height:1.45}
.est-bespoke{padding:18px}
@media(max-width:600px){
  .est{padding:20px 16px!important;border-radius:22px}
  .est .field{margin-bottom:14px}
  .est-bands{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px}
  .est-bands button{padding:9px 4px;font-size:.74rem;border-radius:10px}
  .est-out div{padding:10px 12px}
  .est-out span{font-size:.72rem}
  .est-out b{font-size:1.05rem}
  .est-big{padding:12px 16px}
  .est-big span{font-size:.9rem}
  .est-big b{font-size:1.9rem}
}

/* =====================================================================
   MENU (8 items incl. Funding) and the "Get started" links (v50)
   ===================================================================== */
@media(min-width:1025px) and (max-width:1365px){html body .ca-header .ca-menu .awb-menu__main-a{padding:10px 5px!important;font-size:13.5px!important}}
@media(min-width:1025px) and (max-width:1199px){html body .ca-header .ca-menu .awb-menu__main-a{padding:10px 3px!important;font-size:12.5px!important}}
.ca-nav-start .awb-menu__main-a,.ca-nav-start > a{color:var(--green)!important;font-weight:700}
.ca-start-link p{margin:16px 0 0!important;font-size:15px;color:var(--muted)}
.ca-start-link a{color:var(--green)!important;font-weight:700;text-decoration:none}
.ca-start-link a:hover{text-decoration:underline}

/* =====================================================================
   CALLOUTS: "Starting a new business?" and "Become a partner" boxes (v51)
   ===================================================================== */
.ca-callout{margin:22px 0!important;padding:16px 20px;border-radius:16px;border:1px solid color-mix(in srgb,var(--green) 40%,transparent);border-left:4px solid var(--green);background:color-mix(in srgb,var(--green) 8%,transparent)}
.ca-callout p{margin:0!important;line-height:1.55}
.ca-callout a{color:var(--green-dk)!important;font-weight:700;text-decoration:none;white-space:nowrap}
.ca-sec:not(.light) .ca-callout a{color:var(--green)!important}
.ca-callout a:hover{text-decoration:underline}
.ca-partner-strip .fusion-text p{margin:0!important;text-align:center;font-size:17px}
.ca-partner-strip a{color:var(--green-dk)!important;font-weight:700;text-decoration:none;white-space:nowrap}
.ca-partner-strip a:hover{text-decoration:underline}
.ca-sec.light .ca-start-link a{color:var(--green-dk)!important}

/* =====================================================================
   HOMEPAGE HERO: Dojo machine and seal (v3). Both are Avada Image elements
   in the hero's right-hand column ("Dojo machine and seal"). Move or resize
   them with each image's own Alignment, Max Width and Margin settings
   (desktop, tablet and phone separately) in the builder.
   This CSS only provides two classes you can type into any image's CSS Class:
     ca-spin   = a slow, continuous spin
     ca-shadow = a soft drop shadow
   ===================================================================== */
.ca-shadow img{filter:drop-shadow(0 26px 40px rgba(4,10,24,.55))}
.ca-spin{animation:caSpin 14s linear infinite;will-change:transform}
@keyframes caSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
/* desktop: the headline scales with the screen height so the four cards stay in view */
@media(min-width:1025px){
  html body .ca-hero.hero h1{font-size:clamp(3rem,7.2vh,4.75rem)!important}
  html body .ca-hero .ca-lead p{font-size:clamp(16px,2.1vh,19px)!important}
  .ca-hero .ca-start-link p{margin-top:12px!important;line-height:1.55}
}