/* Fueltek v6.9.312 — Local Fuel Management Experience
   Shared interaction layer for the 30 unique location guides. */

.local-page-v302{--lx-gold:var(--acid,#f3b324);--lx-progress:0%;--lx-stage:1;position:relative;isolation:isolate}
.local-page-v302:before{content:"";position:fixed;z-index:-1;width:55vw;height:55vw;max-width:850px;max-height:850px;left:-18vw;top:24vh;border-radius:50%;background:radial-gradient(circle,rgba(243,179,36,.07),rgba(243,179,36,.018) 35%,transparent 69%);filter:blur(4px);pointer-events:none;transform:translate3d(calc(var(--lx-stage)*1.5vw),calc(var(--lx-stage)*-1vh),0);transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}

/* Page-load / hero entrance */
.local-page-v302 .local-hero-v302>div:first-child,.local-page-v302 .local-hero-v302>.fueltek-postcode-map-host-v309{opacity:0;transform:translate3d(0,24px,0);transition:opacity .8s ease,transform 1s cubic-bezier(.16,1,.3,1)}
.local-page-v302 .local-hero-v302>.fueltek-postcode-map-host-v309{transform:translate3d(32px,10px,0) scale(.985);transition-delay:.10s}
html.local-experience-loaded-v312 .local-page-v302 .local-hero-v302>div:first-child,html.local-experience-loaded-v312 .local-page-v302 .local-hero-v302>.fueltek-postcode-map-host-v309{opacity:1;transform:none}

/* Thin top progress line */
.local-experience-progress-v312{position:fixed;z-index:46;left:0;right:0;top:0;height:2px;background:rgba(255,255,255,.04);pointer-events:none}
.local-experience-progress-v312>i{display:block;width:var(--lx-progress);height:100%;background:linear-gradient(90deg,#8e6517,var(--lx-gold),#ffe296);box-shadow:0 0 16px rgba(243,179,36,.6);transition:width .08s linear}

/* Hero experience cue */
.local-experience-cue-v312{display:flex;align-items:center;gap:14px;margin-top:26px;color:#9ca79e;font-size:10px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
.local-experience-cue-v312:before{content:"";width:38px;height:1px;background:var(--lx-gold);box-shadow:0 0 10px rgba(243,179,36,.45)}
.local-experience-cue-v312:after{content:"↓";display:grid;place-items:center;width:24px;height:24px;border:1px solid rgba(243,179,36,.30);border-radius:50%;color:var(--lx-gold);animation:lxCueBounce 1.8s ease-in-out infinite}
@keyframes lxCueBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}

/* Funnel becomes a living progress control */
.local-funnel-v302{position:relative}
.local-funnel-v302:before{content:"";position:absolute;z-index:4;left:0;bottom:0;width:var(--lx-progress-px,0px);height:2px;background:linear-gradient(90deg,rgba(243,179,36,.35),var(--lx-gold),#ffe296);box-shadow:0 0 14px rgba(243,179,36,.50);pointer-events:none;will-change:width}
.local-funnel-v302 a{overflow:hidden}
.local-funnel-v302 a:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 120%,rgba(243,179,36,.16),transparent 52%);opacity:0;transform:translateY(20%);transition:opacity .35s ease,transform .35s ease;pointer-events:none}
.local-funnel-v302 a.is-active:before,.local-funnel-v302 a:hover:before{opacity:1;transform:none}
.local-funnel-v302 a.is-complete small:after{content:" ✓";color:#d6b85d}

/* Right-side chapter rail */
.local-experience-rail-v312{position:fixed;z-index:23;right:16px;top:50%;transform:translateY(-50%);display:grid;gap:8px;padding:10px;border:1px solid rgba(243,179,36,.15);border-radius:18px;background:rgba(5,8,6,.77);backdrop-filter:blur(13px);box-shadow:0 12px 44px rgba(0,0,0,.27)}
.local-experience-rail-v312:before{content:"";position:absolute;left:21px;top:22px;bottom:22px;width:1px;background:rgba(243,179,36,.13);z-index:-1}
.local-experience-rail-v312 a{position:relative;display:flex;align-items:center;justify-content:flex-end;gap:9px;min-height:24px;color:#7d8780;text-decoration:none;font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.local-experience-rail-v312 a span{max-width:0;opacity:0;white-space:nowrap;overflow:hidden;transition:max-width .25s ease,opacity .2s ease;color .2s ease}
.local-experience-rail-v312 a i{display:grid;place-items:center;width:24px;height:24px;border:1px solid rgba(255,255,255,.09);border-radius:50%;font-style:normal;background:#090c0a;transition:.25s ease}
.local-experience-rail-v312:hover a span,.local-experience-rail-v312:focus-within a span{max-width:150px;opacity:1}
.local-experience-rail-v312 a:hover span,.local-experience-rail-v312 a.is-active span{color:#f3f5f1}
.local-experience-rail-v312 a.is-active i{border-color:rgba(243,179,36,.65);background:var(--lx-gold);color:#070907;box-shadow:0 0 18px rgba(243,179,36,.38)}
.local-experience-rail-v312 a.is-complete i{border-color:rgba(243,179,36,.30);color:#d7ba63}

/* Stage reveal choreography */
.local-stage-v302{overflow:clip}
.local-stage-v302 .local-stage-number-v302,.local-stage-v302 .local-stage-title-v302,.local-stage-v302 .local-stage-copy-v302{opacity:0;transform:translate3d(0,34px,0);transition:opacity .72s ease,transform .92s cubic-bezier(.16,1,.3,1)}
.local-stage-v302 .local-stage-number-v302{transform:translate3d(-34px,20px,0) rotate(-3deg);transition-delay:.02s}
.local-stage-v302 .local-stage-title-v302{transition-delay:.08s}.local-stage-v302 .local-stage-copy-v302{transition-delay:.16s}
.local-stage-v302.is-experience-visible-v312 .local-stage-number-v302,.local-stage-v302.is-experience-visible-v312 .local-stage-title-v302,.local-stage-v302.is-experience-visible-v312 .local-stage-copy-v302{opacity:1;transform:none}
.local-stage-v302 .local-stage-number-v302{will-change:transform}

/* General reveal for page content, staggered by JS variable */
.local-page-v302 [data-lx-reveal-v312]{opacity:0;transform:translate3d(0,26px,0) scale(.992);transition:opacity .62s ease,transform .78s cubic-bezier(.16,1,.3,1);transition-delay:calc(var(--lx-delay,0)*55ms)}
.local-page-v302 [data-lx-reveal-v312].is-experience-visible-v312{opacity:1;transform:none}

/* Interactive card spotlight / tilt */
.local-page-v302 [data-lx-tilt-v312]{position:relative;overflow:hidden;transform-style:preserve-3d;will-change:transform;transition:transform .22s ease,border-color .25s ease,background .25s ease,box-shadow .25s ease}
.local-page-v302 [data-lx-tilt-v312]:before{content:"";position:absolute;inset:-1px;z-index:0;background:radial-gradient(360px circle at var(--lx-x,50%) var(--lx-y,50%),rgba(243,179,36,.13),transparent 48%);opacity:0;transition:opacity .2s ease;pointer-events:none}
.local-page-v302 [data-lx-tilt-v312]:hover:before{opacity:1}
.local-page-v302 [data-lx-tilt-v312]>*{position:relative;z-index:1}
.local-page-v302 [data-lx-tilt-v312]:hover{border-color:rgba(243,179,36,.33)!important;box-shadow:0 20px 60px rgba(0,0,0,.18)}

/* Map activation */
.local-page-v302 .fueltek-postcode-map-host-v309{transition:transform .8s cubic-bezier(.16,1,.3,1),border-color .5s ease,box-shadow .6s ease;transform-origin:center}
.local-page-v302 .fueltek-postcode-map-host-v309.is-experience-visible-v312{border-color:rgba(243,179,36,.48);box-shadow:0 34px 110px rgba(0,0,0,.54),0 0 0 1px rgba(243,179,36,.10),inset 0 0 70px rgba(243,179,36,.045)}
.local-page-v302 .fueltek-postcode-map-host-v309:after{content:"";position:absolute;z-index:5;inset:0;border-radius:inherit;border:1px solid transparent;background:linear-gradient(110deg,transparent 25%,rgba(255,225,146,.34) 48%,transparent 70%) border-box;mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);mask-composite:exclude;transform:translateX(-105%);pointer-events:none}
.local-page-v302 .fueltek-postcode-map-host-v309.is-experience-visible-v312:after{animation:lxMapSweep 1.15s .25s ease both}
@keyframes lxMapSweep{to{transform:translateX(105%)}}

/* Area chips arrive as a local pulse */
.local-page-v302 .area-chip{transition:transform .25s ease,border-color .25s ease,background .25s ease,box-shadow .25s ease}
.local-page-v302 .area-chip:hover{transform:translateY(-3px);border-color:rgba(243,179,36,.52);background:rgba(243,179,36,.12);box-shadow:0 8px 24px rgba(243,179,36,.08)}

/* Conversion cues read as forward movement */
.local-conversion-cue-v302>div{position:relative;overflow:hidden}
.local-conversion-cue-v302>div:after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:linear-gradient(90deg,var(--lx-gold),transparent);transition:width .9s cubic-bezier(.16,1,.3,1)}
.local-conversion-cue-v302.is-experience-visible-v312>div:after{width:100%}
.local-conversion-cue-v302 a span{display:inline-block;transition:transform .2s ease}.local-conversion-cue-v302 a:hover span{transform:translateX(5px)}

/* Nearby route links */
.nearby-links a{position:relative;overflow:hidden;transition:transform .24s ease,border-color .24s ease,background .24s ease}
.nearby-links a:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(243,179,36,.09),transparent 72%);transform:translateX(-101%);transition:transform .35s ease}
.nearby-links a:hover{transform:translateX(5px);border-color:rgba(243,179,36,.32);background:rgba(243,179,36,.025)}
.nearby-links a:hover:before{transform:none}.nearby-links a>*{position:relative;z-index:1}.nearby-links a b{transition:transform .22s ease;color:var(--lx-gold)}.nearby-links a:hover b{transform:translateX(4px)}

/* FAQ feels more like an interactive chapter */
.local-faq details{position:relative;transition:background .25s ease,padding .25s ease,border-color .25s ease}
.local-faq details:before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--lx-gold);transform:scaleY(0);transform-origin:top;transition:transform .28s ease}
.local-faq details[open]{padding-left:18px;background:linear-gradient(90deg,rgba(243,179,36,.055),transparent 70%)}
.local-faq details[open]:before{transform:scaleY(1)}
.local-faq summary{list-style:none;position:relative;padding-right:38px}.local-faq summary::-webkit-details-marker{display:none}
.local-faq summary:after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:28px;height:28px;border:1px solid rgba(243,179,36,.22);border-radius:50%;color:var(--lx-gold);font-size:18px;transition:transform .25s ease,background .25s ease}
.local-faq details[open] summary:after{content:"−";transform:translateY(-50%) rotate(180deg);background:rgba(243,179,36,.10)}

/* Magnetic CTA feedback */
.local-page-v302 .btn[data-lx-magnetic-v312]{will-change:transform;transition:transform .18s ease,box-shadow .22s ease,border-color .22s ease}
.local-page-v302 .btn[data-lx-magnetic-v312]:hover{box-shadow:0 12px 34px rgba(243,179,36,.12)}

/* Light theme */
html[data-theme="light"] .local-experience-rail-v312{background:rgba(246,243,235,.88);border-color:rgba(151,104,11,.18);box-shadow:0 12px 40px rgba(55,45,25,.12)}
html[data-theme="light"] .local-experience-rail-v312 a i{background:#f5f1e8;color:#665f50}
html[data-theme="light"] .local-experience-rail-v312 a.is-active i{background:#b77b00;color:#fff}
html[data-theme="light"] .local-experience-cue-v312{color:#5e675f}

@media(max-width:1180px){.local-experience-rail-v312{display:none}}
@media(max-width:900px){
  .local-page-v302:before{display:none}.local-experience-progress-v312{top:0}
  .local-page-v302 [data-lx-tilt-v312]{transform:none!important}
  .local-experience-cue-v312{margin-top:18px}
  .local-funnel-v302:before{display:none}
}
@media(max-width:700px){
  .local-page-v302 .local-hero-v302>.fueltek-postcode-map-host-v309{transform:translate3d(0,22px,0) scale(.99)}
  .local-page-v302 .fueltek-postcode-map-host-v309:after{display:none}
}
@media(prefers-reduced-motion:reduce){
  .local-page-v302 *,.local-experience-progress-v312 *{animation:none!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .local-page-v302 [data-lx-reveal-v312],.local-stage-v302 .local-stage-number-v302,.local-stage-v302 .local-stage-title-v302,.local-stage-v302 .local-stage-copy-v302,.local-page-v302 .local-hero-v302>div:first-child,.local-page-v302 .local-hero-v302>.fueltek-postcode-map-host-v309{opacity:1!important;transform:none!important}
}