@font-face{font-family:Greed;src:url('/assets/GreedStandard-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Greed;src:url('/assets/GreedStandard-Medium.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:Greed;src:url('/assets/GreedStandard-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
:root{--purple:#4F0FA9;--deep:#370A76;--ink:#111111;--muted:#6b636e;--paper:#F7F7F7;--lavender:#E1E7FF;--line:#ded8e2;--page:clamp(24px,5.5vw,110px);--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;color:var(--ink);background:var(--paper);font:400 16px/1.55 Greed,Arial,sans-serif;-webkit-font-smoothing:antialiased}body:has(dialog[open]){overflow:hidden}img{display:block;max-width:100%;height:auto}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}a,button{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,summary:focus-visible,[role=tabpanel]:focus-visible{outline:3px solid #a371dc;outline-offset:5px}::selection{background:var(--purple);color:white}h1,h2,h3,p{margin:0}h1,h2{font-weight:700;line-height:1.03;letter-spacing:-.055em;text-wrap:balance}h2{font-size:clamp(44px,5.1vw,78px)}h2>span{color:#8b749e}h3{font-weight:500;letter-spacing:-.035em;line-height:1.2}.eyebrow{font-size:10px;font-weight:500;letter-spacing:.13em;margin-bottom:25px}.purple{color:var(--purple)}[hidden]{display:none!important}.section-space{padding:clamp(80px,8.5vw,140px) var(--page)}.skip{position:fixed;z-index:100;top:-100px;left:20px;background:white;padding:15px}.skip:focus{top:20px}
.navigation{position:fixed;z-index:40;top:18px;left:var(--page);right:var(--page);height:68px;padding:0 25px;display:flex;align-items:center;justify-content:space-between;gap:25px;border:1px solid #ffffff26;border-radius:40px;background:#251a2438;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);color:white;transition:background .4s,color .4s,border-color .4s}.brand{flex-shrink:0}.brand img{width:155px;filter:brightness(0) invert(1)}.navigation nav{display:flex;gap:30px;font-size:12px}.navigation nav a{position:relative}.navigation nav a:after{content:'';position:absolute;height:1px;left:0;right:0;bottom:-6px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s}.navigation nav a:hover:after,.navigation nav a[aria-current]:after{transform:scaleX(1)}.nav-actions{display:flex;align-items:center;gap:20px}.nav-cta{display:flex;align-items:center;gap:25px;font-size:11px;background:white;border-radius:30px;padding:12px 20px;color:var(--purple)}.nav-cta span{font-size:16px}.motion-toggle{display:grid;place-items:center;width:30px;height:30px;background:none;border:1px solid #ffffff55;border-radius:50%;font-size:12px}.menu-toggle{display:none}.navigation.light{background:#f7f7f7ed;border-color:#ded8e2;color:var(--ink)}.navigation.light .brand img{filter:none}.navigation.light .nav-cta{background:var(--purple);color:white}.navigation.light .motion-toggle{border-color:#c6bccc}.reading-progress{height:1px;position:absolute;bottom:0;left:25px;right:25px;background:#b697df;transform:scaleX(0);transform-origin:left}.mobile-menu{position:fixed;z-index:35;top:80px;left:14px;right:14px;border-radius:20px;background:var(--paper);color:var(--ink);padding:25px;box-shadow:0 25px 80px #230d3f40}.mobile-menu a{display:flex;justify-content:space-between;padding:17px 0;border-bottom:1px solid var(--line);font-size:18px}.mobile-menu a:last-child{border-bottom:0}
.hero{position:relative;isolation:isolate;color:white;height:100svh;min-height:690px;max-height:1150px;overflow:hidden;background:#30232c}.hero-photo,.hero-shade{position:absolute;inset:0;z-index:-1}.hero-photo img{height:100%;width:100%;object-fit:cover;object-position:64% center;transform:translateY(var(--hero-image-y,0px)) scale(var(--hero-image-scale,1.04));will-change:transform}.hero-shade{background:linear-gradient(90deg,#26152595 0%,#26152535 48%,transparent 78%),linear-gradient(0deg,#21132180,transparent 35%)}.hero-copy{position:absolute;left:var(--page);top:50%;transform:translateY(calc(-42% + var(--hero-copy-y,0px)));max-width:720px}.hero-copy .eyebrow{color:#eee3f4;margin-bottom:30px}.hero h1{font-size:clamp(65px,6.7vw,106px)}.hero h1 span{color:#dec2fa}.hero-description{font-size:clamp(16px,1.4vw,21px);line-height:1.6;margin-top:30px;color:#f1e8ef}.hero-actions{display:flex;align-items:center;gap:30px;margin-top:35px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:35px;border-radius:35px;padding:16px 25px;font-size:13px;font-weight:500;transition:transform .3s,background .3s}.button span{font-size:19px;transition:transform .3s}.button:hover{transform:translateY(-3px)}.button:hover span{transform:translate(2px,-2px)}.button-white{background:white;color:var(--purple)}.subtle-link{display:inline-flex;gap:20px;font-size:12px;align-items:center;padding:10px 0;border-bottom:1px solid #ffffff65}.hero-bottom{position:absolute;left:var(--page);right:var(--page);bottom:35px;display:flex;justify-content:space-between;align-items:flex-end;font-size:12px}.hero-bottom p{line-height:1.5}.hero-bottom p span{color:#ded4dc}.hero-bottom>a{font-size:10px;display:flex;gap:25px;align-items:center}.hero-bottom>a>span{display:grid;place-items:center;width:30px;height:30px;border:1px solid #ffffff55;border-radius:50%;animation:scroll-hint 2.5s ease-in-out infinite}.service-rail{display:grid;grid-template-columns:repeat(4,1fr);padding:0 var(--page);background:var(--purple);color:white}.service-rail a{display:flex;align-items:center;justify-content:space-between;border-right:1px solid #ffffff28;padding:28px 28px;font-size:19px;transition:background .3s}.service-rail a:first-child{border-left:1px solid #ffffff28}.service-rail a>span{font-size:18px;color:#c8a5f1;transition:transform .3s}.service-rail a:hover{background:#ffffff0b}.service-rail a:hover>span{transform:translate(3px,-3px)}.text-link{display:inline-flex;justify-content:space-between;align-items:center;gap:35px;border:0;border-bottom:1px solid #b5a2c7;padding:12px 0;background:none;font-size:13px;color:var(--purple);font-weight:500;margin-top:24px}.text-link span{font-size:18px;transition:transform .3s}.text-link:hover span{transform:translate(3px,-3px)}.section-heading{display:flex;justify-content:space-between;gap:50px;align-items:flex-end;margin-bottom:55px}.section-heading>p{font-size:16px;line-height:1.65;color:var(--muted);max-width:390px;padding-bottom:5px}.products{padding-top:25px}.product-tabs{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line);margin-bottom:42px}.product-tabs button{display:flex;align-items:center;justify-content:space-between;gap:15px;background:none;border:0;border-bottom:2px solid transparent;padding:18px 22px 18px 0;text-align:left;font-size:21px;transition:color .3s,border-color .3s}.product-tabs button>span{font-size:10px;color:#7f7388}.product-tabs button[aria-selected=true]{border-bottom-color:var(--purple);color:var(--purple);font-weight:500}.product-tabs button[aria-selected=true]>span{color:var(--purple)}.product-tabs button:hover{color:var(--purple)}.product-panel{display:grid;grid-template-columns:1.12fr 1fr;gap:clamp(45px,7vw,130px);align-items:center;animation:panel-in .65s var(--ease)}.product-photo{height:690px;min-width:0;position:relative;overflow:hidden;border-radius:3px 3px 75px 3px;background:#dacfc1;isolation:isolate}.product-photo:after{content:'';position:absolute;inset:30% 0 0;background:linear-gradient(transparent,#20131f9c);z-index:0}.product-photo img{width:100%;height:100%;object-fit:cover;object-position:65% 50%;transition:transform 1s var(--ease)}.product-photo:hover img{transform:scale(1.04)}.product-photo>span{position:absolute;z-index:1;left:38px;bottom:38px;color:white;font-size:clamp(36px,3.4vw,50px);font-weight:500;line-height:1.05;letter-spacing:-.04em}.portrait-crop img{object-position:50% 45%}.insurance-crop img{object-position:15% 50%}.product-copy{max-width:510px}.product-copy .eyebrow{margin-bottom:22px}.product-copy>h3{font-size:clamp(35px,3.3vw,50px);font-weight:700;letter-spacing:-.045em;line-height:1.05}.product-copy>p:not(.eyebrow){font-size:15px;line-height:1.7;color:var(--muted);margin-top:24px;max-width:440px}.feature-list{padding:0;margin:30px 0 0;list-style:none}.feature-list li{display:flex;gap:22px;padding:17px 0;border-top:1px solid var(--line)}.feature-list li>span{font-size:10px;color:var(--purple);padding-top:4px}.feature-list b{font-weight:500;font-size:15px}.feature-list p{font-size:12px;color:var(--muted);margin-top:4px;line-height:1.6}.product-contact{margin-top:14px}
.overview-section{position:relative;padding:0 var(--page) 100px;background:var(--light-blue);scroll-margin-top:0}.section-description{font-size:15px;line-height:1.7;color:var(--muted);margin-top:24px;max-width:450px}.overview-visual{min-width:0;width:100%;margin:auto}.screen-shell{padding:6px;background:#dcd2e8;border:1px solid #cbbbd9;border-radius:15px;overflow:hidden;box-shadow:0 30px 75px -45px #35134466}.screen-top{display:flex;align-items:center;justify-content:space-between;gap:20px;height:37px;font-size:9px;color:#665471;padding:5px 12px}.screen-top>span:nth-child(2){font-size:8px}.expand{display:grid;place-items:center;width:25px;height:25px;border:0;border-radius:50%;background:#ffffffb3;font-size:16px;transition:transform .3s,background .3s}.expand:hover{transform:scale(1.1);background:white}
.makker-section{padding:105px var(--page) 110px;background:#370A76;color:white;position:relative;overflow:hidden}.makker-heading{text-align:center}.mark-tile{display:grid;place-items:center;width:60px;height:60px;border:1px solid #ffffff29;border-radius:20px 20px 4px 20px;background:#ad7feb29;margin:0 auto 23px}.mark-tile img{width:39px;filter:brightness(0) invert(1)}.makker-heading .eyebrow{color:#d4b8ef}.makker-heading h2>span{color:#c9a5f1}.makker-heading>p:last-child{color:#dac6e9;font-size:16px;line-height:1.7;margin-top:27px}.makker-layout{display:grid;grid-template-columns:1fr 2fr;gap:clamp(40px,5vw,80px);max-width:1550px;margin:65px auto 0;align-items:center}.makker-questions .eyebrow{font-size:8px;color:#d2b7e9;margin-bottom:15px}.makker-questions>button{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;text-align:left;padding:19px 0;border:0;border-bottom:1px solid #ffffff24;background:none;color:#dfd0eb;font-size:14px;transition:color .3s,border-color .3s}.makker-questions>button[aria-pressed=true]{color:white;border-color:#b78dea}.makker-questions>button>span{transition:transform .3s}.makker-questions>button:hover>span{transform:translate(3px,-3px)}.question-explanation{min-height:145px;padding-top:25px}.question-explanation>p:first-child{font-weight:500;font-size:17px;line-height:1.3;letter-spacing:-.02em}.question-explanation>p+p{font-size:12px;color:#d4c0e6;line-height:1.7;margin-top:12px}.makker-note{font-size:10px;color:#bfa4d8;margin-top:15px}.makker-stage{transform:translateY(var(--makker-y,0px)) scale(var(--makker-scale,1));transform-origin:center}.browser-frame{background:#e5dced;padding:6px;border-radius:15px;border:1px solid #ffffff40;overflow:hidden;box-shadow:0 35px 65px -35px #100023}.browser-frame>img{width:100%;height:auto;border-radius:8px}
.life-section{height:85svh;min-height:600px;max-height:1000px;position:relative;overflow:hidden;isolation:isolate;color:white}.life-photo,.life-shade{position:absolute;inset:0;z-index:-1}.life-photo img{width:100%;height:100%;object-fit:cover;object-position:55% center;transform:translateY(var(--life-y,0px)) scale(1.13)}.life-shade{background:linear-gradient(90deg,#20131c9c,transparent 85%),linear-gradient(0deg,#20131c55,transparent 70%)}.life-copy{position:absolute;left:var(--page);bottom:14%;max-width:700px}.life-copy h2{font-size:clamp(50px,6.4vw,96px)}.life-copy>p:last-child{font-size:18px;line-height:1.65;margin-top:28px;color:#f5eced}
.app-section{overflow:hidden}.app-layout{display:grid;grid-template-columns:.8fr 1.3fr;gap:clamp(45px,8vw,140px);align-items:center}.phone-duo{height:700px;position:relative;isolation:isolate;min-width:0}.phone-front,.phone-back{position:absolute;height:90%;width:auto;max-width:54%;object-fit:contain;filter:drop-shadow(0 28px 20px #30134422)}.phone-front{top:0;right:0;z-index:2;transform:translate(var(--app-front-x,0px),var(--app-front-y,0px)) rotate(var(--app-front-rotate,4deg))}.phone-back{top:8%;left:0;z-index:1;transform:translate(var(--app-back-x,0px),var(--app-back-y,0px)) rotate(var(--app-back-rotate,-5deg))}.app-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:60px;margin-top:60px}.app-benefits>div{border-top:1px solid var(--line);padding-top:20px}.app-benefits span{font-size:10px;color:var(--purple)}.app-benefits h3{font-size:20px;margin-top:20px}.app-benefits p{font-size:13px;color:var(--muted);line-height:1.7;margin-top:12px;max-width:320px}.app-expand{margin-top:30px}
.esim-section{display:grid;grid-template-columns:1.2fr 1fr;gap:70px;align-items:center;padding:100px var(--page);background:var(--light-blue);overflow:hidden;min-height:900px}.esim-copy h2{font-size:clamp(45px,5vw,75px)}.esim-copy h2>span{color:var(--purple)}.esim-copy .section-description{max-width:430px}.esim-visual{position:relative;height:740px;display:grid;place-items:center;isolation:isolate}.esim-visual>img{height:100%;width:auto;object-fit:contain;transform:translateY(var(--esim-y,0px)) rotate(var(--esim-rotate,0deg));filter:drop-shadow(0 25px 25px #40235e22)}.faq-section{display:grid;grid-template-columns:1fr 1.45fr;gap:10%}.faq-heading h2{font-size:clamp(44px,5vw,72px)}.faq-heading>p:last-child{font-size:14px;color:var(--muted);line-height:1.9;margin-top:30px}.faq-heading a{color:var(--purple)}.faq-list details{border-top:1px solid var(--line)}.faq-list details:last-child{border-bottom:1px solid var(--line)}.faq-list summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:30px;font-size:17px;padding:25px 0;font-weight:500;letter-spacing:-.02em}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary>span{font-size:25px;font-weight:400;color:var(--purple);transition:transform .3s}.faq-list details[open] summary>span{transform:rotate(45deg)}.faq-list details>p{font-size:14px;color:var(--muted);line-height:1.8;padding:0 40px 28px 0;max-width:650px;animation:panel-in .4s var(--ease)}
.closing{background:var(--purple);color:white;padding:110px var(--page) 25px;position:relative;overflow:hidden;isolation:isolate}.closing-content{text-align:center}.closing .eyebrow{color:#dec8f3}.closing h2{font-size:clamp(60px,8.5vw,130px)}.closing h2>span{color:#cda7f5}.closing-content>p:not(.eyebrow){font-size:17px;color:#e2d0f4;margin-top:25px}.closing-actions{display:flex;gap:35px;justify-content:center;align-items:center;margin-top:35px}.closing footer{margin-top:105px;border-top:1px solid #ffffff2b;padding-top:45px}.footer-top{display:grid;grid-template-columns:1.15fr 1fr 1fr .7fr;gap:40px}.footer-top>img{width:170px;filter:brightness(0) invert(1)}.footer-top>p{font-size:16px;line-height:1.6;color:#e3d1f5}.footer-top>div{display:flex;flex-direction:column;align-items:flex-start;gap:13px;font-size:12px;color:#e6d8f5}.footer-top a:hover{text-decoration:underline}.footer-bottom{display:flex;gap:25px;justify-content:space-between;margin-top:55px;border-top:1px solid #ffffff26;padding-top:22px;font-size:8px;color:#d4b8ec}
dialog{width:100vw;max-width:none;height:100dvh;max-height:none;border:0;margin:0;padding:0;background:#f7f7f7f5;backdrop-filter:blur(25px);color:var(--ink);overflow:hidden}dialog::backdrop{background:#21083a80}.viewer-top{height:75px;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 32px;border-bottom:1px solid var(--line);font-size:13px}.viewer-top button{display:flex;gap:25px;align-items:center;background:white;border:0;padding:10px 20px;border-radius:25px;font-size:12px}.viewer-top button span{font-size:20px}.viewer-content{height:calc(100dvh - 75px);display:flex;align-items:center;justify-content:center;padding:30px;overflow:auto}.viewer-content img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:8px}.viewer-content img.portrait{height:100%;border-radius:0}dialog[open]{animation:panel-in .35s var(--ease)}
.js .reveal{opacity:0;transform:translateY(30px);transition:opacity .85s var(--ease),transform 1s var(--ease)}.js .reveal.visible{opacity:1;transform:none}.entrance{animation:entrance 1.1s var(--ease) both}.hero-copy>.entrance:nth-child(2){animation-delay:.08s}.hero-copy>.entrance:nth-child(3){animation-delay:.16s}.hero-copy>.entrance:nth-child(4){animation-delay:.24s}.app-benefits .reveal:nth-child(2){transition-delay:.08s}.app-benefits .reveal:nth-child(3){transition-delay:.16s}
@keyframes entrance{from{opacity:0;translate:0 25px}to{opacity:1;translate:0 0}}@keyframes panel-in{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}@keyframes scroll-hint{0%,100%{translate:0 0}50%{translate:0 5px}}
@media(min-width:1001px) and (min-height:680px){.js:not(.motion-reduced) .overview-section{height:220svh;padding-bottom:0}.overview-visual{width:min(100%,calc((100svh - 180px)*1.4545))}}
@media(min-width:1001px) and (max-height:800px){.hero{min-height:640px}.hero-copy{top:47%}.hero h1{font-size:76px}.hero-copy .eyebrow{margin-bottom:22px}.hero-description{margin-top:22px;font-size:17px}.hero-actions{margin-top:25px}}
@media(max-width:1100px){.navigation nav{gap:20px}.navigation{padding:0 20px}.nav-actions{gap:13px}.brand img{width:140px}.product-photo{height:650px}.product-panel{gap:45px}.product-copy>h3{font-size:39px}.makker-layout{gap:35px;grid-template-columns:1fr 1.7fr}.phone-duo{height:600px}.app-layout{gap:60px}.app-benefits{gap:35px}.esim-section{gap:40px}.esim-visual{height:650px}.footer-top{gap:30px}}
@media(max-width:1000px){.hero{min-height:700px}.hero h1{font-size:clamp(60px,7.6vw,82px)}.hero-copy{max-width:600px}.hero-shade{background:linear-gradient(90deg,#261525c9,#26152535 85%),linear-gradient(0deg,#21132170,transparent 40%)}.navigation nav{font-size:11px;gap:18px}.nav-cta{font-size:10px;gap:15px;padding:11px 15px}.product-photo{height:640px}.product-copy>h3{font-size:35px}.product-copy>p:not(.eyebrow){font-size:14px}.feature-list li{padding:14px 0;gap:15px}.overview-section{padding-top:80px}.makker-layout{grid-template-columns:1fr;gap:40px}.makker-questions{max-width:620px;width:100%;margin:auto}.question-explanation{min-height:110px}.makker-stage{max-width:100%;width:100%;margin:auto}.makker-note{margin-top:5px}.life-section{height:70svh;min-height:520px}.app-layout{gap:45px}.phone-duo{height:530px}.esim-section{min-height:0}.esim-visual{height:590px}.esim-copy h2{font-size:48px}.faq-section{gap:7%}.faq-list summary{font-size:16px}}
@media(max-width:760px){.navigation{left:18px;right:18px;top:14px;height:60px;padding:0 20px}.navigation nav{display:none}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:5px;background:none;border:0;width:25px;height:30px;padding:0}.menu-toggle span{width:21px;height:1px;background:currentColor;transition:transform .3s}.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3px) rotate(45deg)}.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3px) rotate(-45deg)}.nav-actions{gap:17px}.nav-cta{padding:9px 15px}.brand img{width:140px}.hero-copy{max-width:530px}.hero h1{font-size:67px}.hero-description{font-size:17px}.hero-photo img{object-position:65% center}.service-rail{padding:0 18px}.service-rail a{padding:22px 15px;font-size:16px}.section-heading{display:block;margin-bottom:35px}.section-heading>p{margin-top:24px;font-size:15px}.product-tabs button{font-size:17px;padding-right:15px}.product-panel{grid-template-columns:1fr;gap:35px}.product-photo{height:490px;border-radius:3px 3px 55px 3px}.product-photo img{object-position:50% center}.product-photo>span{font-size:43px;left:30px;bottom:30px}.product-copy{max-width:none}.product-copy>h3{font-size:43px}.product-copy>p:not(.eyebrow){max-width:500px;font-size:15px}.feature-list{margin-top:25px}.feature-list li{padding:17px 0}.feature-list b{font-size:16px}.feature-list p{font-size:13px}.makker-section{padding-top:80px;padding-bottom:85px}.life-copy h2{font-size:61px}.app-layout{gap:30px;grid-template-columns:.8fr 1.2fr}.phone-duo{height:450px}.app-benefits{gap:23px;margin-top:40px}.app-benefits h3{font-size:19px}.app-benefits p{font-size:12px}.esim-section{gap:30px;padding-top:80px;padding-bottom:80px;grid-template-columns:1.2fr .8fr}.esim-visual{height:500px}.esim-copy h2{font-size:39px}.esim-copy .eyebrow{font-size:8px}.section-description{font-size:14px}.faq-section{grid-template-columns:1fr;gap:35px}.faq-heading>p:last-child{margin-top:20px}.closing{padding-top:85px}.footer-top{grid-template-columns:1fr 1fr;gap:35px}.footer-bottom{flex-wrap:wrap;justify-content:flex-start;gap:15px}.footer-bottom span:last-child{margin-left:auto}}
@media(max-width:540px){:root{--page:24px}html{scroll-padding-top:90px}.navigation{left:14px;right:14px;padding:0 17px;height:55px;top:12px}.brand img{width:130px}.nav-cta{display:none}.nav-actions{gap:15px}.motion-toggle{width:26px;height:26px;font-size:10px}.hero{min-height:740px;height:100svh;max-height:950px}.hero-photo img{object-position:72% center;transform:translateY(var(--hero-image-y,0px)) scale(1.04)}.hero-shade{background:linear-gradient(0deg,#211322b5,transparent 56%),linear-gradient(90deg,#241322be,#24132228 100%)}.hero-copy{top:22%;transform:translateY(var(--hero-copy-y,0px));left:24px;right:24px}.hero-copy .eyebrow{font-size:8px;margin-bottom:24px}.hero h1{font-size:clamp(47px,12.8vw,68px);line-height:1.02}.hero-description{font-size:15px;margin-top:25px;line-height:1.6;max-width:320px}.hero-actions{align-items:flex-start;flex-direction:column;gap:15px;margin-top:28px}.button{padding:14px 22px;font-size:12px;gap:25px}.hero-actions .subtle-link{font-size:11px}.hero-bottom{bottom:28px;font-size:10px;gap:30px}.hero-bottom>a{font-size:8px;gap:12px}.hero-bottom>a>span{width:27px;height:27px}.service-rail{grid-template-columns:1fr 1fr;padding:0 24px}.service-rail a{padding:21px 16px;font-size:17px}.service-rail a:nth-child(2){border-right:1px solid #ffffff28}.service-rail a:nth-child(3){border-left:1px solid #ffffff28;border-top:1px solid #ffffff28}.service-rail a:nth-child(4){border-top:1px solid #ffffff28}.section-space{padding:75px 24px}.eyebrow{font-size:9px;margin-bottom:22px}.products{padding-top:5px}.section-heading h2{font-size:47px}.section-heading>p{font-size:14px}.product-tabs{gap:0;margin-bottom:30px;grid-template-columns:1fr 1fr}.product-tabs button{font-size:17px;padding:16px 14px 16px 0;border-top:1px solid var(--line)}.product-tabs button:nth-child(even){padding-left:15px}.product-tabs button>span{font-size:9px}.product-photo{height:430px}.product-photo>span{font-size:38px;left:25px;bottom:30px}.product-copy>h3{font-size:39px}.product-copy>p:not(.eyebrow){font-size:14px;margin-top:22px}.feature-list li{gap:18px}.feature-list b{font-size:15px}.feature-list p{font-size:12px}.product-contact{font-size:12px}.overview-section{padding:75px 24px}.overview-visual{margin:0 -8px;width:calc(100% + 16px)}.screen-shell{padding:4px;border-radius:11px}.screen-top{height:31px;font-size:8px;padding:4px 8px}.screen-top>span:nth-child(2){display:none}.makker-section{padding:75px 24px}.makker-heading h2{font-size:53px}.makker-heading>p:last-child{font-size:14px;max-width:330px;margin:25px auto 0}.mark-tile{height:55px;width:55px}.mark-tile img{width:35px}.makker-layout{margin-top:35px;gap:35px}.makker-questions>button{font-size:14px}.question-explanation{min-height:125px}.makker-stage{width:calc(100% + 16px);max-width:none;margin:0 -8px}.browser-frame{padding:4px;border-radius:11px}.browser-frame>img{border-radius:7px}.life-section{height:75svh;min-height:560px}.life-photo img{object-position:62% center}.life-shade{background:linear-gradient(0deg,#20131cc9,transparent 85%)}.life-copy{left:24px;right:24px;bottom:11%}.life-copy .eyebrow{font-size:8px}.life-copy h2{font-size:49px}.life-copy>p:last-child{font-size:15px;margin-top:23px}.app-layout{display:flex;flex-direction:column;gap:38px}.phone-duo{width:100%;height:590px}.phone-front,.phone-back{height:86%;max-width:57%}.phone-front{top:0;right:-1%}.phone-back{top:10%;left:-2%}.app-benefits{grid-template-columns:1fr;gap:24px;margin-top:20px}.app-benefits>div{padding-top:18px;display:grid;grid-template-columns:25px 1fr;gap:5px 15px}.app-benefits span{padding-top:4px}.app-benefits h3{font-size:20px;margin-top:0}.app-benefits p{grid-column:2;font-size:13px;margin-top:5px;max-width:none}.app-expand{margin-top:27px;font-size:12px}.esim-section{grid-template-columns:1fr;padding:75px 24px 60px;gap:40px}.esim-copy h2{font-size:48px}.esim-copy .eyebrow{font-size:8px;max-width:300px}.esim-copy .section-description{font-size:14px}.esim-visual{height:610px;max-width:330px;width:100%;margin:auto}.esim-visual>img{max-width:95%}.faq-heading h2{font-size:49px}.faq-list summary{font-size:16px;padding:23px 0}.faq-list details>p{font-size:13px;padding-right:12px}.closing{padding:75px 24px 25px}.closing h2{font-size:clamp(49px,12.5vw,75px)}.closing .eyebrow{font-size:8px}.closing-content>p:not(.eyebrow){font-size:15px;margin-top:25px}.closing-actions{flex-direction:column;gap:22px;margin-top:30px}.closing footer{margin-top:70px;padding-top:35px}.footer-top{gap:30px}.footer-top>img{width:145px}.footer-top>p{font-size:12px}.footer-top>div{gap:14px;font-size:12px}.footer-bottom{display:block;margin-top:35px;padding-top:20px;font-size:8px;line-height:1.7}.footer-bottom>span{display:block;margin-top:10px}.viewer-top{height:65px;padding:15px;font-size:11px}.viewer-top button{font-size:11px;padding:9px 13px;gap:12px}.viewer-content{height:calc(100dvh - 65px);padding:16px}}
@media(max-width:370px){.hero h1{font-size:45px}.hero-description{font-size:14px}.phone-duo{height:530px}.esim-visual{height:550px}}
html.motion-reduced{scroll-behavior:auto}.motion-reduced *,.motion-reduced *:before,.motion-reduced *:after{animation:none!important;transition:none!important}.motion-reduced .reveal{opacity:1!important;transform:none!important}.motion-reduced .hero-photo img,.motion-reduced .life-photo img{transform:none}.motion-reduced .makker-stage{transform:none}.motion-reduced .phone-front{transform:rotate(2deg)}.motion-reduced .phone-back{transform:rotate(-3deg)}.motion-reduced .esim-visual>img{transform:none}.motion-reduced .hero-copy{transform:translateY(-42%)}
@media(max-width:540px){.motion-reduced .hero-copy{transform:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.js .reveal{opacity:1;transform:none}}
@media print{.navigation,.mobile-menu,.hero-bottom,dialog,.expand,.motion-toggle{display:none}.overview-section{height:auto!important}.hero{height:700px}.reveal,.js .reveal{opacity:1;transform:none}.hero,.makker-section,.closing{print-color-adjust:exact}.makker-stage{transform:none}.product-panel[hidden]{display:grid!important;break-before:page}.phone-front,.phone-back,.esim-visual>img{transform:none}}

@media(min-width:761px){.mobile-menu{display:none!important}}

/* Simple, flat navigation keeps the photography and product in focus. */
.navigation,.navigation.light{top:0;left:0;right:0;height:78px;padding:0 var(--page);border:0;border-radius:0;background:#f7f7f7f5;color:var(--ink);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.navigation .brand img,.navigation.light .brand img{width:170px;filter:none}
.navigation nav{font-size:13px;gap:32px}
.navigation .nav-cta,.navigation.light .nav-cta{padding:12px 20px;background:var(--purple);color:white;border-radius:8px;font-size:12px}
.reading-progress{left:0;right:0}
.hero-copy{top:49%}
.hero-copy h1.entrance{animation-delay:0s}.hero-copy p.entrance{animation-delay:.08s}.hero-copy .hero-actions.entrance{animation-delay:.16s}
.footer-bottom .motion-toggle{display:inline-flex;gap:8px;border:0;border-radius:0;width:auto;height:auto;padding:0;font-size:8px;flex-shrink:0;color:#e2d0f3}
.app-section{position:relative;isolation:isolate;background:var(--purple);color:white;padding-top:100px;padding-bottom:100px}
.app-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(45px,6vw,100px);align-items:center;max-width:1450px;margin:auto}
.app-copy{max-width:530px}.app-copy .eyebrow{color:#d8bdef}.app-copy h2{font-size:clamp(48px,4.8vw,74px)}.app-copy h2>span{color:#cda7f5}
.app-description{font-size:17px;line-height:1.65;color:#eadcf6;margin-top:28px}
.app-benefits{display:block;margin-top:32px;max-width:430px}.app-benefits>div{display:flex;gap:20px;padding:17px 0;border-top:1px solid #ffffff30;margin:0}.app-benefits span{font-size:9px;color:#dec2f4;padding-top:4px}.app-benefits h3{font-size:17px;font-weight:500;margin:0;line-height:1.4;letter-spacing:-.02em}.app-benefits p{font-size:12px;line-height:1.7;color:#e4cff5;margin:6px 0 0;max-width:350px}
.app-expand{border:0;margin-top:25px}
.phone-duo{height:min(690px,76svh);width:100%;max-width:650px;margin:auto;position:relative;isolation:isolate}
.phone-front,.phone-back{position:absolute;object-fit:contain;width:auto;max-width:none;filter:drop-shadow(0 26px 22px #1d063a40)}
.phone-front{height:94%;right:3%;top:3%;z-index:2;transform:translate(var(--app-front-x,0px),var(--app-front-y,0px)) rotate(2deg)}
.phone-back{height:85%;left:3%;top:10%;z-index:1;transform:translate(var(--app-back-x,0px),var(--app-back-y,0px)) rotate(-3deg)}
@media(max-width:1100px){.navigation nav{gap:25px;font-size:12px}.app-layout{gap:40px;grid-template-columns:1fr 1fr}.app-copy h2{font-size:54px}.phone-duo{height:610px}.phone-front{right:-2%}.phone-back{left:-2%}}
@media(max-width:760px){.navigation{height:70px;padding:0 24px}.navigation .brand img{width:145px}.navigation .nav-cta{padding:10px 17px;font-size:11px}.hero-copy{top:48%}.app-layout{grid-template-columns:1fr;gap:50px}.app-copy{max-width:540px}.app-copy h2{font-size:61px}.app-description{font-size:17px}.app-benefits{max-width:none}.phone-duo{height:660px;max-width:540px}.phone-front{right:4%;height:92%}.phone-back{left:4%;height:84%}}
@media(max-width:540px){.navigation,.navigation.light{height:66px;padding:0 24px}.navigation .brand img{width:140px}.navigation .nav-cta{display:none}.hero-copy{top:23%}.app-section{padding:75px 24px 60px}.app-copy h2{font-size:48px}.app-description{font-size:16px;margin-top:24px}.app-benefits{margin-top:30px}.app-benefits>div{display:flex;gap:18px;padding:16px 0}.app-benefits h3{font-size:17px}.app-benefits p{font-size:12px;max-width:none}.app-layout{gap:50px}.phone-duo{height:540px;width:100%;max-width:350px}.phone-front{height:92%;right:-1%;top:2%}.phone-back{height:82%;left:-1%;top:11%}.app-expand{font-size:12px}.footer-bottom .motion-toggle{margin-top:15px;font-size:10px}}
@media(max-width:370px){.app-copy h2{font-size:43px}.phone-duo{height:490px}}

/* Keep the four product choices in the first viewport. */
:root{--rail-height:88px}.hero{height:calc(100svh - var(--rail-height));min-height:570px;max-height:none}.service-rail{height:var(--rail-height)}.service-rail a{padding-block:20px}.hero-copy{top:50%}.hero h1{font-size:clamp(62px,6.3vw,100px)}.products{padding-top:95px}.products .section-heading>p{max-width:440px}.product-photo img{transform:translateY(var(--product-photo-y,0px)) scale(1.12)}.product-photo:hover img{transform:translateY(var(--product-photo-y,0px)) scale(1.16)}.motion-reduced .product-photo img{transform:none}
@media(max-width:1000px){.hero{min-height:560px}.hero h1{font-size:clamp(57px,7.4vw,80px)}}
@media(max-width:540px){:root{--rail-height:120px}.hero{height:calc(100svh - var(--rail-height));min-height:560px}.hero-copy{top:23%}.hero h1{font-size:clamp(45px,12.8vw,65px)}.hero-description{margin-top:23px;font-size:14px}.hero-actions{margin-top:24px;gap:12px}.hero-bottom{bottom:23px}.service-rail a{padding:16px;font-size:16px}.products{padding-top:70px}.products .section-heading h2{font-size:49px}}

.product-photo img,.portrait-crop img,.insurance-crop img{object-position:center}

.hero{min-height:0}
@media(max-height:600px){.hero-copy{top:90px;transform:translateY(var(--hero-copy-y,0px))}.hero h1{font-size:44px}.hero-description{font-size:12px;line-height:1.5;margin-top:14px}.hero-actions{margin-top:16px;gap:20px;flex-direction:row;align-items:center}.hero-actions .button{padding:10px 18px;font-size:11px}.hero-actions .subtle-link{font-size:10px}.hero-bottom{display:none}.motion-reduced .hero-copy{transform:none}}

/* Match the hero tint and its controls to the product's purple. */
.hero-shade{background:linear-gradient(90deg,#251039c9 0%,#30144355 47%,transparent 78%),linear-gradient(0deg,#29113c66,transparent 45%)}
.hero h1 span{color:#e3cbff}.hero-description{color:#f3edf8}.hero-bottom{justify-content:flex-end;bottom:25px}.hero-copy{max-width:760px}.hero h1{letter-spacing:-.052em}.hero-actions .button{border-radius:12px}.hero-actions .subtle-link{border-bottom-color:#ffffff50}
@media(max-width:540px){.hero-shade{background:linear-gradient(90deg,#251039cf,#30144338 100%),linear-gradient(0deg,#29113c99,transparent 65%)}.hero-copy{left:24px;right:24px}.hero-bottom{bottom:20px}}

.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:64% center;transform:translateY(var(--hero-image-y,0px)) scale(var(--hero-image-scale,1.1));opacity:0;transition:opacity .7s ease;pointer-events:none}.hero-photo.video-ready .hero-video{opacity:1}.hero-motion{display:inline-flex;gap:10px;width:auto;height:auto;border:0;border-radius:0;padding:5px 0;font-size:9px;color:#f1e8f8;background:none}.hero-motion>span:first-child{display:grid;place-items:center;width:27px;height:27px;border:1px solid #ffffff66;border-radius:50%;font-size:11px}.motion-reduced .hero-video{opacity:0!important;transform:none}
@media(max-width:540px){.hero-video{object-position:72% center}.hero-motion{font-size:8px}.hero-motion>span:first-child{width:25px;height:25px}}
@media(max-height:600px){.hero-bottom{display:flex;bottom:15px}.hero-motion .motion-label{display:none}}

/* Photograph framing preserves faces; depth stays in the surrounding composition. */
.product-photo img,.product-photo:hover img{object-position:center top;transform:none}
.detail-showcase{background:var(--paper)}.detail-intro{max-width:400px}.detail-intro>p{font-size:15px;line-height:1.75;color:var(--muted)}.detail-switch{display:inline-flex;gap:5px;padding:5px;border:1px solid #d7cede;border-radius:28px;background:var(--light-blue);margin-bottom:28px}.detail-switch button{background:none;border:0;padding:11px 20px;font-size:12px;border-radius:22px;color:#675570;transition:background .3s,color .3s}.detail-switch button[aria-selected=true]{background:white;color:var(--purple);box-shadow:0 2px 7px #250b3a0a}.detail-stage{max-width:1250px;margin:auto;transform:translateY(var(--detail-y,0px)) scale(var(--detail-scale,1));transform-origin:center}.detail-stage .screen-shell>img{width:100%;height:auto;border-radius:9px}.detail-stage .screen-shell{background:var(--light-blue)}.detail-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:55px;max-width:1250px;margin:35px auto 0}.detail-benefits p{font-size:12px;color:var(--muted);line-height:1.75;border-top:1px solid var(--line);padding-top:20px}.detail-benefits b{display:block;font-size:15px;font-weight:500;color:var(--ink);margin-bottom:7px}.motion-reduced .detail-stage{transform:none}
/* A softer headline and an integrated header let the living image lead. */
.hero h1{font-weight:500;font-size:clamp(62px,6.1vw,96px);line-height:1.07;letter-spacing:-.043em}.hero h1 span{color:#b383e7}.hero-description{font-size:17px;line-height:1.65;color:#eee8ef;max-width:490px}.hero-actions{gap:30px;margin-top:32px}.hero-actions .button{border-radius:32px;color:#29232f;font-size:13px;padding:13px 16px 13px 24px;gap:28px}.hero-actions .button>span{display:grid;place-items:center;background:#29232f;color:white;width:32px;height:32px;border-radius:50%;font-size:16px}.hero-actions .subtle-link{font-size:12px;gap:17px}.hero-shade{background:linear-gradient(90deg,#231a2fc2 0%,#291c343b 48%,transparent 78%),linear-gradient(0deg,#231c2c40,transparent 40%)}
.navigation{height:84px;background:#f7f7f7ed;padding:0 var(--page);transition:background .45s,color .45s,box-shadow .45s}.navigation:not(.light){background:linear-gradient(#241b2b70,transparent);color:white;backdrop-filter:none;-webkit-backdrop-filter:none}.navigation:not(.light) .brand img{filter:brightness(0) invert(1)}.navigation .brand img{width:175px}.navigation nav{gap:3px;background:#ece7ef;padding:5px;border-radius:30px;border:1px solid #d9d1df80}.navigation:not(.light) nav{background:#ffffff12;border-color:#ffffff25}.navigation nav a{padding:9px 16px;font-size:12px;border-radius:24px;transition:background .3s,color .3s}.navigation nav a:after{display:none}.navigation nav a:hover,.navigation nav a[aria-current]{background:#fff;color:var(--purple)}.navigation:not(.light) nav a:hover,.navigation:not(.light) nav a[aria-current]{background:#ffffff20;color:white}.navigation .nav-cta,.navigation.light .nav-cta{background:#fff;color:var(--ink);border:1px solid #d9d1df;border-radius:30px;padding:7px 8px 7px 20px;gap:23px;font-size:12px}.navigation .nav-cta>span{display:grid;place-items:center;width:32px;height:32px;background:var(--ink);color:white;border-radius:50%;font-size:15px}.navigation:not(.light) .nav-cta{border-color:transparent}.reading-progress{background:#a385c6}
@media(max-width:1100px){.navigation nav a{padding:8px 12px;font-size:11px}.navigation .brand img{width:150px}.navigation .nav-cta{font-size:11px;gap:17px}.hero h1{font-size:clamp(59px,6.7vw,84px)}}
@media(max-width:760px){.detail-showcase .section-heading{margin-bottom:30px}.detail-intro{max-width:540px;margin-top:25px}.detail-benefits{gap:25px}.navigation,.navigation.light{height:70px}.navigation .brand img{width:145px}.hero h1{font-size:clamp(57px,8.2vw,76px)}}
@media(max-width:540px){.hero h1{font-size:clamp(44px,12vw,62px);letter-spacing:-.04em}.hero-description{font-size:14px}.hero-actions{gap:16px;margin-top:25px}.hero-actions .button{font-size:12px;padding:10px 12px 10px 20px;gap:25px}.hero-actions .button>span{width:29px;height:29px}.hero-actions .subtle-link{font-size:11px}.navigation,.navigation.light{height:66px;padding:0 24px}.navigation .brand img{width:143px}.navigation nav{display:none}.detail-switch{width:100%;justify-content:space-between}.detail-switch button{padding:10px 13px;font-size:11px;flex:1}.detail-stage{margin:0 -8px}.detail-benefits{grid-template-columns:1fr;gap:18px;margin-top:25px}.detail-benefits p{font-size:13px;padding-top:16px}.detail-benefits b{font-size:15px}.hero-shade{background:linear-gradient(90deg,#231a2fc7,#291c3438 100%),linear-gradient(0deg,#231c2c80,transparent 65%)}}
@media(max-height:600px){.hero h1{font-size:43px}.hero-description{font-size:12px;margin-top:14px}.hero-actions{margin-top:16px}.hero-actions .button{font-size:11px;padding:8px 12px 8px 18px}.hero-actions .button>span{width:25px;height:25px}}

/* Separate planes give the product story depth without cropping its portraits. */
.products .section-heading>div{transform:translateY(var(--products-title-y,0px))}
.products .section-heading>p{transform:translateY(var(--products-description-y,0px))}
.product-panel{animation:none}
.product-photo{transform:translateY(var(--products-photo-y,0px))}
.product-copy{transform:translateY(var(--products-copy-y,0px))}
.product-photo>span{transform:translateY(calc(var(--products-photo-y,0px) * -.22))}
.product-tabs button{position:relative;border-bottom-color:transparent!important}
.product-tabs button:after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--purple);transform:scaleX(0);transform-origin:left;transition:transform .55s var(--ease)}
.product-tabs button[aria-selected=true]:after{transform:scaleX(1)}
.service-rail a{position:relative;overflow:hidden;isolation:isolate}
.service-rail a:before{content:'';position:absolute;inset:0;background:#ffffff10;transform:translateY(100%);transition:transform .5s var(--ease);z-index:-1}
.service-rail a:hover:before,.service-rail a:focus-visible:before{transform:translateY(0)}
.service-rail a:hover>span{transform:translate(3px,-3px)}
.motion-reduced .products .section-heading>div,.motion-reduced .products .section-heading>p,.motion-reduced .product-photo,.motion-reduced .product-copy,.motion-reduced .product-photo>span{transform:none}
@media(max-width:760px){.product-photo,.product-copy,.product-photo>span,.products .section-heading>div,.products .section-heading>p{transform:none}}
@media(prefers-reduced-motion:reduce){.product-photo,.product-copy,.product-photo>span,.products .section-heading>div,.products .section-heading>p{transform:none}}

/* Brand alignment: identity v1.2, strategy April 2026, tonality May 2026. */
@font-face{font-family:GreedNarrow;src:url('/assets/GreedNarrow-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
:root{--calm-blue:#CED7FF;--light-blue:#E1E7FF;--light-purple:#7423E5;--pink:#E61662}
h1,h2,.product-copy>h3{font-family:GreedNarrow,Greed,Arial,sans-serif;font-weight:700;letter-spacing:-.02em;line-height:.95}
.hero h1{font-family:GreedNarrow,Greed,Arial,sans-serif;font-weight:700;line-height:.97;letter-spacing:-.02em}
.hero h1 span{color:#9e65ed;color:color-mix(in srgb,var(--light-purple) 70%,white)}
.hero-shade{background:linear-gradient(90deg,#111111ed 0%,#111111b5 37%,#11111120 64%,transparent 82%),linear-gradient(0deg,#11111135,transparent 42%)}
h2>span{color:var(--purple)}
.app-copy h2>span,.makker-heading h2>span,.closing h2>span{color:var(--calm-blue)}
.hero-description{letter-spacing:.01em}
.button,.hero-actions .button,.navigation .nav-cta,.navigation.light .nav-cta{border-radius:14px}
.navigation nav{background:#e1e7ff80;border-color:#ced7ff;border-radius:14px}
.navigation nav a{border-radius:9px}
.navigation .nav-cta>span,.hero-actions .button>span{border-radius:9px;background:var(--purple)}
.navigation.light{background:#f7f7f7f2}
.detail-switch{border-radius:14px;background:var(--light-blue);border-color:var(--calm-blue)}
.detail-switch button{border-radius:9px}
.detail-stage .screen-shell,.screen-shell{background:var(--light-blue)}
.product-photo{border-radius:18px 18px 48px 18px}
.eyebrow{letter-spacing:.08em}
@media(max-width:540px){.hero h1{line-height:.99}.hero-shade{background:linear-gradient(90deg,#111111eb,#11111165 100%),linear-gradient(0deg,#11111155,transparent 65%)}.product-photo{border-radius:14px 14px 32px 14px}}

.product-photo>span{font-family:GreedNarrow,Greed,Arial,sans-serif;font-weight:700;letter-spacing:-.02em}

/* Vibrant Pink is the secondary brand accent, reserved for bold moments and actions. */
.hero h1 span{color:var(--pink)}
.navigation .nav-cta>span,.hero-actions .button>span{background:var(--pink)}
.reading-progress{background:var(--pink)}
.mark-tile{background:var(--pink)}.mark-tile img{filter:brightness(0) invert(1)}
.closing h2>span{color:var(--pink)}
.closing{background:var(--deep)}
@media(max-width:540px){.hero-shade{background:linear-gradient(90deg,#111111ee,#111111b8 100%),linear-gradient(0deg,#11111155,transparent 65%)}}
/* Showcase surfaces share Mijn Makkelijk's lavender glass tray. */
#overview .screen-shell,#product-in-detail .screen-shell{position:relative;padding:8px;border:1px solid #ded9e6a6;border-radius:24px;background:#eae7eec9;box-shadow:inset 0 1px 0 #ffffffc4,0 24px 60px -42px #4f0fa93b;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);overflow:hidden}
#product-in-detail .screen-shell>img{border-radius:17px;background:#f4f3f6}
.showcase-icon{width:22px;height:22px;display:block;flex-shrink:0}
#overview .showcase-expand,#product-in-detail .showcase-expand{position:absolute;z-index:5;top:18px;right:18px;width:39px;height:39px;display:grid;place-items:center;padding:0;background:#ffffffe6;color:var(--deep);border:1px solid #ded9e6;border-radius:12px;box-shadow:0 3px 14px #370a7610;backdrop-filter:blur(12px);transition:background .25s,transform .25s}
#overview .showcase-expand:hover,#product-in-detail .showcase-expand:hover{background:white;transform:translateY(-2px)}
.showcase-expand .showcase-icon{width:18px;height:18px}
#overview .overview-visual{transform:translateY(var(--overview-frame-y,0px));will-change:transform}
#product-in-detail .section-heading{transform:translateY(var(--detail-copy-y,0px))}
#product-in-detail .detail-benefits{gap:28px;margin-top:30px}
#product-in-detail .detail-benefit{display:flex;gap:16px;align-items:flex-start;padding:22px 0;border-top:1px solid #ded9e6;min-width:0}
.detail-benefit-icon{display:grid;place-items:center;flex-shrink:0;width:40px;height:40px;border-radius:12px;background:#eae7eec9;color:var(--deep);border:1px solid #ded9e6a6;box-shadow:inset 0 1px 0 #ffffffb3}
#product-in-detail .detail-benefit h3{font-size:17px;font-weight:500;color:var(--deep);letter-spacing:-.025em;line-height:1.3;margin:1px 0 8px}
#product-in-detail .detail-benefit p{font-size:12px;line-height:1.7;border:0;padding:0;margin:0;color:var(--muted)}
@media(max-width:1000px){#overview .overview-visual,#product-in-detail .detail-stage,#product-in-detail .section-heading{transform:none;will-change:auto}}
@media(max-width:760px){#product-in-detail .detail-benefits{gap:20px}#product-in-detail .detail-benefit{gap:12px}.detail-benefit-icon{width:34px;height:34px;border-radius:10px}.detail-benefit-icon .showcase-icon{width:19px;height:19px}}
@media(max-width:540px){#overview .screen-shell,#product-in-detail .screen-shell{padding:5px;border-radius:15px}#product-in-detail .screen-shell>img{border-radius:10px}#overview .showcase-expand,#product-in-detail .showcase-expand{top:12px;right:12px;width:32px;height:32px;border-radius:10px}#product-in-detail .detail-benefits{grid-template-columns:1fr;gap:0}#product-in-detail .detail-benefit{padding:20px 0}#product-in-detail .detail-benefit h3{font-size:17px}}
.motion-reduced #overview .overview-visual,.motion-reduced #product-in-detail .detail-stage,.motion-reduced #product-in-detail .section-heading{transform:none;will-change:auto}
@media(prefers-reduced-motion:reduce){#overview .overview-visual,#product-in-detail .detail-stage,#product-in-detail .section-heading{transform:none;will-change:auto}.showcase-expand{transition:none!important}}

/* Section headings lead directly; product benefits use the application's own icon set. */
.hero h1 span{color:var(--calm-blue)}
.navigation .nav-cta>span,.hero-actions .button>span{background:var(--purple)}
.feature-list{margin-top:28px}
.feature-list li{gap:18px;padding:20px 0;align-items:flex-start}
.feature-list li>.feature-icon{display:block;flex:0 0 24px;width:24px;height:24px;margin-top:2px;padding:0;background:var(--purple);-webkit-mask:var(--feature-icon) center/contain no-repeat;mask:var(--feature-icon) center/contain no-repeat}
.feature-list li>div{min-width:0}
.feature-list b{display:block;font-size:16px;line-height:1.35}
.feature-list p{font-size:13px;line-height:1.65;margin-top:6px;max-width:410px}
@media(max-width:540px){.feature-list li{gap:16px;padding:18px 0}.feature-list b{font-size:15px}.feature-list p{font-size:13px}}
#product-in-detail .detail-switch{background:#eae7eec9;border-color:#ded9e6a6;box-shadow:inset 0 1px 0 #ffffffb3;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
#product-in-detail .detail-switch button[aria-selected=true]{color:var(--deep);box-shadow:0 2px 7px #370a7608}

/* One clear header surface, with direct navigation and account access. */
.navigation,.navigation.light,.navigation:not(.light){height:80px;background:var(--paper);color:var(--ink);border-bottom:1px solid #1111110d;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
.navigation .brand img,.navigation.light .brand img,.navigation:not(.light) .brand img{filter:none;width:180px}
.navigation nav,.navigation:not(.light) nav{padding:0;border:0;border-radius:0;background:none;gap:32px}
.navigation nav a{position:relative;padding:8px 0;font-size:14px;border-radius:0;white-space:nowrap}
.navigation nav a:hover,.navigation nav a[aria-current],.navigation:not(.light) nav a:hover,.navigation:not(.light) nav a[aria-current]{background:none;color:var(--purple)}
.navigation nav a:after{display:block;bottom:1px;height:2px;background:var(--purple);transform:scaleX(0);transition:transform .3s var(--ease)}
.navigation nav a:hover:after,.navigation nav a[aria-current]:after{transform:scaleX(1)}
.navigation .nav-cta,.navigation.light .nav-cta,.navigation:not(.light) .nav-cta{padding:11px 16px;background:var(--purple);border:0;border-radius:12px;gap:18px;color:white;font-size:13px}
.navigation .nav-cta>span{background:none;width:auto;height:auto;font-size:18px}
.reading-progress{background:var(--purple);opacity:.45}
@media(max-width:1100px){.navigation nav{gap:22px}.navigation nav a{font-size:13px}.navigation .brand img{width:155px}.navigation .nav-cta{font-size:12px}}
@media(max-width:760px){.navigation,.navigation.light,.navigation:not(.light){height:70px}.navigation nav{display:none}.navigation .brand img,.navigation.light .brand img,.navigation:not(.light) .brand img{width:150px}}
@media(max-width:540px){.navigation,.navigation.light,.navigation:not(.light){height:66px}.navigation .nav-cta{display:none}.navigation .brand img,.navigation.light .brand img,.navigation:not(.light) .brand img{width:145px}}

/* A quieter opening and a static product view: no dashboard pinning or scroll zoom. */
.hero h1{font-size:clamp(76px,7.7vw,120px);line-height:.91;letter-spacing:-.02em}
.hero h1 span{color:white}
.hero-copy{top:51%;max-width:650px}
.hero-description{margin-top:28px;font-size:18px;line-height:1.6}
.hero-shade{background:linear-gradient(90deg,#211727d9 0%,#24192786 35%,#24192720 62%,transparent 80%)}
.hero-actions .button{background:var(--purple);color:white;padding:17px 23px;font-size:14px;gap:27px}
.hero-actions .button>span{background:none;width:auto;height:auto;border-radius:0;font-size:20px}
.overview-section{height:auto!important;background:var(--paper);padding:95px var(--page)}
.overview-intro{display:grid;grid-template-columns:1.25fr 1fr;gap:70px;align-items:end;max-width:1280px;margin:0 auto 40px}
.overview-intro h2{font-size:clamp(44px,4.5vw,68px)}
.overview-intro>div{max-width:430px;justify-self:end}
.overview-intro p{font-size:16px;color:var(--muted);line-height:1.7}
.overview-static{max-width:1280px;margin:auto;position:relative;transform:none!important;padding:7px;background:var(--light-blue);border-radius:20px;overflow:hidden}
.overview-static>img{width:100%;height:auto;border-radius:14px;transform:none!important}
.overview-benefits{max-width:1280px;margin:35px auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.overview-benefits>div{display:flex;gap:17px;border-top:1px solid var(--line);padding-top:22px}
.overview-benefits .feature-icon{width:25px;height:25px;flex:0 0 25px;background:var(--purple);-webkit-mask:var(--feature-icon) center/contain no-repeat;mask:var(--feature-icon) center/contain no-repeat}
.overview-benefits h3{font-size:17px;line-height:1.3;margin-bottom:8px}
.overview-benefits p{font-size:13px;line-height:1.65;color:var(--muted)}
.detail-stage,#product-in-detail .section-heading{transform:none!important;will-change:auto}
.makker-layout{align-items:start;gap:55px}
.makker-questions{padding-top:0}
.makker-questions>button{padding:23px 0;font-size:17px}
.question-explanation{min-height:0;border-left:2px solid var(--pink);padding:0 0 0 20px;margin-top:28px}
#question-title{font-size:21px;line-height:1.25}
#question-copy{font-size:14px;line-height:1.7;margin-top:13px}
.phone-duo{height:740px;max-width:620px}
.phone-front{height:96%;left:6%;right:auto;top:0;z-index:1;transform:translateY(var(--app-front-y,0px)) rotate(-3deg)}
.phone-back{height:67%;left:auto;right:0;top:27%;z-index:2;transform:translateY(var(--app-back-y,0px)) rotate(6deg);filter:drop-shadow(-14px 25px 23px #21064b65);animation:phone-hover 6s ease-in-out infinite}
@keyframes phone-hover{0%,100%{translate:0 -8px}50%{translate:0 8px}}
.motion-reduced .phone-back{animation:none;translate:none;transform:rotate(6deg)}
@media(max-width:1100px){.phone-duo{height:650px}.hero h1{font-size:clamp(72px,8vw,100px)}}
@media(max-width:760px){.overview-intro{grid-template-columns:1fr;gap:25px}.overview-intro>div{justify-self:start}.overview-benefits{grid-template-columns:1fr;gap:22px}.phone-duo{height:680px;max-width:520px}}
@media(max-width:540px){.hero-copy{top:24%;max-width:none}.hero h1{font-size:clamp(66px,17vw,85px)}.hero-description{font-size:14px;line-height:1.6;margin-top:24px}.hero-actions .button{padding:15px 20px;font-size:13px}.hero-shade{background:linear-gradient(90deg,#211727dc,#21172770 100%)}.overview-section{padding:70px 24px}.overview-intro{margin-bottom:30px}.overview-intro h2{font-size:46px}.overview-intro p{font-size:14px}.overview-static{border-radius:15px;padding:5px}.overview-static>img{border-radius:10px}.overview-benefits{margin-top:25px}.phone-duo{height:560px;max-width:350px}.phone-front{height:95%;left:0;max-width:none}.phone-back{height:65%;right:-1%;top:29%;max-width:none}.makker-layout{gap:32px}}
@media(max-height:600px){.hero-copy{top:90px}.hero h1{font-size:58px}.hero-description{font-size:12px;margin-top:18px}.hero-actions{margin-top:20px}.hero-actions .button{font-size:12px;padding:12px 18px}}
@media(prefers-reduced-motion:reduce){.phone-back{animation:none;translate:none}}

/* Reference alignment: calm blue canvas, purple type, and purposeful single entrances. */
.hero{background:var(--calm-blue);color:var(--purple);overflow:hidden}
.hero-photo{inset:108px var(--page) 30px auto;width:46%;height:auto;border-radius:24px;overflow:hidden;z-index:-1}
.hero-photo img,.hero-video{object-position:76% center;transform:none!important}
.hero-shade{display:none}
.hero-copy{left:var(--page);top:53%;width:42%;max-width:640px}
.hero h1,.hero h1 span{color:var(--purple)}
.hero-line{display:block;animation:brand-land .6s cubic-bezier(.16,1.12,.32,1) both}
.hero-line+ .hero-line{animation-delay:.09s}
@keyframes brand-land{from{transform:translateY(28px)}70%{transform:translateY(-3px)}to{transform:translateY(0)}}
.hero-description{color:var(--deep);font-size:17px;max-width:460px}
.hero-actions .subtle-link{color:var(--purple);border-bottom-color:#4f0fa950}
.hero-bottom{right:calc(var(--page) + 18px);bottom:43px}
.hero-motion{color:white;text-shadow:0 1px 5px #11111180}
.hero-copy .entrance{animation:brand-land .65s cubic-bezier(.16,1.12,.32,1) both}
.hero-copy p.entrance{animation-delay:.16s}.hero-copy .hero-actions.entrance{animation-delay:.24s}
h2{color:var(--purple)}
.app-section h2,.closing h2{color:white}
.makker-section{background:var(--calm-blue);color:var(--purple)}
.makker-heading h2,.makker-heading h2>span{color:var(--purple)}
.makker-heading>p:last-child,.makker-questions>button,.question-explanation p,#question-copy{color:var(--deep)}
.makker-questions>button{border-color:#4f0fa930}
.makker-questions>button[aria-pressed=true]{color:var(--purple);border-bottom-color:var(--purple)}
.makker-questions>button>span{color:var(--purple)}
.phone-back{animation:none;translate:none}
.js .reveal{opacity:1;transition:transform .6s cubic-bezier(.16,1.12,.32,1)}
@media(max-width:1100px){.hero h1{font-size:clamp(62px,7.5vw,96px)}.hero-photo{width:46%}.hero-description{font-size:15px}.hero-actions{gap:20px}.hero-actions .button{font-size:13px;padding:15px 18px}}
@media(max-width:760px){.hero-photo{inset:95px 24px 28px auto;width:43%}.hero-copy{width:47%;top:51%;left:24px}.hero h1{font-size:clamp(54px,7.7vw,72px)}.hero-description{font-size:14px}.hero-actions{flex-direction:column;align-items:flex-start;gap:14px}.hero-actions .button{font-size:12px}.hero-bottom{right:35px;bottom:40px}}
@media(max-width:540px){.hero-photo{inset:80px 16px auto auto;width:44%;height:43%;border-radius:18px}.hero-copy{top:42%;left:24px;right:24px;width:auto;transform:none}.hero h1{font-size:clamp(64px,17vw,85px);line-height:.94;max-width:85%}.hero-description{font-size:14px;max-width:310px;margin-top:20px}.hero-actions{flex-direction:row;align-items:center;gap:18px;margin-top:20px}.hero-actions .button{font-size:12px;padding:13px 16px;gap:17px}.hero-actions .subtle-link{font-size:10px;gap:9px}.hero-bottom{top:95px;right:28px;bottom:auto}.hero-motion .motion-label{display:none}.hero-line+ .hero-line{animation-delay:.07s}}
@media(max-height:600px){.hero-photo{top:92px;bottom:20px}.hero-copy{top:105px;transform:none}.hero h1{font-size:54px}.hero-description{font-size:12px;margin-top:17px}.hero-actions{margin-top:17px}.hero-bottom{bottom:32px}}
.motion-reduced .hero-line{animation:none;transform:none}
@media(prefers-reduced-motion:reduce){.hero-line{animation:none;transform:none}}

/* Reference bento: one real screen, one blue information tile, one pink action tile. */
.hero-photo .hero-makker{position:absolute;inset:auto auto 24px 24px;width:130px;height:auto;max-width:24%;object-fit:contain;transform:none!important;z-index:3;pointer-events:none}
.hero-actions .button{background:var(--pink)}
.account-bento{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(280px,1fr);grid-template-rows:auto auto;gap:18px;max-width:1280px;margin:auto}
.bento-screen{grid-row:span 2;position:relative;background:var(--light-blue);padding:7px;border-radius:20px;overflow:hidden;display:flex;align-items:center}
.bento-screen>img{width:100%;height:auto;border-radius:14px}
.bento-screen .showcase-expand{position:absolute;right:18px;top:18px;z-index:2}
.bento-details,.bento-makker{padding:30px;border-radius:20px;min-width:0}
.bento-details{background:var(--calm-blue);color:var(--purple)}
.bento-details>h3,.bento-makker h3{font-family:GreedNarrow,Greed,sans-serif;font-weight:700;font-size:35px;line-height:.98;letter-spacing:-.02em}
.bento-details .overview-benefits{display:block;margin-top:26px}
.bento-details .overview-benefits>div{padding-top:16px;margin-top:16px;gap:14px;border-top-color:#4f0fa928}
.bento-details h4{font-size:14px;font-weight:500;line-height:1.3;margin:0 0 6px}
.bento-details p{font-size:12px;color:var(--deep)}
.bento-makker{background:var(--pink);color:white;position:relative}
.bento-makker>.feature-icon{display:block;width:40px;height:34px;background:white;-webkit-mask:var(--feature-icon) center/contain no-repeat;mask:var(--feature-icon) center/contain no-repeat;margin-bottom:20px}
.bento-makker p{font-size:13px;line-height:1.6;margin-top:15px;max-width:270px}
.bento-link{display:flex;justify-content:space-between;gap:18px;border-top:1px solid #ffffff55;padding-top:17px;margin-top:22px;font-size:12px}
.product-contact>span,.app-expand>span{color:var(--pink)}
.closing-content{background:var(--pink);border-radius:24px;padding:65px 35px;max-width:1280px;margin:auto}
.closing h2>span{color:var(--deep)}
.closing-content>p:not(.eyebrow){color:white}
.closing .subtle-link{color:white}
.detail-switch{flex-wrap:wrap}
@media(max-width:1100px){.account-bento{grid-template-columns:minmax(0,1.4fr) minmax(270px,1fr)}.bento-details,.bento-makker{padding:26px}.bento-details>h3,.bento-makker h3{font-size:31px}}
@media(max-width:760px){.account-bento{grid-template-columns:1fr 1fr}.bento-screen{grid-column:1/-1;grid-row:auto}.bento-details,.bento-makker{padding:25px}.hero-photo .hero-makker{width:100px;left:18px;bottom:18px}}
@media(max-width:540px){.account-bento{grid-template-columns:1fr;gap:14px}.bento-screen{grid-column:auto}.bento-details,.bento-makker{padding:27px;border-radius:16px}.bento-details>h3,.bento-makker h3{font-size:35px}.hero-photo{height:29%}.hero-photo .hero-makker{width:65px;max-width:40%;left:12px;bottom:12px}.hero-copy{top:40%}.closing-content{padding:40px 22px;border-radius:18px}.closing h2{font-size:48px}.detail-switch button{font-size:10px;padding:10px 9px}}

/* Shared gutters and stronger lower-page editorial rhythm. */
.overview-intro,.account-bento,.overview-static,.overview-benefits,.detail-stage,.detail-benefits{max-width:none}
.life-copy h2{color:white}
.navigation:not(.light){background:var(--calm-blue);border-bottom-color:transparent}
.navigation .nav-cta,.navigation.light .nav-cta,.navigation:not(.light) .nav-cta{background:transparent;color:var(--purple);border:1px solid #4f0fa93b;padding:10px 14px;gap:9px;font-size:13px}
.navigation .nav-cta .account-icon{display:block;width:19px;height:19px;background:var(--purple);-webkit-mask:url('/assets/icons/account.svg') center/contain no-repeat;mask:url('/assets/icons/account.svg') center/contain no-repeat}
.hero-benefits{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;padding:0;margin:24px 0 0;font-size:13px;line-height:1.4;max-width:470px}
.hero-benefits li{display:flex;align-items:center;gap:9px}
.hero-benefits li:before{content:'✓';font-size:16px;font-weight:700}
.hero-actions{margin-top:25px}
.esim-section{background:var(--light-blue);padding:95px var(--page);grid-template-columns:1.2fr .8fr;gap:70px;align-items:center}
.esim-copy{max-width:none}.esim-copy h2{font-size:clamp(50px,5vw,76px)}
.esim-cards{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:32px}
.esim-info{background:var(--calm-blue);padding:27px;border-radius:18px;color:var(--purple)}
.esim-info .feature-icon{display:block;width:28px;height:28px;background:currentColor;-webkit-mask:var(--feature-icon) center/contain no-repeat;mask:var(--feature-icon) center/contain no-repeat;margin-bottom:28px}
.esim-info h3{font-family:GreedNarrow,Greed,sans-serif;font-size:30px;font-weight:700;line-height:1;letter-spacing:-.02em}
.esim-info p{font-size:13px;line-height:1.65;margin-top:15px}
.pink-info{background:var(--pink);color:white}
.esim-preview{display:flex;justify-content:space-between;align-items:center;width:100%;gap:15px;background:none;border:0;border-top:1px solid #ffffff66;padding:17px 0 0;margin-top:25px;color:white;font-size:12px;text-align:left}
.esim-visual{height:640px;max-width:365px;justify-self:center;width:100%}
.esim-visual>img{height:100%;max-width:100%;filter:drop-shadow(0 20px 25px #370a7625)}
.day-story{display:grid;grid-template-columns:1fr 1fr;gap:12%;align-items:start;background:var(--paper)}
.day-intro{position:sticky;top:150px;max-width:500px;transform:translateY(var(--day-copy-y,0px))}
.day-intro h2{font-size:clamp(50px,5vw,76px)}
.day-intro>p{font-size:17px;line-height:1.7;color:var(--muted);margin-top:28px}
.day-stack{display:grid;gap:17px}
.day-note{background:var(--calm-blue);border-radius:18px;padding:30px;color:var(--purple)}
.day-note h3{font-family:GreedNarrow,Greed,sans-serif;font-weight:700;font-size:34px;letter-spacing:-.02em}
.day-note p{font-size:14px;line-height:1.7;margin-top:15px;max-width:440px}
.pink-note{background:var(--pink);color:white}
.pink-note a{display:flex;justify-content:space-between;border-top:1px solid #ffffff60;padding-top:20px;margin-top:24px;font-size:13px}
.day-photo{margin:0;border-radius:18px;overflow:hidden;height:560px;transform:translateY(var(--day-photo-y,0px))}
.day-photo>img{width:100%;height:100%;object-fit:cover;object-position:center}
.choose-section{background:var(--light-blue)}







.choose-action{margin-top:auto;padding-top:18px;border-top:1px solid #ffffff55;font-size:12px}
.closing{background:var(--calm-blue);color:var(--purple);padding-top:85px;padding-bottom:0}
.closing-content{display:grid;grid-template-columns:1fr .45fr;gap:70px;text-align:left;background:none;border-radius:0;padding:0;margin:0;max-width:none;align-items:center}
.closing-message h2,.closing h2>span{font-size:clamp(52px,5.3vw,82px);color:var(--purple)}
.closing-message>p{font-size:17px;margin-top:25px;color:var(--deep)}
.closing-content>img{width:240px;max-width:100%;height:auto;justify-self:center}
.closing-actions{justify-content:flex-start;margin-top:28px}
.closing-actions .button{background:var(--pink);color:white;border-radius:14px}
.closing .subtle-link{color:var(--purple);border-bottom-color:#4f0fa955}
.closing footer{background:var(--purple);color:white;margin:75px calc(-1 * var(--page)) 0;padding:45px var(--page) 25px;border:0}
@media(max-width:1100px){.hero-benefits{font-size:12px;gap:9px 15px}.hero h1{font-size:clamp(62px,7vw,90px)}.esim-section{gap:40px;grid-template-columns:1.2fr .8fr}.esim-cards{grid-template-columns:1fr}.esim-info{padding:24px}.esim-info .feature-icon{margin-bottom:20px}.esim-visual{height:660px}}
@media(max-width:760px){.day-story{grid-template-columns:1fr;gap:35px}.day-intro{position:static;transform:none;max-width:none}.day-photo{height:580px;transform:none}.esim-section{grid-template-columns:1fr;gap:45px}.esim-cards{grid-template-columns:1fr 1fr}.esim-visual{height:620px}.closing-content{grid-template-columns:1fr .3fr;gap:30px}.closing-actions{gap:22px}.hero-benefits{grid-template-columns:1fr;font-size:12px;gap:7px}}
@media(max-width:540px){.hero-copy{top:32%}.hero h1{font-size:clamp(56px,15.5vw,66px)}.hero-photo{height:24%}.hero-benefits{grid-template-columns:1fr 1fr;font-size:10px;gap:8px 13px;margin-top:14px}.hero-benefits li{gap:7px}.hero-benefits li:before{font-size:13px}.hero-description{font-size:12px;margin-top:18px}.hero-actions{margin-top:16px}.hero-actions .button{font-size:11px;padding:12px 14px}.esim-section{padding:70px 24px}.esim-copy h2{font-size:47px}.esim-cards{grid-template-columns:1fr}.esim-info{padding:28px}.esim-info h3{font-size:32px}.esim-visual{height:570px}.day-photo{height:440px}.day-note{padding:27px}.day-note h3{font-size:32px}.day-intro h2{font-size:49px}.choose-action{font-size:10px}.closing-content{display:block}.closing-content>img{width:100px;margin:35px 0 0}.closing-message h2{font-size:50px}.closing-message>p{font-size:15px}.closing-actions{align-items:flex-start;gap:18px}.closing footer{margin-top:45px}.hero-line{animation-duration:.5s}}
.motion-reduced .day-intro,.motion-reduced .day-photo{transform:none}
@media(prefers-reduced-motion:reduce){.day-intro,.day-photo{transform:none}}

/* Real feature storytelling replaces the numbered filler section. */
.billing-section{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:center;background:var(--deep);color:white;overflow:hidden}
.billing-copy{transform:translateY(var(--billing-copy-y,0px))}
.billing-copy h2{color:white;font-size:clamp(48px,5vw,76px)}
.billing-copy>p{font-size:17px;line-height:1.7;color:#e1e7ff;margin-top:28px;max-width:440px}
.billing-copy ul{list-style:none;margin:30px 0;padding:0}
.billing-copy li{display:flex;gap:17px;padding:20px 0;border-top:1px solid #ffffff30}
.billing-copy .feature-icon{display:block;flex:0 0 24px;width:24px;height:24px;background:var(--calm-blue);-webkit-mask:var(--feature-icon) center/contain no-repeat;mask:var(--feature-icon) center/contain no-repeat}
.billing-copy h3{font-size:17px;line-height:1.3;margin-bottom:7px}
.billing-copy li p{font-size:13px;color:#e1e7ff;line-height:1.65}
.billing-copy .button{background:var(--pink);color:white;font-size:13px}
.billing-screen{position:relative;padding:7px;background:var(--calm-blue);border-radius:19px;transform:translateY(var(--billing-screen-y,0px))}
.billing-screen>img{width:100%;height:auto;border-radius:13px}
.billing-screen .showcase-expand{position:absolute;top:18px;right:18px;z-index:2}
.js .reveal-media{clip-path:inset(5% 0 0 round 18px);transition:clip-path .85s cubic-bezier(.16,1.12,.32,1),transform .85s cubic-bezier(.16,1.12,.32,1)}
.js .reveal-media.visible{clip-path:inset(0 round 18px)}
.bento-makker.reveal{transition-delay:.09s}
.navigation nav a{color:var(--purple)}
@media(max-width:1000px){.billing-section{grid-template-columns:1fr;gap:40px}.billing-copy{max-width:650px}.billing-copy,.billing-screen{transform:none}.billing-screen{max-width:none}}
@media(max-width:540px){.billing-copy h2{font-size:48px}.billing-copy>p{font-size:15px}.billing-copy li p{font-size:13px}.billing-screen{padding:5px;border-radius:14px}.billing-screen>img{border-radius:9px}}
.motion-reduced .billing-copy,.motion-reduced .billing-screen{transform:none}
.motion-reduced .reveal-media{clip-path:none}
@media(prefers-reduced-motion:reduce){.billing-copy,.billing-screen{transform:none}.js .reveal-media{clip-path:none}}
@supports(interpolate-size:allow-keywords){:root{interpolate-size:allow-keywords}.faq-list details::details-content{height:0;overflow:clip;transition:height .35s var(--ease),content-visibility .35s allow-discrete}.faq-list details[open]::details-content{height:auto}}

/* Branded chapter wipes: a graphic hand-off between product stories. */
.section-heading.reveal,.makker-heading.reveal,.life-copy.reveal,.closing-content.reveal,.line-heading.reveal{transform:none!important}
.line-heading>.heading-line{display:block;color:inherit;clip-path:inset(-15% -2% -20%);transform:none;transition:transform .65s cubic-bezier(.16,1.12,.32,1),clip-path .65s cubic-bezier(.16,1.12,.32,1);transition-delay:calc(var(--line-index) * 80ms)}
.js .line-heading.reveal:not(.visible)>.heading-line{clip-path:inset(0 0 100%);transform:translateY(25px)}

@media(max-width:400px){.choose-action{font-size:12px}}

.motion-reduced .line-heading>.heading-line{clip-path:none!important;transform:none!important;transition:none}
@media(prefers-reduced-motion:reduce){.line-heading>.heading-line{clip-path:none!important;transform:none!important;transition:none}}

/* Makker is a distinct companion: bold cutouts and speech bubbles beside the copy. */
.brand-compositions{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding-top:0;padding-bottom:100px;background:var(--paper)}
.brand-compositions article{position:relative;min-height:490px;overflow:hidden;border-radius:24px;isolation:isolate}
.brand-promise{background:var(--purple);color:white;padding:36px;display:flex;align-items:flex-end}
.composition-makker{display:block;background:var(--pink);-webkit-mask:url('/assets/mark.svg') center/contain no-repeat;mask:url('/assets/mark.svg') center/contain no-repeat}
.brand-promise .composition-makker{position:absolute;width:85%;height:65%;left:8%;top:-15%;transform:translateY(var(--brand-lift,0px)) rotate(var(--brand-tilt,0deg))}
.brand-promise h2{font-size:clamp(32px,3.8vw,62px);line-height:.98;position:relative;margin:0;max-width:95%;color:white}
.brand-companion{background:var(--calm-blue)}
.brand-companion .composition-makker{position:absolute;inset:30px 30px 65px;transform:translateY(calc(var(--brand-lift,0px) * -.45)) rotate(calc(var(--brand-tilt,0deg) * -1))}
.brand-bubble{position:absolute;right:30px;top:30px;padding:28px 32px;background:var(--purple);color:white;border-radius:55px 55px 55px 0;font-family:GreedNarrow,sans-serif;font-weight:700;font-size:clamp(28px,3vw,48px);line-height:1;transform:translateY(calc(var(--brand-lift,0px) * -.7))}
.composition-link{position:absolute;bottom:26px;left:30px;right:30px;display:flex;justify-content:space-between;color:var(--purple);font-size:14px;font-weight:600}
.makker-invitation{background:var(--calm-blue);display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center;padding-top:80px;padding-bottom:80px;overflow:hidden}
.invitation-copy h2{font-size:clamp(44px,5vw,78px);margin:0 0 24px;color:var(--purple)}
.invitation-copy .button{background:var(--pink);color:white;border-radius:14px}
.invitation-copy p{line-height:1.7;margin-bottom:28px;color:var(--purple)}
.invitation-art{position:relative;height:310px}
.invitation-art .composition-makker{position:absolute;inset:20px 20px -20px;transform:translateY(var(--brand-lift,0px)) rotate(var(--brand-tilt,0deg))}
.invitation-art .brand-bubble{top:0;right:0;font-size:clamp(28px,3vw,46px)}
.motion-reduced .composition-makker,.motion-reduced .brand-bubble{transform:none!important}
@media(max-width:1000px){.brand-compositions article{min-height:390px}.brand-promise{padding:28px}.brand-promise h2{font-size:42px}.brand-bubble{padding:24px;font-size:32px}}
@media(max-width:760px){.brand-compositions{grid-template-columns:1fr;gap:16px;padding-bottom:64px}.brand-compositions article{min-height:390px}.brand-promise h2{font-size:clamp(36px,8vw,52px)}.makker-invitation{grid-template-columns:1fr;gap:16px;padding-block:64px}.invitation-art{height:280px;max-width:430px;width:100%;justify-self:center}}
@media(prefers-reduced-motion:reduce){.composition-makker,.brand-bubble{transform:none!important}}

/* A crisp blue Makker silhouette integrates the hero canvas with the photograph. */
.hero-background-makker{position:absolute;z-index:-2;right:24%;bottom:-38%;width:67%;height:90%;background:var(--dark-calm-blue,#A4B5FF);-webkit-mask:url('/assets/mark.svg') center bottom/contain no-repeat;mask:url('/assets/mark.svg') center bottom/contain no-repeat;pointer-events:none}
@media(max-width:760px){.hero-background-makker{right:15%;bottom:-30%;width:80%;height:75%}}
@media(max-width:540px){.hero-background-makker{right:-12%;bottom:-25%;width:90%;height:60%}.hero-photo{height:125px;top:80px}.hero-photo img,.hero-video{object-position:76% 32%}.hero-photo .hero-makker{width:45px;left:10px;bottom:10px}}

/* A single horizontal brand stripe bridges home and the app chapter. */
.brand-ribbon{height:170px;position:relative;overflow:hidden;background:var(--purple)}
.ribbon-track{position:absolute;inset-block:-25px;left:-40%;width:180%;display:flex;gap:4%;align-items:center;transform:translateX(var(--ribbon-x,0%));will-change:transform}
.ribbon-track span{display:block;flex:0 0 9%;aspect-ratio:160/114;background:var(--calm-blue);-webkit-mask:url('/assets/mark.svg') center/contain no-repeat;mask:url('/assets/mark.svg') center/contain no-repeat;transform:rotate(-8deg)}
.ribbon-track span:nth-child(even){background:var(--pink);transform:rotate(8deg)}
.motion-reduced .ribbon-track{transform:none;will-change:auto}
@media(max-width:760px){.brand-ribbon{height:115px}.ribbon-track{width:240%;left:-70%;gap:5%}.ribbon-track span{flex-basis:11%}}
@media(prefers-reduced-motion:reduce){.ribbon-track{transform:none;will-change:auto}}

/* Choose section — reference "Alle vier bij Makkelijk" cards + motion guide (fast in, overshoot, settle; 80ms line/card offset). */
:root{--spring:cubic-bezier(.16,1.12,.32,1);--snap:cubic-bezier(.34,1.56,.64,1)}
@supports(transition-timing-function:linear(0,1)){:root{--spring:linear(0,.22 6%,.6 14%,.9 23%,1.045 32%,1.07 39%,1.04 50%,1.005 62%,.996 75%,1)}}
.choose-section{position:relative;overflow:hidden;background:var(--light-blue)}
.choose-heading{transform:translateY(calc(var(--choices-y,0px) * -.6))}
.choice-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:start}
.js .choice-grid.reveal{opacity:1;transform:none}
.choice-card{--lift:0px;position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;min-height:440px;padding:30px 28px 26px;border-radius:24px;background:var(--purple);color:white;transform:translateY(calc(var(--choices-y,0px) * var(--depth,1) + var(--lift)));transition:--lift .5s var(--spring),background .4s,box-shadow .5s var(--ease);box-shadow:0 1px 0 #ffffff18 inset}
.choice-card:nth-child(2){background:var(--deep)}.choice-card:nth-child(3){background:#5B17C2}.choice-card:nth-child(4){background:var(--deep)}
@property --lift{syntax:'<length>';inherits:false;initial-value:0px}
.choice-card:hover,.choice-card:focus-within{--lift:-10px;box-shadow:0 30px 50px -28px #370a7690}
.choice-makker{position:absolute;z-index:-1;right:-14%;top:-9%;width:62%;aspect-ratio:160/114;background:var(--pink);-webkit-mask:url('/assets/mark.svg') center/contain no-repeat;mask:url('/assets/mark.svg') center/contain no-repeat;transform:translateY(calc(var(--choices-y,0px) * var(--depth,1) * -1.4)) rotate(-4deg);transition:translate .55s var(--spring),rotate .55s var(--spring)}
.choice-card:nth-child(even) .choice-makker{background:var(--calm-blue);opacity:.2}
.choice-card:nth-child(odd) .choice-makker{opacity:.92}
.choice-card:hover .choice-makker{translate:0 -14px;rotate:6deg}
.choice-icon{display:grid;place-items:center;width:58px;height:58px;border-radius:18px;background:#ffffff1c;box-shadow:0 0 0 1px #ffffff22 inset;margin-bottom:38px;transition:transform .45s var(--snap)}
.choice-icon .feature-icon{display:block;width:26px;height:26px;background:white;-webkit-mask:var(--feature-icon) center/contain no-repeat;mask:var(--feature-icon) center/contain no-repeat}
.choice-card:hover .choice-icon{animation:makker-yes .5s var(--ease)}
.choice-card h3{font-family:GreedNarrow,Greed,sans-serif;font-weight:700;font-size:clamp(30px,2.5vw,40px);letter-spacing:-.01em;line-height:1}
.choice-statement{font-size:clamp(19px,1.45vw,23px);font-weight:500;line-height:1.2;margin-top:14px;color:#e8dcff;letter-spacing:-.02em}
.choice-card p:not(.choice-statement){font-size:13px;line-height:1.6;margin-top:12px;max-width:230px;color:#ffffffc8}
.choice-actions{margin-top:auto;padding-top:34px;display:flex;flex-direction:column;align-items:stretch;gap:12px}
.choice-button{display:inline-flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 20px;border-radius:999px;background:white;color:var(--purple);font-size:13px;font-weight:500;transition:transform .45s var(--snap),background .3s,color .3s}
.choice-button>span{font-size:17px;transition:transform .45s var(--snap)}
.choice-button:hover{transform:scale(1.03);background:var(--pink);color:white}.choice-button:hover>span{transform:translate(3px,-3px)}
.choice-button:active{transform:scale(.97)}
.choice-ask{align-self:center;font-size:12px;color:#ffffffc0;border-bottom:1px solid #ffffff45;padding-bottom:2px;transition:color .3s,border-color .3s}.choice-ask:hover{color:white;border-color:white}
.choice-button:focus-visible,.choice-ask:focus-visible{outline:2px solid white;outline-offset:3px}
/* Entrance: per card, fixed 80ms offset, spring that overshoots and settles. */
.js .choice-grid.reveal:not(.visible) .choice-card{opacity:0;translate:0 70px;scale:.94}
.choice-grid .choice-card{translate:0 0;scale:1;transition:translate .7s var(--spring),scale .7s var(--spring),opacity .35s var(--ease),--lift .5s var(--spring),background .4s,box-shadow .5s var(--ease);transition-delay:calc(var(--i) * 80ms),calc(var(--i) * 80ms),calc(var(--i) * 80ms),0s,0s,0s}
.js .choice-grid.reveal:not(.visible) .choice-makker{translate:0 -70%}
/* Combine card — four products converge into one stack while scrolling. */
.choice-combine{--stack:0;position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:1fr 1.15fr;align-items:center;gap:40px;margin-top:18px;padding:clamp(34px,4vw,60px);min-height:420px;border-radius:24px;background:var(--pink);color:white}
.js .choice-combine.reveal{clip-path:inset(12% 0 0 round 24px);transition:clip-path .8s var(--spring)}
.js .choice-combine.reveal.visible{clip-path:inset(0 round 24px)}
.combine-copy h3{font-family:GreedNarrow,Greed,sans-serif;font-weight:700;font-size:clamp(44px,4.6vw,72px);line-height:.95}
.combine-copy p{font-size:clamp(16px,1.3vw,19px);line-height:1.55;margin:20px 0 32px;color:#ffe6ef}
.combine-copy .choice-button{width:auto}
.choice-combine .choice-button:hover{background:var(--purple)}
.combine-visual{position:relative;height:330px}
.combine-makker{position:absolute;z-index:-1;right:-8%;bottom:-38%;width:78%;aspect-ratio:160/114;background:#C40F50;-webkit-mask:url('/assets/mark.svg') center/contain no-repeat;mask:url('/assets/mark.svg') center/contain no-repeat;transform:translateY(calc((1 - var(--stack)) * 70px)) rotate(calc((1 - var(--stack)) * -6deg))}
.combine-tile{--x:0px;--y:0px;--r:0deg;position:absolute;left:50%;top:50%;display:flex;align-items:center;gap:14px;width:230px;padding:16px 18px;border-radius:18px;background:white;color:var(--purple);font-weight:500;font-size:15px;box-shadow:0 20px 40px -20px #6a0a2f90;translate:-50% -50%;transform:translate(calc(var(--x) * (1 - var(--stack))),calc(var(--y) * (1 - var(--stack)) + var(--n) * 14px * var(--stack) - 21px * var(--stack))) rotate(calc(var(--r) * (1 - var(--stack))))}
.combine-tile .feature-icon{flex:none;display:block;width:34px;height:34px;border-radius:11px;background:var(--purple);-webkit-mask:none;mask:none;position:relative}
.combine-tile .feature-icon:after{content:'';position:absolute;inset:8px;background:white;-webkit-mask:var(--feature-icon) center/contain no-repeat;mask:var(--feature-icon) center/contain no-repeat}
.combine-tile:nth-of-type(2){--x:-150px;--y:-105px;--r:-9deg;z-index:4}
.combine-tile:nth-of-type(3){--x:150px;--y:-75px;--r:7deg;z-index:3}
.combine-tile:nth-of-type(4){--x:-125px;--y:95px;--r:6deg;z-index:2}
.combine-tile:nth-of-type(5){--x:155px;--y:115px;--r:-7deg;z-index:1}
.combine-bubble{position:absolute;right:4%;top:2%;z-index:6;padding:16px 20px;border-radius:22px 22px 22px 4px;background:var(--purple);color:white;font-family:GreedNarrow,Greed,sans-serif;font-weight:700;font-size:24px;line-height:1;scale:0;transform-origin:0 100%;transition:scale .5s var(--snap)}
.choice-combine.stacked .combine-bubble{scale:1}
@keyframes makker-yes{0%{transform:none}35%{transform:translateY(5px) scaleY(.9)}70%{transform:translateY(-4px) scaleY(1.05)}100%{transform:none}}
@media(max-width:1100px){.choice-grid{grid-template-columns:1fr 1fr}.choice-card{min-height:400px}.choice-combine{grid-template-columns:1fr}.combine-visual{height:320px}}
@media(max-width:540px){.choice-grid{gap:12px}.choice-card{min-height:0;padding:24px 20px 20px;border-radius:20px}.choice-icon{width:48px;height:48px;border-radius:15px;margin-bottom:26px}.choice-card h3{font-size:27px}.choice-statement{font-size:17px}.choice-card p:not(.choice-statement){font-size:12px}.choice-button{padding:12px 15px;font-size:12px;gap:10px}.choice-combine{padding:30px 22px;border-radius:20px}.combine-visual{height:300px}.combine-tile{width:190px;font-size:13px;padding:13px 14px}.combine-tile:nth-of-type(2){--x:-60px;--y:-100px}.combine-tile:nth-of-type(3){--x:60px;--y:-60px}.combine-tile:nth-of-type(4){--x:-55px;--y:60px}.combine-tile:nth-of-type(5){--x:60px;--y:105px}.combine-bubble{font-size:19px;right:0;top:-2%}}
@media(max-width:400px){.choice-grid{grid-template-columns:1fr}}
.motion-reduced .choice-card,.motion-reduced .choice-makker,.motion-reduced .choose-heading{transform:none!important;translate:none!important;opacity:1!important;scale:1!important}.motion-reduced .choice-combine{--stack:1!important;clip-path:none!important}.motion-reduced .combine-bubble{scale:1}
@media(prefers-reduced-motion:reduce){.choice-card,.choice-makker,.choose-heading{transform:none!important;translate:none!important;opacity:1!important;scale:1!important}.choice-combine{--stack:1!important;clip-path:none!important}.combine-bubble{scale:1}}

/* Mobile hero — full-width photo card on top, copy flows beneath (replaces the thumbnail crop). */
@media(max-width:540px){
  .hero{--hero-photo-h:clamp(170px,34svh,330px)}
  .hero-photo{inset:78px 16px auto 16px!important;width:auto!important;height:var(--hero-photo-h)!important;border-radius:22px}
  .hero-photo img,.hero-video{object-position:72% 40%}
  .hero-photo .hero-makker{width:58px;left:14px;bottom:14px}
  .hero-copy{top:calc(78px + var(--hero-photo-h) + 26px)!important;left:24px;right:24px;width:auto;transform:none!important}
  .hero h1{font-size:clamp(44px,12.5vw,60px)}
  .hero-background-makker{right:-18%;bottom:-14%;width:85%;height:42%}
}
@media(max-width:540px) and (max-height:700px){.hero{--hero-photo-h:150px}.hero-benefits{display:none}}

/* Brand backdrop — Makker silhouettes on scroll parallax + a glow that follows the selection. */
.has-backdrop{position:relative;isolation:isolate;overflow:hidden}
.brand-backdrop{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.bd-m{position:absolute;display:block;aspect-ratio:160/114;-webkit-mask:url('/assets/mark.svg') center/contain no-repeat;mask:url('/assets/mark.svg') center/contain no-repeat;will-change:transform}
.bd-m1{width:min(62vw,980px);right:-14vw;top:4%;background:var(--light-blue);transform:translateY(calc(var(--bd-y,0px) * -1)) rotate(calc(-6deg + var(--bd-t,0) * 8deg))}
.bd-m2{width:min(44vw,700px);left:-12vw;bottom:-6%;background:var(--calm-blue);opacity:.55;transform:translateY(calc(var(--bd-y,0px) * .7)) rotate(calc(5deg - var(--bd-t,0) * 7deg))}
.bd-glow{position:absolute;width:60vw;aspect-ratio:1;left:calc(var(--tab-x,0) * 25% - 18vw);top:-18vw;border-radius:50%;background:radial-gradient(closest-side,#7423e522,#7423e500);transition:left .9s var(--spring)}
.bd-m.bd-excited{animation:makker-excited .75s var(--ease)}
@keyframes makker-excited{0%{translate:0 0}28%{translate:0 -46px}52%{translate:0 6px}72%{translate:0 -12px}100%{translate:0 0}}
.products.has-backdrop{background:var(--paper)}
.makker-section .bd-m1{background:#DCE3FF;opacity:.75;top:auto;bottom:-10%;right:-18vw}
.makker-section .bd-m2{background:#B9C7FF;opacity:.6;left:-14vw;top:8%;bottom:auto}
.makker-section .bd-glow{left:calc(50% - 30vw);top:-25vw;background:radial-gradient(closest-side,#ffffff70,#ffffff00)}

/* Product tabs carry the dashboard's 3D product art. */
.product-tabs button{justify-content:flex-start;gap:14px;overflow:visible}
.tab-art{flex:none;width:68px;height:auto;margin:-14px 0 -10px -6px;filter:saturate(.55);opacity:.75;transform-origin:50% 90%;transition:transform .55s var(--snap),filter .4s,opacity .4s}
.product-tabs button:hover .tab-art{transform:translateY(-3px) rotate(-3deg);opacity:1}
.product-tabs button[aria-selected=true] .tab-art{filter:none;opacity:1;transform:translateY(-6px) scale(1.14) rotate(-4deg)}
.tab-label{transition:color .3s}

/* Makker — question cards, pink answer card, 3D product art around the screen. */
.makker-section .makker-questions>button.question-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;width:100%;margin-bottom:10px;padding:14px 18px 14px 14px;border:0;border-radius:20px;background:#ffffffa6;color:var(--deep);font-size:16px;font-weight:500;letter-spacing:-.01em;box-shadow:0 1px 0 #ffffff inset,0 14px 30px -24px #370a7660;transition:background .35s,color .35s,translate .5s var(--spring),box-shadow .4s}
.makker-section .makker-questions>button.question-card:hover{translate:6px 0;background:white}
.makker-section .makker-questions>button.question-card[aria-pressed=true]{background:var(--purple);color:white;box-shadow:0 22px 40px -22px #4f0fa9aa}
.q-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--light-blue);transition:background .35s}
.q-icon .feature-icon{display:block;width:21px;height:21px;background:var(--purple);-webkit-mask:var(--feature-icon) center/contain no-repeat;mask:var(--feature-icon) center/contain no-repeat;transition:background .35s}
.question-card[aria-pressed=true] .q-icon{background:#ffffff22}.question-card[aria-pressed=true] .q-icon .feature-icon{background:white}
.makker-section .makker-questions>button.question-card>.q-arrow{color:inherit;font-size:17px;transition:transform .45s var(--snap)}
.question-card:hover>.q-arrow{transform:translate(3px,-3px)}
.makker-section .question-explanation{position:relative;isolation:isolate;overflow:hidden;margin-top:16px;padding:26px 26px 30px;border:0;border-radius:22px;background:var(--pink);min-height:190px}
.makker-section .question-explanation p,.makker-section .question-explanation #question-copy{color:white;max-width:78%}
.makker-section .question-explanation>p:first-of-type{font-family:GreedNarrow,Greed,sans-serif;font-weight:700;font-size:28px;line-height:1.02;letter-spacing:0}
.makker-section .question-explanation #question-copy{font-size:13px;color:#ffe3ec;margin-top:12px;line-height:1.65}
.qe-makker{position:absolute;z-index:-1;right:-12%;bottom:-24%;width:46%;aspect-ratio:160/114;background:#C40F50;-webkit-mask:url('/assets/mark.svg') center/contain no-repeat;mask:url('/assets/mark.svg') center/contain no-repeat}
.makker-stage{position:relative}
.makker-section .browser-frame{position:relative;z-index:1;border-radius:22px;padding:8px;background:#ffffffb8;border-color:#ffffff;box-shadow:0 50px 90px -45px #370a7680}
.makker-section .browser-frame>img{border-radius:15px}
.makker-art{position:absolute;z-index:2;width:clamp(110px,12vw,190px);height:auto;filter:drop-shadow(0 22px 22px #370a7638);transform:translateY(calc(var(--makker-art-y,0px) * var(--d,1))) rotate(var(--r,0deg));pointer-events:none}
.makker-art.art-0{--d:1.3;--r:-8deg;left:-7%;top:-12%}
.makker-art.art-1{--d:.7;--r:9deg;right:-5%;top:-15%;width:clamp(95px,10vw,160px)}
.makker-art.art-2{--d:1.6;--r:6deg;right:-6%;bottom:-8%}
.makker-art.art-3{--d:.9;--r:-5deg;left:-9%;bottom:4%;width:clamp(90px,9vw,150px)}
.makker-art.art-excited{animation:makker-excited .75s var(--ease)}
.mark-tile.nod{animation:makker-yes .5s var(--ease)}
.js .makker-art{opacity:0;scale:.6;transition:opacity .3s,scale .7s var(--spring)}
.js .makker-stage.in .makker-art{opacity:1;scale:1}
.makker-stage.in .art-1{transition-delay:80ms}.makker-stage.in .art-2{transition-delay:160ms}.makker-stage.in .art-3{transition-delay:240ms}
@media(max-width:760px){.makker-art{width:92px!important}.makker-art.art-0{left:-2%;top:-9%}.makker-art.art-1{right:-1%;top:-11%}.makker-art.art-2{right:-2%;bottom:-10%}.makker-art.art-3{display:none}.bd-m1{width:110vw;right:-40vw}.bd-m2{width:80vw}}
@media(max-width:540px){.tab-art{width:46px;margin:-8px 0 -6px -4px}.product-tabs button{gap:8px}.makker-section .makker-questions>button.question-card{font-size:14px;padding:11px 14px 11px 11px;border-radius:17px}.q-icon{width:38px;height:38px;border-radius:12px}.makker-section .question-explanation>p:first-of-type{font-size:24px}}
.motion-reduced .bd-m,.motion-reduced .makker-art{transform:rotate(var(--r,0deg))!important;animation:none!important}.motion-reduced .makker-art{opacity:1;scale:1}
@media(prefers-reduced-motion:reduce){.bd-m,.makker-art{transform:rotate(var(--r,0deg))!important;animation:none!important}.js .makker-art{opacity:1;scale:1}}
.product-tabs button>.tab-label{font-size:inherit;color:inherit;letter-spacing:inherit}
.products .bd-m1{opacity:.7;top:18%;right:-24vw}
.products .bd-m2{opacity:.4}
.makker-section .makker-questions>button.question-card>.q-label{color:inherit}
.makker-section .question-explanation{min-height:0}
.makker-art.art-2{bottom:2%}

/* MAKKELIJK_TEXT_IN — per letter: rises from below, tilted, overshoots, settles. Lines offset by a fixed 120ms. */
.split-word{display:inline-block;white-space:nowrap}
.char{display:inline-block;transform-origin:0 100%;transition:transform .55s var(--spring),opacity .22s var(--ease);transition-delay:calc(var(--line-index,0) * 120ms + var(--c,0) * 24ms)}
.js .text-in:not(.visible) .char{opacity:0;transform:translateY(.55em) rotate(12deg)}
.line-heading.text-in>.heading-line{clip-path:none!important;transform:none!important;transition:none}
.motion-reduced .char{transform:none!important;opacity:1!important;transition:none!important}
@media(prefers-reduced-motion:reduce){.char{transform:none!important;opacity:1!important;transition:none!important}}

/* Product tabs — flat brand icon tiles (same language as the choice cards). */
.tab-icon{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--light-blue);transition:transform .5s var(--snap),background .35s}
.tab-icon .feature-icon{display:block;width:20px;height:20px;background:var(--purple);-webkit-mask:var(--feature-icon) center/contain no-repeat;mask:var(--feature-icon) center/contain no-repeat;transition:background .35s}
.product-tabs button:hover .tab-icon{transform:translateY(-3px) rotate(-4deg)}
.product-tabs button[aria-selected=true] .tab-icon{background:var(--purple);transform:rotate(-6deg)}
.product-tabs button[aria-selected=true] .tab-icon .feature-icon{background:white}
.tab-icon.nod{animation:makker-yes .5s var(--ease)}
@media(max-width:540px){.tab-icon{width:36px;height:36px;border-radius:12px}.tab-icon .feature-icon{width:17px;height:17px}}

/* Makker character — the official expression loops, background keyed out. */
.makker-character{pointer-events:none}
.makker-character video{display:block;width:100%;height:auto;aspect-ratio:1}
.character-stage{position:absolute;z-index:0;right:8%;width:clamp(150px,17vw,260px);bottom:calc(100% - clamp(150px,17vw,260px) * .26)}
.makker-section .makker-stage{margin-top:clamp(70px,9vw,140px)}
.character-closing{width:min(330px,100%);justify-self:center}
@media(max-width:760px){.character-stage{width:130px;bottom:calc(100% - 34px);right:6%}.makker-section .makker-stage{margin-top:80px}.character-closing{width:190px;margin:20px 0 0 -20px}}

/* End card — the guide's closing move as a scroll scene: the 3D Makker rises, the line types in, Makker shrinks into the logo. */
.endcard{position:relative;height:280vh;background:var(--calm-blue)}
.endcard-sticky{position:sticky;top:0;height:100svh;overflow:hidden;display:grid;place-items:center}
.endcard-m{--w:max(118vw,150svh);position:absolute;left:50%;bottom:0;width:var(--w);aspect-ratio:160/114;transform-origin:50% 38%;transform:translateX(-50%) translateY(calc((1 - var(--rise,0)) * 108% - var(--shrink,0) * 30svh)) scale(calc(1 - var(--shrink,0) * .955));opacity:calc(1 - var(--fade,0));will-change:transform}
.endcard-face,.endcard-edge{position:absolute;inset:0;-webkit-mask:url('/assets/mark.svg') center/100% 100% no-repeat;mask:url('/assets/mark.svg') center/100% 100% no-repeat}
.endcard-edge{background:#F2508A;transform:translate(.7%,.25%)}
.endcard-face{background:linear-gradient(100deg,#D5135A 0%,#E61662 42%,#EA2068 100%)}
.endcard-text{position:relative;z-index:1;max-width:min(86vw,1150px);padding:0 24px;margin-top:-6svh;text-align:center;color:white;font-family:GreedNarrow,Greed,sans-serif;font-weight:700;font-size:clamp(42px,6.4vw,112px);line-height:.95;letter-spacing:-.005em;opacity:calc(1 - var(--shrink,0) * 4)}
.endcard-text .char{transition-delay:calc(var(--c,0) * 28ms)}
.endcard-logo{position:absolute;left:50%;top:50%;width:clamp(180px,20vw,300px);height:auto;translate:-50% -50%;opacity:0;scale:.6;transition:opacity .25s,scale .6s var(--spring)}
.endcard.logo-in .endcard-logo{opacity:1;scale:1}
@media(max-width:760px){.endcard{height:230vh}.endcard-m{--w:max(150vw,140svh)}.endcard-text{font-size:clamp(38px,11vw,60px)}}
.motion-reduced .endcard{height:auto}.motion-reduced .endcard-sticky{position:relative;height:70svh}.motion-reduced .endcard-m{transform:translateX(-50%) translateY(10%);opacity:1}.motion-reduced .endcard-text{opacity:1}.motion-reduced .endcard-logo{display:none}
@media(prefers-reduced-motion:reduce){.endcard{height:auto}.endcard-sticky{position:relative;height:70svh}.endcard-m{transform:translateX(-50%) translateY(10%)!important;opacity:1!important}.endcard-text{opacity:1!important}.endcard-logo{display:none}}
.makker-section .browser-frame{background:#F3F5FF}
.endcard-m{transform-origin:50% 50%;transform:translateX(-50%) translateY(calc((1 - var(--rise,0)) * 108% + var(--shrink,0) * (50% - 54svh))) scale(calc(1 - var(--shrink,0) * .955))}

/* End card as an intro section after the hero: shorter scroll, ends on logo + services + way into the products. */
.endcard{height:190vh}
.endcard-final{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;text-align:center;padding:0 24px;pointer-events:none}
.endcard-final>*{opacity:0;translate:0 26px;transition:opacity .3s var(--ease),translate .6s var(--spring)}
.endcard-final>img{width:clamp(190px,20vw,300px);height:auto}
.endcard-services{display:flex;flex-wrap:wrap;justify-content:center;gap:0;color:var(--purple);font-size:clamp(13px,1.1vw,16px);font-weight:500}
.endcard-services span+span:before{content:'|';margin:0 .9em;color:#4f0fa966}
.endcard-cta{margin-top:12px;background:var(--pink);color:white;border-radius:14px}
.endcard.logo-in .endcard-final{pointer-events:auto}
.endcard.logo-in .endcard-final>*{opacity:1;translate:0 0}
.endcard.logo-in .endcard-final>:nth-child(2){transition-delay:80ms}.endcard.logo-in .endcard-final>:nth-child(3){transition-delay:160ms}
@media(max-width:760px){.endcard{height:170vh}}
.motion-reduced .endcard-final{position:relative;inset:auto;margin-top:30px}.motion-reduced .endcard-final>*{opacity:1;translate:none}
@media(prefers-reduced-motion:reduce){.endcard-final{position:relative;inset:auto;margin-top:30px;pointer-events:auto}.endcard-final>*{opacity:1!important;translate:none!important}}

/* End card v3 — back above the closing, shorter, Safari-safe centring, animated logotype (guide: Logotype with services). */
.endcard{height:160vh}
.endcard-sticky{display:block}
.endcard-text{position:absolute;left:50%;top:50%;width:min(86vw,1150px);max-width:none;margin:0;padding:0 12px;transform:translate(-50%,-56%)}
.endcard-final{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(14px,1.6vw,22px);padding:0 24px}
.endcard-final>*{opacity:1;translate:none;transition:none}
.logotype{--lw:clamp(250px,30vw,440px);display:flex;align-items:flex-end;width:var(--lw);aspect-ratio:188/28}
.lt-slice{display:block;flex:none;height:100%;width:calc(var(--w) / 188 * var(--lw));background:var(--purple);-webkit-mask:url('/assets/logo-marketing.svg') no-repeat;mask:url('/assets/logo-marketing.svg') no-repeat;-webkit-mask-size:var(--lw) 100%;mask-size:var(--lw) 100%;-webkit-mask-position:calc(var(--x) / 188 * var(--lw) * -1) 0;mask-position:calc(var(--x) / 188 * var(--lw) * -1) 0;transform-origin:50% 100%;opacity:0;transform:translateY(.55em) rotate(12deg);transition:transform .55s var(--spring),opacity .2s var(--ease);transition-delay:calc(.42s + (var(--i) - 1) * 45ms);font-size:calc(var(--lw) * .12)}
.lt-mark{background:var(--pink);opacity:0;transform:translateX(calc(var(--lw) * .375)) translateY(-70%) scale(.8,1.4);transition:none}
.endcard.logo-in .lt-slice{opacity:1;transform:none}
.endcard.logo-in .lt-mark{opacity:1;transform:none;animation:lt-mark-in 1s var(--ease) both,lt-breathe 3.4s ease-in-out 1.3s infinite}
@keyframes lt-mark-in{0%{opacity:0;transform:translateX(calc(var(--lw) * .375)) translateY(-90%) scale(.8,1.4)}28%{opacity:1;transform:translateX(calc(var(--lw) * .375)) translateY(0) scale(1.18,.78)}42%{transform:translateX(calc(var(--lw) * .375)) translateY(-14%) scale(.95,1.06)}55%{transform:translateX(calc(var(--lw) * .375)) translateY(0) scale(1,1)}82%{transform:translateX(-4%) scale(1.03,.97)}100%{opacity:1;transform:none}}
@keyframes lt-breathe{0%,100%{transform:scale(1,1)}50%{transform:scale(1.025,1.05)}}
.endcard-services{color:var(--purple);font-size:clamp(14px,1.25vw,18px);font-weight:500;letter-spacing:.01em;word-spacing:.35em}
.endcard-services .char{transition-delay:calc(.85s + var(--c,0) * 16ms)}
@media(max-width:760px){.endcard{height:150vh}.logotype{--lw:min(78vw,320px)}.endcard-services{font-size:13px;word-spacing:.15em}}
.motion-reduced .lt-slice,.motion-reduced .lt-mark{opacity:1!important;transform:none!important;animation:none!important}
@media(prefers-reduced-motion:reduce){.lt-slice,.lt-mark{opacity:1!important;transform:none!important;animation:none!important}}

/* Hero Makker: the official character in place of the static mark (M body = 73% of the clip width, feet at 74%). */
.hero-character{--mw:130px;--ml:24px;--mb:24px;position:absolute;z-index:3;width:calc(var(--mw) / .73);left:calc(var(--ml) - var(--mw) / .73 * .14);bottom:calc(var(--mb) - var(--mw) / .73 * .26)}
.hero-photo .hero-character video{transform:none!important;object-fit:contain}
@media(max-width:760px){.hero-character{--mw:100px;--ml:18px;--mb:18px}}
@media(max-width:540px){.hero-character{--mw:58px;--ml:14px;--mb:14px}}
.endcard-services span+span:before{content:none}
.endcard-services{display:block;text-align:center;word-spacing:.45em}@media(max-width:760px){.endcard-services{word-spacing:.3em}}
.endcard{height:180vh}@media(max-width:760px){.endcard{height:165vh}}
.brand-compositions{padding-top:clamp(60px,7vw,110px)}