:root{--green:#16824d;--green2:#0d6038;--ink:#11251b;--muted:#607068;--line:#dce7e0;--cream:#faf9f5;--mint:#eef8f1;--dark:#0d2117;--shadow:0 26px 70px rgba(18,58,36,.12)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#fff;line-height:1.65;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}.wrap{width:min(1200px,calc(100% - 64px));margin:auto}.topnote{background:var(--dark);color:#dcebe1;font-size:13px;text-align:center;padding:9px 16px}.topnote a{color:#fff;font-weight:750;margin-left:5px}header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);border-bottom:1px solid rgba(220,231,224,.85)}.nav{height:80px;display:flex;align-items:center;gap:28px}.brand{display:inline-flex;align-items:baseline;font-size:27px;font-weight:850;letter-spacing:-1.4px;white-space:nowrap}.brand .q{color:#26342d}.brand .p{color:var(--green)}.brand-dot{width:7px;height:7px;border-radius:50%;background:var(--green);margin-left:4px}.links{display:flex;gap:24px;margin-left:auto;align-items:center}.links a{font-size:13.5px;font-weight:680;color:#43544b}.links a:hover,.links a.active{color:var(--green2)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:9px;padding:13px 20px;font-weight:780;font-size:14px;border:1px solid var(--line);transition:.2s}.btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(18,58,36,.08)}.primary{background:var(--green);color:#fff;border-color:var(--green)}.primary:hover{background:var(--green2)}.secondary{background:#fff}.menu{display:none}.hero{padding:94px 0 88px;background:linear-gradient(180deg,#f7fbf8 0,#fff 100%);overflow:hidden}.hero-grid{display:grid;grid-template-columns:.94fr 1.06fr;gap:78px;align-items:center}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:11px;font-weight:850;color:var(--green2);margin-bottom:16px}.hero h1,.pagehero h1{font-size:clamp(48px,5.5vw,74px);line-height:1.01;letter-spacing:-.048em;margin:0 0 26px;max-width:900px}.green{color:var(--green)}.lead{font-size:20px;line-height:1.58;color:#506159;max-width:710px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.microproof{display:flex;gap:24px;flex-wrap:wrap;margin-top:30px;font-size:13px;font-weight:720;color:#53665b}.microproof span:before{content:'✓';color:var(--green);margin-right:8px}.retail-stage{position:relative;min-height:550px}.retail-photo{position:absolute;inset:0 0 36px 50px;border-radius:28px;overflow:hidden;box-shadow:var(--shadow);background:#e7f2ea}.retail-photo img{width:100%;height:100%;object-fit:cover}.offer-panel{position:absolute;left:0;bottom:0;width:310px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 22px;box-shadow:0 22px 55px rgba(17,55,34,.16)}.offer-panel small{display:block;text-transform:uppercase;letter-spacing:.12em;color:var(--green2);font-weight:850}.offer-panel strong{display:block;font-size:23px;line-height:1.15;margin:7px 0}.offer-panel p{font-size:13px;color:var(--muted);margin:0}.offer-chip{position:absolute;right:-8px;top:34px;background:var(--dark);color:#fff;padding:14px 18px;border-radius:12px;box-shadow:0 16px 38px rgba(13,33,23,.18);font-size:13px}.offer-chip b{color:#9ee0b9}.section{padding:104px 0}.soft{background:var(--cream)}.mint{background:var(--mint)}.dark{background:var(--dark);color:#fff}.dark .eyebrow{color:#83d4a6}.dark .section-intro{color:#b8c9bf}.section h2{font-size:clamp(35px,4vw,54px);line-height:1.08;letter-spacing:-.038em;margin:0 0 20px;max-width:900px}.section-intro{font-size:18px;color:var(--muted);max-width:800px;margin:0 0 44px}.outcomes{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;border-top:1px solid var(--line);padding-top:36px}.outcome{padding-right:20px}.outcome .num{font-size:11px;color:var(--green);font-weight:850;letter-spacing:.12em}.outcome h3{font-size:22px;line-height:1.2;margin:13px 0 11px}.outcome p{color:var(--muted);font-size:14px;margin:0}.outcome .mini{margin-top:20px;color:#315542;font-size:13px;font-weight:720}.split{display:grid;grid-template-columns:1fr 1fr;gap:82px;align-items:center}.storyflow{display:grid;gap:0}.storyrow{display:grid;grid-template-columns:52px 1fr;gap:17px;align-items:start;padding:18px 0;border-bottom:1px solid var(--line)}.storyicon{width:44px;height:44px;border-radius:50%;background:var(--mint);display:grid;place-items:center;color:var(--green2);font-weight:850}.storyrow h4{margin:0 0 4px;font-size:17px}.storyrow p{margin:0;color:var(--muted);font-size:14px}.quotegrid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.quote{background:#fff;border-top:3px solid var(--green);padding:32px 34px;box-shadow:0 16px 45px rgba(20,60,38,.07)}.quote blockquote{font-size:21px;line-height:1.5;margin:14px 0 24px;color:#26382f}.quote cite{font-style:normal;font-size:13px;color:var(--muted)}.quote .stars{font-size:13px;color:#e4a52c;letter-spacing:2px}.recommend{display:inline-flex;margin-top:14px;background:var(--mint);color:var(--green2);font-size:12px;font-weight:850;padding:6px 10px;border-radius:999px}.promo-demo{border:1px solid var(--line);border-radius:18px;background:#fff;overflow:hidden;box-shadow:var(--shadow)}.promo-head{padding:19px 24px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between}.promo-body{padding:25px}.promo-row{display:grid;grid-template-columns:1fr auto;gap:12px;padding:12px 0;border-bottom:1px solid #edf1ee}.tag{font-size:11px;font-weight:800;background:var(--mint);color:var(--green2);border-radius:999px;padding:4px 9px}.tag.warn{background:#fff4dd;color:#855d0b}.metric{font-size:40px;font-weight:850;letter-spacing:-.04em;color:var(--green2)}.engine{display:grid;grid-template-columns:1fr 80px 1fr;align-items:center;gap:20px}.channelgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.channel{padding:21px;border-bottom:1px solid var(--line);font-weight:760}.hub{background:var(--dark);color:#fff;border-radius:18px;padding:38px;text-align:center;box-shadow:var(--shadow)}.hub strong{font-size:26px}.hub span{display:block;color:#9ed8b6;font-size:12px;margin-top:6px}.connect{font-size:34px;color:var(--green);text-align:center}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.card{border-top:1px solid rgba(255,255,255,.22);padding:26px 0}.card h3{font-size:21px;margin:12px 0 10px}.card p{color:#b8c9bf;font-size:14px;margin:0}.card .icon{width:42px;height:42px;border-radius:50%;background:#224d37;display:grid;place-items:center;color:#9fe1ba;font-weight:850}.pagehero{padding:82px 0 70px;background:linear-gradient(180deg,#f4faf6,#fff)}.pagehero h1{font-size:clamp(44px,5vw,68px)}.pagehero .lead{max-width:840px}.kicker{font-size:14px;font-weight:750;color:var(--green2)}.featuregrid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}.feature{padding:30px 0;border-top:1px solid var(--line)}.feature h3{margin:0 0 8px;font-size:22px}.feature p{color:var(--muted);margin:0}.list{display:grid;gap:10px;margin-top:20px}.list div{display:flex;gap:10px}.list div:before{content:'✓';color:var(--green);font-weight:900}.cta{background:linear-gradient(135deg,#eaf7ef,#f7fbf8);border-radius:22px;padding:48px 52px;display:flex;align-items:center;justify-content:space-between;gap:34px}.cta h2{font-size:36px;margin:0;max-width:670px}.cta p{margin:9px 0 0;color:var(--muted)}.code{background:#0d1e16;color:#d7eee0;border-radius:14px;padding:24px;overflow:auto;font:13px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace}.code .g{color:#8ad8a9}.compare{width:100%;border-collapse:collapse}.compare th,.compare td{text-align:left;padding:14px;border-bottom:1px solid var(--line);font-size:14px}.compare th{color:var(--green2)}.form{display:grid;gap:15px;max-width:720px}.form label{font-size:13px;font-weight:750}.form input,.form textarea,.form select{width:100%;padding:13px 14px;border:1px solid #cad8cf;border-radius:8px;font:inherit}.form textarea{min-height:130px}.note{font-size:12px;color:var(--muted)}footer{background:#0d1e16;color:#fff;padding:64px 0 26px}.foot{display:grid;grid-template-columns:1.8fr repeat(4,1fr);gap:42px}.foot h4{margin:0 0 15px;font-size:13px}.foot a{display:block;color:#b9c8bf;font-size:13px;margin:9px 0}.foot a:hover{color:#fff}.socials{display:flex;gap:10px;margin-top:22px}.socials a{width:38px;height:38px;border:1px solid #365043;border-radius:50%;display:grid;place-items:center;color:#fff;margin:0;font-weight:800}.copyright{border-top:1px solid #284035;margin-top:42px;padding-top:22px;color:#82968a;font-size:12px}.footer-note{color:#aeb9b0;max-width:370px;font-size:14px}.external-note{font-size:11px;color:#71867a;margin-top:12px}@media(max-width:980px){.links{display:none}.menu{display:block;margin-left:auto}.nav>.primary{display:none}.hero-grid,.split,.engine{grid-template-columns:1fr}.retail-stage{min-height:500px}.outcomes{grid-template-columns:1fr 1fr}.cards{grid-template-columns:1fr 1fr}.foot{grid-template-columns:1fr 1fr}.connect{transform:rotate(90deg)}.quotegrid{grid-template-columns:1fr}}@media(max-width:640px){.wrap{width:min(100% - 30px,1200px)}.hero{padding-top:58px}.hero h1,.pagehero h1{font-size:44px}.lead{font-size:18px}.outcomes,.cards,.featuregrid,.channelgrid{grid-template-columns:1fr}.section{padding:74px 0}.retail-stage{min-height:430px}.retail-photo{left:18px;bottom:54px}.offer-panel{width:270px}.offer-chip{right:0}.cta{display:block;padding:32px}.foot{grid-template-columns:1fr}.quotegrid{grid-template-columns:1fr}}

/* V4 brand and refinement */
.brand-logo{display:flex;align-items:center;min-width:205px}.brand-logo img{display:block;width:205px;height:auto}.footer-logo{display:block;background:#fff;border-radius:8px;padding:8px 10px;width:max-content}.footer-logo img{display:block;width:190px;height:auto}.hero{background:radial-gradient(circle at 76% 18%,rgba(22,130,77,.09),transparent 30%),linear-gradient(180deg,#f8fbf9 0,#fff 100%)}.hero-grid{gap:88px}.hero h1{max-width:720px}.section-intro{line-height:1.72}.quote{border-top:0;border-left:3px solid var(--green);border-radius:0;box-shadow:none;background:#fbfdfb}.outcomes{gap:38px}.outcome h3{font-size:23px}.card{border-top-color:rgba(255,255,255,.16)}@media(max-width:980px){.brand-logo img{width:180px}}

/* V5 brand system: derived from supplied Qixol artwork */
:root{--green:#9fc83a;--green2:#668a34;--green3:#7fa13e;--lime:#b5d679;--ink:#172016;--muted:#626b5d;--line:#e2e7da;--cream:#fbfaf6;--mint:#f2f6e9;--dark:#152015;--shadow:0 28px 80px rgba(42,55,30,.13)}
.brand-logo{gap:11px;min-width:190px;align-items:center}.brand-logo .brand-symbol{width:30px!important;height:40px;object-fit:contain}.brand-word{font-size:25px;font-weight:830;letter-spacing:-1.3px;color:#202820;line-height:1}.brand-word span{color:var(--green2)}.footer-logo{display:flex!important;align-items:center;gap:11px;background:transparent;padding:0;width:auto}.footer-logo .brand-symbol{width:34px!important;height:46px;object-fit:contain}.footer-logo .brand-word{color:#fff}.footer-logo .brand-word span{color:var(--lime)}
.primary{background:#71963a;border-color:#71963a}.primary:hover{background:#5d7d30}.eyebrow{color:#668a34}.green{color:#71963a}.topnote{background:#152015}.hero{background:radial-gradient(circle at 80% 18%,rgba(159,200,58,.16),transparent 31%),linear-gradient(180deg,#f8faf4,#fff)}
.v5-hero{padding:96px 0 82px}.v5-hero .hero-grid{grid-template-columns:.93fr 1.07fr}.hero-proof{display:flex;gap:9px;flex-wrap:wrap;margin-top:28px}.hero-proof span{font-size:12px;font-weight:760;padding:7px 11px;border:1px solid #dce4cf;border-radius:999px;background:rgba(255,255,255,.72);color:#4f5e49}.beauty-stage{position:relative;min-height:560px}.beauty-stage>img{position:absolute;inset:0 0 0 35px;width:calc(100% - 35px);height:100%;object-fit:cover;border-radius:30px;box-shadow:var(--shadow)}.stage-card{position:absolute;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 20px 55px rgba(34,48,26,.14);padding:17px 19px}.stage-card.top{right:-18px;top:54px}.stage-card.bottom{left:0;bottom:34px;width:285px}.stage-card small{display:block;font-size:10px;letter-spacing:.12em;font-weight:850;color:#668a34}.stage-card strong{display:block;font-size:20px;line-height:1.2;margin-top:5px}.stage-card p{font-size:12px;color:var(--muted);margin:5px 0 0}.signal{display:inline-block;width:8px;height:8px;border-radius:50%;background:#9fc83a;margin-right:7px}
.bestdeal{background:#152015;color:#fff;overflow:hidden}.bestdeal .eyebrow{color:#b5d679}.bestdeal h2{max-width:760px}.bestdeal .section-intro{color:#b8c2b3}.deal-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:72px;align-items:center}.deal-board{background:#f9faf5;color:#172016;border-radius:24px;padding:26px;box-shadow:0 30px 80px rgba(0,0,0,.24)}.deal-top{display:flex;align-items:center;justify-content:space-between;padding-bottom:18px;border-bottom:1px solid #dfe5d7}.deal-top b{font-size:18px}.deal-top span{font-size:12px;color:#687263}.basket-lines{display:grid;gap:9px;padding:18px 0}.basket-line{display:grid;grid-template-columns:1fr auto;gap:15px;font-size:13px}.basket-line span:last-child{font-weight:800}.deal-eval{background:#edf4df;border:1px solid #d9e7bc;border-radius:14px;padding:15px;margin:4px 0 15px}.deal-eval small{display:block;color:#668a34;font-weight:850;letter-spacing:.1em}.deal-eval b{display:block;font-size:17px;margin-top:4px}.winning{display:grid;gap:8px}.winrow{display:grid;grid-template-columns:24px 1fr auto;gap:10px;align-items:center;padding:11px 0;border-bottom:1px solid #e6eadf;font-size:12px}.wincheck{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#71963a;color:#fff;font-weight:900}.winrow b{font-size:12px}.always{margin-top:12px;background:#fff6df;border-radius:10px;padding:11px 13px;font-size:12px;color:#67531c}.deal-total{display:flex;justify-content:space-between;align-items:end;padding-top:18px}.deal-total span{font-size:12px;color:#687263}.deal-total strong{font-size:30px;color:#5d7d30}.deal-points{display:grid;gap:25px;margin-top:34px}.deal-point{display:grid;grid-template-columns:40px 1fr;gap:14px}.deal-point i{width:36px;height:36px;border:1px solid #425041;border-radius:50%;display:grid;place-items:center;color:#b5d679;font-style:normal;font-weight:850}.deal-point h3{font-size:18px;margin:0 0 4px}.deal-point p{font-size:13px;color:#b8c2b3;margin:0}.bestline{font-size:22px;font-weight:780;color:#dce8c5;margin-top:28px}
.brand-band{position:relative;overflow:hidden}.brand-band:after{content:'';position:absolute;right:-80px;top:-150px;width:330px;height:440px;background:url('qixol-symbol.png') center/contain no-repeat;opacity:.045;pointer-events:none}.editorial-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:90px;align-items:start}.big-statement{font-size:clamp(34px,4vw,52px);line-height:1.12;letter-spacing:-.035em;margin:0}.plain-list{border-top:1px solid var(--line)}.plain-item{display:grid;grid-template-columns:42px 1fr;gap:18px;padding:22px 0;border-bottom:1px solid var(--line)}.plain-item .n{font-size:11px;color:#71963a;font-weight:900}.plain-item h3{font-size:18px;margin:0 0 5px}.plain-item p{font-size:14px;color:var(--muted);margin:0}
@media(max-width:980px){.deal-layout,.editorial-grid{grid-template-columns:1fr}.beauty-stage{min-height:500px}.stage-card.top{right:0}.brand-logo{min-width:auto}.deal-layout{gap:45px}}@media(max-width:640px){.v5-hero{padding-top:58px}.beauty-stage{min-height:430px}.beauty-stage>img{left:12px;width:calc(100% - 12px)}.stage-card.bottom{width:250px}.deal-board{padding:18px}.brand-word{font-size:22px}.brand-logo .brand-symbol{width:26px!important;height:35px}}

/* V6 readability and visual communication pass */
:root{--muted:#44564c}
.lead,.section-intro,.feature p,.outcome p,.plain-item p,.storyrow p,.quote cite,.stage-card p{color:#44564c}
.card p{color:#d2ddd6}.links a.active{color:#4f7228;position:relative}.links a.active:after{content:'';position:absolute;left:0;right:0;bottom:-12px;height:3px;border-radius:3px;background:#98c340}.capability-intro{margin-top:30px;padding:16px 18px;border-left:3px solid #98c340;background:#f5f8ef;max-width:610px}.capability-intro b{display:block;font-size:14px}.capability-intro span{display:block;font-size:13px;color:#4b5b4e;margin-top:3px}.commerce-map{display:grid;grid-template-columns:1.2fr .45fr .9fr .55fr;gap:18px;align-items:center;margin-top:42px;padding:30px;border:1px solid var(--line);border-radius:24px;background:#fafbf7}.touchpoints{display:grid;grid-template-columns:1fr 1fr;gap:12px}.touchpoints div{padding:18px;background:#fff;border:1px solid var(--line);border-radius:14px}.touchpoints b,.touchpoints span{display:block}.touchpoints span{font-size:12px;color:#536258;margin-top:3px}.map-flow{text-align:center;font-size:11px;color:#647164;text-transform:uppercase;letter-spacing:.08em}.map-flow strong{display:block;font-size:30px;color:#71963a}.attribute-story{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:30px}.attribute-story>div{padding:30px;border-radius:18px;background:#f5f8ef;border:1px solid #dfe8d4}.attribute-story small{font-weight:850;letter-spacing:.1em;color:#668a34}.attribute-story h3{font-size:21px;line-height:1.25;margin:10px 0}.attribute-story p{color:#405147;margin:0}.integration-visual{display:grid;grid-template-columns:1fr 42px 1fr 42px 1fr;gap:10px;align-items:center;padding:28px;border-radius:22px;background:#f7f9f3;border:1px solid #dfe7d6}.iv-source,.iv-core{text-align:center;padding:22px 12px}.iv-source b,.iv-source span,.iv-core b,.iv-core span{display:block}.iv-source span,.iv-core span{font-size:12px;color:#536258;margin-top:5px}.iv-core{background:#152015;color:#fff;border-radius:16px}.iv-core img{width:28px;height:38px;object-fit:contain;margin-bottom:8px}.iv-core span{color:#cbd8c7}.iv-arrow{text-align:center;color:#71963a;font-size:28px;font-weight:800}.stage-card.top{right:-8px}.stage-card.bottom{width:320px}.stage-card strong{font-size:19px}.beauty-stage>img{filter:saturate(.92) contrast(1.03)}
@media(max-width:980px){.commerce-map,.integration-visual{grid-template-columns:1fr}.map-flow strong{transform:rotate(90deg)}.attribute-story{grid-template-columns:1fr}.iv-arrow{transform:rotate(90deg)}}

.future-note{font-size:.95rem;padding:1rem 1.1rem;border-left:3px solid #98c340;background:rgba(152,195,64,.09);border-radius:0 .6rem .6rem 0;}

/* V8 contrast audit */
:root{--muted:#394b41}
body{color:#172016}
.lead,.section-intro,.feature p,.outcome p,.plain-item p,.storyrow p,.quote cite,.stage-card p,
.note,.footer-note,.external-note,.copyright,.touchpoints span,.iv-source span,.iv-core span,
.deal-top span,.deal-total span,.map-flow{opacity:1}
.lead{color:#3d5045}
.section-intro,.feature p,.outcome p,.plain-item p,.storyrow p,.quote cite,.stage-card p,.note{color:#3f5147}
.topnote{color:#eef4ef}
.dark .section-intro,.card p,.deal-point p{color:#d8e2da}
.foot a{color:#d2ddd6}
.footer-note{color:#cbd6ce}
.external-note{color:#b8c8bd}
.copyright{color:#b6c5bb}
.touchpoints span,.iv-source span{color:#46584d}
.iv-core span{color:#d6e1d9}
.deal-top span,.deal-total span{color:#4f5f54}
.map-flow{color:#4d5e53}

/* V9 commercial outcome extension */
.commerce-map-outcomes{grid-template-columns:1.15fr .45fr .9fr .5fr 1.15fr}
.commercial-outcomes{display:grid;gap:10px}
.commercial-outcomes>div{background:#fff;border:1px solid var(--line);border-radius:16px;padding:13px 15px}
.commercial-outcomes b{display:block;color:#172016;font-size:.98rem;margin-bottom:4px}
.commercial-outcomes span{display:block;color:#3f5147;font-size:.86rem;line-height:1.4}
.outcome-statement{text-align:center;margin:22px auto 0;color:#172016;font-size:1.12rem}
@media(max-width:1100px){
 .commerce-map-outcomes{grid-template-columns:1fr}
 .commercial-outcomes{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:720px){.commercial-outcomes{grid-template-columns:1fr}}

/* V10 targeted readability correction. Keep light text scoped to dark surfaces only. */
.card p{color:#3f5147}
.dark .card p{color:#d8e2da}
.feature p,.outcome p,.plain-item p,.storyrow p,.stage-card p,.section-intro,.note{color:#3f5147}
.cta p{color:#3f5147}
.offer-panel p{color:#3f5147}
.quote cite{color:#3f5147}

/* V11 readability and developer visual */
.eyebrow{font-size:15px;font-weight:800;letter-spacing:.12em;line-height:1.35;margin-bottom:16px}
.integration-visual{display:grid;grid-template-columns:1fr auto .82fr auto 1fr;align-items:stretch;gap:16px;margin-top:28px}
.integration-step,.integration-engine{border-radius:20px;padding:24px;display:flex;flex-direction:column;justify-content:center;min-height:150px}
.integration-step{background:#fff;border:1px solid var(--line)}
.integration-engine{background:#102217;color:#fff;text-align:center;box-shadow:0 20px 42px rgba(16,34,23,.12)}
.integration-step strong,.integration-engine strong{font-size:1.15rem;margin:5px 0 8px}
.integration-step small{color:#3f5147;font-size:.9rem;line-height:1.5}
.integration-engine small{color:#d8e2da;font-size:.9rem;line-height:1.5}
.integration-kicker{font-size:.75rem;font-weight:800;letter-spacing:.1em;color:#678539}
.integration-arrow{display:flex;align-items:center;justify-content:center;color:#719f32;font-size:1.65rem;font-weight:800}
@media(max-width:900px){.integration-visual{grid-template-columns:1fr}.integration-arrow{transform:rotate(90deg);min-height:22px}}
@media(max-width:640px){.eyebrow{font-size:14px;letter-spacing:.1em}}

/* V15 Resources and Best Deal guide */
.article-shell{max-width:1120px}.article-intro,.article-section{max-width:900px;margin:0 auto 72px}.article-section.split{max-width:1120px}
.bestdeal-example{margin:20px 0 80px;padding:38px;border:1px solid var(--line);border-radius:28px;background:var(--soft)}
.example-heading{max-width:760px;margin-bottom:26px}.example-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.example-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px}.example-card>span,.example-result span{font-size:.76rem;font-weight:800;letter-spacing:.1em;color:#678539}
.example-card strong,.example-result strong{display:block;font-size:1.08rem;margin:8px 0}.example-card p,.example-result p{color:#3f5147}
.example-result{display:grid;grid-template-columns:.8fr 1.5fr;gap:28px;align-items:center;margin-top:18px;padding:26px;border-radius:20px;background:#102217;color:#fff}.example-result p{color:#d8e2da;margin:0}
.featured-guide{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center;padding:34px;border:1px solid var(--line);border-radius:24px;background:#fff;margin:30px 0 48px}
.featured-guide h3{font-size:clamp(1.7rem,3vw,2.5rem);margin:6px 0 10px}.featured-guide p{max-width:760px;color:#3f5147}.coming-guides{margin-top:34px}
@media(max-width:800px){.example-grid,.example-result,.featured-guide{grid-template-columns:1fr}.bestdeal-example{padding:24px}}

/* V16 customer proof */
.testimonial-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin:34px 0}
.testimonial{margin:0;padding:30px;border:1px solid var(--line);border-radius:24px;background:#fff}
.testimonial p{font-size:1.2rem;line-height:1.55;color:#18261e;margin:0 0 24px}
.testimonial footer{display:flex;flex-direction:column;gap:3px}
.testimonial footer span{font-size:.92rem;color:#536259}
.proof-points{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px}
.proof-points>div{display:flex;flex-direction:column;gap:6px}
.proof-points span{color:#536259}
@media(max-width:800px){.testimonial-grid,.proof-points{grid-template-columns:1fr}}

/* V17 Best Deal worked example */
.deal-example{display:grid;gap:18px;margin-top:34px}
.deal-example-step{display:grid;grid-template-columns:48px 1fr;gap:18px;align-items:start;padding:24px;border:1px solid var(--line);border-radius:22px;background:#fff}
.deal-example-number{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#edf5dc;color:#45621e;font-weight:800}
.deal-example-step strong{display:block;font-size:1.08rem;margin:4px 0 8px;color:#18261e}
.deal-example-step p{margin:0;color:#536259;line-height:1.6}
.deal-example-total{display:inline-block;margin-top:9px;font-weight:700;color:#18261e}
.deal-offers{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}
.deal-offers>div{display:flex;flex-direction:column;gap:6px;padding:18px;border-radius:16px;background:#f7f9f3}
.deal-offers b{color:#18261e}.deal-offers span{color:#536259;line-height:1.45}.deal-offers em{font-style:normal;font-weight:800;color:#45621e;margin-top:auto}
.deal-example-result{background:#f4f8eb}
.deal-result-line{display:flex;justify-content:space-between;gap:20px;max-width:420px;padding:8px 0;border-bottom:1px solid var(--line)}
.deal-result-total{font-size:1.08rem;border-bottom:0;padding-top:12px}
.deal-example-note{margin-top:18px!important;font-weight:600;color:#26382c!important}
@media(max-width:800px){.deal-offers{grid-template-columns:1fr}.deal-example-step{grid-template-columns:40px 1fr;padding:20px}.deal-example-number{width:36px;height:36px}}

/* V18 About: anonymised real-world result */
.result-story{display:grid;grid-template-columns:minmax(230px,.7fr) minmax(0,1.3fr);gap:56px;align-items:center}
.result-stat{display:flex;flex-direction:column;gap:10px}
.result-stat strong{font-size:clamp(4rem,8vw,7rem);line-height:.9;letter-spacing:-.06em}
.result-stat span{max-width:300px;font-size:1rem;line-height:1.5}
.result-copy h2{margin-top:0}
.result-copy p{max-width:720px}
@media(max-width:800px){.result-story{grid-template-columns:1fr;gap:28px}.result-stat strong{font-size:4.5rem}}

/* V19 About pedigree */
.pedigree-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:start}
.pedigree-story{padding-left:32px;border-left:1px solid var(--line)}
.pedigree-year{display:flex;align-items:baseline;gap:14px;margin-bottom:22px}
.pedigree-year strong{font-size:clamp(3rem,6vw,5rem);line-height:.9;letter-spacing:-.05em;color:#678539}
.pedigree-year span{font-weight:800;color:#26382c}
.pedigree-story p{color:#536259;line-height:1.65}
@media(max-width:800px){.pedigree-grid{grid-template-columns:1fr;gap:28px}.pedigree-story{padding-left:0;border-left:0;border-top:1px solid var(--line);padding-top:28px}}

/* V20 lighter customer testimonial treatment */
.testimonial-grid .testimonial.testimonial-light{
  position:relative;
  overflow:hidden;
  background:#fff;
  border:1px solid #dfe8d2;
  border-radius:24px;
  padding:34px 36px 30px;
  box-shadow:0 12px 32px rgba(24,38,30,.055);
  color:#18261e;
}
.testimonial-grid .testimonial.testimonial-light::before{
  content:"";
  display:block;
  width:54px;
  height:3px;
  border-radius:3px;
  background:#7c9f3e;
  margin:6px 0 24px;
}
.testimonial-light .testimonial-quote{
  position:absolute;
  top:17px;
  right:28px;
  font-size:72px;
  line-height:1;
  font-family:Georgia,serif;
  color:#dce9c8;
  pointer-events:none;
}
.testimonial-grid .testimonial.testimonial-light>p{
  position:relative;
  margin:0 0 28px;
  max-width:620px;
  color:#18261e;
  font-size:1.13rem;
  line-height:1.62;
}
.testimonial-grid .testimonial.testimonial-light footer{
  display:flex;
  flex-direction:column;
  gap:5px;
  padding:0;
  background:transparent;
  color:#536259;
}
.testimonial-grid .testimonial.testimonial-light footer strong{
  color:#18261e;
  font-size:1.02rem;
}
.testimonial-grid .testimonial.testimonial-light footer>span{
  color:#65736a;
}
.testimonial-rating{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid #edf1e7;
  color:#536259;
  font-size:.93rem;
}
.testimonial-rating .stars{
  color:#678539;
  letter-spacing:2px;
  font-size:1rem;
}
@media(max-width:720px){
  .testimonial-grid .testimonial.testimonial-light{padding:28px 24px 24px}
  .testimonial-light .testimonial-quote{right:20px;font-size:60px}
  .testimonial-grid .testimonial.testimonial-light>p{font-size:1.05rem}
}


/* V22 compliance */
.footer-legal{display:flex;justify-content:space-between;gap:28px;align-items:flex-start;margin-top:30px;padding-top:22px;border-top:1px solid rgba(255,255,255,.14)}.footer-legal p{margin:0;max-width:720px;color:#b6c5bb;font-size:.79rem;line-height:1.55;text-align:right}.legal-links{display:flex;gap:16px;flex-wrap:wrap}.legal-links a,.cookie-settings-link{color:#d2ddd6;font:inherit;font-size:.82rem;background:none;border:0;padding:0;cursor:pointer;text-decoration:none}.legal-links a:hover,.cookie-settings-link:hover{text-decoration:underline;color:#fff}.form-privacy{font-size:.82rem;line-height:1.5;color:#536259;margin:4px 0 0}.form-privacy a{color:#4f7228;font-weight:700}.legal-hero{padding-bottom:56px}.legal-wrap{max-width:920px}.legal-updated{margin:20px 0 0;color:#536259;font-size:.9rem;font-weight:650}.legal-body{padding-top:56px}.legal-layout{display:grid;grid-template-columns:220px minmax(0,760px);gap:72px;align-items:start;justify-content:center}.legal-toc{position:sticky;top:105px;display:flex;flex-direction:column;gap:9px;padding:22px;border:1px solid var(--line);border-radius:18px;background:#f7f9f3}.legal-toc strong{font-size:.9rem;margin-bottom:4px}.legal-toc a{font-size:.84rem;line-height:1.35;color:#536259;text-decoration:none}.legal-toc a:hover{color:#4f7228}.legal-section{scroll-margin-top:110px;padding:0 0 34px;margin:0 0 34px;border-bottom:1px solid var(--line)}.legal-section:last-child{border-bottom:0}.legal-section h2{font-size:clamp(1.45rem,2.5vw,2rem);margin:0 0 18px}.legal-section p,.legal-section li{color:#3f5147;line-height:1.72}.legal-section a{color:#4f7228;font-weight:650}.legal-section code{background:#f1f5e9;padding:2px 6px;border-radius:5px}.legal-table{border:1px solid var(--line);border-radius:16px;overflow:hidden;margin:22px 0}.legal-table>div{display:grid;grid-template-columns:.8fr 1.4fr;border-top:1px solid var(--line)}.legal-table>div:first-child{border-top:0;background:#edf5dc}.legal-table b,.legal-table span{padding:14px 16px;line-height:1.5}.inline-cookie-button{border:0;background:none;padding:0;color:#4f7228;font:inherit;font-weight:700;text-decoration:underline;cursor:pointer}.cookie-banner{position:fixed;left:24px;right:24px;bottom:24px;z-index:1000;max-width:760px;margin:auto;background:#102217;color:#fff;border:1px solid rgba(255,255,255,.14);border-radius:22px;box-shadow:0 22px 70px rgba(0,0,0,.28);padding:24px;display:none}.cookie-banner.show{display:block}.cookie-banner h2{font-size:1.35rem;margin:0 0 8px;color:#fff}.cookie-banner p{margin:0;color:#d8e2da;line-height:1.55;font-size:.92rem}.cookie-banner p a{color:#cfe99a}.cookie-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.cookie-actions .cookie-reject{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.24)}.cookie-panel{position:fixed;inset:0;z-index:1100;background:rgba(10,20,13,.62);display:none;align-items:center;justify-content:center;padding:24px}.cookie-panel.show{display:flex}.cookie-dialog{width:min(620px,100%);background:#fff;border-radius:24px;padding:30px;box-shadow:0 30px 90px rgba(0,0,0,.3)}.cookie-dialog h2{margin:0 0 10px}.cookie-dialog>p{color:#536259;line-height:1.55}.cookie-choice{display:flex;justify-content:space-between;gap:22px;padding:18px 0;border-top:1px solid var(--line)}.cookie-choice b,.cookie-choice span{display:block}.cookie-choice span{font-size:.86rem;color:#536259;margin-top:4px}.cookie-status{font-size:.82rem!important;font-weight:800;color:#678539!important;white-space:nowrap}.cookie-toggle{display:flex;align-items:center;gap:8px;font-weight:700}.cookie-toggle input{width:20px;height:20px;accent-color:#678539}.cookie-dialog-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;margin-top:22px}@media(max-width:800px){.footer-legal{flex-direction:column}.footer-legal p{text-align:left}.legal-layout{grid-template-columns:1fr;gap:28px}.legal-toc{position:static}.legal-table>div{grid-template-columns:1fr}.cookie-banner{left:12px;right:12px;bottom:12px;padding:20px}.cookie-dialog{padding:24px}.cookie-choice{flex-direction:column;gap:10px}}


/* V23 footer and legal-page refinement */
.footer-legal{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:28px;
  margin-top:28px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.12)
}
.footer-legal-left{display:flex;flex-direction:column;gap:9px}
.legal-links{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.legal-links a,.cookie-settings-link{font-size:.78rem;line-height:1.3}
.company-legal{
  margin:0!important;
  max-width:none!important;
  color:#83938a!important;
  font-size:.68rem!important;
  line-height:1.35!important;
  text-align:left!important;
  letter-spacing:.015em
}
/* Empty by design in V23. Future social icons can be inserted here without restructuring the footer. */
.footer-social{min-width:116px;min-height:24px;display:flex;justify-content:flex-end;align-items:center;gap:12px}
.footer-social:empty{visibility:hidden}

.legal-hero{padding-top:72px;padding-bottom:46px}
.legal-hero h1{max-width:820px}
.legal-body{padding-top:46px}
.legal-layout{
  grid-template-columns:210px minmax(0,760px);
  gap:58px;
  align-items:start;
  justify-content:center
}
.legal-toc{
  position:sticky;
  top:105px;
  display:block;
  padding:20px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#f7f9f3
}
.legal-toc strong{
  display:block;
  margin:0 0 12px;
  font-size:.84rem;
  line-height:1.3;
  color:#18261e
}
.legal-toc a{
  display:block;
  margin:0;
  padding:6px 0;
  font-size:.78rem;
  line-height:1.35;
  color:#536259;
  text-decoration:none;
  border-top:1px solid rgba(24,38,30,.07)
}
.legal-toc strong + a{border-top:0;padding-top:0}
.legal-content{min-width:0}
.legal-section{
  scroll-margin-top:110px;
  padding:0 0 28px;
  margin:0 0 30px;
  border-bottom:1px solid var(--line)
}
.legal-section:last-child{padding-bottom:0;margin-bottom:0;border-bottom:0}
.legal-section h2{
  margin:0 0 14px!important;
  font-size:1.55rem!important;
  line-height:1.22!important;
  letter-spacing:-.025em!important;
  color:#18261e
}
.legal-section p{
  margin:0 0 14px;
  font-size:.98rem;
  line-height:1.7;
  color:#3f5147
}
.legal-section p:last-child{margin-bottom:0}
.legal-section ul{
  margin:10px 0 16px;
  padding-left:22px
}
.legal-section li{
  margin:6px 0;
  font-size:.98rem;
  line-height:1.65;
  color:#3f5147
}
.legal-table{margin:18px 0 6px}
.legal-table b,.legal-table span{font-size:.9rem}

@media(max-width:800px){
  .footer-legal{align-items:flex-start}
  .footer-social{min-width:0;min-height:0}
  .legal-hero{padding-top:48px;padding-bottom:36px}
  .legal-body{padding-top:34px}
  .legal-layout{grid-template-columns:1fr;gap:30px}
  .legal-toc{position:static}
  .legal-section h2{font-size:1.4rem!important}
}


/* V24 compliance QA */
.company-legal{
  max-width:780px!important;
  font-size:.62rem!important;
  line-height:1.45!important;
  color:#74837a!important;
}
.legal-callout{
  margin:18px 0 4px;
  padding:18px 20px;
  border-left:3px solid #7c9f3e;
  border-radius:0 12px 12px 0;
  background:#f4f8ec;
}
.legal-callout strong{display:block;margin-bottom:7px;color:#18261e}
.legal-callout p{margin:0!important}

/* V26 promotion example capability labels */
.feature .capabilities{
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid rgba(24,38,30,.09);
  font-size:.88rem;
  line-height:1.55;
  color:#536259;
}
.feature .capabilities strong{color:#18261e}


/* V29 true full-width photographic homepage hero */
.v29-hero{
  position:relative;
  min-height:720px;
  padding:0!important;
  overflow:hidden;
  background:#f7f9f3;
}
.v29-photo{
  position:absolute;
  inset:0;
  z-index:0;
}
.v29-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:66% center;
  display:block;
}
.v29-wash{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(90deg,
      rgba(249,250,246,.99) 0%,
      rgba(249,250,246,.98) 24%,
      rgba(249,250,246,.90) 34%,
      rgba(249,250,246,.48) 46%,
      rgba(249,250,246,.08) 58%,
      rgba(249,250,246,0) 70%);
}
.v29-hero-content{
  position:relative;
  z-index:2;
  min-height:720px;
  display:flex;
  align-items:center;
}
.v29-copy{
  width:min(610px,47vw);
  padding:58px 0 52px;
}
.v29-copy h1{
  max-width:590px;
}
.v29-copy .lead{
  max-width:590px;
}
.v29-copy .capability-intro{
  max-width:610px;
  background:rgba(247,249,243,.91);
  backdrop-filter:blur(5px);
}
@media(max-width:1050px){
  .v29-wash{
    background:linear-gradient(90deg,
      rgba(249,250,246,.99) 0%,
      rgba(249,250,246,.96) 38%,
      rgba(249,250,246,.64) 55%,
      rgba(249,250,246,.10) 72%,
      rgba(249,250,246,0) 100%);
  }
  .v29-copy{width:min(560px,55vw)}
}
@media(max-width:800px){
  .v29-hero{
    min-height:auto;
    padding-bottom:0!important;
  }
  .v29-photo{
    position:relative;
    height:420px;
    order:2;
  }
  .v29-photo img{object-position:66% center}
  .v29-wash{display:none}
  .v29-hero-content{
    min-height:0;
    display:block;
  }
  .v29-copy{
    width:100%;
    padding:46px 0 38px;
  }
  .v29-copy .capability-intro{background:#f4f8ec}
}
@media(max-width:520px){
  .v29-photo{height:330px}
  .v29-photo img{object-position:68% center}
}


/* V30 final homepage composition refinement
   Keep text in a quiet visual zone and move checkout/POS detail farther right. */
@media(min-width:801px){
  .v29-photo img{
    object-position:78% center;
    transform:scale(1.035);
    transform-origin:center right;
  }
  .v29-wash{
    background:
      linear-gradient(90deg,
        rgba(249,250,246,1) 0%,
        rgba(249,250,246,.995) 27%,
        rgba(249,250,246,.96) 36%,
        rgba(249,250,246,.72) 45%,
        rgba(249,250,246,.30) 53%,
        rgba(249,250,246,.06) 61%,
        rgba(249,250,246,0) 70%);
  }
  .v29-copy{
    width:min(600px,44vw);
  }
  .v29-copy .capability-intro{
    background:rgba(247,249,243,.95);
  }
}


/* V31 Retailers photographic promotion example */
.retailers-visual-section{
  padding:10px 0 28px;
}
.retailers-promo-visual{
  position:relative;
  margin:0;
  overflow:hidden;
  border-radius:26px;
  background:#eef2e8;
  box-shadow:0 22px 60px rgba(24,38,30,.12);
}
.retailers-promo-visual img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:2.18/1;
  object-fit:cover;
  object-position:center;
}
.retailers-promo-visual figcaption{
  position:absolute;
  left:22px;
  bottom:22px;
  max-width:360px;
  padding:15px 18px;
  border:1px solid rgba(255,255,255,.58);
  border-radius:15px;
  background:rgba(250,251,247,.93);
  box-shadow:0 10px 30px rgba(24,38,30,.10);
  backdrop-filter:blur(7px);
}
.retailers-promo-visual figcaption span{
  display:block;
  margin-bottom:5px;
  color:#678539;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.retailers-promo-visual figcaption strong{
  display:block;
  color:#18261e;
  font-size:1rem;
  line-height:1.35;
}
@media(max-width:700px){
  .retailers-visual-section{padding:0 0 22px}
  .retailers-promo-visual{border-radius:20px}
  .retailers-promo-visual img{
    aspect-ratio:1.35/1;
    object-position:54% center;
  }
  .retailers-promo-visual figcaption{
    left:14px;
    right:14px;
    bottom:14px;
    max-width:none;
    padding:13px 14px;
  }
}


/* V32 Retailers caption refinement */
.retailers-promo-visual figcaption{
  left:16px;
  bottom:16px;
  max-width:292px;
  padding:10px 13px 11px;
  border:1px solid rgba(255,255,255,.48);
  border-radius:11px;
  background:rgba(250,251,247,.84);
  box-shadow:0 5px 16px rgba(24,38,30,.07);
  backdrop-filter:blur(6px);
}
.retailers-promo-visual figcaption span{
  margin-bottom:3px;
  font-size:.62rem;
  letter-spacing:.11em;
}
.retailers-promo-visual figcaption strong{
  font-size:.88rem;
  line-height:1.32;
  font-weight:700;
}
@media(max-width:700px){
  .retailers-promo-visual figcaption{
    left:10px;
    right:auto;
    bottom:10px;
    max-width:250px;
    padding:9px 11px 10px;
  }
  .retailers-promo-visual figcaption strong{
    font-size:.82rem;
  }
}


/* V33 Retailers caption: genuinely subtle editorial annotation */
.retailers-promo-visual figcaption{
  left:12px;
  bottom:12px;
  width:auto;
  max-width:238px;
  padding:7px 10px 8px;
  border:1px solid rgba(255,255,255,.34);
  border-radius:8px;
  background:rgba(250,251,247,.68);
  box-shadow:0 2px 8px rgba(24,38,30,.04);
  backdrop-filter:blur(5px);
}
.retailers-promo-visual figcaption span{
  margin-bottom:2px;
  font-size:.54rem;
  line-height:1.15;
  letter-spacing:.105em;
  font-weight:800;
}
.retailers-promo-visual figcaption strong{
  font-size:.74rem;
  line-height:1.25;
  font-weight:650;
}
@media(max-width:700px){
  .retailers-promo-visual figcaption{
    left:8px;
    bottom:8px;
    max-width:205px;
    padding:6px 8px 7px;
    border-radius:7px;
  }
  .retailers-promo-visual figcaption span{font-size:.50rem}
  .retailers-promo-visual figcaption strong{font-size:.68rem}
}


/* V34 Partners & Platforms integration visual */
.partners-visual-section{
  padding:10px 0 30px;
}
.partners-integration-visual{
  margin:0;
  overflow:hidden;
  border-radius:26px;
  background:#e9f0ec;
  box-shadow:0 22px 60px rgba(20,38,35,.12);
}
.partners-integration-visual img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:2.18/1;
  object-fit:cover;
  object-position:center;
}
@media(max-width:700px){
  .partners-visual-section{padding:0 0 22px}
  .partners-integration-visual{border-radius:20px}
  .partners-integration-visual img{
    aspect-ratio:1.35/1;
    object-position:56% center;
  }
}


/* V35 Partners opening spacing refinement */
.partners-visual-section{
  margin-top:-70px;
}
@media(max-width:700px){
  .partners-visual-section{
    margin-top:-28px;
  }
}


/* V36 Partners post-image spacing refinement */
.partners-visual-section + .section{
  padding-top:34px;
}
@media(max-width:700px){
  .partners-visual-section + .section{
    padding-top:28px;
  }
}


/* V37 Retailers post-image spacing refinement */
.retailers-visual-section + .section{
  padding-top:34px;
}
@media(max-width:700px){
  .retailers-visual-section + .section{
    padding-top:28px;
  }
}


/* V43 safe page-scoped desktop whitespace tidy-up
   No global hero/section spacing changes. */
@media(min-width:701px){
  /* Text-led pages only: reduce the oversized opening transition.
     Original: pagehero 70px bottom + following section 104px top.
     V43: 42px bottom + 42px top = 84px total, still deliberately spacious. */
  body.page-product .pagehero,
  body.page-business-central .pagehero,
  body.page-developers .pagehero,
  body.page-resources .pagehero,
  body.page-demo .pagehero,
  body.page-about .pagehero,
  body.page-examples .pagehero,
  body.page-best-deal .pagehero{
    padding-bottom:42px;
  }

  body.page-product .pagehero + .section,
  body.page-business-central .pagehero + .section,
  body.page-developers .pagehero + .section,
  body.page-resources .pagehero + .section,
  body.page-demo .pagehero + .section,
  body.page-about .pagehero + .section,
  body.page-examples .pagehero + .section,
  body.page-best-deal .pagehero + .section{
    padding-top:42px;
  }
}


/* V44 full desktop whitespace audit - PAGE SCOPED ONLY
   No global section, hero, footer, legal or navigation rules. */
@media(min-width:701px){

  /* TEXT-LED PAGES
     Reduce the repeated 104px section shells while preserving all component internals. */
  body.page-product main > .section,
  body.page-business-central main > .section,
  body.page-developers main > .section,
  body.page-resources main > .section,
  body.page-demo main > .section,
  body.page-examples main > .section,
  body.page-best-deal main > .section{
    padding-top:64px;
    padding-bottom:64px;
  }

  /* Their opening transition is intentionally tighter than later transitions.
     V43 already reduced this; V44 keeps it explicit after the rule above. */
  body.page-product main > .pagehero + .section,
  body.page-business-central main > .pagehero + .section,
  body.page-developers main > .pagehero + .section,
  body.page-resources main > .pagehero + .section,
  body.page-demo main > .pagehero + .section,
  body.page-examples main > .pagehero + .section,
  body.page-best-deal main > .pagehero + .section{
    padding-top:42px;
  }

  /* ABOUT has a bespoke subhero, so do not alter that opening.
     Only reduce the repeated content-section shells beneath it. */
  body.page-about main > .section:not(.hero){
    padding-top:68px;
    padding-bottom:68px;
  }

  /* RETAILERS / PARTNERS:
     preserve the approved hero-to-image and image-to-benefit compositions.
     Only later ordinary sections are made slightly less vertically stretched. */
  body.page-retailers main > .section:nth-of-type(n+4),
  body.page-partners main > .section:nth-of-type(n+4){
    padding-top:72px;
    padding-bottom:72px;
  }

  /* Reassert the already-approved image-to-first-benefit transitions. */
  body.page-retailers .retailers-visual-section + .section,
  body.page-partners .partners-visual-section + .section{
    padding-top:34px;
  }
}


/* V45 compact desktop rhythm - forensic page-scoped correction
   Purpose: remove duplicated white space at section boundaries.
   No footer, navigation, typography, component-internal or legal rules. */
@media(min-width:701px){

  /* TEXT-LED PAGE OPENINGS
     Treat hero + first content block as one composition. */
  body.page-product .pagehero,
  body.page-business-central .pagehero,
  body.page-developers .pagehero,
  body.page-resources .pagehero,
  body.page-demo .pagehero,
  body.page-examples .pagehero,
  body.page-best-deal .pagehero{
    padding-bottom:18px;
  }

  body.page-product main > .pagehero + .section,
  body.page-business-central main > .pagehero + .section,
  body.page-developers main > .pagehero + .section,
  body.page-resources main > .pagehero + .section,
  body.page-demo main > .pagehero + .section,
  body.page-examples main > .pagehero + .section,
  body.page-best-deal main > .pagehero + .section{
    padding-top:18px;
  }

  /* Normal content rhythm on text-led pages.
     This overrides V44's still-generous 64/64 shell. */
  body.page-product main > .section,
  body.page-business-central main > .section,
  body.page-developers main > .section,
  body.page-resources main > .section,
  body.page-demo main > .section,
  body.page-examples main > .section,
  body.page-best-deal main > .section{
    padding-top:48px;
    padding-bottom:48px;
  }

  /* Reassert the tighter first section after the rule above. */
  body.page-product main > .pagehero + .section,
  body.page-business-central main > .pagehero + .section,
  body.page-developers main > .pagehero + .section,
  body.page-resources main > .pagehero + .section,
  body.page-demo main > .pagehero + .section,
  body.page-examples main > .pagehero + .section,
  body.page-best-deal main > .pagehero + .section{
    padding-top:18px;
  }

  /* Resources first row has its own card top padding which visually adds
     another blank strip. Remove only that top padding on this one row. */
  body.page-resources main > .pagehero + .section .cards > .card{
    padding-top:8px;
  }

  /* Business Central opening: button lives in hero and the three-column
     benefits begin immediately after it, so keep this boundary especially compact. */
  body.page-business-central .pagehero{
    padding-bottom:14px;
  }
  body.page-business-central main > .pagehero + .section{
    padding-top:14px;
    padding-bottom:44px;
  }

  /* Product opening feature grid likewise needs less empty boundary space. */
  body.page-product .pagehero{
    padding-bottom:16px;
  }
  body.page-product main > .pagehero + .section{
    padding-top:16px;
  }

  /* ABOUT: preserve bespoke subhero internals, but stop later content sections
     from accumulating large 68/68 white bands. */
  body.page-about main > .section:not(.hero){
    padding-top:52px;
    padding-bottom:52px;
  }

  /* Keep the transition from About hero to first content comfortable but compact. */
  body.page-about main > .hero + .section{
    padding-top:46px;
  }

  /* RETAILERS / PARTNERS:
     approved photographic openings remain protected.
     Only later ordinary sections get a compact rhythm. */
  body.page-retailers main > .section:nth-of-type(n+4),
  body.page-partners main > .section:nth-of-type(n+4){
    padding-top:54px;
    padding-bottom:54px;
  }

  body.page-retailers .retailers-visual-section + .section,
  body.page-partners .partners-visual-section + .section{
    padding-top:34px;
  }
}


/* V46 Partners-only whitespace refinement.
   Tightens the benefit block shown after the approved integration image.
   No other page or component is affected. */
@media(min-width:701px){
  body.page-partners .partners-visual-section + .section{
    padding-top:18px;
    padding-bottom:24px;
  }

  body.page-partners .partners-visual-section + .section + .section{
    padding-top:38px;
  }
}


/* V47 Business Central placeholder visual.
   Page-scoped and intentionally compact to match the V46 whitespace rhythm. */
body.page-business-central .bc-visual-section{
  padding:0 0 30px;
  background:#fff;
}
body.page-business-central .bc-visual{
  margin:0;
}
body.page-business-central .bc-visual img{
  display:block;
  width:100%;
  height:auto;
  border-radius:18px;
  box-shadow:0 18px 46px rgba(21,32,21,.12);
}
body.page-business-central .bc-visual figcaption{
  margin-top:12px;
  font-size:14px;
  line-height:1.45;
  color:#617061;
}
body.page-business-central .bc-visual figcaption span{
  color:#253425;
  font-weight:700;
  margin-right:7px;
}
@media(min-width:701px){
  body.page-business-central main > .pagehero + .section{
    padding-bottom:28px;
  }
  body.page-business-central .bc-visual-section + .section{
    padding-top:42px;
  }
}
@media(max-width:700px){
  body.page-business-central .bc-visual-section{
    padding-bottom:24px;
  }
  body.page-business-central .bc-visual img{
    border-radius:12px;
  }
  body.page-business-central .bc-visual figcaption{
    font-size:13px;
  }
}

/* V48 Business Central benefit-row alignment.
   Desktop only: give the three headings a consistent block height so the
   supporting copy starts on the same baseline. Page-scoped to BC only. */
@media(min-width:981px){
  body.page-business-central main > .pagehero + .section .cards > .card{
    display:grid;
    grid-template-rows:minmax(72px,auto) auto;
    align-content:start;
  }
  body.page-business-central main > .pagehero + .section .cards > .card h3{
    margin-top:12px;
    margin-bottom:10px;
  }
}

/* V50 Business Central benefit-row alignment.
   Corrects malformed V49 CSS and explicitly places each heading/description
   pair into shared desktop grid rows. */
@media(min-width:981px){
  body.page-business-central main > .pagehero + .section .cards{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    grid-template-rows:auto auto;
    column-gap:28px;
    row-gap:10px;
    align-items:start;
  }
  body.page-business-central main > .pagehero + .section .cards > .card{display:contents;}
  body.page-business-central main > .pagehero + .section .cards > .card:nth-child(1) h3{grid-column:1;grid-row:1;}
  body.page-business-central main > .pagehero + .section .cards > .card:nth-child(2) h3{grid-column:2;grid-row:1;}
  body.page-business-central main > .pagehero + .section .cards > .card:nth-child(3) h3{grid-column:3;grid-row:1;}
  body.page-business-central main > .pagehero + .section .cards > .card:nth-child(1) p{grid-column:1;grid-row:2;}
  body.page-business-central main > .pagehero + .section .cards > .card:nth-child(2) p{grid-column:2;grid-row:2;}
  body.page-business-central main > .pagehero + .section .cards > .card:nth-child(3) p{grid-column:3;grid-row:2;}
  body.page-business-central main > .pagehero + .section .cards > .card h3{margin:12px 0 0;}
  body.page-business-central main > .pagehero + .section .cards > .card p{margin:0;}
}

/* V51 dedicated tablet/mobile responsive audit.
   All rules are scoped below desktop navigation width; V50 desktop remains unchanged. */
@media(max-width:980px){
  header{overflow:visible}
  .nav{position:relative}
  .menu{
    border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:9px;
    padding:10px 14px;font:inherit;font-size:14px;font-weight:780;cursor:pointer;
  }
  .links.open{
    display:flex;position:absolute;top:70px;left:0;right:0;z-index:40;
    flex-direction:column;align-items:stretch;gap:0;margin:0;padding:10px;
    background:#fff;border:1px solid var(--line);border-radius:14px;
    box-shadow:0 18px 46px rgba(21,32,21,.14);
  }
  .links.open a{padding:11px 12px;border-radius:8px;font-size:14px}
  .links.open a:hover,.links.open a.active{background:var(--mint)}
  .hero-grid,.split{gap:46px}
  .cta{padding:38px 40px}
  .pagehero{padding-top:64px;padding-bottom:54px}
  .section{padding-top:78px;padding-bottom:78px}
  .foot{gap:34px}
}

@media(max-width:700px){
  .wrap{width:min(100% - 30px,1200px)}
  .nav{height:70px}
  .brand-logo{min-width:0}
  .brand-logo img{width:176px}
  .links.open{top:62px}
  .topnote{font-size:12px;line-height:1.4}
  .hero,.pagehero{padding-top:46px;padding-bottom:42px}
  .hero h1,.pagehero h1{font-size:clamp(38px,11.5vw,44px);line-height:1.04;margin-bottom:20px}
  .section{padding-top:58px;padding-bottom:58px}
  .section h2{font-size:clamp(31px,9vw,40px)}
  .section-intro{font-size:17px;margin-bottom:32px}
  .lead{font-size:17px;line-height:1.55}
  .actions{margin-top:24px}
  .actions .btn{min-height:46px}
  .cta{padding:28px 24px;border-radius:18px}
  .cta h2{font-size:30px;line-height:1.12}
  .cta .actions{display:grid;grid-template-columns:1fr;width:100%}
  .cta .btn{width:100%}
  .cards{gap:18px}
  .card{padding:20px 0}
  .feature{padding:24px 0}
  .quote{padding:26px 24px}
  .quote blockquote{font-size:19px}
  .promo-head{gap:12px;flex-wrap:wrap}
  .promo-body{padding:21px}
  .metric{font-size:34px}
  .compare{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .code{font-size:12px;padding:18px}
  .foot{gap:28px}
  footer{padding-top:48px}
  .footer-logo img{width:170px}
  .footer-legal{margin-top:32px;padding-top:24px}
  .legal-links{gap:12px}
  .cookie-banner{max-height:calc(100vh - 24px);overflow:auto;border-radius:16px}
  .cookie-dialog{max-height:calc(100vh - 48px);overflow:auto;border-radius:18px}
  body.page-business-central .bc-visual-section{padding-bottom:18px}
  body.page-business-central .bc-visual figcaption{margin-top:9px}
}

@media(max-width:420px){
  .hero h1,.pagehero h1{font-size:38px}
  .section h2{font-size:32px}
  .btn{padding:12px 16px}
  .actions:not(.cookie-actions){gap:9px}
  .microproof{gap:12px;margin-top:22px}
  .storyrow{grid-template-columns:44px 1fr;gap:13px}
  .storyicon{width:40px;height:40px}
  .cookie-actions{display:grid;grid-template-columns:1fr}
  .cookie-actions .btn{width:100%}
  .cookie-dialog-actions{display:grid;grid-template-columns:1fr}
  .cookie-dialog-actions .btn{width:100%}
}

/* V52 mobile visual deep-dive refinement.
   Based on full-page rendered screenshots. Desktop >= 981px remains V50/V51 unchanged. */
@media(max-width:700px){
  /* Shared phone rhythm: retain breathing room without desktop-sized vertical bands. */
  .section{padding-top:48px;padding-bottom:48px}
  .pagehero{padding-top:42px;padding-bottom:34px}
  .hero{padding-top:42px;padding-bottom:38px}
  .section-intro{margin-bottom:26px}
  footer{padding-top:42px}
  .foot{gap:24px}
  .foot h4{margin-bottom:11px}
  .foot a{margin:7px 0}
  .footer-legal{margin-top:26px;padding-top:20px}
  .copyright{margin-top:30px;padding-top:18px}

  /* Resources: remove the oversized blank bands visible between the hero and resource items. */
  body.page-resources .pagehero{padding-bottom:26px}
  body.page-resources main > .pagehero + .section{padding-top:18px;padding-bottom:42px}
  body.page-resources main > .pagehero + .section .cards{gap:0}
  body.page-resources main > .pagehero + .section .card{padding:22px 0 26px}
  body.page-resources main > .pagehero + .section .card + .card{border-top:1px solid var(--line)}
  body.page-resources main > .pagehero + .section .card h3{margin-top:0}
  body.page-resources main > .pagehero + .section .card .actions{margin-top:18px}
  body.page-resources main > .section.soft{padding-top:46px;padding-bottom:48px}
  body.page-resources .featured-guide{margin:24px 0 34px;padding:24px 20px}
  body.page-resources .coming-guides{margin-top:26px}
  body.page-resources .coming-guides .feature{padding:22px 0}

  /* Demo: keep the form comfortable but remove the large hero-to-form separation. */
  body.page-demo .pagehero{padding-bottom:30px}
  body.page-demo main > .pagehero + .section{padding-top:28px;padding-bottom:50px}
  body.page-demo main > .pagehero + .section .split{gap:34px}
  body.page-demo .form{gap:13px}

  /* About: long narrative page benefits from a slightly tighter cadence. */
  body.page-about main > .section:not(.hero){padding-top:44px;padding-bottom:44px}
  body.page-about .testimonial-grid{margin:26px 0}
  body.page-about .pedigree-grid{gap:24px}

  /* Text-led pages: light tightening only, preserving their already-good hierarchy. */
  body.page-product main > .section,
  body.page-developers main > .section,
  body.page-examples main > .section{padding-top:46px;padding-bottom:46px}
  body.page-retailers main > .section,
  body.page-partners main > .section,
  body.page-business-central main > .section{padding-top:48px;padding-bottom:48px}

  /* Keep approved visual transitions compact on phones. */
  body.page-retailers .retailers-visual-section,
  body.page-partners .partners-visual-section{padding-bottom:16px}
  body.page-retailers .retailers-visual-section + .section,
  body.page-partners .partners-visual-section + .section{padding-top:30px}
  body.page-business-central .bc-visual-section{padding-top:6px;padding-bottom:14px}
  body.page-business-central .bc-visual-section + .section{padding-top:38px}

  /* Legal pages: readable phone type and less wasted transition space. */
  .legal-hero{padding-top:38px;padding-bottom:28px}
  .legal-body{padding-top:28px;padding-bottom:46px}
  .legal-layout{gap:24px}
  .legal-toc{padding:18px;border-radius:15px}
  .legal-section{padding-bottom:24px;margin-bottom:26px}
  .legal-section h2{font-size:1.38rem!important;margin-bottom:12px!important}
  .legal-section p,.legal-section li{font-size:.96rem;line-height:1.66}

  /* Cookie controls: safe on short phone viewports. */
  .cookie-panel{padding:12px;align-items:flex-start;overflow:auto}
  .cookie-dialog{margin:auto 0;padding:22px 20px;max-height:none}
  .cookie-choice{padding:14px 0}
  .cookie-dialog-actions{margin-top:16px}
}

@media(min-width:701px) and (max-width:980px){
  /* Tablet pass: modest tightening only. */
  .section{padding-top:66px;padding-bottom:66px}
  .pagehero{padding-top:56px;padding-bottom:46px}
  body.page-resources main > .pagehero + .section{padding-top:38px}
  body.page-demo main > .pagehero + .section{padding-top:44px}
  footer{padding-top:54px}
}

/* V53 targeted mobile density correction.
   Resources only: remove accumulated outer padding while preserving typography and controls. */
@media(max-width:700px){
  body.page-resources .pagehero{padding-bottom:12px}
  body.page-resources main > .pagehero + .section{padding-top:6px;padding-bottom:28px}
  body.page-resources main > .pagehero + .section .cards > .card{padding:10px 0 16px}
  body.page-resources main > .pagehero + .section .cards > .card + .card{padding-top:18px}
  body.page-resources main > .pagehero + .section .card .actions{margin-top:14px}
  body.page-resources main > .section.soft{padding-top:38px;padding-bottom:40px}
  body.page-resources .featured-guide{margin:18px 0 26px;padding:22px 18px}
  body.page-resources .coming-guides{margin-top:20px}
  body.page-resources .coming-guides .feature{padding:18px 0}
}


/* V54 mobile system refinement.
   Uses the approved V53 Resources density as the benchmark while preserving
   page-specific hierarchy. Phone-only; desktop and tablet remain unchanged. */
@media(max-width:700px){
  /* Home: compact related narrative blocks; keep dark/colour changes as separators. */
  body.page-home .hero{padding-bottom:30px}
  body.page-home main > .section{padding-top:42px;padding-bottom:42px}
  body.page-home main > .section.brand-band{padding-top:40px;padding-bottom:40px}
  body.page-home main > .section.bestdeal{padding-top:44px;padding-bottom:44px}
  body.page-home main > .section.soft,
  body.page-home main > .section.mint{padding-top:40px;padding-bottom:40px}
  body.page-home .section-intro{margin-bottom:22px}

  /* About: reduce accumulated narrative gaps without crowding testimonials. */
  body.page-about .pagehero{padding-bottom:20px}
  body.page-about main > .section:not(.hero){padding-top:38px;padding-bottom:38px}
  body.page-about .testimonial-grid{margin:20px 0}
  body.page-about .quote{padding:22px 20px}
  body.page-about .pedigree-grid{gap:20px}

  /* Demo: objectives, explanatory copy and form should read as one task. */
  body.page-demo .pagehero{padding-bottom:18px}
  body.page-demo main > .pagehero + .section{padding-top:18px;padding-bottom:40px}
  body.page-demo main > .pagehero + .section .split{gap:26px}
  body.page-demo .section-intro{margin-bottom:20px}

  /* Product / Developers / Best Deal: already content-rich, modest tightening only. */
  body.page-product .pagehero,
  body.page-developers .pagehero,
  body.page-best-deal .pagehero{padding-bottom:24px}
  body.page-product main > .section,
  body.page-developers main > .section,
  body.page-best-deal main > .section{padding-top:40px;padding-bottom:40px}
  body.page-product .section-intro,
  body.page-developers .section-intro,
  body.page-best-deal .section-intro{margin-bottom:22px}

  /* Examples is intentionally dense: keep examples clearly separated but efficient. */
  body.page-examples .pagehero{padding-bottom:22px}
  body.page-examples main > .section{padding-top:38px;padding-bottom:38px}
  body.page-examples .feature{padding-top:20px;padding-bottom:20px}

  /* Retailers: protect the approved image, tighten the text groups around it. */
  body.page-retailers .pagehero{padding-bottom:24px}
  body.page-retailers main > .section{padding-top:42px;padding-bottom:42px}
  body.page-retailers .retailers-visual-section{padding-top:14px;padding-bottom:10px}
  body.page-retailers .retailers-visual-section + .section{padding-top:26px}
  body.page-retailers .feature{padding-top:20px;padding-bottom:20px}

  /* Partners: image and benefits belong together; later architecture remains distinct. */
  body.page-partners .pagehero{padding-bottom:24px}
  body.page-partners main > .section{padding-top:42px;padding-bottom:42px}
  body.page-partners .partners-visual-section{padding-top:14px;padding-bottom:8px}
  body.page-partners .partners-visual-section + .section{padding-top:24px;padding-bottom:36px}

  /* Business Central: benefits + product evidence are one story; preserve major section changes. */
  body.page-business-central .pagehero{padding-bottom:24px}
  body.page-business-central main > .section{padding-top:42px;padding-bottom:42px}
  body.page-business-central main > .pagehero + .section{padding-top:28px;padding-bottom:26px}
  body.page-business-central .bc-visual-section{padding-top:4px;padding-bottom:10px}
  body.page-business-central .bc-visual-section + .section{padding-top:34px}

  /* Resources is deliberately untouched here: V53 is the approved mobile benchmark. */
}

/* V55 desktop surgical final polish.
   Screenshot-led, page-scoped refinements only.
   Mobile/tablet rules and approved pages remain unchanged. */
@media(min-width:981px){
  /* About: reduce accumulated outer whitespace while preserving the bespoke
     two-column hero composition and all internal component spacing. */
  body.page-about main > .hero{
    padding-top:78px;
    padding-bottom:54px;
  }
  body.page-about main > .hero + .section{
    padding-top:34px;
    padding-bottom:44px;
  }
  body.page-about main > .section:not(.hero){
    padding-top:44px;
    padding-bottom:44px;
  }
  body.page-about main > .hero + .section{
    padding-top:34px;
  }

  /* Demo: hero proposition and enquiry task should read as one composition. */
  body.page-demo .pagehero{
    padding-bottom:10px;
  }
  body.page-demo main > .pagehero + .section{
    padding-top:10px;
    padding-bottom:46px;
  }

  /* Resources reviewed against V54 desktop capture: no further tightening.
     Its current rhythm is the desktop density benchmark. */
}

/* V56 About desktop hero alignment.
   Lift the supporting Our Focus proposition so it reads as the intentional
   second column of the hero rather than floating at the vertical midpoint. */
@media(min-width:981px){
  body.page-about main > .hero .hero-card{
    transform:translateY(-112px);
  }
}

/* V60 demo form success confirmation */
.demo-success{max-width:720px;padding:34px 36px;border:1px solid var(--line);border-radius:18px;background:var(--mint)}.demo-success:focus{outline:none}.demo-success .eyebrow{margin-bottom:12px}.demo-success h2{font-size:clamp(28px,3vw,38px);line-height:1.12;letter-spacing:-.025em;margin:0 0 18px}.demo-success p{color:var(--muted);margin:0 0 12px}.demo-success p:last-child{margin-bottom:0}@media(max-width:640px){.demo-success{padding:26px 24px}}

/* V61 scoped refinements */
body.page-about .pedigree-year{display:flex;align-items:center;gap:clamp(14px,2vw,28px);flex-wrap:wrap}
body.page-about .pedigree-year strong{font-size:clamp(52px,6vw,86px);line-height:1}
body.page-about .pedigree-year span{font-size:clamp(21px,2.2vw,30px);line-height:1.2;font-weight:750}
body.page-about .hero-card{align-self:start}
body.page-about .hero-card .eyebrow{margin-bottom:12px}
body.page-about .hero-card h2{margin-top:0;margin-bottom:16px}
body.page-about .hero-card p{margin-top:0}
body.page-examples .cta-band{padding-bottom:max(58px,5vw)}
body.page-partners .partners-integration-visual img{display:block;max-width:100%;height:auto}
@media(max-width:980px){body.page-partners .partners-visual-section,body.page-partners .partners-integration-visual{overflow:visible}body.page-partners .partners-integration-visual{margin-inline:auto;width:100%;max-width:100%;}body.page-partners .partners-integration-visual img{width:100%;height:auto;object-fit:contain;object-position:center}body.page-partners .partners-visual-section{padding-bottom:36px}body.page-about .hero-card{align-self:auto}}
@media(max-width:640px){body.page-examples .cta-band{padding-bottom:64px}body.page-partners .partners-visual-section{padding-bottom:42px}}

/* V62: scoped desktop alignment and CTA spacing refinements. No mobile rules changed. */
@media (min-width:981px){
  body.page-product .attribute-story > div,
  body.page-index .attribute-story > div,
  body.page-home .attribute-story > div {display:flex;flex-direction:column;}
  body.page-product .attribute-story > div > h3,
  body.page-index .attribute-story > div > h3,
  body.page-home .attribute-story > div > h3 {min-height:2.5em;}
  body.page-retailers .outcomes > .outcome > h3 {min-height:2.5em;}
  body.page-developers .cards > .card > h3 {min-height:2.5em;}
  body.page-examples .featuregrid > .feature {display:flex;flex-direction:column;}
  body.page-examples .featuregrid > .feature > .capabilities {margin-top:auto;}
  body.page-about .hero.subhero .hero-grid > .hero-card {align-self:center;}
  body.page-about .hero.subhero .hero-grid > div:first-child h1 {font-size:clamp(3rem,4.1vw,4.7rem);}
  body.page-about .cta-band {padding-bottom:76px;}
  body.page-examples .cta-band {padding-bottom:76px;}
}
@media (min-width:641px) and (max-width:980px){
  body.page-about .cta-band,body.page-examples .cta-band {padding-bottom:60px;}
}
@media (max-width:640px){
  body.page-about .cta-band,body.page-examples .cta-band {padding-bottom:48px;}
}


/* V63 responsive alignment fixes. Scoped to the affected components.
   Preserve approved text, images, colours, links, and form behaviour. */

/* Multi-column information cards: align copy below headings of varying length.
   Existing desktop V62 selector missed the actual cards' responsive layout. */
body.page-developers .cards > .card,
body.page-partners .cards > .card {
  display:flex;
  flex-direction:column;
}
@media(min-width:701px){
  body.page-developers .cards > .card > h3,
  body.page-partners .cards > .card > h3 {
    min-height:3.1em;
  }
}
@media(min-width:701px) and (max-width:980px){
  body.page-developers .cards > .card > h3,
  body.page-partners .cards > .card > h3 {min-height:4.5em;}
}
@media(max-width:700px){
  /* Narrow columns need a taller heading slot; a single column flows naturally. */
  body.page-developers .cards > .card > h3,
  body.page-partners .cards > .card > h3 {min-height:4.5em;}
}
@media(max-width:540px){
  body.page-developers .cards,
  body.page-partners .cards {grid-template-columns:1fr;}
  body.page-developers .cards > .card > h3,
  body.page-partners .cards > .card > h3 {min-height:0;}
}

/* Promotion examples: each side-by-side pair shares four grid tracks:
   category, heading, description and capabilities. This keeps dividers
   and capability text aligned without truncating or rewriting descriptions. */
body.page-examples .featuregrid {align-items:stretch;}
body.page-examples .featuregrid > .feature {
  display:grid;
  grid-template-rows:subgrid;
  grid-row:span 4;
  align-content:stretch;
  min-width:0;
}
body.page-examples .featuregrid > .feature > .capabilities {
  margin-top:0;
  align-self:start;
}
@media(max-width:600px){
  body.page-examples .featuregrid {grid-template-columns:minmax(0,1fr);}
  body.page-examples .featuregrid > .feature {
    grid-row:auto;
    grid-template-rows:auto auto auto auto;
  }
}

/* Testimonials: share quotation and attribution row heights while two-up.
   The two cards' author details and ratings then start at equal baselines. */
@media(min-width:801px){
  body.page-about .testimonial-grid > .testimonial.testimonial-light {
    display:grid;
    grid-template-rows:subgrid;
    grid-row:span 3;
    align-content:stretch;
  }
  body.page-about .testimonial-grid > .testimonial.testimonial-light > p {margin-bottom:0;}
  body.page-about .testimonial-grid > .testimonial.testimonial-light > footer {align-self:start;}
}
@media(min-width:601px) and (max-width:800px){
  body.page-about .testimonial-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
  body.page-about .testimonial-grid > .testimonial.testimonial-light {
    display:grid;
    grid-template-rows:subgrid;
    grid-row:span 3;
    align-content:stretch;
  }
  body.page-about .testimonial-grid > .testimonial.testimonial-light > p {margin-bottom:0;}
}
@media(max-width:600px){
  body.page-about .testimonial-grid {grid-template-columns:1fr;}
}

/* Promotion outcomes: retain three-up presentation on usable tablet widths;
   align descriptive copy even if an outcome title wraps. */
@media(min-width:701px) and (max-width:1100px){
  body.page-index .commercial-outcomes {grid-template-columns:repeat(3,minmax(0,1fr));}
  body.page-index .commercial-outcomes > div {min-width:0;}
  body.page-index .commercial-outcomes b {min-height:3.0em;}
}
@media(max-width:700px){
  body.page-index .commercial-outcomes {grid-template-columns:1fr;}
  body.page-index .commercial-outcomes b {min-height:0;}
}

/* Footer: brand is always first, and its top aligns with navigation headings.
   Reserve a modest area for future social links without adding fake icons. */
.foot {align-items:start;}
.foot > div:first-child {align-self:start;min-width:0;}
.foot > div:first-child .footer-logo {margin-top:0;}
.foot > div:first-child .footer-note {margin-top:14px;}
.foot > div:first-child::after {content:"";display:block;height:36px;}
@media(min-width:641px) and (max-width:1100px){
  .foot {grid-template-columns:minmax(210px,1.4fr) repeat(2,minmax(0,1fr));gap:26px 30px;}
  .foot > div:first-child {grid-row:1 / span 2;}
}
@media(max-width:640px){
  .foot {grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 22px;}
  .foot > div:first-child {grid-column:1 / -1;grid-row:auto;}
  .foot > div:first-child::after {height:28px;}
}
@media(max-width:420px){
  .foot {grid-template-columns:1fr;}
  .foot > div:first-child {grid-column:auto;}
}


/* V64 targeted responsive alignment. Keep existing visual tokens and content. */
/* Shared tracks across sibling items prevent individual heading wrapping from
   displacing the next row. At phone widths, each card flows independently. */
@media(min-width:641px){
  body.page-retailers .outcomes{align-items:stretch;}
  body.page-retailers .outcomes>.outcome{display:grid;grid-template-rows:subgrid;grid-row:span 3;min-width:0;}
  body.page-retailers .outcomes>.outcome>h3{min-height:0;margin:13px 0 11px;}
  body.page-retailers .outcomes>.outcome>p{align-self:start;}
  body.page-product .featuregrid>.feature{display:grid;grid-template-rows:subgrid;grid-row:span 2;min-width:0;}
  body.page-product .featuregrid>.feature>h3{margin:0 0 8px;}
  body.page-resources main>.pagehero+.section .cards>.card{display:grid;grid-template-rows:subgrid;grid-row:span 3;min-width:0;}
  body.page-resources main>.pagehero+.section .cards>.card .actions{align-self:end;margin-top:18px;}
}
@media(min-width:641px) and (max-width:980px){
  /* Four-up on landscape tablet; headings share a row via subgrid. */
  body.page-retailers .outcomes{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;}
  body.page-retailers .outcomes>.outcome{padding-right:0;}
}
@media(max-width:640px){
  body.page-retailers .outcomes>.outcome,body.page-product .featuregrid>.feature{display:block;}
}
/* Horizontal flow is too narrow at iPad sizes: switch both integration
   diagrams to vertical flow, with downward arrows and readable full-width cards. */
@media(min-width:901px) and (max-width:1100px){
  body.page-partners .integration-visual,body.page-developers .integration-visual{grid-template-columns:minmax(0,1fr);}
}
@media(max-width:1100px){
  body.page-partners .integration-visual .iv-arrow,
  body.page-developers .integration-visual .integration-arrow{transform:rotate(90deg);display:flex;align-items:center;justify-content:center;min-height:32px;}
  body.page-partners .integration-visual .iv-source,
  body.page-partners .integration-visual .iv-core,
  body.page-developers .integration-visual .integration-step,
  body.page-developers .integration-visual .integration-engine{min-width:0;text-align:center;align-items:center;justify-content:center;}
  body.page-partners .integration-visual .iv-source,body.page-partners .integration-visual .iv-core{display:flex;flex-direction:column;justify-content:center;align-items:center;}
  body.page-partners .integration-visual .iv-source b,body.page-partners .integration-visual .iv-source span{max-width:28rem;}
  body.page-developers .integration-visual .integration-step{min-height:135px;}
}
/* On the commerce diagram, change arrow orientation with the actual layout. */
@media(max-width:1100px){
  body.page-index .commerce-map-outcomes{grid-template-columns:minmax(0,1fr);}
  body.page-index .commerce-map-outcomes .map-flow strong{display:block;transform:rotate(90deg);transform-origin:center;}
}
/* Customer voices: share quote, attribution and rating rows while two-up. */
@media(min-width:701px){
  body.page-index .quotegrid{align-items:stretch;grid-template-columns:repeat(2,minmax(0,1fr));}
  body.page-index .quotegrid>.quote{display:grid;grid-template-rows:subgrid;grid-row:span 4;min-width:0;}
  body.page-index .quotegrid>.quote blockquote{margin:14px 0 24px;}
  body.page-index .quotegrid>.quote .recommend{justify-self:start;align-self:start;}
}
@media(max-width:700px){body.page-index .quotegrid{grid-template-columns:1fr;}}

/* V65: homepage flow uses page-home, not page-index.
   When the commerce map stacks, use an actual downward glyph. */
@media (max-width:1100px) {
  body.page-home .commerce-map-outcomes .map-flow strong {
    display:block;
    font-size:0;
    transform:none;
    line-height:1;
  }
  body.page-home .commerce-map-outcomes .map-flow strong::after {
    content:"↓";
    display:block;
    font-size:30px;
    line-height:1.2;
    color:#71963a;
  }
}

/* V66: switch to the existing accessible tablet menu before desktop
   navigation labels and the demo CTA run out of horizontal space.
   This is header-only and leaves all page layouts untouched. */
@media (min-width:981px) and (max-width:1360px) {
  header { overflow:visible; }
  header .nav { position:relative; }
  header .links { display:none; }
  header .menu {
    display:block; margin-left:auto; border:1px solid var(--line);
    background:#fff; color:var(--ink); border-radius:9px;
    padding:10px 14px; font:inherit; font-size:14px;
    font-weight:780; cursor:pointer;
  }
  header .nav>.primary { display:none; }
  header .links.open {
    display:flex; position:absolute; top:70px; left:0; right:0; z-index:40;
    flex-direction:column; align-items:stretch; gap:0; margin:0; padding:10px;
    background:#fff; border:1px solid var(--line); border-radius:14px;
    box-shadow:0 18px 46px rgba(21,32,21,.14);
  }
  header .links.open a {padding:11px 12px; border-radius:8px; font-size:14px; white-space:nowrap;}
  header .links.open a:hover, header .links.open a.active {background:var(--mint);}
  header .links.open a.active::after {display:none;}
}
@media (min-width:1361px) {
  header .links a, header .nav>.primary {white-space:nowrap;}
}
