@font-face{font-family:Inter;src:url("assets/inter-latin.woff") format("woff");font-display:swap;font-style:normal;font-weight:100 900}
@font-face{font-family:Montserrat;src:url("assets/montserrat-latin.woff") format("woff");font-display:swap;font-style:normal;font-weight:100 900}
:root{--navy:#061426;--midnight:#0A1F44;--deep:#071a31;--blue:#007BFF;--sky:#00B4FF;--cyan:#36d9ff;--silver:#A7B0BA;--white:#F9FAFF;--ink:#0d1b2d;--paper:#f6f8fb;--line:rgba(167,176,186,.22);--line-light:rgba(255,255,255,.16);--muted:#aebbd0;--max:1240px;--header:88px;--shadow:0 24px 80px rgba(0,0,0,.26);--ease:cubic-bezier(.22,.61,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--navy)}body{margin:0;background:var(--navy);color:var(--white);font:400 16px/1.65 Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}img{max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a,input,select,textarea,summary{outline-offset:4px}:focus-visible{outline:2px solid var(--sky);outline-offset:4px}::selection{background:var(--sky);color:var(--navy)}
.skip{position:fixed;top:10px;left:10px;z-index:9999;background:var(--white);color:var(--navy);padding:.7rem 1rem;transform:translateY(-160%);border-radius:2px}.skip:focus{transform:none}
.section{width:min(var(--max),calc(100% - 64px));margin-inline:auto;padding-block:110px}.eyebrow{margin:0 0 18px;color:var(--sky);font:700 .72rem/1.4 Montserrat,Arial,sans-serif;letter-spacing:.18em;text-transform:uppercase}.lead{font-size:clamp(1.08rem,1.5vw,1.32rem);line-height:1.6;color:inherit}
h1,h2,h3{font-family:Montserrat,Arial,sans-serif;letter-spacing:-.035em;margin-top:0;text-wrap:balance}h1{font-size:clamp(3.3rem,7.3vw,7.1rem);line-height:.91}h2{font-size:clamp(2.35rem,4.8vw,4.65rem);line-height:1.01}h3{font-size:clamp(1.55rem,2.4vw,2.45rem);line-height:1.08}p{margin:0 0 1.15rem}ul{padding-left:1.2rem}em{font-style:normal;color:var(--sky)}
.button{display:inline-flex;align-items:center;justify-content:center;gap:.7rem;min-height:50px;padding:.78rem 1.28rem;border:1px solid transparent;background:var(--blue);color:#fff;font:700 .82rem/1 Montserrat,Arial,sans-serif;letter-spacing:.01em;transition:transform .25s var(--ease),background .25s,border-color .25s}.button:hover{transform:translateY(-2px);background:#1288ff}.button.small{min-height:42px;padding:.66rem 1rem;font-size:.75rem}.button-outline{background:transparent;border-color:rgba(255,255,255,.35)}.button-outline:hover{background:rgba(255,255,255,.08);border-color:var(--sky)}.button-link,.text-link{display:inline-flex;align-items:center;gap:.55rem;color:var(--white);font-weight:700;border-bottom:1px solid rgba(255,255,255,.28);padding-bottom:.2rem}.button-link:hover,.text-link:hover{border-color:var(--sky);color:var(--sky)}.note,.quiet{color:var(--muted);font-size:.9rem}.optional{font-weight:400;color:var(--muted)}
.site-header,body>header{position:sticky;top:0;z-index:1000;height:var(--header);display:flex;align-items:center;justify-content:space-between;padding:0 max(28px,calc((100vw - var(--max))/2));background:rgba(6,20,38,.9);border-bottom:1px solid rgba(255,255,255,.09);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.brand{display:flex;align-items:center;min-width:0}.identity{display:flex;align-items:center;gap:10px;min-width:0}.identity-symbol{width:50px;flex:0 0 50px;overflow:hidden}.identity-symbol img{width:100%;height:auto}.identity-type{display:grid;gap:4px;min-width:0}.identity-word{width:118px;display:block}.identity-word img{width:100%}.identity-descriptor{font:700 7.2px/1.22 Montserrat,Arial,sans-serif;letter-spacing:.11em;color:#d6e2f0}
#navigation{display:flex;align-items:center;gap:1.8rem}#navigation>a:not(.button){font:650 .82rem/1 Montserrat,Arial,sans-serif;color:#d9e3ef;position:relative}#navigation>a:not(.button)::after{content:"";position:absolute;left:0;bottom:-10px;width:100%;height:1px;background:var(--sky);transform:scaleX(0);transform-origin:left;transition:transform .25s}#navigation>a:hover::after,#navigation>a[aria-current="page"]::after{transform:scaleX(1)}#navigation>a[aria-current="page"]{color:#fff}#menu,.menu-button{display:none;border:1px solid var(--line-light);background:transparent;color:#fff;min-width:54px;min-height:44px;font-weight:700}

.campaign-hero{position:relative;min-height:calc(100svh - var(--header));isolation:isolate;overflow:hidden;display:grid;align-items:end}.campaign-hero-media{position:absolute;inset:0;z-index:-4}.campaign-hero-media img{width:100%;height:100%;object-fit:cover;object-position:58% center;transform:scale(1.018);animation:heroBreathe 14s ease-in-out infinite alternate}.campaign-hero-overlay{position:absolute;inset:0;z-index:-3;background:linear-gradient(90deg,rgba(4,14,28,.98) 0%,rgba(4,14,28,.86) 34%,rgba(4,14,28,.29) 68%,rgba(4,14,28,.12) 100%),linear-gradient(0deg,rgba(4,14,28,.92) 0%,rgba(4,14,28,.10) 46%,rgba(4,14,28,.38) 100%)}.campaign-hero-grain{position:absolute;inset:0;z-index:-2;opacity:.28;background-image:radial-gradient(rgba(255,255,255,.14) .55px,transparent .7px);background-size:5px 5px;mix-blend-mode:soft-light;pointer-events:none}.campaign-hero-content{width:min(var(--max),calc(100% - 64px));margin:0 auto;padding:9vh 0 175px}.campaign-hero-content .eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:24px}.signal-dot{width:7px;height:7px;border-radius:50%;background:var(--sky);box-shadow:0 0 18px rgba(0,180,255,.7)}.campaign-hero h1{max-width:850px;margin-bottom:28px;text-transform:uppercase;font-weight:800}.campaign-hero h1 span,.campaign-hero h1 em{display:block}.campaign-hero h1 em{color:var(--sky)}.hero-lead{max-width:660px;color:#d9e5f3;font-size:clamp(1.05rem,1.55vw,1.34rem);line-height:1.62}.hero-actions{display:flex;align-items:center;gap:1.3rem;margin-top:34px;flex-wrap:wrap}.hero-proof{position:absolute;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.15);background:rgba(4,15,29,.6);backdrop-filter:blur(10px)}.hero-proof>div{padding:24px max(24px,calc((100vw - var(--max))/6));border-right:1px solid rgba(255,255,255,.12)}.hero-proof>div:last-child{border-right:0}.hero-proof strong{display:block;font:700 .95rem/1.2 Montserrat;color:#fff;margin-bottom:4px}.hero-proof span{display:block;color:#aebed0;font-size:.78rem}

.positioning{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px 100px}.positioning-intro h2{margin-bottom:0}.positioning-copy{align-self:end;max-width:660px;color:#c3d0de}.value-rail{grid-column:1/-1;border-top:1px solid var(--line-light);border-bottom:1px solid var(--line-light);display:grid;grid-template-columns:repeat(3,1fr)}.value-rail>div{padding:34px 38px 28px 0;position:relative}.value-rail>div+div{padding-left:38px;border-left:1px solid var(--line-light)}.value-rail span{color:var(--sky);font:700 .72rem Montserrat;letter-spacing:.16em}.value-rail strong{display:block;margin:.55rem 0 .65rem;font:700 1.14rem Montserrat}.value-rail p{color:#aebed0;font-size:.93rem;margin:0;max-width:300px}

.services-story{background:#07182d}.services-story-head{display:grid;grid-template-columns:1fr .65fr;gap:40px 90px;padding-bottom:78px}.services-story-head .eyebrow,.services-story-head h2{grid-column:1}.services-story-head h2{margin-bottom:0}.services-story-head>p:last-child{grid-column:2;grid-row:1/3;align-self:end;color:#b7c5d4;max-width:500px}.editorial-service{position:relative;border-top:1px solid rgba(255,255,255,.14);min-height:620px;display:flex;align-items:center;overflow:hidden}.editorial-service-light{background:var(--paper);color:var(--ink)}.editorial-service-blue{background:#082b53}.editorial-service-night{background:#040f1e}.editorial-service-inner{width:min(var(--max),calc(100% - 64px));margin:auto;padding:84px 0;display:grid;grid-template-columns:110px minmax(0,1fr) minmax(360px,.85fr);gap:50px;align-items:center}.editorial-reverse{grid-template-columns:110px minmax(360px,.85fr) minmax(0,1fr)}.editorial-reverse .service-copy{grid-column:3}.editorial-reverse .service-visual{grid-column:2;grid-row:1}.service-index-number{font:700 clamp(2.8rem,6vw,5.6rem)/1 Montserrat;color:rgba(255,255,255,.13);align-self:start}.editorial-service-light .service-index-number{color:rgba(10,31,68,.12)}.service-copy{max-width:620px}.service-copy h3{font-size:clamp(2.2rem,4vw,4.4rem);margin-bottom:24px}.service-copy>p{color:#bccada;max-width:610px}.editorial-service-light .service-copy>p{color:#42516a}.editorial-service-light .eyebrow{color:#006bdb}.editorial-service-light .text-link{color:var(--midnight);border-color:rgba(10,31,68,.25)}.editorial-service-light .text-link:hover{color:#006bdb;border-color:#006bdb}.service-outcome-line{display:grid;grid-template-columns:85px 1fr;gap:20px;padding:18px 0;margin:25px 0;border-top:1px solid rgba(255,255,255,.15);border-bottom:1px solid rgba(255,255,255,.15)}.editorial-service-light .service-outcome-line{border-color:rgba(10,31,68,.15)}.service-outcome-line span{font:.7rem Montserrat;color:var(--sky);text-transform:uppercase;letter-spacing:.12em}.service-outcome-line strong{font-size:.95rem}.boundary-note{padding-left:18px;border-left:2px solid var(--blue);font-size:.92rem!important}.boundary-note strong{display:block;color:var(--midnight);margin-bottom:5px}
.service-visual{min-height:360px;border-left:1px solid rgba(255,255,255,.18);padding:34px 0 34px 42px;display:flex;flex-direction:column;justify-content:center}.editorial-service-light .service-visual{border-color:rgba(10,31,68,.17)}.visual-kicker{font:700 .67rem/1.3 Montserrat;letter-spacing:.16em;color:var(--sky);margin-bottom:32px}.ledger-line{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid rgba(255,255,255,.12);padding:14px 0;color:#c4d1de}.ledger-line b{color:#fff;font-size:.9rem}.ledger-line .accent{color:var(--sky)}.visual-rule{height:1px;background:linear-gradient(90deg,var(--blue),var(--sky),transparent);margin:30px 0}.visual-result{font:700 2rem Montserrat}.ageing-row{display:grid;grid-template-columns:58px 1fr;align-items:center;gap:15px;margin:12px 0;font:700 .75rem Montserrat;color:#43516a}.ageing-row i{height:12px;background:rgba(10,31,68,.08);position:relative}.ageing-row i::after{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);background:linear-gradient(90deg,#007BFF,#00B4FF)}.service-visual-ageing small{color:#6b7789;margin-top:18px}.report-stat{display:grid;grid-template-columns:1fr auto 28px;gap:15px;align-items:end;border-bottom:1px solid rgba(255,255,255,.13);padding:17px 0}.report-stat span{color:#b9c9da}.report-stat strong{font:700 1.55rem Montserrat}.report-stat em{font-style:normal;color:var(--sky);text-align:right}.service-visual-report small{color:#abc0d7;margin-top:22px}.timeline-step{display:grid;grid-template-columns:48px 1fr;gap:18px;align-items:center;padding:15px 0;border-bottom:1px solid rgba(255,255,255,.12);color:#9fb0c3}.timeline-step b{display:grid;place-items:center;width:38px;height:38px;border:1px solid rgba(255,255,255,.25);font:.72rem Montserrat}.timeline-step.active{color:#fff}.timeline-step.active b{border-color:var(--sky);color:var(--sky)}

.remote-story{position:relative;min-height:760px;display:flex;align-items:end;overflow:hidden;isolation:isolate}.remote-story-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-3}.remote-story-overlay{position:absolute;inset:0;background:linear-gradient(0deg,#061426 3%,rgba(6,20,38,.78) 32%,rgba(6,20,38,.16) 72%),linear-gradient(90deg,rgba(6,20,38,.82),transparent 70%);z-index:-2}.remote-story-content{padding-top:260px}.remote-story h2{font-size:clamp(3.7rem,7vw,7.4rem);text-transform:uppercase;margin-bottom:42px}.remote-story-grid{display:grid;grid-template-columns:.75fr 1fr;gap:110px;border-top:1px solid rgba(255,255,255,.2);padding-top:32px}.remote-story-grid>div{color:#c1cfde}.remote-story-grid .text-link{margin-top:14px}

.pricing-campaign{padding-top:120px;padding-bottom:120px}.pricing-campaign-head{display:grid;grid-template-columns:1fr .62fr;gap:70px;align-items:end;margin-bottom:60px}.pricing-campaign-head h2{margin-bottom:0}.pricing-campaign-head>p{color:#b9c8d7;max-width:480px}.package-ledger{border-top:1px solid rgba(255,255,255,.2)}.package-row{display:grid;grid-template-columns:1.1fr .82fr 1.65fr 44px;gap:34px;align-items:center;padding:38px 0;border-bottom:1px solid rgba(255,255,255,.18);position:relative}.package-row::before{content:"";position:absolute;inset:0 -28px;background:linear-gradient(90deg,rgba(0,123,255,0),rgba(0,123,255,.07),rgba(0,180,255,0));opacity:0;transition:opacity .25s}.package-row:hover::before,.package-featured::before{opacity:1}.package-name,.package-price,.package-row ul,.package-link{position:relative;z-index:1}.package-name{display:flex;align-items:baseline;gap:18px}.package-name>span{font:.7rem Montserrat;color:var(--sky);letter-spacing:.13em}.package-name h3{font-size:1.65rem;margin:0;text-transform:uppercase}.package-price small{display:block;color:var(--sky);font:.62rem Montserrat;letter-spacing:.13em}.package-price strong{font:700 2rem Montserrat}.package-price span{font-size:.8rem;color:#9fb0c3}.package-row ul{display:grid;grid-template-columns:1fr 1fr;gap:6px 25px;margin:0;padding:0;list-style:none;color:#b9c7d6;font-size:.86rem}.package-row li::before{content:"—";color:var(--sky);margin-right:8px}.package-link{display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(255,255,255,.24);font-size:1.15rem}.package-link:hover{border-color:var(--sky);color:var(--sky)}.pricing-aux{margin-top:36px;display:grid;grid-template-columns:1fr 1fr auto;gap:30px;border:1px solid rgba(255,255,255,.18);padding:26px 30px;align-items:center;background:rgba(255,255,255,.025)}.pricing-aux>div{display:grid;gap:3px}.pricing-aux>div+div{border-left:1px solid rgba(255,255,255,.15);padding-left:30px}.pricing-aux span{font:.7rem Montserrat;color:#b7c6d5;text-transform:uppercase;letter-spacing:.08em}.pricing-aux strong{font:700 1.3rem Montserrat}.pricing-aux small{color:#8093a8}

.workflow{background:linear-gradient(180deg,#061426,#071b33)}.workflow-head{max-width:760px}.workflow-track{list-style:none;padding:0;margin:70px 0 38px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(255,255,255,.18)}.workflow-track li{padding:35px 35px 0 0;position:relative}.workflow-track li+li{border-left:1px solid rgba(255,255,255,.13);padding-left:35px}.workflow-track>li>span{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--sky);color:var(--sky);font:700 .7rem Montserrat;margin-top:-57px;background:var(--navy)}.workflow-track h3{font-size:1.45rem;margin:28px 0 12px}.workflow-track p{font-size:.9rem;color:#a9b9ca;margin:0}

.insight-campaign{background:#f5f7fa;color:var(--ink);border-top:1px solid #dde3eb;border-bottom:1px solid #dde3eb}.insight-campaign-inner{display:grid;grid-template-columns:.75fr 1.25fr;gap:90px;align-items:center}.insight-copy .eyebrow{color:#006edc}.insight-copy .text-link{color:var(--midnight);border-color:rgba(10,31,68,.25)}.insight-copy .text-link:hover{color:#006edc;border-color:#006edc}.insight-copy>p:not(.eyebrow){color:#4d5d71}.insight-board{margin:0;background:#07192e;color:#fff;padding:34px 36px 30px;box-shadow:0 26px 70px rgba(7,25,46,.2);border:1px solid rgba(0,123,255,.25)}.insight-board figcaption{display:grid;grid-template-columns:1fr auto;gap:4px 20px;padding-bottom:22px;border-bottom:1px solid rgba(255,255,255,.15)}.insight-board figcaption span{grid-column:1/-1;font:700 .65rem Montserrat;letter-spacing:.15em;color:var(--sky)}.insight-board figcaption strong{font:700 1.05rem Montserrat}.insight-board figcaption small{color:#9eb0c4}.mini-chart{height:310px;display:flex;align-items:end;justify-content:space-around;gap:28px;padding:35px 30px 38px;position:relative;overflow:hidden}.mini-chart-grid{position:absolute;inset:32px 20px 50px;display:grid;grid-template-rows:repeat(4,1fr);z-index:0}.mini-chart-grid i{border-top:1px solid rgba(255,255,255,.09)}.mini-month{height:100%;flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative;z-index:1}.mini-month>div{height:100%;display:flex;align-items:flex-end;gap:9px;width:100%;justify-content:center}.mini-month>span{font:700 .65rem Montserrat;color:#8fa2b5;margin-top:12px}.mini-bar{width:min(42px,34%);height:var(--v);display:flex;align-items:flex-start;justify-content:center;transform-origin:bottom;transform:scaleY(.04);transition:transform 1s var(--ease)}.mini-bar em{font:700 .62rem Montserrat;color:#fff;transform:translateY(-21px)}.mini-bar.revenue{background:linear-gradient(180deg,#00B4FF,#007BFF)}.mini-bar.cost{background:linear-gradient(180deg,#a9b8c9,#5e7085)}.columns-chart.is-visible .mini-bar,.motion-on .mini-chart .mini-bar{transform:scaleY(1)}.insight-board-foot{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.15);padding-top:20px}.insight-board-foot>div+div{border-left:1px solid rgba(255,255,255,.12);padding-left:22px}.insight-board-foot span{display:block;color:#91a5ba;font-size:.68rem}.insight-board-foot strong{font:700 1rem Montserrat}

.edward-feature{display:grid;grid-template-columns:minmax(360px,.88fr) 1.12fr;gap:90px;align-items:center;padding-top:130px;padding-bottom:130px}.edward-feature-media{position:relative;min-height:650px;overflow:hidden;background:#0a203a}.edward-feature-media::before{content:"";position:absolute;inset:0;border:1px solid rgba(255,255,255,.15);z-index:2;pointer-events:none}.edward-feature-media img{width:100%;height:650px;object-fit:cover;object-position:center 22%;filter:saturate(.88) contrast(1.03)}.edward-caption{position:absolute;left:0;right:0;bottom:0;padding:26px 28px;background:linear-gradient(0deg,rgba(4,14,28,.95),rgba(4,14,28,.05));display:grid;gap:3px}.edward-caption span{font:700 .85rem Montserrat;letter-spacing:.08em}.edward-caption small{color:#b8c5d2}.edward-feature-copy{max-width:650px}.edward-feature-copy h2{font-size:clamp(2.5rem,4.4vw,4.7rem);margin-bottom:28px}.experience-number{color:var(--sky)}.edward-feature-copy>p{color:#bbc9d7}.edward-experience{display:flex;flex-wrap:wrap;gap:0;margin:30px 0;border-top:1px solid rgba(255,255,255,.17);border-left:1px solid rgba(255,255,255,.17)}.edward-experience span{padding:10px 13px;border-right:1px solid rgba(255,255,255,.17);border-bottom:1px solid rgba(255,255,255,.17);font-size:.77rem;color:#c9d5e0}.edward-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:30px}

.final-cta{position:relative;overflow:hidden;background:#071b34;border-top:1px solid rgba(255,255,255,.12);isolation:isolate}.final-cta::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(circle at 78% 25%,rgba(0,123,255,.24),transparent 32%),linear-gradient(115deg,#061426,#0a2341)}.final-cta-orbit{position:absolute;width:min(760px,70vw);aspect-ratio:1;border:1px solid rgba(0,180,255,.18);border-radius:50%;right:-10%;top:-38%;z-index:-1}.final-cta-orbit::before,.final-cta-orbit::after{content:"";position:absolute;border:1px solid rgba(0,180,255,.12);border-radius:50%;inset:11%}.final-cta-orbit::after{inset:23%}.final-cta-inner{padding-block:120px;max-width:var(--max);margin:auto}.final-cta h2{font-size:clamp(3rem,6vw,6.4rem);text-transform:uppercase;margin-bottom:24px}.final-cta-inner>p:not(.eyebrow){max-width:650px;color:#bbcad8;font-size:1.08rem}.final-cta-actions{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:35px}

.site-footer,body>footer{width:100%;background:#030d1a;border-top:1px solid rgba(255,255,255,.12);padding:70px max(32px,calc((100vw - var(--max))/2)) 28px}.footer-top{display:flex;justify-content:space-between;align-items:flex-end;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.15);gap:30px}.footer-identity .identity-symbol{width:64px;flex-basis:64px}.footer-identity .identity-word{width:150px}.footer-identity .identity-descriptor{font-size:8px}.footer-top>p{font:500 clamp(1.4rem,2.4vw,2.4rem)/1.18 Montserrat;text-align:right;margin:0}.footer-top>p strong{color:var(--sky)}.footer-grid{display:grid;grid-template-columns:1fr 1fr 1.35fr;gap:60px;padding:42px 0}.footer-grid>div{display:grid;align-content:start;gap:8px}.footer-grid span{font:700 .65rem Montserrat;letter-spacing:.14em;color:#6f849b;margin-bottom:7px}.footer-grid a{color:#c8d3df;font-size:.88rem}.footer-grid a:hover{color:var(--sky)}.footer-legal{padding-top:22px;border-top:1px solid rgba(255,255,255,.1);color:#72869c;font-size:.75rem;margin:0}

/* Shared inner-page campaign system */
.detail-hero{position:relative;min-height:54vh;padding:clamp(100px,12vw,165px) max(32px,calc((100vw - var(--max))/2)) 80px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;isolation:isolate;background:#07182c}.detail-hero::before{content:"";position:absolute;inset:0;z-index:-3;background:url("assets/mattly-finance-premium-hero.webp") center 46%/cover no-repeat;opacity:.52;transform:scale(1.035)}.detail-hero::after{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(4,14,28,.99) 0%,rgba(4,14,28,.83) 52%,rgba(4,14,28,.2) 100%),linear-gradient(0deg,rgba(4,14,28,.96),transparent 70%)}.detail-hero h1{font-size:clamp(2.7rem,5.4vw,5.8rem);max-width:920px;margin:.15rem 0 20px;text-transform:none}.detail-hero .lead{max-width:780px;color:#c1cede}.breadcrumb{display:flex;gap:10px;align-items:center;color:#91a4b8;font-size:.78rem;margin-bottom:25px}.breadcrumb a:hover{color:var(--sky)}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:40px}.section-heading h2{margin-bottom:0}.dark{background:#07182d}.scope-band{border-top:1px solid rgba(255,255,255,.15);display:grid;grid-template-columns:.7fr 1.3fr;gap:40px 80px}.scope-band h2{font-size:clamp(2rem,3.5vw,3.6rem)}.scope-band>p,.scope-band>ul{color:#b5c4d4}.scope-band .text-link{grid-column:2}
.service-index{padding-top:40px}.service-index article{display:grid;grid-template-columns:80px 1fr;gap:35px;border-bottom:1px solid rgba(255,255,255,.17);padding:46px 0}.service-index article:first-child{border-top:1px solid rgba(255,255,255,.17)}.service-index article>.eyebrow{font-size:1rem}.service-index h2{font-size:clamp(1.8rem,3vw,3rem);margin-bottom:12px}.service-index h2 a:hover{color:var(--sky)}.service-index p{max-width:760px;color:#aebed0}.service-index .text-link{font-size:.85rem}
.pricing-page{padding-top:70px}.pricing-heading{display:grid;grid-template-columns:1fr .7fr;gap:60px;align-items:end;margin-bottom:50px}.pricing-heading h2{font-size:clamp(2.3rem,4vw,4rem);margin-bottom:0}.pricing-heading>p{color:#adbdcc}.pricing-grid{border-top:1px solid rgba(255,255,255,.2);display:grid;grid-template-columns:1fr}.pricing-card{display:grid;grid-template-columns:.85fr .85fr 1.5fr auto;gap:30px 42px;align-items:center;padding:36px 0;border-bottom:1px solid rgba(255,255,255,.18);background:transparent!important;border-radius:0!important;box-shadow:none!important}.pricing-card>.eyebrow{margin:0}.pricing-card h3{margin:0;font-size:clamp(1.7rem,2.6vw,2.55rem)}.pricing-card h3 span{font:400 .78rem Inter;color:#8fa1b5}.pricing-card>p{display:none}.pricing-card ul{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:5px 20px;list-style:none;padding:0;color:#afbfce;font-size:.85rem}.pricing-card li::before{content:"—";color:var(--sky);margin-right:8px}.pricing-card .text-link{white-space:nowrap;font-size:.8rem}.pricing-card-featured{position:relative}.pricing-card-featured::before{content:"";position:absolute;inset:0 -25px;background:linear-gradient(90deg,rgba(0,123,255,.10),transparent);z-index:-1}
.pricing-extra{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center;margin:42px 0;padding:34px;border:1px solid rgba(255,255,255,.18);background:rgba(0,123,255,.04)}.pricing-extra h3{font-size:2rem;margin-bottom:8px}.pricing-extra p{color:#aebed0;max-width:760px}.pricing-rules{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.15);margin-top:40px}.pricing-rules article{background:#07182d;padding:42px}.pricing-rules h2{font-size:2rem}.pricing-rules p,.pricing-rules li{color:#afbfce}.pricing-smallprint{color:#8296aa;font-size:.82rem;margin-top:28px}
.detail-cta{border-top:1px solid rgba(255,255,255,.17);display:flex;align-items:center;justify-content:space-between;gap:60px}.detail-cta h2{font-size:clamp(2rem,3.4vw,3.5rem);margin-bottom:12px}.detail-cta p{max-width:720px;color:#adbdcc}.detail-cta .button{flex:0 0 auto}
.detail-shell{width:min(var(--max),calc(100% - 64px));margin:auto;padding:75px 0 110px;display:grid;grid-template-columns:250px minmax(0,1fr);gap:80px}.detail-nav{position:sticky;top:calc(var(--header) + 28px);align-self:start;display:grid;border-top:1px solid rgba(255,255,255,.18)}.detail-nav a{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.12);color:#9cafc2;font-size:.82rem}.detail-nav a:hover{color:var(--sky)}.detail-content>section{padding:0 0 62px;margin-bottom:62px;border-bottom:1px solid rgba(255,255,255,.14)}.detail-content h2{font-size:clamp(2rem,3.4vw,3.3rem)}.detail-content h3{font-size:1.35rem;margin-top:34px}.detail-content p,.detail-content li{color:#b6c5d4}.detail-list{padding-left:1.1rem}.detail-note,.example-note{border-left:2px solid var(--sky);padding:18px 20px;background:rgba(0,180,255,.055);color:#c3d0dc!important}
.table-scroll{overflow-x:auto;max-width:100%;border:1px solid rgba(255,255,255,.16);margin:25px 0}.table-scroll table{width:100%;border-collapse:collapse;min-width:650px}.table-scroll caption{text-align:left;padding:14px 16px;color:#8fa3b8;font-size:.75rem}.table-scroll th,.table-scroll td{padding:12px 16px;border-top:1px solid rgba(255,255,255,.12);text-align:left;font-size:.83rem}.table-scroll th{color:#e9f0f7}.table-scroll td{color:#b1c0cf}
.reading-page,.legal{max-width:900px!important}.legal{width:min(900px,calc(100% - 48px));margin:70px auto 100px!important;padding:55px 60px!important;background:#f7f8fb;color:var(--ink);box-shadow:var(--shadow)}.legal h1{font-size:clamp(2.6rem,5vw,4.8rem)}.legal h2{font-size:1.6rem;margin:2.4rem 0 .7rem}.legal p,.legal li{color:#3f4f63}.legal a{color:#006fdc;text-decoration:underline}.legal .eyebrow{color:#006fdc}.legal .note{color:#6b7789}

/* Existing About / FAQ / Contact */
.edward-section{padding-top:90px}.edward-layout{display:grid;grid-template-columns:minmax(320px,.8fr) 1.2fr;gap:80px;align-items:start}.edward-portrait{margin:0;position:sticky;top:calc(var(--header) + 28px);overflow:hidden;background:#0b213a}.edward-portrait img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 22%}.edward-portrait figcaption{padding:20px 22px;border:1px solid rgba(255,255,255,.15);border-top:0;display:grid}.edward-portrait figcaption strong{font-family:Montserrat}.edward-portrait figcaption span{font-size:.75rem;color:#9db0c4}.edward-copy h2{font-size:clamp(2.4rem,4vw,4.3rem)}.edward-copy>p{color:#b6c5d5}.edward-proof{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid rgba(255,255,255,.16);margin:28px 0}.edward-proof>div{padding:18px}.edward-proof>div+div{border-left:1px solid rgba(255,255,255,.14)}.edward-proof strong{display:block;font:.85rem Montserrat}.edward-proof span{display:block;color:#899db1;font-size:.72rem;margin-top:4px}.working-principles{margin-top:80px;padding-top:60px;border-top:1px solid rgba(255,255,255,.16)}.principles{padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,1fr)}.principles li{display:grid;grid-template-columns:35px 1fr;gap:12px;padding:25px;border-top:1px solid rgba(255,255,255,.14);border-bottom:1px solid rgba(255,255,255,.14)}.principles li+li{border-left:1px solid rgba(255,255,255,.14)}.principles li>span{color:var(--sky);font:.7rem Montserrat}.principles p{font-size:.86rem;color:#aabacb}
.faq details,.full-faq details{border-top:1px solid rgba(255,255,255,.17)}.faq details:last-of-type,.full-faq details:last-of-type{border-bottom:1px solid rgba(255,255,255,.17)}.faq summary,.full-faq summary{cursor:pointer;list-style:none;padding:22px 40px 22px 0;font:700 1.05rem Montserrat;position:relative}.faq summary::-webkit-details-marker,.full-faq summary::-webkit-details-marker{display:none}.faq summary::after,.full-faq summary::after{content:"+";position:absolute;right:5px;color:var(--sky);font-size:1.4rem}.faq details[open] summary::after,.full-faq details[open] summary::after{content:"−"}.faq details p,.full-faq details p{color:#aebed0;max-width:850px;padding:0 0 20px;margin:0}
.contact{display:grid;grid-template-columns:.85fr 1.15fr;gap:90px;align-items:start}.contact h2{font-size:clamp(2.5rem,4.4vw,4.4rem)}.contact-methods{display:grid;border-top:1px solid rgba(255,255,255,.17);margin:28px 0}.contact-methods a{padding:13px 0;border-bottom:1px solid rgba(255,255,255,.14);color:#c4d1dd}.contact-methods a:hover{color:var(--sky)}
#enquiry{background:#0a203a;border:1px solid rgba(255,255,255,.16);padding:34px;display:grid;gap:8px}#enquiry label{font:650 .8rem Montserrat;margin-top:8px}#enquiry input,#enquiry select,#enquiry textarea{width:100%;border:1px solid rgba(255,255,255,.2);background:#061426;color:#fff;padding:12px 13px;min-height:48px;border-radius:0}#enquiry textarea{min-height:120px;resize:vertical}#enquiry input:focus,#enquiry select:focus,#enquiry textarea:focus{border-color:var(--sky);outline:none;box-shadow:0 0 0 2px rgba(0,180,255,.16)}#enquiry .button{margin-top:12px;justify-self:start}.form-error{background:#4b1720;border-left:3px solid #ff6f7b;padding:12px 14px;color:#fff;margin-bottom:8px}#result{margin-top:18px;padding-top:20px;border-top:1px solid rgba(255,255,255,.16)}#result pre{white-space:pre-wrap;word-break:break-word;background:#061426;padding:15px;color:#d7e3ed;max-height:300px;overflow:auto}#download{border:1px solid rgba(255,255,255,.24);background:transparent;color:#fff;padding:10px 14px;cursor:pointer;margin-top:10px}
@keyframes heroBreathe{from{transform:scale(1.018) translate3d(0,0,0)}to{transform:scale(1.055) translate3d(-.35%,0,0)}}
@media(max-width:1100px){:root{--header:80px}.section{width:min(var(--max),calc(100% - 48px));padding-block:90px}#navigation{gap:1rem}#navigation>a:not(.button){font-size:.75rem}.campaign-hero-content{width:calc(100% - 48px)}.positioning{gap:60px}.editorial-service-inner{width:calc(100% - 48px);grid-template-columns:70px 1fr .8fr;gap:32px}.editorial-reverse{grid-template-columns:70px .8fr 1fr}.service-visual{padding-left:28px;min-height:330px}.package-row{grid-template-columns:1fr .8fr 1.45fr 44px;gap:24px}.package-row ul{grid-template-columns:1fr}.edward-feature{gap:55px}.edward-feature-media,.edward-feature-media img{min-height:590px;height:590px}.detail-shell{width:calc(100% - 48px);grid-template-columns:210px 1fr;gap:50px}}
@media(max-width:900px){:root{--header:74px}body>header,.site-header{padding-inline:24px}#menu,.menu-button{display:inline-grid;place-items:center}#navigation{position:absolute;top:100%;left:0;right:0;display:none;align-items:stretch;gap:0;background:#061426;border-bottom:1px solid rgba(255,255,255,.15);padding:12px 24px 20px;box-shadow:0 18px 35px rgba(0,0,0,.28)}#navigation.open{display:grid}#navigation>a{padding:13px 0;border-bottom:1px solid rgba(255,255,255,.11)}#navigation>a:not(.button)::after{display:none}#navigation .button{margin-top:12px}.campaign-hero{min-height:calc(100svh - var(--header))}.campaign-hero-media img{object-position:64% center}.campaign-hero-overlay{background:linear-gradient(0deg,rgba(4,14,28,.98) 0%,rgba(4,14,28,.88) 42%,rgba(4,14,28,.22) 80%),linear-gradient(90deg,rgba(4,14,28,.6),transparent)}.campaign-hero-content{padding:34vh 0 170px;align-self:end}.campaign-hero h1{font-size:clamp(3.1rem,10vw,5.8rem)}.hero-lead{max-width:600px}.hero-proof>div{padding:20px 24px}.positioning{grid-template-columns:1fr;gap:28px}.value-rail{grid-column:auto}.services-story-head{grid-template-columns:1fr;gap:20px}.services-story-head .eyebrow,.services-story-head h2,.services-story-head>p:last-child{grid-column:1;grid-row:auto}.editorial-service{min-height:0}.editorial-service-inner,.editorial-reverse{grid-template-columns:60px 1fr;gap:25px;padding:70px 0}.editorial-service-inner .service-copy,.editorial-reverse .service-copy{grid-column:2}.editorial-service-inner .service-visual,.editorial-reverse .service-visual{grid-column:2;grid-row:auto;border-left:0;border-top:1px solid rgba(255,255,255,.15);padding:34px 0 0;margin-top:10px}.editorial-service-light .service-visual{border-color:rgba(10,31,68,.15)}.remote-story{min-height:700px}.remote-story-content{padding-top:220px}.remote-story-grid{gap:50px}.pricing-campaign-head{grid-template-columns:1fr;gap:20px}.package-row{grid-template-columns:1fr 1fr 44px}.package-row ul{grid-column:1/-1;grid-template-columns:1fr 1fr}.pricing-aux{grid-template-columns:1fr 1fr}.pricing-aux .button{grid-column:1/-1;justify-self:start}.workflow-track{grid-template-columns:1fr 1fr;gap:65px 0}.workflow-track li:nth-child(3){border-left:0}.workflow-track li:nth-child(n+3){border-top:1px solid rgba(255,255,255,.13);padding-top:35px}.workflow-track li:nth-child(n+3)>span{margin-top:-57px}.insight-campaign-inner{grid-template-columns:1fr;gap:50px}.edward-feature{grid-template-columns:.8fr 1.2fr;gap:45px}.edward-feature-media,.edward-feature-media img{min-height:520px;height:520px}.scope-band{grid-template-columns:1fr;gap:15px}.scope-band .text-link{grid-column:1}.pricing-heading{grid-template-columns:1fr;gap:20px}.pricing-card{grid-template-columns:.8fr 1fr auto}.pricing-card ul{grid-column:1/-1}.pricing-rules{grid-template-columns:1fr}.detail-shell{grid-template-columns:1fr}.detail-nav{position:static;display:flex;overflow-x:auto;gap:0;border-bottom:1px solid rgba(255,255,255,.15)}.detail-nav a{white-space:nowrap;padding:12px 18px 12px 0;margin-right:18px;border-bottom:0}.edward-layout{grid-template-columns:.78fr 1.22fr;gap:45px}.edward-portrait{position:static}.contact{grid-template-columns:1fr;gap:45px}}
@media(max-width:700px){.section{width:calc(100% - 36px);padding-block:72px}.identity-symbol{width:44px;flex-basis:44px}.identity-word{width:104px}.identity-descriptor{font-size:6.5px}.campaign-hero-content{width:calc(100% - 36px);padding:31vh 0 190px}.campaign-hero h1{font-size:clamp(2.9rem,14vw,5rem);line-height:.92;margin-bottom:20px}.campaign-hero-content .eyebrow{font-size:.62rem;letter-spacing:.12em}.hero-lead{font-size:1rem;line-height:1.5}.hero-actions{align-items:flex-start;flex-direction:column;gap:15px;margin-top:25px}.hero-actions .button{width:100%}.hero-proof{grid-template-columns:1fr 1fr}.hero-proof>div{padding:15px 18px}.hero-proof>div:nth-child(2){border-right:0}.hero-proof>div:nth-child(3){display:none}.positioning h2{font-size:2.45rem}.value-rail{grid-template-columns:1fr}.value-rail>div{padding:24px 0}.value-rail>div+div{padding-left:0;border-left:0;border-top:1px solid rgba(255,255,255,.12)}.services-story-head{padding-bottom:50px}.editorial-service-inner,.editorial-reverse{width:calc(100% - 36px);grid-template-columns:1fr;padding:58px 0}.service-index-number{font-size:2rem}.editorial-service-inner .service-copy,.editorial-reverse .service-copy,.editorial-service-inner .service-visual,.editorial-reverse .service-visual{grid-column:1}.service-copy h3{font-size:2.55rem}.service-visual{min-height:280px}.service-outcome-line{grid-template-columns:1fr;gap:5px}.remote-story{min-height:780px}.remote-story-media{object-position:62% center}.remote-story-content{width:calc(100% - 36px);padding-top:320px}.remote-story h2{font-size:3.6rem}.remote-story-grid{grid-template-columns:1fr;gap:10px}.pricing-campaign-head h2{font-size:2.55rem}.package-row{grid-template-columns:1fr auto 40px;gap:14px;padding:28px 0}.package-name{display:grid;gap:5px}.package-name h3{font-size:1.25rem}.package-price{text-align:right}.package-price strong{font-size:1.45rem}.package-row ul{grid-column:1/-1;grid-template-columns:1fr;margin-top:10px}.package-link{width:40px;height:40px}.pricing-aux{grid-template-columns:1fr;padding:22px}.pricing-aux>div+div{border-left:0;border-top:1px solid rgba(255,255,255,.15);padding:18px 0 0}.pricing-aux .button{grid-column:1;width:100%}.workflow-track{grid-template-columns:1fr;margin-top:55px;gap:0;border-top:0}.workflow-track li,.workflow-track li+li,.workflow-track li:nth-child(n+3){border-left:0;border-top:1px solid rgba(255,255,255,.14);padding:30px 0 34px 55px}.workflow-track>li>span,.workflow-track li:nth-child(n+3)>span{position:absolute;left:0;top:28px;margin:0;width:35px;height:35px}.workflow-track h3{margin:0 0 8px}.insight-board{padding:24px 18px 20px}.insight-board figcaption{grid-template-columns:1fr}.mini-chart{height:260px;padding-inline:5px}.insight-board-foot{grid-template-columns:1fr}.insight-board-foot>div{display:flex;justify-content:space-between;padding:9px 0}.insight-board-foot>div+div{border-left:0;border-top:1px solid rgba(255,255,255,.1);padding-left:0}.edward-feature{grid-template-columns:1fr;gap:40px}.edward-feature-media,.edward-feature-media img{height:auto;min-height:0;aspect-ratio:4/5}.edward-feature-copy h2{font-size:2.65rem}.edward-experience{margin-bottom:24px}.final-cta h2{font-size:3.45rem}.final-cta-actions{align-items:flex-start;flex-direction:column}.final-cta-actions .button{width:100%}.footer-top{align-items:flex-start;flex-direction:column}.footer-top>p{text-align:left}.footer-grid{grid-template-columns:1fr 1fr;gap:35px}.footer-grid>div:last-child{grid-column:1/-1}.detail-hero{min-height:50vh;padding-inline:18px;padding-bottom:58px}.detail-hero h1{font-size:3rem}.detail-hero .lead{font-size:1rem}.detail-hero::before{background-position:65% center}.service-index article{grid-template-columns:46px 1fr;gap:15px;padding:32px 0}.service-index h2{font-size:1.75rem}.pricing-card{grid-template-columns:1fr auto;gap:15px}.pricing-card>.eyebrow{grid-column:1}.pricing-card h3{grid-column:2;grid-row:1;text-align:right;font-size:1.5rem}.pricing-card ul{grid-column:1/-1;grid-template-columns:1fr}.pricing-card .text-link{grid-column:1/-1}.pricing-extra{grid-template-columns:1fr}.pricing-extra .button{width:100%}.detail-cta{align-items:flex-start;flex-direction:column;gap:20px}.detail-cta .button{width:100%}.detail-shell{width:calc(100% - 36px);padding-top:50px}.detail-content>section{padding-bottom:45px;margin-bottom:45px}.legal{width:calc(100% - 28px);padding:36px 25px!important;margin:35px auto 70px!important}.legal h1{font-size:2.55rem}.edward-layout{grid-template-columns:1fr}.edward-portrait{max-width:460px}.edward-proof{grid-template-columns:1fr}.edward-proof>div+div{border-left:0;border-top:1px solid rgba(255,255,255,.14)}.principles{grid-template-columns:1fr}.principles li+li{border-left:0;border-top:0}#enquiry{padding:24px 18px}.site-footer,body>footer{padding-inline:18px}}
@media(max-width:430px){.identity-type{gap:2px}.identity-word{width:92px}.identity-descriptor{font-size:5.8px;letter-spacing:.08em}#menu,.menu-button{min-width:50px}.campaign-hero-media img{object-position:66% center}.campaign-hero-content{padding-top:28vh}.campaign-hero h1{font-size:3.25rem}.campaign-hero-content .eyebrow{max-width:290px}.hero-proof>div{padding:14px 18px}.hero-proof strong{font-size:.82rem}.hero-proof span{font-size:.68rem}.remote-story h2{font-size:3.05rem}.service-copy h3{font-size:2.25rem}.insight-board figcaption strong{font-size:.95rem}.footer-grid{grid-template-columns:1fr}.footer-grid>div:last-child{grid-column:1}}
@media(max-width:370px){.campaign-hero h1{font-size:2.85rem}.campaign-hero-content{padding-bottom:180px}.button{font-size:.76rem;padding-inline:1rem}.hero-proof span{font-size:.64rem}.remote-story h2{font-size:2.7rem}.package-name h3{font-size:1.05rem}.package-price strong{font-size:1.25rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}.campaign-hero-media img{transform:none}.mini-bar{transform:scaleY(1)}}

/* QA refinements: tablet navigation, detailed-report charts and legacy inner-page footer */
@media(max-width:1050px){
  body>header,.site-header{padding-inline:24px}
  #menu,.menu-button{display:inline-grid;place-items:center}
  #navigation{position:absolute;top:100%;left:0;right:0;display:none;align-items:stretch;gap:0;background:#061426;border-bottom:1px solid rgba(255,255,255,.15);padding:12px 24px 20px;box-shadow:0 18px 35px rgba(0,0,0,.28)}
  #navigation.open{display:grid}
  #navigation>a{padding:13px 0;border-bottom:1px solid rgba(255,255,255,.11)}
  #navigation>a:not(.button)::after{display:none}
  #navigation .button{margin-top:12px}
}
body>footer:not(.site-footer){display:grid;grid-template-columns:1fr auto;gap:24px 55px;align-items:end}
body>footer:not(.site-footer)>p:not(.footer-legal){margin:0;color:#a9b9ca}
.footer-links{display:flex;flex-wrap:wrap;gap:8px 22px;grid-column:1/-1;padding-top:24px;border-top:1px solid rgba(255,255,255,.11)}
.footer-links a{font-size:.78rem;min-height:42px;display:inline-flex;align-items:center;color:#c4d1de}
.footer-links a:hover{color:var(--sky)}
body>footer:not(.site-footer) .footer-legal{grid-column:1/-1}

.detail-content .finance-figure{margin:28px 0 0;background:#f8fafc;border:1px solid #cfdae5;padding:26px;min-width:0;color:#162941;box-shadow:0 22px 55px rgba(0,0,0,.18)}
.finance-figure .figure-kicker{display:block;font-size:11px;font-weight:700;letter-spacing:.11em;color:#006bd6;margin-bottom:10px}
.finance-figure h3{font-size:22px;line-height:1.35;margin:0 0 10px;color:#162941}
.finance-figure figcaption>p{font-size:14px;line-height:1.7;color:#526177;margin:0 0 16px}
.finance-figure .chart-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:#526177;align-items:center;margin:20px 0}
.finance-figure .chart-legend>span{display:flex;align-items:center;gap:7px}
.finance-figure .chart-legend i{width:11px;height:11px;display:inline-block}
.finance-figure .legend-revenue{background:#007BFF}.finance-figure .legend-cost{background:#65788d}
.finance-figure .columns-chart{display:flex;gap:12px;height:230px;margin:24px 0 16px}
.finance-figure .chart-scale{display:flex;flex-direction:column;justify-content:space-between;flex:0 0 28px;padding-bottom:27px;font-size:11px;color:#607086}
.finance-figure .chart-months{display:flex;flex:1;gap:24px;justify-content:space-around;background:repeating-linear-gradient(to top,transparent 0,transparent 66px,#dce6ef 66px,#dce6ef 67px);background-size:100% 201px;background-repeat:no-repeat;min-width:0}
.finance-figure .chart-month{display:flex;flex-direction:column;flex:1;max-width:135px;min-width:0}
.finance-figure .chart-pair{display:flex;gap:8px;align-items:end;height:201px;border-bottom:1px solid #9eb5c9}
.finance-figure .chart-column{background:#007BFF;flex:1;max-width:54px;border-radius:2px 2px 0 0;transform-origin:bottom;position:relative}
.finance-figure .chart-column.cost{background:#65788d}
.finance-figure .chart-column>span{position:absolute;top:7px;left:0;right:0;text-align:center;color:#fff;font-size:11px;font-weight:700}
.finance-figure .height-95{height:63.333%}.finance-figure .height-108{height:72%}.finance-figure .height-117{height:78%}.finance-figure .height-120{height:80%}.finance-figure .height-135{height:90%}.finance-figure .height-150{height:100%}
.finance-figure .chart-month-label{font-size:12px;color:#526177;text-align:center;padding-top:8px}
.finance-figure .chart-takeaway,.chart-takeaway{font-size:14px!important;line-height:1.75!important;margin:18px 0 10px;color:#526177!important}
.finance-figure .chart-takeaway strong,.chart-takeaway strong{color:#162941}
.finance-figure .chart-data summary,.chart-data summary{font-size:13px;font-weight:700;color:#006bd6;cursor:pointer;padding:10px 0;min-height:44px}
.finance-figure .chart-data .table-scroll,.chart-data .table-scroll{margin-top:10px}
.finance-figure table{font-size:12px}
.finance-figure .cash-chart{display:block;width:100%;height:auto;max-height:270px;margin:22px 0}
.finance-figure .chart-grid{stroke:#d9e4ed;stroke-width:1}
.finance-figure .svg-labels{font:12px Inter,Arial,sans-serif;fill:#526177}
.finance-figure .cash-line{stroke:#007BFF;stroke-width:4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.finance-figure .cash-points{fill:#007BFF;stroke:#fff;stroke-width:2}
.finance-figure .svg-values{font:700 14px Inter,Arial,sans-serif;fill:#162941;text-anchor:middle}
.age-scale{font-size:12px;color:#6a788b}
.age-chart{display:flex;flex-direction:column;gap:20px;padding:14px 0;margin:18px 0;min-height:205px}
.age-row{display:grid;grid-template-columns:150px minmax(0,1fr) 80px;gap:12px;align-items:center;font-size:13px;color:#526177}
.age-row strong{text-align:right;color:#162941;font-size:13px}
.age-track{background:#e5edf4;height:14px;overflow:hidden}
.age-fill{background:#007BFF;height:100%;transform-origin:left}
.age-40{width:100%}.age-20{width:50%;background:#2878b6}.age-12{width:30%;background:#55768f}.age-8{width:20%;background:#78899a}
.motion-on .finance-figure .columns-chart.is-visible .chart-column{animation:legacyBar .75s var(--ease) both}
.motion-on .finance-figure .cash-chart.is-visible .cash-line{animation:legacyLine 1.1s ease both}
.motion-on .age-chart.is-visible .age-fill{animation:legacyBar .75s ease both}
@keyframes legacyBar{from{transform:scaleY(.04)}to{transform:scaleY(1)}}
@keyframes legacyLine{from{stroke-dasharray:1;stroke-dashoffset:1}to{stroke-dasharray:1;stroke-dashoffset:0}}
@media(max-width:700px){
  body>footer:not(.site-footer){grid-template-columns:1fr;gap:18px}
  .footer-links{gap:2px 17px}
  .finance-figure{padding:18px!important}
  .finance-figure .columns-chart{height:205px;gap:6px}
  .finance-figure .chart-pair{height:177px;gap:5px}
  .finance-figure .chart-months{gap:10px;background-size:100% 177px;background-image:repeating-linear-gradient(to top,transparent 0,transparent 58px,#dce6ef 58px,#dce6ef 59px)}
  .age-row{grid-template-columns:minmax(0,1fr) 75px;gap:8px}
  .age-row>span{grid-column:1}.age-row>strong{grid-column:2}.age-track{grid-column:1}.age-row strong{grid-row:2}
}

/* =========================================================
   PREMIUM INNER-PAGE CAMPAIGN SYSTEM — 2026-10-04
   ========================================================= */
.detail-hero{min-height:62vh;padding-bottom:72px}
.detail-hero .breadcrumb,.detail-hero>.eyebrow,.detail-hero>h1,.detail-hero>.lead,.detail-hero>.hero-signature{position:relative;z-index:2}
.detail-hero>.lead{max-width:720px}
.hero-signature{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;width:min(760px,100%);margin-top:36px;border-top:1px solid rgba(255,255,255,.22);border-bottom:1px solid rgba(255,255,255,.14);background:rgba(4,14,28,.28);backdrop-filter:blur(8px)}
.hero-signature span{min-height:58px;display:flex;align-items:center;padding:13px 18px;font:650 .73rem/1.35 Montserrat,Arial,sans-serif;letter-spacing:.035em;color:#d6e2ee}
.hero-signature span+span{border-left:1px solid rgba(255,255,255,.15)}
.page-services .detail-hero::before{background:url("assets/mattly-finance-premium-hero.webp") 58% 48%/cover no-repeat;opacity:.72}
.page-pricing .detail-hero::before,.page-process .detail-hero::before,.page-faq .detail-hero::before,.page-contact .detail-hero::before,.page-bookkeeping .detail-hero::before,.page-reporting .detail-hero::before{background:url("assets/brand-scene-desktop.webp") center/cover no-repeat;opacity:.92}
.page-balances .detail-hero::before,.page-catchup .detail-hero::before{background:url("assets/mattly-finance-premium-hero.webp") 62% 46%/cover no-repeat;opacity:.69}
.page-about .detail-hero::before{background:url("assets/edward-lessing.png") 84% 22%/min(48vw,670px) auto no-repeat;opacity:.72}
.page-about .detail-hero::after{background:linear-gradient(90deg,rgba(4,14,28,.99) 0%,rgba(4,14,28,.90) 45%,rgba(4,14,28,.26) 78%,rgba(4,14,28,.58) 100%),linear-gradient(0deg,rgba(4,14,28,.93),transparent 70%)}
.page-pricing .detail-hero::after,.page-process .detail-hero::after,.page-faq .detail-hero::after,.page-contact .detail-hero::after,.page-bookkeeping .detail-hero::after,.page-reporting .detail-hero::after{background:linear-gradient(90deg,rgba(4,14,28,.99) 0%,rgba(4,14,28,.86) 49%,rgba(4,14,28,.22) 100%),linear-gradient(0deg,rgba(4,14,28,.90),transparent 72%)}

/* Services overview becomes an editorial index rather than a card list */
.page-services .service-index{padding-top:0}
.page-services .service-index article{position:relative;grid-template-columns:94px minmax(0,1fr);padding:54px 38px 54px 0;transition:background .3s var(--ease),padding .3s var(--ease)}
.page-services .service-index article::after{content:"";position:absolute;inset:0 -34px;z-index:-1;background:linear-gradient(90deg,rgba(0,123,255,.10),rgba(0,180,255,.025),transparent);opacity:0;transition:opacity .3s}
.page-services .service-index article:hover::after{opacity:1}
.page-services .service-index article>.eyebrow{font-size:1.1rem;color:rgba(0,180,255,.72)}
.page-services .service-index h2{font-size:clamp(2rem,3.3vw,3.5rem);max-width:760px}
.page-services .service-index p{font-size:1rem;max-width:760px}
.page-services .scope-band{position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.14);padding-inline:48px;background:linear-gradient(135deg,rgba(0,123,255,.08),rgba(255,255,255,.018))}
.page-services .scope-band::after{content:"";position:absolute;width:340px;aspect-ratio:1;border:1px solid rgba(0,180,255,.14);border-radius:50%;right:-120px;top:-120px;box-shadow:0 0 0 45px rgba(0,180,255,.035),0 0 0 90px rgba(0,180,255,.02)}
.page-services .scope-band>*{position:relative;z-index:1}

/* Service detail pages: controlled editorial blocks */
.page-service .detail-shell{padding-top:90px;gap:64px}
.page-service .detail-nav{background:rgba(255,255,255,.022);border:1px solid rgba(255,255,255,.13);padding:18px 22px}
.page-service .detail-nav>p{margin:0 0 8px;color:var(--sky);font:700 .64rem/1.35 Montserrat;letter-spacing:.14em}
.page-service .detail-nav a{padding:11px 0}
.page-service .detail-nav .text-link{margin-top:12px;border-bottom-color:transparent}
.page-service .detail-content>section{position:relative;margin:0 0 24px;padding:52px 54px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.018)}
.page-service .detail-content>section:nth-child(even){background:linear-gradient(135deg,rgba(0,123,255,.055),rgba(255,255,255,.014))}
.page-service .detail-content>section>h2{font-size:clamp(2rem,3.25vw,3.15rem);max-width:720px}
.page-service .detail-content>section>p,.page-service .detail-content>section>ul{max-width:780px}
.page-service .detail-content .detail-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 30px;list-style:none;padding:0;margin:28px 0}
.page-service .detail-content .detail-list li{position:relative;padding:0 0 0 18px}
.page-service .detail-content .detail-list li::before{content:"";position:absolute;left:0;top:.72em;width:7px;height:1px;background:var(--sky)}
.page-service .detail-content .example-note{background:#f7f9fc;color:var(--ink);border-color:#d7e0e9;border-left:3px solid var(--blue)}
.page-service .detail-content .example-note>p,.page-service .detail-content .example-note li{color:#4c5d72!important}
.page-service .detail-content .example-note h2,.page-service .detail-content .example-note h3{color:#11233a}
.page-service .detail-content .example-note .eyebrow{color:#006cd9}

/* Full-width campaign break within each service */
.service-break{width:min(var(--max),calc(100% - 64px));min-height:470px;margin:40px auto 20px;display:grid;grid-template-columns:1fr 1fr;border:1px solid rgba(255,255,255,.15);overflow:hidden;background:#07182d}
.service-break-copy{display:flex;flex-direction:column;justify-content:center;padding:70px}
.service-break-copy h2{font-size:clamp(2.4rem,4vw,4.5rem);margin-bottom:24px}
.service-break-copy>p:last-child{max-width:590px;color:#b5c4d3;font-size:1.03rem}
.service-break-visual{position:relative;min-height:430px;background:url("assets/brand-scene-desktop.webp") center/cover no-repeat}
.page-balances .service-break-visual,.page-catchup .service-break-visual{background-image:url("assets/mattly-finance-premium-hero.webp");background-position:65% center}
.page-reporting .service-break-visual{background-image:url("assets/finance-social-aligned.webp");background-size:cover;background-position:center}
.service-break-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,24,45,.55),transparent 45%),linear-gradient(0deg,rgba(7,24,45,.35),transparent)}

/* Pricing: closer to a financial-services rate schedule */
.page-pricing .pricing-page{padding-top:95px}
.page-pricing .pricing-grid{border-top-color:rgba(0,180,255,.35)}
.page-pricing .pricing-card{min-height:158px}
.page-pricing .pricing-card>.eyebrow{font-size:.76rem}
.page-pricing .pricing-card h3{letter-spacing:-.045em}
.page-pricing .pricing-card-featured::before{background:linear-gradient(90deg,rgba(0,123,255,.17),rgba(0,180,255,.045),transparent)}
.page-pricing .pricing-extra{background:linear-gradient(135deg,rgba(0,123,255,.10),rgba(0,180,255,.025))}
.page-pricing .pricing-rules article{background:linear-gradient(145deg,#07182d,#091d35)}

/* How it works — purpose-built process page */
.process-campaign{padding-top:100px}
.process-intro{display:grid;grid-template-columns:1fr .65fr;gap:28px 90px;align-items:end;margin-bottom:70px}
.process-intro .eyebrow,.process-intro h2{grid-column:1}
.process-intro h2{margin-bottom:0}
.process-intro>p:last-child{grid-column:2;grid-row:1/3;color:#b1c1d0}
.process-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.18);border-left:1px solid rgba(255,255,255,.10)}
.process-grid li{min-height:280px;padding:34px 32px;border-right:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;justify-content:space-between;background:rgba(255,255,255,.012)}
.process-grid li:hover{background:rgba(0,123,255,.055)}
.process-grid li>span{color:var(--sky);font:700 .68rem Montserrat;letter-spacing:.14em}
.process-grid h3{font-size:1.45rem;margin:42px 0 12px}
.process-grid p{color:#aebdcc;font-size:.9rem;margin:0}
.process-workspace{background:#f5f7fa;color:var(--ink);border-top:1px solid #dfe5eb;border-bottom:1px solid #dfe5eb}
.process-workspace-inner{display:grid;grid-template-columns:1.15fr .85fr;gap:90px;align-items:center}
.process-workspace .eyebrow{color:#006edc}
.process-workspace article>p:not(.eyebrow){color:#4d5e71}
.process-workspace h2{font-size:clamp(2.4rem,4vw,4.25rem)}
.process-cycle{background:#071a31;color:#fff;padding:42px 40px;box-shadow:0 28px 70px rgba(8,24,45,.16)}
.process-cycle .eyebrow{color:var(--sky)}
.process-cycle h3{font-size:1.75rem}
.process-cycle ol{list-style:none;padding:0;margin:25px 0;border-top:1px solid rgba(255,255,255,.14)}
.process-cycle li{display:grid;grid-template-columns:34px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.12);font-size:.9rem;color:#d4dee8}
.process-cycle li span{color:var(--sky);font:700 .7rem Montserrat}
.process-cycle>p:last-child{color:#9fb1c4!important;font-size:.88rem}
.responsibility-section{padding-top:105px}
.responsibility-head{display:grid;grid-template-columns:1fr .55fr;gap:20px 80px;align-items:end;margin-bottom:42px}
.responsibility-head .eyebrow,.responsibility-head h2{grid-column:1}
.responsibility-head h2{margin-bottom:0}
.responsibility-head>p:last-child{grid-column:2;grid-row:1/3;color:#aebed0}
.responsibility-section .table-scroll{border-color:rgba(255,255,255,.17);background:rgba(255,255,255,.02)}
.responsibility-section th,.responsibility-section td{padding:17px 19px}
.process-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.13);padding-top:0}
.process-notes article{position:relative;background:#07182d;padding:40px 34px;min-height:330px}
.process-notes article>span{display:block;color:rgba(0,180,255,.5);font:700 2.2rem Montserrat;margin-bottom:42px}
.process-notes h3{font-size:1.55rem}
.process-notes p:not(.eyebrow){color:#aebdcc;font-size:.9rem}

/* About Edward — editorial profile, no qualification inflation */
.page-about .edward-section{padding-top:110px}
.page-about .edward-layout{grid-template-columns:minmax(360px,.85fr) 1.15fr;gap:90px}
.page-about .edward-portrait{border:1px solid rgba(255,255,255,.15);background:#07182d;box-shadow:0 26px 70px rgba(0,0,0,.22)}
.page-about .edward-portrait img{aspect-ratio:4/5;filter:saturate(.92) contrast(1.03)}
.page-about .edward-copy>p:first-of-type{font-size:1.12rem;color:#d1dce7}
.page-about .edward-proof{margin:36px 0;background:rgba(0,123,255,.045)}
.page-about .working-principles{margin-top:100px}

/* FAQ — sticky editorial index beside the answers */
.page-faq .full-faq{display:grid;grid-template-columns:minmax(260px,.52fr) minmax(0,1.48fr);gap:0 80px;align-items:start}
.page-faq .faq-intro{grid-column:1;grid-row:1 / span 30;position:sticky;top:calc(var(--header) + 36px);padding:0 0 30px}
.page-faq .faq-intro h2{font-size:clamp(2.3rem,3.6vw,3.8rem);margin-bottom:20px}
.page-faq .faq-intro>p:not(.eyebrow){color:#aebdcc}
.page-faq .faq-intro .button{margin-top:12px}
.page-faq .full-faq details{grid-column:2}
.page-faq .full-faq summary{font-size:1.02rem;padding-block:24px}
.page-faq .full-faq details p{font-size:.94rem;line-height:1.75;padding-right:30px}

/* Contact — direct and deliberately simple */
.page-contact .contact-page{padding-top:105px}
.page-contact .contact>div:first-child{padding-top:12px}
.page-contact #enquiry{position:relative;overflow:hidden;background:linear-gradient(145deg,#0a203a,#07182d);box-shadow:0 26px 70px rgba(0,0,0,.22)}
.page-contact #enquiry::before{content:"";position:absolute;width:280px;aspect-ratio:1;border:1px solid rgba(0,180,255,.10);border-radius:50%;right:-140px;top:-140px}
.page-contact #enquiry>*{position:relative;z-index:1}

/* Inner-page CTA refinement */
.page-services .detail-cta,.page-pricing .detail-cta,.page-process .detail-cta,.page-about .detail-cta,.page-service .detail-cta{position:relative;overflow:hidden;background:linear-gradient(120deg,rgba(0,123,255,.08),transparent 55%)}

/* Performance-friendly below-fold isolation */
@supports(content-visibility:auto){
  .editorial-service,.service-break,.process-workspace,.process-notes,.pricing-campaign,.edward-feature{content-visibility:auto;contain-intrinsic-size:700px}
}

@media(max-width:1000px){
  .page-about .detail-hero::before{background-position:95% 28%;background-size:60vw auto}
  .page-service .detail-content>section{padding:42px}
  .service-break{width:calc(100% - 48px)}
  .service-break-copy{padding:50px}
  .process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .process-intro,.responsibility-head{grid-template-columns:1fr;gap:18px}
  .process-intro .eyebrow,.process-intro h2,.process-intro>p:last-child,.responsibility-head .eyebrow,.responsibility-head h2,.responsibility-head>p:last-child{grid-column:1;grid-row:auto}
  .process-workspace-inner{gap:55px}
  .page-faq .full-faq{grid-template-columns:230px minmax(0,1fr);gap:0 50px}
}

@media(max-width:800px){
  .hero-signature{grid-template-columns:1fr}
  .hero-signature span+span{border-left:0;border-top:1px solid rgba(255,255,255,.12)}
  .hero-signature span{min-height:46px}
  .page-about .detail-hero::before{background-position:100% 10%;background-size:auto 100%;opacity:.45}
  .page-service .detail-shell{padding-top:60px}
  .page-service .detail-nav{padding:10px 0;background:transparent;border-left:0;border-right:0}
  .page-service .detail-content>section{padding:36px 30px}
  .page-service .detail-content .detail-list{grid-template-columns:1fr}
  .service-break{grid-template-columns:1fr;width:calc(100% - 36px);min-height:0}
  .service-break-copy{padding:46px 34px}
  .service-break-visual{min-height:320px}
  .process-workspace-inner{grid-template-columns:1fr}
  .process-notes{grid-template-columns:1fr}
  .process-notes article{min-height:0}
  .page-faq .full-faq{grid-template-columns:1fr;gap:32px}
  .page-faq .faq-intro{grid-column:1;grid-row:auto;position:static;padding-bottom:22px;border-bottom:1px solid rgba(255,255,255,.16)}
  .page-faq .full-faq details{grid-column:1}
}

@media(max-width:600px){
  .detail-hero{min-height:58vh;padding-bottom:52px}
  .detail-hero h1{font-size:clamp(2.65rem,12vw,3.8rem)}
  .hero-signature{margin-top:28px}
  .page-pricing .detail-hero::before,.page-process .detail-hero::before,.page-faq .detail-hero::before,.page-contact .detail-hero::before,.page-bookkeeping .detail-hero::before,.page-reporting .detail-hero::before{background-image:url("assets/brand-scene-mobile.webp");background-position:center;background-size:cover}
  .page-about .detail-hero::before{background-position:88% 5%;background-size:auto 100%}
  .page-service .detail-content>section{padding:30px 22px;margin-bottom:16px}
  .page-services .scope-band{padding-inline:24px}
  .process-grid{grid-template-columns:1fr}
  .process-grid li{min-height:235px}
  .process-cycle{padding:32px 24px}
  .service-break-copy{padding:38px 24px}
  .service-break-copy h2{font-size:2.45rem}
  .service-break-visual{min-height:250px}
  .page-faq .full-faq summary{font-size:.96rem}
}


/* Accessibility QA refinements */
#navigation>a:not(.button){min-height:44px;display:inline-flex;align-items:center}
.footer-grid a{min-height:44px;display:inline-flex;align-items:center}
.contact-methods a{min-height:48px;align-items:center;display:flex}
.faq summary,.full-faq summary{min-height:48px}
.package-link{min-width:44px;min-height:44px}
.text-link,.button-link{min-height:32px}
@media(max-width:1050px){
  #navigation>a{min-height:48px;display:flex;align-items:center}
}


/* Related-service navigation: conversion + internal linking */
.related-services{display:grid;grid-template-columns:.62fr 1.38fr;gap:70px;align-items:start;padding-top:80px;padding-bottom:80px}
.related-services h2{font-size:clamp(2rem,3.4vw,3.4rem);margin-bottom:0}
.related-service-links{border-top:1px solid rgba(255,255,255,.18)}
.related-service-links a{display:grid;grid-template-columns:48px 1fr 32px;gap:15px;align-items:center;min-height:72px;border-bottom:1px solid rgba(255,255,255,.14);transition:background .25s,padding .25s,color .25s}
.related-service-links a:hover{background:rgba(0,123,255,.055);padding-inline:14px;color:var(--sky)}
.related-service-links span{font:700 .64rem Montserrat;color:var(--sky);letter-spacing:.12em}
.related-service-links strong{font:650 .92rem Montserrat;color:#dbe5ef}
.related-service-links em{font-style:normal;text-align:right;color:var(--sky)}
.page-service .related-services+.service-break{margin-top:0}
@media(max-width:800px){
  .related-services{grid-template-columns:1fr;gap:28px;padding-top:60px;padding-bottom:60px}
}


/* QA: remove pseudo-element overflow and enlarge breadcrumb targets */
.breadcrumb a{display:inline-flex;align-items:center;min-height:32px}
@media(max-width:700px){
  .page-pricing .pricing-grid{overflow:hidden}
  .page-pricing .pricing-card-featured::before{inset:0}
}


/* Premium 404 */
.notfound{position:relative;min-height:72vh;display:grid;place-items:center;overflow:hidden;isolation:isolate;background:linear-gradient(120deg,#061426,#0a2443)}
.notfound::before{content:"";position:absolute;inset:0;z-index:-3;background:url("assets/brand-scene-desktop.webp") center/cover no-repeat;opacity:.55}
.notfound::after{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(4,14,28,.97),rgba(4,14,28,.68) 52%,rgba(4,14,28,.3))}
.notfound-inner{width:min(var(--max),calc(100% - 64px));margin:auto;padding:100px 0;display:grid;grid-template-columns:1fr .8fr;gap:70px;align-items:center}
.notfound h1{font-size:clamp(3.3rem,7vw,7rem);text-transform:uppercase;margin-bottom:25px}
.notfound .lead{max-width:650px;color:#c3d0dd}
.notfound-code{display:flex;align-items:center;justify-content:center;gap:22px;font:800 clamp(7rem,15vw,13rem)/.8 Montserrat;color:rgba(255,255,255,.08);letter-spacing:-.08em}
.notfound-code i{width:110px;height:110px;border:1px solid rgba(0,180,255,.28);border-radius:50%;box-shadow:0 0 0 28px rgba(0,180,255,.04),0 0 0 56px rgba(0,180,255,.025)}
@media(max-width:800px){.notfound-inner{width:calc(100% - 36px);grid-template-columns:1fr;padding:80px 0}.notfound-code{display:none}.notfound::before{background-image:url("assets/brand-scene-mobile.webp")}}


/* WCAG contrast refinement for white text on primary action buttons */
.button{background:#006edc}
.button:hover{background:#005fc9}
.button-outline{background:transparent}
.button-outline:hover{background:rgba(255,255,255,.08)}


/* Mobile performance: defer Edward's full portrait until the profile content */
@media(max-width:600px){
  .page-about .detail-hero::before{background-image:url("assets/brand-scene-mobile.webp");background-position:center;background-size:cover;opacity:.78}
}


/* QA: keep the About profile single-column on phone/tablet portrait */
@media(max-width:800px){
  .page-about .edward-layout{grid-template-columns:minmax(0,1fr);gap:42px}
  .page-about .edward-portrait{width:100%;max-width:520px}
  .page-about .edward-copy{min-width:0}
}


/* Final mobile overflow containment */
.page-services .service-index{overflow:hidden}
@media(max-width:700px){
  .page-services .service-index article::after{inset:0}
  .page-services .service-index article{padding-right:0}
}


/* Final contact inline-link touch target */
.page-contact .contact p a{display:inline-flex;align-items:center;min-height:32px;vertical-align:middle}


/* =========================================================
   MATTLY FINANCIAL INSIGHT CHART — 2026-10-04
   ========================================================= */
.insight-board-live{position:relative;overflow:hidden;background:linear-gradient(145deg,#061426 0%,#09223f 100%);border-color:rgba(0,180,255,.32);box-shadow:0 28px 72px rgba(7,25,46,.25)}
.insight-board-live::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 82% 14%,rgba(0,180,255,.11),transparent 28%);pointer-events:none}
.insight-board-live>*{position:relative;z-index:1}
.insight-board-live figcaption{align-items:end}
.insight-board-live figcaption span{font-size:.68rem;letter-spacing:.17em}
.insight-board-live figcaption strong{font-size:1.12rem;letter-spacing:-.015em}
.insight-board-live figcaption small{font-size:.72rem}
.insight-chart-legend{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:18px 0 4px;color:#9eb1c4;font-size:.68rem}
.insight-chart-legend>span{display:inline-flex;align-items:center;gap:8px}
.legend-line{display:inline-block;width:23px;height:2px}
.legend-revenue{background:linear-gradient(90deg,#00B4FF,#006EDC);box-shadow:0 0 12px rgba(0,180,255,.35)}
.legend-cost{background:#8496a9}
.legend-spread{margin-left:auto;color:#6f879e;text-transform:uppercase;letter-spacing:.08em;font:700 .58rem Montserrat}
.mattly-chart.mini-chart{height:320px;display:grid;grid-template-columns:38px minmax(0,1fr);grid-template-rows:minmax(0,1fr) 28px;gap:0 8px;padding:18px 0 0;overflow:visible;position:relative}
.mattly-chart-scale{grid-column:1;grid-row:1;display:flex;flex-direction:column;justify-content:space-between;padding:7px 0 20px;text-align:right;color:#62788f;font:650 .58rem/1 Montserrat}
.mattly-chart-stage{grid-column:2;grid-row:1;position:relative;min-width:0;overflow:hidden;border-left:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.11)}
.mattly-chart-stage svg{display:block;width:100%;height:100%;overflow:visible}
.mattly-grid line{stroke:rgba(255,255,255,.08);stroke-width:1;vector-effect:non-scaling-stroke}
.mattly-spread{fill:rgba(0,123,255,.10);opacity:0;transition:opacity .75s ease .55s}
.mattly-line{fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1}
.mattly-line-revenue{stroke:#00B4FF;filter:drop-shadow(0 0 5px rgba(0,180,255,.28))}
.mattly-line-cost{stroke:#8193a7;stroke-width:2}
.mattly-points circle{opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(.2);vector-effect:non-scaling-stroke}
.revenue-points circle{fill:#00B4FF;stroke:#07192e;stroke-width:2.5}
.cost-points circle{fill:#8193a7;stroke:#07192e;stroke-width:2}
.mattly-pulse{fill:none;stroke:#00B4FF;stroke-width:2;opacity:0;transform-box:fill-box;transform-origin:center}
.mattly-chart-callouts text{fill:#eaf7ff;font:700 12px Montserrat;opacity:0;transform:translateY(5px);transition:opacity .45s ease 1.8s,transform .45s ease 1.8s}
.mattly-chart-callouts .cost-label{fill:#9aaabd}
.mattly-months{grid-column:2;grid-row:2;display:grid;grid-template-columns:repeat(6,1fr);align-items:end;padding:7px 0 0;color:#74889d;font:700 .59rem/1 Montserrat;letter-spacing:.08em}
.mattly-months span{text-align:center}
.mattly-scan{position:absolute;top:0;bottom:0;width:1px;left:8%;background:linear-gradient(180deg,transparent,rgba(0,180,255,.22) 20%,rgba(0,180,255,.48) 52%,rgba(0,180,255,.12) 82%,transparent);opacity:0;box-shadow:0 0 12px rgba(0,180,255,.16)}
.mattly-chart.is-visible .mattly-line-revenue{animation:mattlyLineDraw 1.25s var(--ease) .12s forwards}
.mattly-chart.is-visible .mattly-line-cost{animation:mattlyLineDraw 1.2s var(--ease) .42s forwards}
.mattly-chart.is-visible .mattly-spread{opacity:1}
.mattly-chart.is-visible .mattly-points circle{animation:mattlyPointIn .42s var(--ease) forwards}
.mattly-chart.is-visible .revenue-points circle:nth-child(1){animation-delay:.55s}
.mattly-chart.is-visible .revenue-points circle:nth-child(2){animation-delay:.69s}
.mattly-chart.is-visible .revenue-points circle:nth-child(3){animation-delay:.83s}
.mattly-chart.is-visible .revenue-points circle:nth-child(4){animation-delay:.97s}
.mattly-chart.is-visible .revenue-points circle:nth-child(5){animation-delay:1.11s}
.mattly-chart.is-visible .revenue-points circle:nth-child(6){animation-delay:1.25s}
.mattly-chart.is-visible .cost-points circle:nth-child(1){animation-delay:.82s}
.mattly-chart.is-visible .cost-points circle:nth-child(2){animation-delay:.94s}
.mattly-chart.is-visible .cost-points circle:nth-child(3){animation-delay:1.06s}
.mattly-chart.is-visible .cost-points circle:nth-child(4){animation-delay:1.18s}
.mattly-chart.is-visible .cost-points circle:nth-child(5){animation-delay:1.30s}
.mattly-chart.is-visible .cost-points circle:nth-child(6){animation-delay:1.42s}
.mattly-chart.is-visible .mattly-pulse{animation:mattlyPulse 2.4s ease-out 1.65s infinite}
.mattly-chart.is-visible .mattly-chart-callouts text{opacity:1;transform:translateY(0)}
.mattly-chart.is-visible .mattly-scan{animation:mattlyScan 5.5s ease-in-out 2s infinite}
.insight-board-live .insight-board-foot{margin-top:7px;padding-top:18px}
.insight-board-live .insight-board-foot>div{position:relative;padding-top:2px}
.insight-board-live .insight-board-foot span{font-size:.66rem}
.insight-board-live .insight-board-foot strong{font-size:1.08rem}
.insight-board-live .insight-board-foot small{display:block;margin-top:3px;color:#647b91;font-size:.58rem;text-transform:uppercase;letter-spacing:.07em}
.insight-board-live .insight-highlight strong{color:#00B4FF}
.insight-board-live .insight-highlight::before{content:"";position:absolute;left:21px;top:-19px;width:38px;height:2px;background:linear-gradient(90deg,#006EDC,#00B4FF)}
@keyframes mattlyLineDraw{to{stroke-dashoffset:0}}
@keyframes mattlyPointIn{0%{opacity:0;transform:scale(.2)}70%{opacity:1;transform:scale(1.28)}100%{opacity:1;transform:scale(1)}}
@keyframes mattlyPulse{0%{opacity:.72;transform:scale(.55)}70%,100%{opacity:0;transform:scale(2.15)}}
@keyframes mattlyScan{0%{left:8%;opacity:0}12%{opacity:.65}50%{left:82%;opacity:.34}88%{opacity:.55}100%{left:8%;opacity:0}}
@media(max-width:700px){
  .insight-chart-legend{gap:10px 14px}
  .legend-spread{width:100%;margin-left:0}
  .mattly-chart.mini-chart{height:280px;grid-template-columns:30px minmax(0,1fr)}
  .mattly-chart-scale{font-size:.54rem}
  .mattly-months{font-size:.54rem}
  .insight-board-live .insight-board-foot strong{font-size:.95rem}
}
@media(max-width:430px){
  .mattly-chart.mini-chart{height:255px;padding-top:12px}
  .insight-chart-legend{padding-top:14px}
  .mattly-chart-callouts text{font-size:11px}
}
@media(prefers-reduced-motion:reduce){
  .mattly-line{stroke-dashoffset:0!important;animation:none!important}
  .mattly-spread{opacity:1!important;transition:none!important}
  .mattly-points circle{opacity:1!important;transform:none!important;animation:none!important}
  .mattly-pulse,.mattly-scan{display:none!important}
  .mattly-chart-callouts text{opacity:1!important;transform:none!important;transition:none!important}
}


/* Animated MATTLY monthly-results bars */
.insight-board-bars{background:radial-gradient(circle at 84% 10%,rgba(0,180,255,.10),transparent 28%),linear-gradient(145deg,#061426 0%,#09223f 100%)}
.insight-board-bars figcaption{grid-template-columns:1fr auto}
.insight-board-bars .insight-chart-legend{padding-bottom:8px}
.legend-block{display:inline-block;width:13px;height:8px;border-radius:1px}
.insight-board-bars .legend-revenue{background:linear-gradient(90deg,#006EDC,#00B4FF);box-shadow:0 0 12px rgba(0,180,255,.22)}
.insight-board-bars .legend-cost{background:#667a90}
.mattly-bars.mini-chart{height:370px;display:block;padding:10px 0 0;position:relative;overflow:hidden}
.mattly-bars svg{display:block;width:100%;height:100%;overflow:visible}
.bars-grid line{stroke:rgba(255,255,255,.08);stroke-width:1;vector-effect:non-scaling-stroke}
.bars-axis text{fill:#667b91;font:600 10px Montserrat;text-anchor:end}
.bars-months text{fill:#71869c;font:700 10px Montserrat;text-anchor:middle;letter-spacing:.08em}
.bars-columns .bar{transform-box:fill-box;transform-origin:center bottom;transform:scaleY(.02);rx:2}
.bars-columns .revenue{fill:url(#unused);fill:#007EEA}
.bars-columns .cost{fill:#5c7187}
.bars-trend{fill:none;stroke:#39d4ff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 0 5px rgba(0,180,255,.25))}
.bars-points circle{fill:#07192e;stroke:#62ddff;stroke-width:2.2;vector-effect:non-scaling-stroke;opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(.2)}
.bars-values text{fill:#eaf7ff;font:700 10px Montserrat;text-anchor:middle;opacity:0}
.bars-scan{stroke:#00B4FF;stroke-width:1;opacity:0;filter:drop-shadow(0 0 5px rgba(0,180,255,.4));vector-effect:non-scaling-stroke}
.spread-row{display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid rgba(255,255,255,.10);border-bottom:1px solid rgba(255,255,255,.12);margin-top:-2px}
.spread-row>div{padding:12px 8px 13px;text-align:center;position:relative}
.spread-row>div+div{border-left:1px solid rgba(255,255,255,.08)}
.spread-row span{display:block;color:#677d93;font:700 .55rem Montserrat;letter-spacing:.08em}
.spread-row strong{display:block;margin-top:3px;color:#cbd7e2;font:700 .78rem Montserrat}
.spread-row .spread-current{background:linear-gradient(180deg,rgba(0,180,255,.08),transparent)}
.spread-row .spread-current strong{color:#00B4FF}
.mattly-bars.is-visible .bars-columns .bar{animation:mattlyBarGrow .9s var(--ease) forwards;animation-delay:var(--d)}
.mattly-bars.is-visible .bars-trend{animation:mattlyBarsLine 1.35s var(--ease) .72s forwards}
.mattly-bars.is-visible .bars-points circle{animation:mattlyBarsPoint .42s var(--ease) forwards}
.mattly-bars.is-visible .bars-points circle:nth-child(1){animation-delay:.85s}.mattly-bars.is-visible .bars-points circle:nth-child(2){animation-delay:.98s}.mattly-bars.is-visible .bars-points circle:nth-child(3){animation-delay:1.11s}.mattly-bars.is-visible .bars-points circle:nth-child(4){animation-delay:1.24s}.mattly-bars.is-visible .bars-points circle:nth-child(5){animation-delay:1.37s}.mattly-bars.is-visible .bars-points circle:nth-child(6){animation-delay:1.5s}
.mattly-bars.is-visible .bars-values text{animation:mattlyBarsValue .4s ease forwards}
.mattly-bars.is-visible .bars-values text:nth-child(1){animation-delay:.92s}.mattly-bars.is-visible .bars-values text:nth-child(2){animation-delay:1.05s}.mattly-bars.is-visible .bars-values text:nth-child(3){animation-delay:1.18s}.mattly-bars.is-visible .bars-values text:nth-child(4){animation-delay:1.31s}.mattly-bars.is-visible .bars-values text:nth-child(5){animation-delay:1.44s}.mattly-bars.is-visible .bars-values text:nth-child(6){animation-delay:1.57s}
.mattly-bars.is-visible .bars-scan{animation:mattlyBarsScan 6.2s ease-in-out 1.8s infinite}
@keyframes mattlyBarGrow{0%{transform:scaleY(.02)}72%{transform:scaleY(1.035)}100%{transform:scaleY(1)}}
@keyframes mattlyBarsLine{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes mattlyBarsPoint{0%{opacity:0;transform:scale(.2)}75%{opacity:1;transform:scale(1.3)}100%{opacity:1;transform:scale(1)}}
@keyframes mattlyBarsValue{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@keyframes mattlyBarsScan{0%,8%{transform:translateX(0);opacity:0}14%{opacity:.6}76%{opacity:.3}84%,100%{transform:translateX(600px);opacity:0}}
@media(max-width:700px){
  .mattly-bars.mini-chart{height:320px}
  .spread-row>div{padding-inline:3px}
  .spread-row strong{font-size:.7rem}
}
@media(max-width:430px){
  .mattly-bars.mini-chart{height:290px}
  .bars-values text{font-size:9px}
  .bars-axis text,.bars-months text{font-size:9px}
  .spread-row strong{font-size:.66rem}
}
@media(prefers-reduced-motion:reduce){
  .bars-columns .bar{transform:scaleY(1)!important;animation:none!important}
  .bars-trend{stroke-dashoffset:0!important;animation:none!important}
  .bars-points circle,.bars-values text{opacity:1!important;transform:none!important;animation:none!important}
  .bars-scan{display:none!important}
}


/* Final MATTLY chart polish */
.insight-board-bars::after{content:"MATTLY / INSIGHT";position:absolute;right:34px;top:28px;color:rgba(0,180,255,.22);font:700 .55rem/1 Montserrat;letter-spacing:.18em;pointer-events:none}
.bars-columns .revenue{fill:url(#mattlyRevenueGradient)}
.bars-columns .cost{fill:url(#mattlyCostGradient)}
.bars-columns .bar{filter:drop-shadow(0 7px 10px rgba(0,0,0,.12))}
.bars-pulse{fill:none;stroke:#56E2FF;stroke-width:1.8;opacity:0;transform-box:fill-box;transform-origin:center;vector-effect:non-scaling-stroke}
.mattly-bars.is-visible .bars-pulse{animation:mattlyBarsPulse 2.2s ease-out 1.65s infinite}
.spread-row .spread-current{box-shadow:inset 0 2px 0 rgba(0,180,255,.36)}
.spread-row .spread-current strong{animation:mattlySpreadGlow 2.6s ease-in-out 1.7s infinite}
@keyframes mattlyBarsPulse{0%{opacity:.75;transform:scale(.65)}72%,100%{opacity:0;transform:scale(2.35)}}
@keyframes mattlySpreadGlow{0%,100%{text-shadow:0 0 0 rgba(0,180,255,0)}50%{text-shadow:0 0 13px rgba(0,180,255,.34)}}
@media(max-width:700px){.insight-board-bars::after{right:18px;top:20px;font-size:.5rem}}
@media(prefers-reduced-motion:reduce){.bars-pulse{display:none!important}.spread-row .spread-current strong{animation:none!important}}


/* Animated MATTLY outstanding-ageing view */
.service-visual-ageing{position:relative;overflow:hidden}
.ageing-head{display:flex;justify-content:space-between;align-items:end;gap:18px;margin:-4px 0 20px;padding-bottom:13px;border-bottom:1px solid rgba(10,31,68,.12)}
.ageing-head strong{font:700 1rem/1.2 Montserrat;color:#17283f;letter-spacing:-.02em}
.ageing-head span{font:700 .56rem/1.2 Montserrat;color:#6c7f94;letter-spacing:.12em;text-transform:uppercase}
.ageing-stack{display:grid;gap:16px;position:relative}
.ageing-row{display:grid;grid-template-columns:62px minmax(0,1fr) 38px;align-items:center;gap:12px;margin:0;font:700 .72rem/1.2 Montserrat;color:#3e5268}
.ageing-row>span{font-weight:700}
.ageing-row>strong{text-align:right;color:#27445f;font:700 .66rem/1 Montserrat;opacity:0}
.ageing-row>i{height:11px;background:rgba(10,31,68,.065);position:relative;overflow:visible;border-radius:1px}
.ageing-row>i::before{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--w);transform:scaleX(.02);transform-origin:left center;background:linear-gradient(90deg,#006EDC 0%,#00A8F0 68%,#42D9FF 100%);border-radius:1px;box-shadow:0 0 14px rgba(0,123,255,.08)}
.ageing-row>i em{position:absolute;top:50%;left:var(--w);width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;background:#fff;border:2px solid #00A8F0;opacity:0;transform:scale(.3);box-shadow:0 0 0 4px rgba(0,168,240,.08)}
.ageing-row>i u{position:absolute;left:0;top:50%;width:var(--w);height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.7));opacity:.45;text-decoration:none}
.ageing-row-alert>i::before{background:linear-gradient(90deg,#4f6f91,#728ca6)}
.ageing-row-alert>i em{border-color:#728ca6}
.ageing-foot{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:22px;padding-top:13px;border-top:1px solid rgba(10,31,68,.12);color:#738398;font-size:.68rem}
.ageing-foot b{color:#006EDC;font:700 1rem Montserrat}
.ageing-scan{position:absolute;top:84px;bottom:55px;width:1px;left:66px;background:linear-gradient(180deg,transparent,rgba(0,123,255,.25),transparent);opacity:0;pointer-events:none}

.ageing-live.is-visible .ageing-row>i::before{animation:ageingBarGrow .85s var(--ease) forwards;animation-delay:var(--d)}
.ageing-live.is-visible .ageing-row>i em{animation:ageingDotIn .4s var(--ease) forwards;animation-delay:calc(var(--d) + .72s)}
.ageing-live.is-visible .ageing-row>strong{animation:ageingValueIn .4s ease forwards;animation-delay:calc(var(--d) + .76s)}
.ageing-live.is-visible .ageing-scan{animation:ageingScan 5.6s ease-in-out 1.4s infinite}
@keyframes ageingBarGrow{0%{transform:scaleX(.02)}74%{transform:scaleX(1.035)}100%{transform:scaleX(1)}}
@keyframes ageingDotIn{0%{opacity:0;transform:scale(.3)}70%{opacity:1;transform:scale(1.35)}100%{opacity:1;transform:scale(1)}}
@keyframes ageingValueIn{from{opacity:0;transform:translateX(-4px)}to{opacity:1;transform:translateX(0)}}
@keyframes ageingScan{0%,8%{left:66px;opacity:0}15%{opacity:.55}72%{opacity:.22}84%,100%{left:calc(100% - 18px);opacity:0}}
@media(max-width:700px){
  .ageing-row{grid-template-columns:58px minmax(0,1fr) 34px;gap:9px}
  .ageing-scan{left:62px}
}
@media(prefers-reduced-motion:reduce){
  .ageing-row>i::before{transform:scaleX(1)!important;animation:none!important}
  .ageing-row>i em,.ageing-row>strong{opacity:1!important;transform:none!important;animation:none!important}
  .ageing-scan{display:none!important}
}


/* OUTSTANDING VIEW v2 — dots are physically attached to each fill end */
.ageing-live .ageing-row{display:grid;grid-template-columns:62px minmax(0,1fr) 38px;align-items:center;gap:12px;margin:0;font:700 .72rem/1.2 Montserrat;color:#3e5268}
.ageing-live .ageing-track{height:12px;position:relative;background:rgba(10,31,68,.07);border-radius:2px;overflow:visible}
.ageing-live .ageing-track::after{content:"";position:absolute;inset:50% 0 auto;height:1px;background:rgba(10,31,68,.09);transform:translateY(-50%)}
.ageing-live .ageing-fill{position:absolute;left:0;top:0;height:100%;width:var(--w);border-radius:2px;background:linear-gradient(90deg,#006EDC 0%,#00A8F0 70%,#39D5FF 100%);box-shadow:0 0 16px rgba(0,123,255,.09);transform:scaleX(.015);transform-origin:left center;z-index:2}
.ageing-live .ageing-fill::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.03),rgba(255,255,255,.28) 72%,rgba(255,255,255,.08));border-radius:inherit}
.ageing-live .ageing-dot{position:absolute;right:-5px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:#f8fbff;border:2px solid #00A8F0;box-shadow:0 0 0 4px rgba(0,168,240,.09),0 0 12px rgba(0,168,240,.22);opacity:0;transform:scale(.25);z-index:4}
.ageing-live .ageing-row-alert .ageing-fill{background:linear-gradient(90deg,#506d8a,#728ca6)}
.ageing-live .ageing-row-alert .ageing-dot{border-color:#728ca6;box-shadow:0 0 0 4px rgba(114,140,166,.08)}
.ageing-live.is-visible .ageing-fill{animation:ageingFillV2 .9s var(--ease) forwards;animation-delay:var(--d)}
.ageing-live.is-visible .ageing-dot{animation:ageingDotV2 .42s var(--ease) forwards,ageingDotPulseV2 3.8s ease-in-out infinite;animation-delay:calc(var(--d) + .76s),calc(var(--d) + 1.18s)}
.ageing-live.is-visible .ageing-row>strong{animation:ageingValueIn .4s ease forwards;animation-delay:calc(var(--d) + .80s)}
@keyframes ageingFillV2{0%{transform:scaleX(.015)}72%{transform:scaleX(1.035)}100%{transform:scaleX(1)}}
@keyframes ageingDotV2{0%{opacity:0;transform:scale(.25)}70%{opacity:1;transform:scale(1.3)}100%{opacity:1;transform:scale(1)}}
@keyframes ageingDotPulseV2{0%,76%,100%{transform:scale(1);box-shadow:0 0 0 4px rgba(0,168,240,.09),0 0 12px rgba(0,168,240,.18)}84%{transform:scale(1.22);box-shadow:0 0 0 6px rgba(0,168,240,.05),0 0 18px rgba(0,168,240,.34)}}
@media(max-width:700px){
  .ageing-live .ageing-row{grid-template-columns:58px minmax(0,1fr) 34px;gap:9px}
}
@media(prefers-reduced-motion:reduce){
  .ageing-live .ageing-fill{transform:scaleX(1)!important;animation:none!important}
  .ageing-live .ageing-dot,.ageing-live .ageing-row>strong{opacity:1!important;transform:none!important;animation:none!important}
}


/* OUTSTANDING VIEW v3 — fill and dot animate independently */
.ageing-live .ageing-track{position:relative;overflow:visible}
.ageing-live .ageing-fill{
  position:absolute;left:0;top:0;height:100%;width:0;
  transform:none!important;transform-origin:left center;
}
.ageing-live .ageing-dot{
  position:absolute;left:0;right:auto;top:50%;
  width:10px;height:10px;margin:-5px 0 0 -5px;
  opacity:0;transform:scale(.25);
  z-index:5;
}
.ageing-live.is-visible .ageing-fill{
  animation:ageingFillV3 .9s var(--ease) forwards!important;
  animation-delay:var(--d)!important;
}
.ageing-live.is-visible .ageing-dot{
  animation:ageingDotTravelV3 .9s var(--ease) forwards,ageingDotPulseV3 3.8s ease-in-out infinite!important;
  animation-delay:var(--d),calc(var(--d) + 1.05s)!important;
}
@keyframes ageingFillV3{
  0%{width:0}
  72%{width:calc(var(--w) + 1.5%)}
  100%{width:var(--w)}
}
@keyframes ageingDotTravelV3{
  0%{left:0;opacity:0;transform:scale(.25)}
  18%{opacity:1}
  72%{left:calc(var(--w) + 1.5%);transform:scale(1.2)}
  100%{left:var(--w);opacity:1;transform:scale(1)}
}
@keyframes ageingDotPulseV3{
  0%,76%,100%{transform:scale(1);box-shadow:0 0 0 4px rgba(0,168,240,.09),0 0 12px rgba(0,168,240,.18)}
  84%{transform:scale(1.2);box-shadow:0 0 0 6px rgba(0,168,240,.05),0 0 18px rgba(0,168,240,.34)}
}
@media(prefers-reduced-motion:reduce){
  .ageing-live .ageing-fill{width:var(--w)!important;transform:none!important;animation:none!important}
  .ageing-live .ageing-dot{left:var(--w)!important;opacity:1!important;transform:none!important;animation:none!important}
}


/* OUTSTANDING VIEW v4 — endpoint positions are static; only reveal/appearance animates */
#outstanding-view .ageing-track{position:relative;overflow:visible}
#outstanding-view .ageing-fill{
  left:0!important;
  width:var(--w)!important;
  transform:none!important;
  clip-path:inset(0 100% 0 0);
  will-change:clip-path;
}
#outstanding-view .ageing-dot{
  left:var(--w)!important;
  right:auto!important;
  margin-left:-5px!important;
  opacity:0;
  transform:scale(.3);
  will-change:opacity,transform;
}
#outstanding-view.is-visible .ageing-fill{
  animation:ageingRevealV4 .9s var(--ease) forwards!important;
  animation-delay:var(--d)!important;
}
#outstanding-view.is-visible .ageing-dot{
  animation:ageingDotAppearV4 .42s var(--ease) forwards,ageingDotPulseV4 4s ease-in-out infinite!important;
  animation-delay:calc(var(--d) + .76s),calc(var(--d) + 1.18s)!important;
}
#outstanding-view.is-visible .ageing-row>strong{
  animation:ageingValueIn .4s ease forwards!important;
  animation-delay:calc(var(--d) + .8s)!important;
}
@keyframes ageingRevealV4{
  0%{clip-path:inset(0 100% 0 0)}
  72%{clip-path:inset(0 0 0 0)}
  100%{clip-path:inset(0 0 0 0)}
}
@keyframes ageingDotAppearV4{
  0%{opacity:0;transform:scale(.3)}
  70%{opacity:1;transform:scale(1.28)}
  100%{opacity:1;transform:scale(1)}
}
@keyframes ageingDotPulseV4{
  0%,78%,100%{transform:scale(1);box-shadow:0 0 0 4px rgba(0,168,240,.09),0 0 12px rgba(0,168,240,.18)}
  86%{transform:scale(1.2);box-shadow:0 0 0 6px rgba(0,168,240,.05),0 0 18px rgba(0,168,240,.34)}
}
@media(prefers-reduced-motion:reduce){
  #outstanding-view .ageing-fill{clip-path:inset(0)!important;animation:none!important}
  #outstanding-view .ageing-dot{left:var(--w)!important;opacity:1!important;transform:scale(1)!important;animation:none!important}
  #outstanding-view .ageing-row>strong{opacity:1!important;animation:none!important}
}


/* OUTSTANDING VIEW v5 — hard-set endpoints; no horizontal dot animation */
#outstanding-view .ageing-fill{
  transform:none!important;
  clip-path:inset(0 100% 0 0);
}
#outstanding-view .ageing-dot{
  position:absolute!important;
  top:50%!important;
  margin:-5px 0 0 -5px!important;
  opacity:0;
  transform:scale(.3);
}
#outstanding-view.is-visible .ageing-fill{
  animation:ageingRevealV5 .85s var(--ease) forwards!important;
  animation-delay:var(--d)!important;
}
#outstanding-view.is-visible .ageing-dot{
  animation:ageingDotAppearV5 .42s var(--ease) forwards,ageingDotPulseV5 4s ease-in-out infinite!important;
  animation-delay:calc(var(--d) + .72s),calc(var(--d) + 1.14s)!important;
}
@keyframes ageingRevealV5{
  from{clip-path:inset(0 100% 0 0)}
  to{clip-path:inset(0 0 0 0)}
}
@keyframes ageingDotAppearV5{
  0%{opacity:0;transform:scale(.3)}
  70%{opacity:1;transform:scale(1.28)}
  100%{opacity:1;transform:scale(1)}
}
@keyframes ageingDotPulseV5{
  0%,78%,100%{transform:scale(1)}
  86%{transform:scale(1.2)}
}
@media(prefers-reduced-motion:reduce){
  #outstanding-view .ageing-fill{clip-path:inset(0)!important;animation:none!important}
  #outstanding-view .ageing-dot{opacity:1!important;transform:scale(1)!important;animation:none!important}
}


/* OUTSTANDING VIEW CSP-safe endpoints — no inline styles or custom properties */
#outstanding-view .ageing-fill{
  transform:none!important;
  clip-path:inset(0 100% 0 0);
}
#outstanding-view .ageing-dot{
  position:absolute!important;
  right:auto!important;
  top:50%!important;
  margin:-5px 0 0 -5px!important;
  opacity:0;
  transform:scale(.3);
}
#outstanding-view .ageing-current .ageing-fill{width:82%!important}
#outstanding-view .ageing-current .ageing-dot{left:82%!important}
#outstanding-view .ageing-30 .ageing-fill{width:58%!important}
#outstanding-view .ageing-30 .ageing-dot{left:58%!important}
#outstanding-view .ageing-60 .ageing-fill{width:34%!important}
#outstanding-view .ageing-60 .ageing-dot{left:34%!important}
#outstanding-view .ageing-61 .ageing-fill{width:16%!important}
#outstanding-view .ageing-61 .ageing-dot{left:16%!important}

#outstanding-view.is-visible .ageing-fill{
  animation:ageingRevealCSP .85s var(--ease) forwards!important;
}
#outstanding-view.is-visible .ageing-current .ageing-fill{animation-delay:.05s!important}
#outstanding-view.is-visible .ageing-30 .ageing-fill{animation-delay:.20s!important}
#outstanding-view.is-visible .ageing-60 .ageing-fill{animation-delay:.35s!important}
#outstanding-view.is-visible .ageing-61 .ageing-fill{animation-delay:.50s!important}

#outstanding-view.is-visible .ageing-dot{
  animation:ageingDotCSP .42s var(--ease) forwards,ageingDotPulseCSP 4s ease-in-out infinite!important;
}
#outstanding-view.is-visible .ageing-current .ageing-dot{animation-delay:.77s,1.19s!important}
#outstanding-view.is-visible .ageing-30 .ageing-dot{animation-delay:.92s,1.34s!important}
#outstanding-view.is-visible .ageing-60 .ageing-dot{animation-delay:1.07s,1.49s!important}
#outstanding-view.is-visible .ageing-61 .ageing-dot{animation-delay:1.22s,1.64s!important}

#outstanding-view.is-visible .ageing-current>strong{animation-delay:.85s!important}
#outstanding-view.is-visible .ageing-30>strong{animation-delay:1s!important}
#outstanding-view.is-visible .ageing-60>strong{animation-delay:1.15s!important}
#outstanding-view.is-visible .ageing-61>strong{animation-delay:1.30s!important}

@keyframes ageingRevealCSP{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes ageingDotCSP{0%{opacity:0;transform:scale(.3)}70%{opacity:1;transform:scale(1.28)}100%{opacity:1;transform:scale(1)}}
@keyframes ageingDotPulseCSP{0%,78%,100%{transform:scale(1)}86%{transform:scale(1.2)}}

@media(prefers-reduced-motion:reduce){
  #outstanding-view .ageing-fill{clip-path:inset(0)!important;animation:none!important}
  #outstanding-view .ageing-dot{opacity:1!important;transform:scale(1)!important;animation:none!important}
}


/* =========================================================
   MATTLY CAMPAIGN MATERIALS — SOCIAL-ART-DIRECTION PASS
   Responsive / touch / lower-power aware
   ========================================================= */

/* Keep the brand cinematic without turning every section into a card. */
.positioning-material{position:relative;isolation:isolate}
.positioning-material::before{content:"";position:absolute;z-index:-2;inset:24px -8vw -30px;background:
  linear-gradient(90deg,rgba(6,20,38,.96) 0%,rgba(6,20,38,.80) 54%,rgba(6,20,38,.52) 100%),
  url("assets/brand-scene-desktop.webp") center/cover no-repeat;opacity:.52;pointer-events:none}
.positioning-material::after{content:"";position:absolute;z-index:-1;inset:24px -8vw -30px;border-top:1px solid rgba(75,208,255,.11);border-bottom:1px solid rgba(255,255,255,.07);pointer-events:none}

/* Editorial service chapters: deeper material surfaces, not generic SaaS cards. */
.editorial-service-dark{background:
  radial-gradient(circle at 82% 20%,rgba(0,180,255,.08),transparent 30%),
  linear-gradient(145deg,#061527,#081c33 70%,#07182d)}
.editorial-service-blue{background:
  radial-gradient(circle at 78% 18%,rgba(53,217,255,.10),transparent 31%),
  linear-gradient(145deg,#072544,#08305c 60%,#08284b)}
.editorial-service-night{background:
  radial-gradient(circle at 22% 76%,rgba(0,123,255,.08),transparent 30%),
  linear-gradient(145deg,#030d19,#061426 65%,#07182d)}
.editorial-service-light{background:
  radial-gradient(circle at 80% 15%,rgba(0,123,255,.055),transparent 32%),
  linear-gradient(145deg,#f8fafc,#f1f5f9)}

.premium-scene{position:relative;isolation:isolate}
.premium-scene::before{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;background:
  radial-gradient(circle at 82% 15%,rgba(0,180,255,.08),transparent 31%),
  linear-gradient(145deg,rgba(255,255,255,.025),transparent 55%)}

/* BOOKKEEPING / RECONCILIATION — tactile paper, glass and inspection. */
.recon-scene{min-height:420px;padding-top:22px}
.recon-stage{position:relative;min-height:286px;margin-top:5px;perspective:900px}
.recon-paper{position:absolute;border:1px solid rgba(213,226,239,.24);box-shadow:0 26px 60px rgba(0,0,0,.28);border-radius:2px}
.recon-paper-back{width:76%;height:220px;right:4%;top:30px;background:linear-gradient(145deg,#18334f,#0c2138);transform:rotate(3.5deg);opacity:.7}
.recon-paper-front{width:82%;height:238px;left:3%;top:12px;background:
  linear-gradient(90deg,rgba(0,123,255,.04),transparent 34%),
  linear-gradient(180deg,#f7f9fb,#e9eff5);color:#17304a;padding:22px 22px 16px;transform:rotate(-1.4deg);overflow:hidden}
.recon-paper-front::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 0 42%,rgba(255,255,255,.60) 49%,transparent 56%);transform:translateX(-130%);pointer-events:none}
.recon-paper-head{display:flex;justify-content:space-between;gap:14px;padding-bottom:12px;border-bottom:1px solid #c8d5e1;font:700 .62rem/1.25 Montserrat;letter-spacing:.1em;color:#31506d}
.recon-paper-head b{color:#006edc}
.recon-entry{display:grid;grid-template-columns:auto 1fr 22px;gap:9px;align-items:center;padding:11px 0;border-bottom:1px solid #d6e0e8;font-size:.69rem}
.recon-entry i{height:1px;background:repeating-linear-gradient(90deg,#b7c6d4 0 6px,transparent 6px 10px)}
.recon-entry strong{display:grid;place-items:center;width:19px;height:19px;border-radius:50%;background:#e2effb;color:#006edc;font:800 .65rem Montserrat}
.recon-entry:nth-child(4) strong{background:#eef2f5;color:#6a7d8f}
.recon-lens{position:absolute;width:112px;height:112px;border:7px solid rgba(225,235,245,.68);border-radius:50%;right:0;bottom:10px;background:rgba(7,25,46,.10);box-shadow:0 18px 40px rgba(0,0,0,.25),inset 0 0 28px rgba(0,180,255,.12);backdrop-filter:blur(2px)}
.recon-lens::after{content:"";position:absolute;width:72px;height:11px;border-radius:8px;background:linear-gradient(90deg,#51677e,#c6d4df);right:-54px;bottom:-21px;transform:rotate(42deg);transform-origin:left center;box-shadow:0 9px 20px rgba(0,0,0,.2)}
.recon-lens span{position:absolute;width:12px;height:12px;border-radius:50%;background:#23c9ff;right:25px;top:22px;box-shadow:0 0 17px rgba(35,201,255,.65)}
.scene-foot{display:grid;grid-template-columns:auto 1fr auto 1fr auto;align-items:center;gap:9px;padding-top:16px;border-top:1px solid rgba(255,255,255,.13);color:#9fb1c4;font:650 .63rem/1.25 Montserrat;letter-spacing:.04em;text-transform:uppercase}
.scene-foot b{color:#00b4ff;text-align:center}
.recon-scene.is-visible .recon-paper-front::after{animation:reconSheen 5.4s ease-in-out .7s infinite}
.recon-scene.is-visible .recon-lens{animation:reconLens 6.5s ease-in-out .6s infinite}
.recon-scene.is-visible .recon-entry strong{animation:reconTick .4s var(--ease) both}
.recon-scene.is-visible .recon-entry:nth-child(2) strong{animation-delay:.35s}
.recon-scene.is-visible .recon-entry:nth-child(3) strong{animation-delay:.55s}
.recon-scene.is-visible .recon-entry:nth-child(4) strong{animation-delay:.75s}
.recon-scene.is-visible .recon-entry:nth-child(5) strong{animation-delay:.95s}
@keyframes reconSheen{0%,16%{transform:translateX(-130%)}42%,100%{transform:translateX(160%)}}
@keyframes reconLens{0%,100%{transform:translate3d(0,0,0)}45%{transform:translate3d(-12px,-8px,0)}70%{transform:translate3d(-4px,5px,0)}}
@keyframes reconTick{from{opacity:0;transform:scale(.45)}to{opacity:1;transform:scale(1)}}

/* REPORTING — layered glass dashboard language from the social campaign. */
.reporting-scene{min-height:430px;padding-top:22px}
.reporting-console{display:grid;gap:12px;perspective:1000px}
.console-panel{position:relative;overflow:hidden;border:1px solid rgba(93,208,255,.28);background:
  linear-gradient(145deg,rgba(8,42,78,.76),rgba(5,24,47,.88));box-shadow:
  inset 0 1px rgba(255,255,255,.08),
  0 18px 45px rgba(0,0,0,.18);backdrop-filter:blur(10px);padding:16px 17px}
.console-panel::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 0 45%,rgba(90,216,255,.055) 53%,transparent 61%);transform:translateX(-120%);pointer-events:none}
.console-panel>span{display:block;color:#9eb9d0;font:700 .57rem/1.2 Montserrat;letter-spacing:.16em;margin-bottom:9px}
.console-trend{min-height:172px;transform:rotateX(1.5deg) rotateY(-1.2deg)}
.console-trend svg{width:100%;height:106px;display:block;overflow:visible}
.console-gridline{fill:none;stroke:rgba(255,255,255,.09);stroke-width:1}
.console-line{fill:none;stroke:#35d9ff;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 0 5px rgba(53,217,255,.30))}
.console-points circle{fill:#061a30;stroke:#72e4ff;stroke-width:2;opacity:0}
.console-row{display:grid;grid-template-columns:1.35fr .65fr;gap:12px}
.console-bars{min-height:132px}
.console-columns{height:77px;display:flex;align-items:flex-end;gap:7px;padding-top:7px;border-bottom:1px solid rgba(255,255,255,.12)}
.console-columns i{display:block;flex:1;max-width:20px;background:linear-gradient(180deg,#4adfff,#006edc);transform:scaleY(.04);transform-origin:bottom;box-shadow:0 0 11px rgba(0,180,255,.12)}
.console-columns .c1{height:34%}.console-columns .c2{height:50%}.console-columns .c3{height:44%}.console-columns .c4{height:68%}.console-columns .c5{height:61%}.console-columns .c6{height:86%}
.console-kpi{display:flex;flex-direction:column;justify-content:center}
.console-kpi strong{font:750 clamp(1.65rem,3vw,2.3rem)/1 Montserrat;color:#fff;letter-spacing:-.04em}
.console-kpi em{margin-top:7px;color:#74dfff;font:600 .58rem Montserrat;text-transform:uppercase;letter-spacing:.1em;font-style:normal}
.reporting-scene>small{display:block;margin-top:13px;color:#90a6bb}
.reporting-scene.is-visible .console-line{animation:consoleDraw 1.45s var(--ease) .25s forwards}
.reporting-scene.is-visible .console-points circle{animation:consolePoint .4s var(--ease) forwards}
.reporting-scene.is-visible .console-points circle:nth-child(1){animation-delay:.45s}.reporting-scene.is-visible .console-points circle:nth-child(2){animation-delay:.58s}.reporting-scene.is-visible .console-points circle:nth-child(3){animation-delay:.71s}.reporting-scene.is-visible .console-points circle:nth-child(4){animation-delay:.84s}.reporting-scene.is-visible .console-points circle:nth-child(5){animation-delay:.97s}.reporting-scene.is-visible .console-points circle:nth-child(6){animation-delay:1.10s}.reporting-scene.is-visible .console-points circle:nth-child(7){animation-delay:1.23s}
.reporting-scene.is-visible .console-columns i{animation:consoleBars .8s var(--ease) forwards}
.reporting-scene.is-visible .console-columns .c1{animation-delay:.35s}.reporting-scene.is-visible .console-columns .c2{animation-delay:.43s}.reporting-scene.is-visible .console-columns .c3{animation-delay:.51s}.reporting-scene.is-visible .console-columns .c4{animation-delay:.59s}.reporting-scene.is-visible .console-columns .c5{animation-delay:.67s}.reporting-scene.is-visible .console-columns .c6{animation-delay:.75s}
.reporting-scene.is-visible .console-panel::before{animation:consoleSheen 6.8s ease-in-out 1.2s infinite}
@keyframes consoleDraw{to{stroke-dashoffset:0}}
@keyframes consolePoint{from{opacity:0;transform:scale(.4);transform-origin:center}to{opacity:1;transform:scale(1)}}
@keyframes consoleBars{0%{transform:scaleY(.04)}75%{transform:scaleY(1.04)}100%{transform:scaleY(1)}}
@keyframes consoleSheen{0%,15%{transform:translateX(-120%)}38%,100%{transform:translateX(150%)}}

/* CATCH-UP — premium recovery sequence, still very legible. */
.recovery-scene{padding-top:22px}
.recovery-scene .timeline-step{position:relative}
.recovery-scene .timeline-step::after{content:"";position:absolute;left:18px;top:53px;bottom:-15px;width:1px;background:linear-gradient(#00b4ff,rgba(255,255,255,.10))}
.recovery-scene .timeline-step:last-child::after{display:none}
.recovery-scene .timeline-step b{background:linear-gradient(145deg,#0b2440,#061426);box-shadow:0 0 0 4px rgba(0,180,255,.035)}
.recovery-scene.is-visible .timeline-step b{animation:recoveryStep .45s var(--ease) both}
.recovery-scene.is-visible .timeline-step:nth-child(1) b{animation-delay:.2s}.recovery-scene.is-visible .timeline-step:nth-child(2) b{animation-delay:.42s}.recovery-scene.is-visible .timeline-step:nth-child(3) b{animation-delay:.64s}.recovery-scene.is-visible .timeline-step:nth-child(4) b{animation-delay:.86s}
@keyframes recoveryStep{from{opacity:.25;transform:scale(.7)}to{opacity:1;transform:scale(1)}}

/* The existing ageing display gets a more tangible glass/material surface. */
#outstanding-view{padding:30px 0 30px 42px}
#outstanding-view .ageing-head{background:linear-gradient(90deg,rgba(0,123,255,.035),transparent);padding:13px 12px;margin-left:-12px;margin-right:0}
#outstanding-view .ageing-track{background:linear-gradient(180deg,rgba(10,31,68,.08),rgba(10,31,68,.035));box-shadow:inset 0 1px 2px rgba(10,31,68,.06)}
#outstanding-view .ageing-fill{background:linear-gradient(90deg,#006edc,#00a7ed 67%,#52ddff);box-shadow:0 0 16px rgba(0,126,234,.10)}
#outstanding-view .ageing-row-alert .ageing-fill{background:linear-gradient(90deg,#506d8a,#7f96aa)}

/* Financial insight: glass-board atmosphere without loading extra media. */
.premium-reporting-zone{position:relative;isolation:isolate;overflow:hidden;background:
  radial-gradient(circle at 82% 10%,rgba(0,180,255,.10),transparent 28%),
  linear-gradient(145deg,#eef3f7,#f8fafc)}
.premium-reporting-zone::before{content:"";position:absolute;z-index:-1;inset:0;background:
  linear-gradient(90deg,rgba(245,247,250,.99) 0%,rgba(245,247,250,.96) 40%,rgba(245,247,250,.76) 100%),
  url("assets/brand-scene-desktop.webp") 85% center/cover no-repeat;opacity:.68;pointer-events:none}
.insight-board-bars{border-color:rgba(62,205,255,.34);box-shadow:0 30px 85px rgba(4,24,46,.22),0 0 0 1px rgba(255,255,255,.03) inset}
.bars-columns .revenue{fill:url(#mattlyRevenueGradient)}
.bars-columns .cost{fill:url(#mattlyCostGradient)}
.mattly-bars.is-visible .bars-columns .bar-delay-1{animation-delay:.05s}.mattly-bars.is-visible .bars-columns .bar-delay-2{animation-delay:.14s}
.mattly-bars.is-visible .bars-columns .bar-delay-3{animation-delay:.20s}.mattly-bars.is-visible .bars-columns .bar-delay-4{animation-delay:.29s}
.mattly-bars.is-visible .bars-columns .bar-delay-5{animation-delay:.35s}.mattly-bars.is-visible .bars-columns .bar-delay-6{animation-delay:.44s}
.mattly-bars.is-visible .bars-columns .bar-delay-7{animation-delay:.50s}.mattly-bars.is-visible .bars-columns .bar-delay-8{animation-delay:.59s}
.mattly-bars.is-visible .bars-columns .bar-delay-9{animation-delay:.65s}.mattly-bars.is-visible .bars-columns .bar-delay-10{animation-delay:.74s}
.mattly-bars.is-visible .bars-columns .bar-delay-11{animation-delay:.80s}.mattly-bars.is-visible .bars-columns .bar-delay-12{animation-delay:.89s}

/* Service-detail visual breaks: richer scene framing across the wider site. */
.page-service .service-break{position:relative;background:linear-gradient(145deg,#061426,#092340);box-shadow:0 30px 80px rgba(0,0,0,.18)}
.page-service .service-break-visual::before{content:"";position:absolute;inset:8%;border:1px solid rgba(83,212,255,.16);box-shadow:inset 0 0 40px rgba(0,180,255,.035);pointer-events:none}
.page-service .service-break-visual::after{background:
  linear-gradient(90deg,rgba(7,24,45,.68),transparent 52%),
  linear-gradient(0deg,rgba(7,24,45,.48),transparent 62%),
  radial-gradient(circle at 72% 24%,rgba(0,180,255,.10),transparent 30%)}
.page-bookkeeping .service-break-visual{background-image:url("assets/brand-scene-desktop.webp");background-position:72% center}
.page-reporting .service-break-visual{background-image:url("assets/mattly-finance-premium-hero.webp");background-position:62% center}
.page-balances .service-break-visual{background-image:url("assets/mattly-finance-premium-hero.webp");background-position:76% center}
.page-catchup .service-break-visual{background-image:url("assets/brand-scene-desktop.webp");background-position:80% center}

/* Soft reveal only: never required for access to content. */
.premium-reveal{--revealY:14px}
.motion-on .premium-reveal{opacity:.985;transform:translateY(var(--revealY));transition:opacity .7s var(--ease),transform .7s var(--ease)}
.motion-on .premium-reveal.is-visible{opacity:1;transform:none}

/* Pointer capability: premium hover on mice/trackpads only. */
@media(hover:hover) and (pointer:fine){
  .console-panel{transition:transform .3s var(--ease),border-color .3s,box-shadow .3s}
  .reporting-scene:hover .console-trend{transform:rotateX(0) rotateY(0) translateY(-3px);border-color:rgba(91,216,255,.48);box-shadow:inset 0 1px rgba(255,255,255,.10),0 24px 54px rgba(0,0,0,.23)}
  .recon-paper-front{transition:transform .35s var(--ease)}
  .recon-scene:hover .recon-paper-front{transform:rotate(-.4deg) translateY(-3px)}
}

/* Tablet: retain the cinematic story, reduce compositing cost and complexity. */
@media(max-width:1000px){
  .positioning-material::before,.positioning-material::after{inset:15px -24px -20px}
  .recon-stage{min-height:260px}
  .recon-paper-front{width:86%}
  .recon-lens{width:94px;height:94px;right:-2px}
  .reporting-console{gap:9px}
  .console-row{gap:9px}
  #outstanding-view{padding-left:28px}
}

/* Touch/mobile: deliberate compositions, no desktop-only layering. */
@media(max-width:700px){
  .positioning-material::before{inset:0 -18px;background:
    linear-gradient(180deg,rgba(6,20,38,.94),rgba(6,20,38,.82)),
    url("assets/brand-scene-mobile.webp") center/cover no-repeat;opacity:.43}
  .positioning-material::after{inset:0 -18px}
  .recon-scene,.reporting-scene{min-height:auto}
  .recon-stage{min-height:238px;margin-top:0}
  .recon-paper-back{width:78%;height:190px}
  .recon-paper-front{width:86%;height:208px;padding:18px 16px 12px}
  .recon-paper-head{font-size:.54rem}
  .recon-entry{padding:9px 0;font-size:.62rem}
  .recon-lens{width:82px;height:82px;border-width:5px;right:0;bottom:4px}
  .recon-lens::after{width:54px;height:9px;right:-42px;bottom:-17px}
  .scene-foot{font-size:.54rem;gap:5px}
  .reporting-console{gap:8px}
  .console-trend{min-height:148px}
  .console-trend svg{height:86px}
  .console-row{grid-template-columns:1.2fr .8fr;gap:8px}
  .console-panel{padding:13px}
  .console-bars{min-height:112px}
  .console-columns{height:62px}
  .console-kpi strong{font-size:1.45rem}
  #outstanding-view{padding:28px 0}
  .premium-reporting-zone::before{background:
    linear-gradient(180deg,rgba(245,247,250,.98),rgba(245,247,250,.93)),
    url("assets/brand-scene-mobile.webp") center/cover no-repeat;opacity:.55}
  .page-service .service-break-visual::before{inset:14px}
  .page-service .service-break-visual{background-image:url("assets/brand-scene-mobile.webp")}
}

/* Small phones: protect readability and touch space first. */
@media(max-width:430px){
  .recon-paper-front{width:88%;left:0}
  .recon-lens{right:-4px}
  .scene-foot{grid-template-columns:auto auto auto;justify-content:start}
  .scene-foot span:nth-of-type(3),.scene-foot b:nth-of-type(2){display:none}
  .console-row{grid-template-columns:1fr}
  .console-kpi{min-height:92px}
  .console-columns i{max-width:none}
}

/* Coarse pointers and lower-refresh hardware: remove decorative interaction cost. */
@media(pointer:coarse){
  .console-panel,.recon-paper-front{transition:none!important}
}
@media(update:slow){
  .console-panel{backdrop-filter:none}
  .recon-lens{backdrop-filter:none}
  .premium-reveal{transform:none!important;opacity:1!important}
}

/* User motion preference always wins. */
@media(prefers-reduced-motion:reduce){
  .recon-paper-front::after,.recon-lens,.recon-entry strong,
  .console-line,.console-points circle,.console-columns i,.console-panel::before,
  .recovery-scene .timeline-step b{animation:none!important}
  .console-line{stroke-dashoffset:0!important}
  .console-points circle{opacity:1!important}
  .console-columns i{transform:scaleY(1)!important}
  .premium-reveal{opacity:1!important;transform:none!important;transition:none!important}
}

/* Browsers/devices without backdrop-filter still get a complete design. */
@supports not (backdrop-filter:blur(2px)){
  .console-panel{background:linear-gradient(145deg,#0a3158,#071a31)}
  .recon-lens{background:rgba(8,30,53,.20)}
}


/* =========================================================
   PREMIUM HERO — MATTLY DESK / CASH-FLOW / SOUTH AFRICA
   Purpose-built desktop + mobile compositions
   ========================================================= */
.campaign-hero-media img{
  object-position:50% center;
  filter:saturate(1.04) contrast(1.03);
}
.campaign-hero-media::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 78% 45%,rgba(0,180,255,.14),transparent 25%),
    linear-gradient(112deg,transparent 0 57%,rgba(93,221,255,.08) 66%,transparent 75%);
  mix-blend-mode:screen;
  opacity:.58;
  animation:heroFinanceGlow 8.5s ease-in-out infinite alternate;
}
.campaign-hero-overlay{
  background:
    linear-gradient(90deg,rgba(3,12,24,.96) 0%,rgba(3,12,24,.79) 32%,rgba(3,12,24,.30) 61%,rgba(3,12,24,.10) 100%),
    linear-gradient(0deg,rgba(3,12,24,.95) 0%,rgba(3,12,24,.28) 48%,rgba(3,12,24,.20) 100%);
}
.campaign-hero-content{
  padding-top:8vh;
}
@keyframes heroFinanceGlow{
  0%{opacity:.38;transform:translate3d(-1.5%,0,0)}
  100%{opacity:.66;transform:translate3d(1.5%,-.5%,0)}
}

@media(max-width:1000px){
  .campaign-hero-media img{object-position:57% center}
  .campaign-hero-overlay{
    background:
      linear-gradient(90deg,rgba(3,12,24,.94) 0%,rgba(3,12,24,.72) 40%,rgba(3,12,24,.20) 76%,rgba(3,12,24,.08) 100%),
      linear-gradient(0deg,rgba(3,12,24,.94) 0%,rgba(3,12,24,.24) 52%,rgba(3,12,24,.18) 100%);
  }
}

@media(max-width:700px){
  .campaign-hero-media img{
    object-position:center top;
    filter:saturate(1.03) contrast(1.02);
  }
  .campaign-hero-media::after{
    background:
      radial-gradient(circle at 73% 38%,rgba(0,180,255,.13),transparent 24%),
      linear-gradient(145deg,transparent 0 54%,rgba(76,213,255,.07) 65%,transparent 77%);
    opacity:.50;
  }
  .campaign-hero-overlay{
    background:
      linear-gradient(0deg,rgba(3,12,24,.99) 0%,rgba(3,12,24,.93) 35%,rgba(3,12,24,.60) 54%,rgba(3,12,24,.20) 73%,rgba(3,12,24,.06) 100%),
      linear-gradient(90deg,rgba(3,12,24,.38) 0%,rgba(3,12,24,.10) 72%,transparent 100%);
  }
  .campaign-hero-content{
    padding-top:35vh;
  }
}

@media(max-width:430px){
  .campaign-hero-content{padding-top:33vh}
  .campaign-hero-media img{object-position:52% top}
}

@media(update:slow),(prefers-reduced-motion:reduce){
  .campaign-hero-media::after{animation:none!important;transform:none!important}
}


/* =========================================================
   MATTLY FINANCE — BUSINESS LAUNCH ANNOUNCEMENT
   01 November 2026
   ========================================================= */
.launch-banner{
  position:relative;z-index:1100;overflow:hidden;
  background:
    radial-gradient(circle at 82% 10%,rgba(0,180,255,.16),transparent 26%),
    linear-gradient(100deg,#020b16 0%,#061a31 48%,#082b50 100%);
  border-bottom:1px solid rgba(94,215,255,.24);
  box-shadow:0 8px 24px rgba(0,0,0,.16);
}
.launch-banner::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(110deg,transparent 0 37%,rgba(255,255,255,.045) 45%,transparent 53%);
  transform:translateX(-130%);
}
.launch-banner::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,#00b4ff 28%,#49dbff 50%,#007bff 72%,transparent);
  opacity:.72;
}
.launch-banner-inner{
  width:min(var(--max),calc(100% - 64px));min-height:64px;margin:0 auto;
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:28px;align-items:center;
  padding:9px 0;
}
.launch-date{display:grid;gap:2px;min-width:max-content}
.launch-date span{color:#53d9ff;font:750 .56rem/1.2 Montserrat,Arial,sans-serif;letter-spacing:.18em}
.launch-date strong{color:#fff;font:800 .88rem/1.15 Montserrat,Arial,sans-serif;letter-spacing:.015em}
.launch-banner p{
  margin:0;color:#bccbda;font-size:.78rem;line-height:1.45;
  border-left:1px solid rgba(255,255,255,.15);padding-left:28px;
}
.launch-banner p strong{color:#fff;font-weight:700}
.launch-cta{
  min-height:42px;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:0 16px;border:1px solid rgba(73,219,255,.38);
  background:linear-gradient(135deg,rgba(0,110,220,.24),rgba(0,180,255,.10));
  color:#fff;font:750 .72rem/1 Montserrat,Arial,sans-serif;white-space:nowrap;
  box-shadow:inset 0 1px rgba(255,255,255,.06);
  transition:border-color .25s,background .25s,transform .25s;
}
.launch-cta span{color:#53d9ff}
@media(hover:hover) and (pointer:fine){
  .launch-cta:hover{
    border-color:rgba(83,217,255,.78);
    background:linear-gradient(135deg,rgba(0,110,220,.38),rgba(0,180,255,.17));
    transform:translateY(-1px);
  }
  .motion-on .launch-banner::before{animation:launchBannerSheen 8s ease-in-out 1.4s infinite}
}
@keyframes launchBannerSheen{
  0%,12%{transform:translateX(-130%)}
  38%,100%{transform:translateX(150%)}
}
.premium-home .campaign-hero{min-height:calc(100svh - var(--header) - 64px)}
@media(max-width:900px){
  .launch-banner-inner{width:calc(100% - 40px);gap:18px}
  .launch-banner p{padding-left:18px}
}
@media(max-width:700px){
  .launch-banner-inner{
    width:calc(100% - 32px);min-height:86px;
    grid-template-columns:minmax(0,1fr) auto;gap:5px 14px;padding:10px 0 11px;
  }
  .launch-date{grid-column:1}
  .launch-date strong{font-size:.78rem}
  .launch-banner p{
    grid-column:1/-1;grid-row:2;margin-top:2px;padding:7px 0 0;
    border-left:0;border-top:1px solid rgba(255,255,255,.12);
    font-size:.68rem;line-height:1.38;
  }
  .launch-cta{grid-column:2;grid-row:1;min-height:40px;padding:0 12px;font-size:.64rem}
  .premium-home .campaign-hero{min-height:calc(100svh - var(--header) - 86px)}
}
@media(max-width:430px){
  .launch-banner-inner{width:calc(100% - 24px);gap:5px 10px}
  .launch-date span{font-size:.49rem}
  .launch-date strong{font-size:.69rem}
  .launch-cta{padding:0 10px;font-size:.59rem}
  .launch-extra{display:none}
}
@media(max-width:360px){
  .launch-date strong{font-size:.64rem}
  .launch-cta{font-size:.56rem;padding-inline:8px}
}
@media(prefers-reduced-motion:reduce){
  .launch-banner::before,.launch-cta{animation:none!important;transition:none!important}
}
