:root{--ink:#172019;--ink-2:#273029;--muted:#667067;--cream:#f5f1e8;--paper:#fffaf3;--white:#fff;--line:#dedfd7;--lime:#c6f25b;--red:#f4383e;--soft-red:#ffe6e3;--max:1240px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif;margin:0}body.menu-open{overflow:hidden}a{color:inherit}.sr-only{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0)}h1,h2,h3{font-family:Manrope,sans-serif}.content-shell{margin:auto;max-width:var(--max);padding-left:32px;padding-right:32px}.site-header{align-items:center;background:rgba(255,250,243,.96);border-bottom:1px solid rgba(222,223,215,.7);display:flex;height:82px;justify-content:space-between;margin:auto;padding:0 max(26px,calc((100vw - 1320px)/2));position:sticky;top:0;z-index:50;backdrop-filter:blur(16px)}.brand{align-items:center;display:inline-flex;font-family:Manrope,sans-serif;font-size:24px;font-weight:800;gap:8px;letter-spacing:-.055em;text-decoration:none;white-space:nowrap}.brand>img{height:34px;object-fit:contain;width:24px}.brand>span>span{color:var(--red)}.desktop-nav{align-items:center;display:flex;gap:30px}.desktop-nav>a,.nav-group>button,.language-link{background:none;border:0;color:#4d574f;font:600 13px "DM Sans";padding:13px 0;text-decoration:none}.desktop-nav>a:hover,.desktop-nav>a.active,.nav-group>button:hover,.language-link:hover{color:var(--ink)}.nav-group{position:relative}.nav-group>button{cursor:pointer}.nav-group>button span{font-size:12px;margin-left:5px}.nav-menu{background:var(--white);border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 45px rgba(23,32,25,.12);display:grid;left:-22px;min-width:320px;opacity:0;padding:9px;pointer-events:none;position:absolute;top:45px;transform:translateY(-7px);transition:.18s ease;visibility:hidden}.nav-group:hover .nav-menu,.nav-group:focus-within .nav-menu{opacity:1;pointer-events:auto;transform:none;visibility:visible}.nav-menu a{border-radius:9px;display:flex;flex-direction:column;padding:13px;text-decoration:none}.nav-menu a:hover{background:var(--cream)}.nav-menu b{font:700 13px Manrope}.nav-menu small{color:var(--muted);font-size:11px;margin-top:3px}.header-actions{align-items:center;display:flex;gap:13px}.button{align-items:center;border-radius:999px;display:inline-flex;font-size:13px;font-weight:700;gap:14px;justify-content:center;padding:14px 20px;text-decoration:none;transition:background .18s ease,color .18s ease,transform .18s ease}.button:hover{transform:translateY(-2px)}.button-small{padding:10px 15px}.button-ghost{border:1px solid var(--line)}.button-ghost:hover{background:var(--cream)}.button-primary{background:var(--ink);color:white}.button-primary:hover{background:#303a32}.button-link{padding-left:4px;text-decoration:underline;text-underline-offset:5px}.button-bright{background:var(--lime);color:var(--ink)}.mobile-toggle,.mobile-menu{display:none}.hero{display:grid;grid-template-columns:.92fr 1.08fr;margin:auto;max-width:1440px;min-height:680px;overflow:hidden}.hero-copy{align-self:center;padding:75px 38px 85px max(32px,calc((100vw - 1300px)/2))}.eyebrow{align-items:center;color:#5d695d;display:flex;font-size:10px;font-weight:800;gap:9px;letter-spacing:.14em;margin-bottom:20px;text-transform:uppercase}.eyebrow>span{background:var(--red);border-radius:50%;height:7px;flex:0 0 7px}.hero h1,.page-hero h1{font-size:clamp(55px,5.5vw,84px);letter-spacing:-.072em;line-height:.97;margin:0}.hero h1 em{color:var(--red);display:block;font-style:normal}.hero-copy>p,.page-hero-copy>p{color:var(--muted);font-size:18px;line-height:1.65;margin:27px 0;max-width:620px}.hero-actions{align-items:center;display:flex;gap:15px}.hero-proof{border-top:1px solid var(--line);display:grid;gap:18px;grid-template-columns:repeat(3,1fr);margin-top:48px;padding-top:22px}.hero-proof div{display:flex;flex-direction:column}.hero-proof strong{font-size:12px}.hero-proof span{color:var(--muted);font-size:10px;margin-top:4px}.hero-product{align-items:center;background:#eee9df;display:flex;justify-content:center;min-width:0;overflow:hidden;padding:65px 0 65px 38px;position:relative}.product-orbit{border-radius:50%;position:absolute}.orbit-one{background:var(--lime);height:470px;right:-70px;top:60px;width:470px}.orbit-two{border:1px solid rgba(23,32,25,.15);height:620px;right:-60px;top:20px;width:620px}.dashboard-preview{background:#131914;border:7px solid #303833;border-radius:18px 0 0 18px;box-shadow:0 35px 80px rgba(23,32,25,.25);display:grid;grid-template-columns:58px 1fr;min-height:450px;overflow:hidden;position:relative;transform:rotate(-1.2deg);width:min(710px,100%);z-index:1}.preview-sidebar{align-items:center;background:#0c110d;display:flex;flex-direction:column;gap:24px;padding:17px 0}.preview-sidebar img{height:34px;margin-bottom:13px;object-fit:contain;width:23px}.preview-sidebar i{background:#68726b;border-radius:4px;height:14px;opacity:.35;width:14px}.preview-sidebar i.active{background:var(--lime);box-shadow:0 0 0 8px rgba(198,242,91,.1);opacity:1}.preview-main{color:white;min-width:0;padding:27px}.preview-top{align-items:center;display:flex;justify-content:space-between}.preview-top>div{display:flex;flex-direction:column}.preview-top small{color:#8f9a91;font-size:10px}.preview-top strong{font-size:17px}.status{background:rgba(198,242,91,.1);border:1px solid rgba(198,242,91,.2);border-radius:99px;color:var(--lime);font-size:8px;padding:7px 9px}.status i{background:var(--lime);border-radius:50%;display:inline-block;height:5px;margin-right:5px;width:5px}.metric-grid{display:grid;gap:11px;grid-template-columns:repeat(3,1fr);margin:27px 0 13px}.metric{background:#1b231d;border:1px solid #2b342d;border-radius:10px;display:flex;flex-direction:column;padding:15px}.metric.featured{background:var(--lime);color:#263713}.metric small{color:#8f9a91;font-size:8px}.metric.featured small,.metric.featured span{color:#526826}.metric strong{font-size:21px;margin:7px 0 3px;white-space:nowrap}.metric span{color:#8f9a91;font-size:7px}.preview-content{display:grid;gap:13px;grid-template-columns:1.1fr .9fr}.orders-card,.chart-card{background:#1b231d;border:1px solid #2b342d;border-radius:10px;padding:15px}.card-title{display:flex;font-size:8px;justify-content:space-between;margin-bottom:11px}.card-title span{color:#8f9a91}.order{align-items:center;border-top:1px solid #2b342d;display:grid;font-size:8px;gap:8px;grid-template-columns:auto 1fr auto;padding:11px 0}.order span{color:#8f9a91}.order em{background:rgba(255,194,73,.12);border-radius:99px;color:#ffc249;font-style:normal;padding:4px 6px}.order em.new{background:rgba(198,242,91,.12);color:var(--lime)}.bars{align-items:end;display:flex;gap:6px;height:120px}.bars i{background:#39433b;border-radius:3px 3px 0 0;flex:1;height:var(--h)}.bars i.today{background:var(--lime)}.days{color:#748077;display:flex;font-size:7px;justify-content:space-around;margin-top:6px}.order-notice{align-items:center;background:white;border:1px solid rgba(23,32,25,.08);border-radius:12px;bottom:75px;box-shadow:0 20px 40px rgba(23,32,25,.16);display:flex;gap:10px;left:18px;padding:11px 15px;position:absolute;z-index:2}.order-notice>span{align-items:center;background:var(--lime);border-radius:50%;display:flex;height:29px;justify-content:center;width:29px}.order-notice div{display:flex;flex-direction:column}.order-notice small{color:var(--muted);font-size:8px}.order-notice strong{font-size:11px}.trust-strip{align-items:center;background:var(--ink);color:white;display:flex;font-size:11px;font-weight:700;gap:34px;justify-content:center;letter-spacing:.04em;min-height:68px;padding:18px 30px;text-transform:uppercase}.trust-strip i{background:var(--red);border-radius:50%;height:5px;width:5px}.section-heading h2,.process h2,.payments-section h2,.final-cta h2,.detail-intro h2,.pricing-note h2{font-size:clamp(38px,4.2vw,60px);letter-spacing:-.057em;line-height:1.05;margin:0}.split-heading{align-items:end;display:grid;gap:80px;grid-template-columns:1.3fr .7fr}.split-heading>p,.centered-heading>p{color:var(--muted);font-size:17px;line-height:1.65;margin:0}.benefit-section{padding-bottom:115px;padding-top:115px}.benefit-grid{border:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr);margin-top:55px}.benefit-grid article{border-right:1px solid var(--line);min-height:255px;padding:28px}.benefit-grid article:last-child{border-right:0}.benefit-grid article>span,.detail-intro>span,.detail-grid article>span{color:#a0a9a1;font-size:10px;letter-spacing:.1em}.benefit-grid h3{font-size:20px;letter-spacing:-.04em;margin:78px 0 11px}.benefit-grid p,.solution-card p,.payments-section p,.detail-intro p,.detail-grid p,.integration-grid p,.pricing-grid p,.pricing-note p{color:var(--muted);font-size:14px;line-height:1.65;margin:0}.solutions-section{background:var(--cream);padding:110px 0}.centered-heading{margin:auto;max-width:700px;text-align:center}.centered-heading .eyebrow{justify-content:center}.centered-heading>p{margin:18px auto 0;max-width:560px}.solution-grid{display:grid;grid-template-columns:repeat(2,1fr);margin-top:55px}.solution-card{background:var(--paper);border:1px solid var(--line);min-height:350px;padding:32px;position:relative;text-decoration:none;transition:background .2s ease,transform .2s ease}.solution-card:nth-child(even){border-left:0}.solution-card:nth-child(n+3){border-top:0}.solution-card:hover{background:white;transform:translateY(-4px);z-index:2}.solution-card>span{color:#a0a9a1;font-size:10px}.solution-icon{align-items:center;background:var(--soft-red);border-radius:50%;display:flex;font-size:25px;height:55px;justify-content:center;margin:53px 0 25px;width:55px}.solution-card h3{font-size:25px;letter-spacing:-.04em;margin:0 0 10px}.solution-card p{max-width:450px}.solution-card b{bottom:30px;font-size:12px;position:absolute;text-decoration:underline;text-underline-offset:4px}.process{background:var(--ink);color:white;display:grid;gap:100px;grid-template-columns:1fr 1.15fr;padding:110px max(32px,calc((100vw - 1176px)/2))}.eyebrow-light{color:#aab2ab}.process ol{list-style:none;margin:0;padding:0}.process li{border-top:1px solid #3c463e;display:grid;gap:24px;grid-template-columns:auto 1fr;padding:25px 0}.process li>span{align-items:center;border:1px solid #536055;border-radius:50%;display:flex;font-size:11px;height:32px;justify-content:center;width:32px}.process li strong{font:700 17px Manrope}.process li p{color:#aab2ab;line-height:1.55;margin:7px 0 0}.payments-section{align-items:center;display:grid;gap:70px;grid-template-columns:1fr 1fr;padding-bottom:110px;padding-top:110px}.payments-section p{font-size:17px;margin-top:20px;max-width:550px}.payment-cloud{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}.payment-cloud span{background:white;border:1px solid var(--line);border-radius:12px;font-size:15px;font-weight:800;padding:20px 24px}.testimonial-section{background:var(--red);color:white;padding:95px max(32px,calc((100vw - 1000px)/2));text-align:center}.testimonial-section blockquote{font:700 clamp(28px,3.3vw,46px)/1.3 Manrope;margin:0}.testimonial-section>div{align-items:center;display:flex;gap:12px;justify-content:center;margin-top:30px}.testimonial-section>div span{opacity:.55}.page-hero{display:grid;grid-template-columns:1.25fr .75fr;margin:auto;max-width:1380px;min-height:540px}.page-hero-copy{align-self:center;padding:85px 70px 90px max(32px,calc((100vw - 1240px)/2))}.page-hero h1{max-width:820px}.page-hero-aside{background:var(--cream);display:flex;flex-direction:column;justify-content:flex-end;padding:55px}.aside-mark{align-items:center;background:var(--red);border-radius:50%;display:flex;height:70px;justify-content:center;margin-bottom:auto;width:70px}.aside-mark img{filter:brightness(0) invert(1);height:37px;object-fit:contain;width:26px}.page-hero-aside p{font:700 21px/1.45 Manrope;max-width:400px}.page-hero-aside>div:last-child{border-top:1px solid #d3d4cc;display:flex;flex-direction:column;gap:10px;padding-top:22px}.page-hero-aside>div:last-child span{font-size:11px;font-weight:700;text-transform:uppercase}.detail-section,.integration-section,.pricing-section,.faq-section,.contact-section{padding-bottom:115px;padding-top:115px}.detail-intro{display:grid;gap:35px;grid-template-columns:.15fr 1.05fr .8fr;margin-bottom:60px}.detail-intro p{font-size:16px;padding-top:8px}.detail-grid{border-left:1px solid var(--line);border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr)}.detail-grid article{border-bottom:1px solid var(--line);border-right:1px solid var(--line);min-height:290px;padding:28px}.detail-icon{align-items:center;background:var(--lime);border-radius:50%;display:flex;height:42px;justify-content:center;margin:38px 0 22px;width:42px}.detail-grid h3,.integration-grid h3{font-size:20px;letter-spacing:-.04em;margin:0 0 10px}.integration-grid{border-left:1px solid var(--line);border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr)}.integration-grid article{border-bottom:1px solid var(--line);border-right:1px solid var(--line);min-height:240px;padding:30px}.integration-grid article>div{align-items:center;background:var(--ink);border-radius:12px;color:white;display:flex;font:800 19px Manrope;height:48px;justify-content:center;margin-bottom:34px;width:48px}.pricing-grid{display:grid;grid-template-columns:repeat(4,1fr)}.pricing-grid article{background:white;border:1px solid var(--line);display:flex;flex-direction:column;min-height:555px;padding:28px;position:relative}.pricing-grid article+article{border-left:0}.pricing-grid .featured-plan{background:var(--cream);border-color:var(--ink)}.pricing-grid h2{font-size:22px;margin:13px 0 25px}.popular{background:var(--red);border-radius:99px;color:white;font-size:9px;font-weight:800;padding:6px 9px;position:absolute;right:18px;top:18px;text-transform:uppercase}.price{align-items:flex-end;display:flex;gap:5px;margin-bottom:22px}.price small{color:var(--muted);font-size:10px;margin-bottom:8px}.price strong{font:800 46px Manrope;letter-spacing:-.06em;line-height:1}.price span{font-size:10px;margin-bottom:7px}.pricing-grid ul{border-top:1px solid var(--line);list-style:none;margin:27px 0;padding:22px 0}.pricing-grid li{font-size:12px;margin:13px 0;padding-left:18px;position:relative}.pricing-grid li:before{color:var(--red);content:"✓";left:0;position:absolute}.pricing-grid .button{margin-top:auto}.pricing-note{align-items:center;background:var(--ink);color:white;display:grid;gap:35px;grid-template-columns:1fr 1fr;margin-top:45px;padding:45px}.pricing-note p{color:#b4bcb5}.pricing-note small{color:#8e9990;grid-column:2}.faq-section{max-width:1000px}.faq-list{border-top:1px solid var(--line)}.faq-list details{border-bottom:1px solid var(--line)}.faq-list summary{align-items:center;cursor:pointer;display:grid;font:700 20px Manrope;gap:22px;grid-template-columns:35px 1fr auto;list-style:none;padding:27px 5px}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary span{color:#9da69e;font:500 10px "DM Sans"}.faq-list summary i{font-style:normal;font-weight:400;transition:transform .2s}.faq-list details[open] summary i{transform:rotate(45deg)}.faq-list details p{color:var(--muted);font-size:16px;line-height:1.7;margin:0 60px 28px}.contact-grid{display:grid;grid-template-columns:repeat(3,1fr)}.contact-grid article{border:1px solid var(--line);min-height:360px;padding:35px}.contact-grid article+article{border-left:0}.contact-icon{align-items:center;background:var(--soft-red);border-radius:50%;display:flex;font-size:20px;height:50px;justify-content:center;margin-bottom:70px;width:50px}.contact-grid h2{font-size:24px;margin:0 0 12px}.contact-grid p{color:var(--muted);line-height:1.65;min-height:80px}.contact-grid a{font-size:13px;font-weight:800;text-decoration:underline;text-underline-offset:5px}.company-line{align-items:center;background:var(--cream);display:flex;justify-content:space-between;margin-top:35px;padding:30px}.company-line>div{display:flex;flex-direction:column}.company-line span,.company-line p{color:var(--muted);font-size:12px}.final-cta{align-items:end;background:var(--ink);color:white;display:grid;gap:80px;grid-template-columns:1.2fr .8fr;padding:90px max(32px,calc((100vw - 1176px)/2))}.final-cta p{color:#aab2ab;font-size:16px;line-height:1.6;max-width:620px}.final-cta>div:last-child{align-items:flex-start;display:flex;flex-direction:column;gap:20px}.final-cta>div:last-child>a:last-child{color:#bbc2bc;font-size:12px}.site-footer{background:#0c110d;color:white;display:grid;gap:65px;grid-template-columns:1.4fr repeat(3,1fr);padding:65px max(32px,calc((100vw - 1176px)/2)) 25px}.brand-light{color:white}.brand-light img{filter:none}.footer-brand p{color:#89928b;font-size:13px;margin-top:22px;max-width:230px}.site-footer>div:not(.footer-brand):not(.footer-bottom){display:flex;flex-direction:column;gap:11px}.site-footer strong{font-size:11px;margin-bottom:7px;text-transform:uppercase}.site-footer a,.site-footer span{color:#9ca59e;font-size:12px;text-decoration:none}.site-footer a:hover{color:white}.footer-bottom{border-top:1px solid #2d352f;display:flex;grid-column:1/-1;justify-content:space-between;padding-top:24px}
@media(max-width:1050px){.desktop-nav{gap:18px}.desktop-only{display:none}.hero{grid-template-columns:1fr}.hero-copy{padding:75px 32px}.hero-product{min-height:570px}.split-heading{gap:35px}.benefit-grid{grid-template-columns:repeat(2,1fr)}.benefit-grid article:nth-child(2){border-right:0}.benefit-grid article:nth-child(-n+2){border-bottom:1px solid var(--line)}.process{gap:55px}.page-hero{grid-template-columns:1fr}.page-hero-aside{min-height:330px}.aside-mark{margin-bottom:45px}.detail-intro{grid-template-columns:45px 1fr}.detail-intro p{grid-column:2}.detail-grid,.integration-grid{grid-template-columns:repeat(2,1fr)}.pricing-grid{grid-template-columns:repeat(2,1fr)}.pricing-grid article:nth-child(3){border-left:1px solid var(--line)}.pricing-grid article:nth-child(n+3){border-top:0}.site-footer{grid-template-columns:1.5fr repeat(3,1fr)}}
@media(max-width:760px){.site-header{height:70px;padding:0 18px}.brand{font-size:21px}.brand>img{height:30px;width:21px}.desktop-nav,.language-link{display:none}.mobile-toggle{background:none;border:0;display:flex;flex-direction:column;gap:6px;padding:10px 3px}.mobile-toggle i{background:var(--ink);height:2px;width:23px}.mobile-menu{background:var(--paper);display:flex;flex-direction:column;height:calc(100vh - 70px);left:0;opacity:0;padding:25px 20px;pointer-events:none;position:fixed;right:0;top:70px;transform:translateY(-10px);transition:.2s;visibility:hidden}.mobile-menu.is-open{opacity:1;pointer-events:auto;transform:none;visibility:visible}.mobile-menu a{border-bottom:1px solid var(--line);font:700 21px Manrope;padding:15px 4px;text-decoration:none}.content-shell{padding-left:20px;padding-right:20px}.hero-copy{padding:58px 20px 62px}.hero h1,.page-hero h1{font-size:49px}.hero-copy>p,.page-hero-copy>p{font-size:16px}.hero-actions{align-items:stretch;flex-direction:column}.hero-proof{gap:12px;margin-top:38px}.hero-product{min-height:450px;padding:35px 0 35px 18px}.orbit-one{height:330px;width:330px}.orbit-two{height:420px;width:420px}.dashboard-preview{grid-template-columns:45px 1fr;min-height:350px;transform:none}.preview-sidebar{gap:18px}.preview-main{padding:17px 12px}.metric-grid{grid-template-columns:1fr 1fr}.metric:last-child{display:none}.preview-content{grid-template-columns:1fr}.chart-card{display:none}.order-notice{bottom:36px}.trust-strip{align-items:flex-start;flex-direction:column;gap:10px;padding:22px 20px}.trust-strip i{display:none}.section-heading h2,.process h2,.payments-section h2,.final-cta h2,.detail-intro h2,.pricing-note h2{font-size:38px}.benefit-section,.detail-section,.integration-section,.pricing-section,.faq-section,.contact-section{padding-bottom:75px;padding-top:75px}.split-heading{align-items:start;grid-template-columns:1fr}.benefit-grid{grid-template-columns:1fr;margin-top:38px}.benefit-grid article{border-bottom:1px solid var(--line)!important;border-right:0;min-height:220px}.benefit-grid article:last-child{border-bottom:0!important}.benefit-grid h3{margin-top:50px}.solutions-section{padding:75px 0}.solution-grid{grid-template-columns:1fr}.solution-card{border:1px solid var(--line)!important;min-height:320px}.solution-card+article,.solution-card+a{border-top:0!important}.process{grid-template-columns:1fr;padding:75px 20px}.payments-section{gap:40px;grid-template-columns:1fr;padding-bottom:75px;padding-top:75px}.payment-cloud{justify-content:flex-start}.payment-cloud span{padding:15px 17px}.testimonial-section{padding:70px 20px}.page-hero-copy{padding:58px 20px 65px}.page-hero-aside{min-height:300px;padding:35px}.detail-intro{gap:18px;grid-template-columns:1fr}.detail-intro p{grid-column:auto}.detail-grid,.integration-grid,.pricing-grid,.contact-grid{grid-template-columns:1fr}.detail-grid article,.integration-grid article{min-height:240px}.pricing-grid article{border:1px solid var(--line)!important;min-height:520px}.pricing-grid article+article{border-top:0!important}.pricing-note{align-items:start;grid-template-columns:1fr;padding:30px}.pricing-note small{grid-column:auto}.faq-list summary{font-size:16px;gap:12px;grid-template-columns:26px 1fr auto}.faq-list details p{font-size:14px;margin:0 35px 24px}.contact-grid article{border:1px solid var(--line)!important;min-height:310px}.contact-grid article+article{border-top:0!important}.contact-icon{margin-bottom:45px}.company-line{align-items:flex-start;flex-direction:column}.final-cta{align-items:start;gap:40px;grid-template-columns:1fr;padding:70px 20px}.site-footer{gap:38px;grid-template-columns:1fr 1fr;padding:55px 20px 25px}.footer-brand{grid-column:1/-1}.footer-contact{grid-column:1/-1}.footer-bottom{align-items:flex-start;flex-direction:column;gap:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button,.solution-card,.nav-menu{transition:none}}

/* Faithful media migration from the original FoodlyOn site. */
.brand>img.brand-logo{height:33px;object-fit:contain;object-position:left center;width:126px}
.hero-photo{padding:0}
.hero-photo>img{height:100%;left:0;object-fit:cover;position:absolute;top:0;width:100%}
.hero-photo:after{background:linear-gradient(180deg,transparent 50%,rgba(10,15,11,.3));content:"";inset:0;position:absolute}
.hero-photo-badge{align-items:center;background:white;border-radius:14px;bottom:34px;box-shadow:0 18px 45px rgba(23,32,25,.2);display:flex;gap:12px;left:34px;padding:14px 17px;position:absolute;z-index:2}
.hero-photo-badge>span{align-items:center;background:var(--lime);border-radius:50%;display:flex;height:32px;justify-content:center;width:32px}
.hero-photo-badge>div{display:flex;flex-direction:column}.hero-photo-badge small{color:var(--muted);font-size:9px}.hero-photo-badge strong{font:700 13px Manrope}
.media-story{align-items:stretch;display:grid;grid-template-columns:1fr 1fr;padding-bottom:115px}
.media-story-image img{height:100%;min-height:520px;object-fit:cover;width:100%}
.media-story-copy{background:var(--soft-red);display:flex;flex-direction:column;justify-content:center;padding:65px}
.media-story-copy h2,.video-story h2,.page-media-panel h2{font-size:clamp(34px,3.7vw,54px);letter-spacing:-.055em;line-height:1.07;margin:0}
.media-story-copy p,.video-story p,.page-media-panel p{color:var(--muted);font-size:16px;line-height:1.7;margin:22px 0 28px}.media-story-copy .button{align-self:flex-start}
.solution-card{display:grid;grid-template-columns:.82fr 1.18fr;overflow:hidden;padding:0}
.solution-card>img{height:100%;min-height:350px;object-fit:cover;width:100%}
.solution-card-content{display:flex;flex-direction:column;padding:32px}.solution-card-content>span{color:#a0a9a1;font-size:10px}
.solution-card h3{margin-top:70px}.solution-card b{bottom:auto;margin-top:auto;padding-top:30px;position:static}
.video-story{background:#0c110d;display:grid;grid-template-columns:1.15fr .85fr;min-height:640px}
.video-story video{height:100%;max-height:720px;object-fit:cover;width:100%}
.video-story>div{align-self:center;color:white;padding:70px}.video-story p{color:#aab2ab}.video-story .button{display:inline-flex}
.payment-cloud span{align-items:center;display:flex;height:76px;justify-content:center;padding:18px 22px;width:142px}
.payment-cloud img{max-height:34px;max-width:96px;width:auto}
.page-hero-image{min-height:540px;overflow:hidden;padding:0;position:relative}
.page-hero-image>img{height:100%;inset:0;object-fit:cover;position:absolute;width:100%}
.page-hero-image:after{background:linear-gradient(180deg,transparent 42%,rgba(7,10,8,.72));content:"";inset:0;position:absolute}
.page-image-caption{bottom:0;color:white;padding:36px;position:absolute;z-index:2}.page-image-caption p{font:700 20px/1.4 Manrope;margin:0 0 10px}.page-image-caption span{color:#d4d9d5;font-size:11px;font-weight:800;text-transform:uppercase}
.page-media-panel{display:grid;grid-template-columns:1.1fr .9fr;margin-top:65px}.page-media-image{min-height:480px;position:relative}.page-media-image>img:first-child{height:100%;inset:0;object-fit:cover;position:absolute;width:100%}.orderpad-cutout{bottom:18px;filter:drop-shadow(0 22px 24px rgba(0,0,0,.24));height:78%;object-fit:contain;position:absolute;right:-4%;width:42%;z-index:2}
.page-media-panel>div{background:var(--cream);display:flex;flex-direction:column;justify-content:center;padding:60px}.page-media-panel>div>span{color:var(--red);font-size:10px;font-weight:800;letter-spacing:.14em;margin-bottom:20px;text-transform:uppercase}
.page-media-panel>.page-media-image{background:#dedbd4;padding:0}.integration-grid article>div.integration-logo{align-items:center;background:white;border:1px solid var(--line);border-radius:12px;display:flex;height:64px;justify-content:center;margin-bottom:34px;width:112px}.integration-grid .integration-logo img{max-height:38px;max-width:84px;width:auto}

@media(max-width:1050px){.solution-card{grid-template-columns:1fr}.solution-card>img{height:230px;min-height:230px}.solution-card h3{margin-top:35px}.video-story{grid-template-columns:1fr}.video-story video{max-height:560px}.page-media-panel{grid-template-columns:1fr}}
@media(max-width:760px){.brand>img.brand-logo{height:28px;width:108px}.hero-photo{min-height:430px}.hero-photo-badge{bottom:18px;left:18px;right:18px}.media-story{grid-template-columns:1fr;padding-bottom:75px}.media-story-image img{min-height:330px}.media-story-copy{padding:38px 28px}.solution-card{min-height:0}.solution-card>img{height:210px;min-height:210px}.solution-card-content{min-height:300px}.solution-card h3{margin-top:35px}.video-story{min-height:0}.video-story video{height:420px}.video-story>div{padding:50px 20px}.page-hero-image{min-height:400px}.page-media-image{min-height:350px}.orderpad-cutout{height:72%;right:0}.page-media-panel>div{padding:38px 28px}}
/* Prevent intrinsic image and video sizes from widening hero grid tracks. */
html,body{max-width:100%}
body{overflow-x:clip}
.hero,.page-hero,.video-story,.media-story,.page-media-panel{max-width:100%;min-width:0;width:100%}
.hero-copy,.hero-product,.page-hero-copy,.page-hero-aside,.video-story>*,.media-story>*,.page-media-panel>*{max-width:100%;min-width:0}
.hero-photo>img,.page-hero-image>img,.video-story video,.media-story img,.page-media-image img{max-width:100%}
.hero h1,.page-hero h1{max-width:100%;overflow-wrap:break-word}
.hero-subtitle{color:var(--red);font-size:clamp(25px,2.6vw,38px);letter-spacing:-.045em;line-height:1.12;margin:16px 0 0;max-width:660px}
.legal-section{padding-bottom:115px;padding-top:90px}.legal-notice{background:var(--cream);border-left:4px solid var(--red);color:var(--muted);font-size:13px;margin-bottom:45px;padding:18px 22px}.legal-copy{margin:auto;max-width:900px}.legal-copy h1{font-size:42px;letter-spacing:-.05em;margin:0 0 35px}.legal-copy h2{font-size:28px;letter-spacing:-.04em;margin:52px 0 18px}.legal-copy h3{font-size:21px;margin:38px 0 15px}.legal-copy p,.legal-copy li{color:#4f5951;font-size:15px;line-height:1.78}.legal-copy ul,.legal-copy ol{padding-left:22px}
@media(max-width:760px){.hero,.page-hero{display:block}.page-hero-copy,.page-hero-aside{width:100%}.page-hero-image{display:block}.video-story,.media-story,.page-media-panel{display:block}.orderpad-cutout{max-width:44%}.legal-section{padding-bottom:75px;padding-top:65px}.legal-copy h1{font-size:34px}.legal-copy h2{font-size:24px}}
.newsletter-section{align-items:center;background:var(--ink);color:white;display:grid;gap:80px;grid-template-columns:1fr 1fr;padding:85px max(32px,calc((100vw - 1176px)/2))}.newsletter-section h2,.enquiry-panel h2{font-size:clamp(34px,3.7vw,52px);letter-spacing:-.055em;line-height:1.08;margin:0}.newsletter-section form{display:grid;gap:13px;grid-template-columns:1fr auto}.newsletter-section label:first-of-type{grid-column:1}.newsletter-section .consent{grid-column:1/-1}.newsletter-section button{grid-column:2;grid-row:1}.newsletter-section label>span,.enquiry-panel label>span{display:block;font-size:11px;font-weight:700;margin-bottom:7px}.newsletter-section input[type=email],.enquiry-panel input:not([type=checkbox]){background:white;border:1px solid var(--line);border-radius:10px;font:500 15px "DM Sans";height:50px;outline:none;padding:0 15px;width:100%}.newsletter-section input:focus,.enquiry-panel input:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(244,56,62,.1)}.consent{align-items:flex-start;display:flex;gap:9px}.consent input{accent-color:var(--red);margin-top:2px}.consent span{color:#aab2ab!important;font-size:10px!important;font-weight:500!important;line-height:1.45;margin:0!important}.form-honeypot{height:1px!important;left:-9999px;opacity:0;position:absolute;width:1px!important}.enquiry-panel{background:var(--cream);display:grid;gap:70px;grid-template-columns:.85fr 1.15fr;margin-top:45px;padding:60px}.enquiry-panel>div>p{color:var(--muted);line-height:1.65}.enquiry-panel form{display:grid;gap:16px;grid-template-columns:1fr 1fr}.form-wide{grid-column:1/-1}.enquiry-panel button{border:0;cursor:pointer;width:100%}.form-message{border-radius:8px;font-size:12px;margin:0;padding:12px}.form-message.success{background:#e4f5d2;color:#31530f}.form-message.error{background:#ffe1dd;color:#8f211e}
@media(max-width:760px){.newsletter-section{gap:38px;grid-template-columns:1fr;padding:65px 20px}.newsletter-section form{grid-template-columns:1fr}.newsletter-section label:first-of-type,.newsletter-section button,.newsletter-section .consent{grid-column:1;grid-row:auto}.enquiry-panel{gap:38px;grid-template-columns:1fr;margin-top:30px;padding:38px 22px}.enquiry-panel form{grid-template-columns:1fr}.form-wide{grid-column:1}}
.all-features{border:1px solid var(--line);display:grid;grid-template-columns:.72fr 1.28fr;margin-top:45px}.all-features>div{background:var(--cream);padding:42px}.all-features>div>span{color:var(--red);font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.all-features h2{font-size:32px;letter-spacing:-.05em;margin:18px 0 13px}.all-features p{color:var(--muted);font-size:13px;line-height:1.6}.all-features ul{display:grid;grid-template-columns:1fr 1fr;list-style:none;margin:0;padding:28px 36px}.all-features li{border-bottom:1px solid var(--line);font-size:12px;padding:14px 8px 14px 25px;position:relative}.all-features li:before{color:var(--red);content:"✓";left:5px;position:absolute}@media(max-width:760px){.all-features{grid-template-columns:1fr}.all-features>div{padding:32px 24px}.all-features ul{grid-template-columns:1fr;padding:20px}}

/* Keep every marketing hero on the same centred grid with equal side gutters. */
.hero,.page-hero{max-width:var(--max);padding-left:32px;padding-right:32px}
.hero-copy{padding:75px 52px 85px 0}
.page-hero-copy{padding:85px 70px 90px 0}
@media(max-width:1050px){.hero-copy,.page-hero-copy{padding-left:0;padding-right:0}.hero-product,.page-hero-aside{margin-left:0;margin-right:0}}
@media(max-width:760px){.hero,.page-hero{padding-left:20px;padding-right:20px}.hero-copy{padding:58px 0 62px}.page-hero-copy{padding:58px 0 65px}.hero-product,.page-hero-aside{width:100%}}

.integration-more{display:inline-block;font-size:12px;font-weight:800;margin-top:24px;text-decoration:underline;text-underline-offset:5px}
.integration-detail-hero{background:var(--cream)}
.page-hero-image.integration-detail-hero>img{inset:15%;height:70%;object-fit:contain;width:70%}
.page-hero-image.integration-detail-hero:after{background:linear-gradient(180deg,transparent 55%,rgba(7,10,8,.7))}
.migrated-details{padding-bottom:115px}.migrated-details>.section-heading{max-width:720px}.migrated-detail-grid{border-left:1px solid var(--line);border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(2,1fr);margin-top:42px}.migrated-detail-grid article{border-bottom:1px solid var(--line);border-right:1px solid var(--line);padding:34px}.migrated-detail-grid h3{font-size:21px;letter-spacing:-.04em;margin:0 0 12px}.migrated-detail-grid p{color:var(--muted);font-size:14px;line-height:1.7;margin:0}@media(max-width:760px){.migrated-details{padding-bottom:75px}.migrated-detail-grid{grid-template-columns:1fr}.migrated-detail-grid article{padding:26px}}
.skip-link{background:var(--ink);color:white;font-size:13px;font-weight:800;left:16px;padding:12px 16px;position:fixed;top:12px;transform:translateY(-150%);z-index:100}.skip-link:focus{transform:none}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--lime);outline-offset:3px}
.preview-bar{align-items:center;background:#171b24;color:white;display:flex;font-size:11px;gap:16px;justify-content:center;min-height:42px;padding:8px 20px;position:relative;z-index:80}.preview-bar strong{color:#c6f25b}.preview-bar span{color:#aeb7af}.preview-bar a{color:white;font-weight:800;margin-left:12px}@media(max-width:760px){.preview-bar{align-items:flex-start;flex-direction:column;gap:3px}.preview-bar a{margin-left:0}.page-home .preview-bar+.skip-link+.site-header{top:0}}

/* 2026 visual foundation: solid, editorial and shared with the webshop. */
body {
    background: var(--paper);
    line-height: 1.5;
}

.content-shell {
    padding-left: var(--gutter);
    padding-right: var(--gutter);
}

.site-header {
    background: var(--paper);
    backdrop-filter: none;
    border-bottom-color: var(--line);
    height: 76px;
    padding-left: max(var(--gutter), calc((100vw - var(--max)) / 2));
    padding-right: max(var(--gutter), calc((100vw - var(--max)) / 2));
}

.desktop-nav {
    gap: clamp(18px, 2.2vw, 30px);
}

.desktop-nav > a,
.nav-group > button,
.language-link {
    color: var(--muted);
    position: relative;
}

.desktop-nav > a::after,
.nav-group > button::after {
    background: var(--red);
    bottom: 3px;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 180ms ease;
    width: 100%;
}

.desktop-nav > a:hover::after,
.desktop-nav > a.active::after,
.nav-group > button:hover::after,
.nav-group > button.active::after {
    transform: scaleX(1);
}

.nav-menu {
    border-radius: var(--radius-medium);
    box-shadow: var(--shadow-floating);
    padding: 8px;
}

.nav-menu a {
    border-radius: var(--radius-small);
    padding: 14px;
}

.button {
    border-radius: 10px;
    min-height: 46px;
    padding: 13px 19px;
    transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

.button:hover {
    transform: none;
}

.button-small {
    min-height: 40px;
    padding: 9px 14px;
}

.button-primary {
    background: var(--red);
    color: var(--white);
}

.button-primary:hover {
    background: var(--red-dark);
}

.button-ghost {
    background: transparent;
    border-color: var(--line-strong);
}

.button-link {
    min-height: auto;
    padding-left: 6px;
    padding-right: 6px;
    text-decoration-color: var(--line-strong);
}

.hero {
    gap: clamp(40px, 5vw, 76px);
    grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr);
    min-height: 650px;
    padding-left: var(--gutter);
    padding-right: var(--gutter);
}

.hero-copy {
    padding: clamp(72px, 8vw, 108px) 0;
}

.hero h1 {
    font-size: clamp(56px, 5.8vw, 86px);
    letter-spacing: -.068em;
    line-height: .96;
    max-width: 760px;
}

.hero h1 span,
.hero h1 em {
    display: block;
}

.hero h1 em {
    color: var(--red);
    font-size: .48em;
    letter-spacing: -.045em;
    line-height: 1.14;
    margin-top: 18px;
    max-width: 690px;
}

.hero-copy > p {
    font-size: 17px;
    line-height: 1.7;
    margin: 28px 0 30px;
    max-width: 58ch;
}

.hero-actions {
    gap: 12px;
}

.hero-proof {
    gap: 22px;
    margin-top: 44px;
    padding-top: 20px;
}

.hero-proof strong {
    font-size: 12px;
}

.hero-proof span {
    font-size: 10px;
    line-height: 1.45;
}

.hero-photo {
    align-self: center;
    border: 1px solid var(--line);
    border-radius: var(--radius-large);
    height: 570px;
    min-height: 0;
}

.hero-photo::after {
    background: linear-gradient(180deg, transparent 68%, rgba(10, 15, 11, .18));
}

.hero-photo-badge {
    border: 1px solid var(--line);
    border-radius: var(--radius-medium);
    bottom: 24px;
    box-shadow: none;
    left: 24px;
}

.trust-strip {
    background: var(--white);
    border-bottom: 1px solid var(--line);
    border-top: 1px solid var(--line);
    color: var(--ink);
    display: block;
    min-height: 0;
    padding: 0 var(--gutter);
}

.trust-strip-inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin: auto;
    max-width: var(--max);
}

.trust-strip-inner > span {
    align-items: center;
    border-right: 1px solid var(--line);
    display: flex;
    gap: 10px;
    justify-content: center;
    min-height: 72px;
    padding: 16px;
}

.trust-strip-inner > span:first-child {
    border-left: 1px solid var(--line);
}

.trust-strip-inner i {
    align-items: center;
    background: var(--lime);
    border-radius: 50%;
    color: var(--ink);
    display: inline-flex;
    flex: 0 0 24px;
    font-size: 11px;
    font-style: normal;
    height: 24px;
    justify-content: center;
    width: 24px;
}

.benefit-section {
    padding-bottom: var(--section-space);
    padding-top: var(--section-space);
}

.section-heading h2,
.process h2,
.payments-section h2,
.final-cta h2,
.detail-intro h2,
.pricing-note h2 {
    font-size: clamp(38px, 4.2vw, 58px);
}

.benefit-grid {
    border: 0;
    gap: 14px;
}

.benefit-grid article {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius-medium);
    min-height: 250px;
    padding: 26px;
}

.benefit-grid article:last-child {
    border-right: 1px solid var(--line);
}

.benefit-grid article > span {
    color: var(--red);
    font-weight: 800;
}

.benefit-grid h3 {
    margin-top: 54px;
}

.media-story {
    border: 1px solid var(--line);
    border-radius: var(--radius-large);
    grid-template-columns: 1.08fr .92fr;
    margin-bottom: var(--section-space);
    overflow: hidden;
    padding-bottom: 0;
}

.media-story-copy {
    background: var(--cream);
    padding: clamp(38px, 5vw, 68px);
}

.media-story-image img {
    min-height: 560px;
}

.solutions-section {
    background: var(--cream);
    padding: var(--section-space) 0;
}

.solution-grid {
    gap: 16px;
}

.solution-card,
.solution-card:nth-child(even),
.solution-card:nth-child(n + 3) {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius-medium);
}

.solution-card:hover {
    background: var(--white);
    border-color: var(--line-strong);
    transform: none;
}

.solution-card > img {
    min-height: 330px;
}

.video-story {
    border-radius: var(--radius-large);
    margin: var(--section-space) auto;
    max-width: var(--max);
    min-height: 600px;
    overflow: hidden;
    width: calc(100% - (var(--gutter) * 2));
}

.video-story > div {
    padding: clamp(42px, 5vw, 70px);
}

.process {
    padding-bottom: var(--section-space);
    padding-top: var(--section-space);
}

.payments-section {
    padding-bottom: var(--section-space);
    padding-top: var(--section-space);
}

.payment-cloud span {
    border-radius: var(--radius-medium);
}

.newsletter-section {
    padding-bottom: clamp(68px, 7vw, 90px);
    padding-top: clamp(68px, 7vw, 90px);
}

.newsletter-section input[type="email"],
.enquiry-panel input:not([type="checkbox"]) {
    border-radius: var(--radius-small);
}

.testimonial-section {
    background: var(--paper);
    border-bottom: 1px solid var(--line);
    color: var(--ink);
    padding-bottom: var(--section-space);
    padding-top: var(--section-space);
}

.testimonial-section blockquote {
    margin-left: auto;
    margin-right: auto;
    max-width: 1000px;
}

.testimonial-section > div span {
    color: var(--red);
    opacity: 1;
}

.final-cta {
    padding-bottom: clamp(72px, 8vw, 100px);
    padding-top: clamp(72px, 8vw, 100px);
}

.site-footer {
    padding-left: max(var(--gutter), calc((100vw - var(--max)) / 2));
    padding-right: max(var(--gutter), calc((100vw - var(--max)) / 2));
}

@media (max-width: 1050px) {
    .hero {
        gap: 0;
        grid-template-columns: 1fr;
    }

    .hero-copy {
        padding-bottom: 58px;
    }

    .hero-photo {
        height: min(620px, 70vw);
        margin-bottom: var(--section-space);
    }

    .benefit-grid article:nth-child(2) {
        border-right: 1px solid var(--line);
    }

    .benefit-grid article:nth-child(-n + 2) {
        border-bottom: 1px solid var(--line);
    }
}

@media (max-width: 760px) {
    .site-header {
        height: 68px;
        padding-left: var(--gutter);
        padding-right: var(--gutter);
    }

    .mobile-toggle {
        align-items: flex-end;
        cursor: pointer;
        min-height: 44px;
        min-width: 44px;
    }

    .mobile-menu {
        background: var(--paper);
        height: calc(100dvh - 68px);
        padding: 18px var(--gutter) 30px;
        top: 68px;
    }

    .mobile-menu a {
        font-size: 18px;
        padding: 13px 3px;
    }

    .mobile-menu .mobile-language {
        border: 0;
        color: var(--red);
        font: 800 12px var(--font-body);
        margin-top: auto;
        text-transform: uppercase;
    }

    .hero {
        display: block;
        padding-left: var(--gutter);
        padding-right: var(--gutter);
    }

    .hero-copy {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 52px 0 42px;
        text-align: center;
    }

    .hero .eyebrow {
        justify-content: center;
    }

    .hero h1 {
        font-size: clamp(44px, 13vw, 58px);
        max-width: 650px;
    }

    .hero h1 em {
        font-size: .5em;
        margin-top: 15px;
    }

    .hero-copy > p {
        font-size: 15px;
        margin: 23px auto 26px;
    }

    .hero-actions {
        align-items: center;
        width: 100%;
    }

    .hero-actions .button-primary {
        width: 100%;
    }

    .hero-proof {
        gap: 10px;
        margin-top: 35px;
        text-align: left;
        width: 100%;
    }

    .hero-photo {
        height: 390px;
        margin-bottom: 64px;
        min-height: 0;
    }

    .hero-photo-badge {
        bottom: 14px;
        left: 14px;
        right: 14px;
    }

    .trust-strip {
        padding: 0;
    }

    .trust-strip-inner {
        grid-template-columns: 1fr 1fr;
    }

    .trust-strip-inner > span,
    .trust-strip-inner > span:first-child {
        border: 0;
        border-bottom: 1px solid var(--line);
        font-size: 9px;
        justify-content: flex-start;
        min-height: 62px;
        padding: 13px var(--gutter);
    }

    .trust-strip-inner > span:nth-child(odd) {
        border-right: 1px solid var(--line);
    }

    .trust-strip-inner > span:nth-child(n + 3) {
        border-bottom: 0;
    }

    .trust-strip-inner i {
        flex-basis: 22px;
        height: 22px;
        width: 22px;
    }

    .benefit-section {
        padding-bottom: 72px;
        padding-top: 72px;
    }

    .benefit-grid {
        gap: 10px;
    }

    .benefit-grid article {
        border: 1px solid var(--line) !important;
        min-height: 0;
        padding: 24px;
    }

    .benefit-grid h3 {
        margin-top: 38px;
    }

    .media-story {
        border-radius: var(--radius-medium);
        margin-bottom: 72px;
    }

    .media-story-image img {
        min-height: 300px;
    }

    .solutions-section {
        padding: 72px 0;
    }

    .solution-grid {
        gap: 10px;
    }

    .solution-card,
    .solution-card + article,
    .solution-card + a {
        border: 1px solid var(--line) !important;
        border-radius: var(--radius-medium);
    }

    .solution-card-content {
        min-height: 280px;
    }

    .video-story {
        border-radius: var(--radius-medium);
        margin: 72px var(--gutter);
        width: auto;
    }

    .video-story video {
        height: 360px;
    }

    .process,
    .payments-section {
        padding-bottom: 72px;
        padding-top: 72px;
    }

    .newsletter-section,
    .testimonial-section,
    .final-cta {
        padding-bottom: 68px;
        padding-top: 68px;
    }

    .site-footer {
        padding-left: var(--gutter);
        padding-right: var(--gutter);
    }
}

/* Inner marketing templates use the same editorial grammar as the homepage. */
.page-hero {
    gap: clamp(40px, 5vw, 72px);
    grid-template-columns: minmax(0, 1fr) minmax(360px, .72fr);
    min-height: 600px;
    padding-left: var(--gutter);
    padding-right: var(--gutter);
}

.page-hero-copy {
    padding: clamp(76px, 8vw, 110px) 0;
}

.page-hero h1 {
    font-size: clamp(52px, 5.2vw, 78px);
    max-width: 760px;
}

.page-hero-copy > p {
    font-size: 17px;
    line-height: 1.7;
    max-width: 62ch;
}

.page-hero-image {
    align-self: center;
    border: 1px solid var(--line);
    border-radius: var(--radius-large);
    min-height: 500px;
}

.page-hero-image::after {
    background: linear-gradient(180deg, transparent 62%, rgba(7, 10, 8, .38));
}

.page-image-caption {
    padding: 28px;
}

.page-image-caption p {
    font-size: 17px;
    max-width: 34ch;
}

.integration-detail-hero {
    background: var(--white);
}

.page-hero-image.integration-detail-hero::after {
    background: linear-gradient(180deg, transparent 66%, rgba(7, 10, 8, .42));
}

.detail-section,
.integration-section,
.pricing-section,
.faq-section,
.contact-section {
    padding-bottom: var(--section-space);
    padding-top: var(--section-space);
}

.detail-intro {
    gap: clamp(24px, 3vw, 42px);
    grid-template-columns: 50px minmax(0, 1.05fr) minmax(280px, .75fr);
    margin-bottom: 54px;
}

.detail-intro > span {
    color: var(--red);
    font-weight: 800;
    padding-top: 9px;
}

.detail-grid,
.integration-grid {
    border: 0;
    gap: 12px;
}

.detail-grid article,
.integration-grid article {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius-medium);
    min-height: 270px;
    padding: 28px;
}

.detail-icon {
    height: 38px;
    margin: 32px 0 20px;
    width: 38px;
}

.page-media-panel {
    border: 1px solid var(--line);
    border-radius: var(--radius-large);
    margin-top: 64px;
    overflow: hidden;
}

.page-media-panel > div {
    background: var(--cream);
    padding: clamp(38px, 5vw, 62px);
}

.integration-grid article > div.integration-logo {
    border-radius: var(--radius-small);
}

.pricing-grid {
    gap: 12px;
}

.pricing-grid article,
.pricing-grid article + article,
.pricing-grid article:nth-child(3),
.pricing-grid article:nth-child(n + 3) {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius-medium);
    min-height: 550px;
    padding: 28px;
}

.pricing-grid .featured-plan {
    background: var(--white);
    border-color: var(--red);
    box-shadow: inset 0 4px var(--red);
}

.popular {
    border-radius: var(--radius-pill);
}

.pricing-note {
    background: var(--cream);
    border: 1px solid var(--line);
    border-radius: var(--radius-medium);
    color: var(--ink);
    margin-top: 28px;
}

.pricing-note p,
.pricing-note small {
    color: var(--muted);
}

.all-features {
    border-radius: var(--radius-medium);
    margin-top: 28px;
    overflow: hidden;
}

.faq-list {
    border: 0;
    display: grid;
    gap: 10px;
}

.faq-list details {
    background: transparent;
    border: 1px solid var(--line);
    border-radius: var(--radius-medium);
    overflow: hidden;
}

.faq-list details[open] {
    background: var(--white);
    border-color: var(--line-strong);
}

.faq-list summary {
    padding: 24px;
}

.faq-list details p {
    margin: 0 80px 26px;
    max-width: 70ch;
}

.contact-grid {
    gap: 12px;
}

.contact-grid article,
.contact-grid article + article {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius-medium);
    min-height: 340px;
}

.contact-icon {
    background: var(--lime);
    margin-bottom: 58px;
}

.company-line {
    background: var(--cream);
    border: 1px solid var(--line);
    border-radius: var(--radius-medium);
    margin-top: 24px;
}

.enquiry-panel {
    border: 1px solid var(--line);
    border-radius: var(--radius-large);
    margin-top: 24px;
}

.legal-section {
    padding-bottom: var(--section-space);
    padding-top: var(--section-space);
}

.legal-notice {
    border: 1px solid var(--line);
    border-left: 4px solid var(--red);
    border-radius: var(--radius-small);
}

.legal-copy {
    max-width: 76ch;
}

.migrated-details {
    padding-bottom: var(--section-space);
}

.migrated-detail-grid {
    border: 0;
    gap: 12px;
}

.migrated-detail-grid article {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius-medium);
}

@media (max-width: 1050px) {
    .page-hero {
        gap: 0;
        grid-template-columns: 1fr;
    }

    .page-hero-copy {
        padding-bottom: 58px;
    }

    .page-hero-image {
        margin-bottom: var(--section-space);
        min-height: min(560px, 70vw);
    }

    .detail-intro {
        grid-template-columns: 40px 1fr;
    }

    .detail-intro p {
        grid-column: 2;
    }
}

@media (max-width: 760px) {
    .page-hero {
        padding-left: var(--gutter);
        padding-right: var(--gutter);
    }

    .page-hero-copy {
        padding: 52px 0 42px;
    }

    .page-hero h1 {
        font-size: clamp(43px, 12.5vw, 56px);
    }

    .page-hero-copy > p {
        font-size: 15px;
    }

    .page-hero-image {
        border-radius: var(--radius-medium);
        margin-bottom: 68px;
        min-height: 360px;
    }

    .detail-section,
    .integration-section,
    .pricing-section,
    .faq-section,
    .contact-section,
    .legal-section {
        padding-bottom: 72px;
        padding-top: 72px;
    }

    .detail-intro {
        grid-template-columns: 1fr;
    }

    .detail-intro p {
        grid-column: auto;
    }

    .detail-grid,
    .integration-grid,
    .pricing-grid,
    .contact-grid,
    .migrated-detail-grid {
        gap: 10px;
    }

    .detail-grid article,
    .integration-grid article,
    .pricing-grid article,
    .pricing-grid article + article,
    .contact-grid article,
    .contact-grid article + article,
    .migrated-detail-grid article {
        border: 1px solid var(--line) !important;
        border-radius: var(--radius-medium);
    }

    .pricing-note {
        padding: 28px 24px;
    }

    .faq-list summary {
        padding: 20px 18px;
    }

    .faq-list details p {
        margin: 0 54px 22px;
    }

    .enquiry-panel {
        border-radius: var(--radius-medium);
        padding: 34px 22px;
    }

    .page-media-panel {
        border-radius: var(--radius-medium);
    }

    .migrated-details {
        padding-bottom: 72px;
    }

    .mobile-toggle i {
        transition: transform 180ms ease;
    }

    .mobile-toggle[aria-expanded="true"] i:first-of-type {
        transform: translateY(4px) rotate(45deg);
    }

    .mobile-toggle[aria-expanded="true"] i:last-of-type {
        transform: translateY(-4px) rotate(-45deg);
    }
}
