:root{--paper:#ffffff;--ink:#262626;--muted:#8a8a8a;--accent:#bbbbbb}
*{box-sizing:border-box}
html{scroll-padding-top:120px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,textarea{font:inherit}
button,a,summary{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,summary:focus-visible,textarea:focus-visible{outline:3px solid #676767;outline-offset:5px}
.wrap{max-width:1440px;margin:auto;padding-left:32px;padding-right:32px}
.app-icon{width:42px;height:42px;border-radius:13px;display:inline-flex;align-items:center;justify-content:center;background:var(--ink);color:var(--paper);font-size:40px;font-weight:800;line-height:1;padding-bottom:6px;letter-spacing:-3px;padding-right:3px}
.hero{padding-top:76px}
h1{font-size:clamp(60px,8.6vw,124px);line-height:1.02;letter-spacing:-.065em;margin:20px 0 48px;font-weight:750}
.hero-actions{display:flex;align-items:center;gap:26px;margin-bottom:80px}
.purchase-note{color:#a5a5a5;font-size:16px;line-height:1.45;margin:0 0 0 10px}
.purchase-note strong{color:#838383}
.faq{padding-top:120px;padding-bottom:90px;display:grid;grid-template-columns:1fr 1.4fr;gap:80px}
.faq>h2{font-size:44px;line-height:1.05;letter-spacing:-.055em;margin:14px 0}
.questions details{border-bottom:1px solid #d9d9d9}
.questions summary{padding:23px 30px 23px 0;cursor:pointer;font-weight:600;font-size:18px;list-style:none;position:relative}
.questions summary::-webkit-details-marker{display:none}
.questions summary:after{content:'+';position:absolute;right:0;font-weight:400;color:#919191}
.questions details[open] summary:after{content:'−'}
.questions p{color:#7e7e7e;line-height:1.65;font-size:16px;margin:0 0 24px}
.questions p a{text-decoration:underline}
.closing{text-align:center;padding-top:80px;padding-bottom:110px}
.app-icon.large{width:72px;height:72px;border-radius:22px;font-size:68px}
.closing>p{font-size:18px;color:#8c8c8c;margin-bottom:30px}
.closing .fine-print{font-size:12px;margin-top:25px}
@media(max-width:1000px){.hero{padding-top:40px}.hero-actions{gap:16px}.faq{gap:45px}.purchase-note{font-size:13px}}
@media(max-width:650px){.wrap{padding-left:20px;padding-right:20px}.app-icon{height:36px;width:36px;font-size:35px}.hero{padding-top:27px}h1{font-size:clamp(43px,10.5vw,68px);margin:12px 0 28px;letter-spacing:-.065em}.hero-actions{flex-wrap:wrap;gap:10px;margin-bottom:35px}.purchase-note{width:100%;margin:7px 0 0;font-size:12px}.purchase-note br{display:none}.purchase-note strong{margin-left:5px}.faq{grid-template-columns:1fr;gap:16px;padding-top:65px;padding-bottom:35px}.faq>h2{font-size:36px}.questions summary{font-size:16px;padding-top:21px;padding-bottom:21px}.questions p{font-size:14px}.closing{padding-top:65px;padding-bottom:65px}.closing h2{font-size:45px}.closing>p{font-size:15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

.hero h1{text-align:center;font-size:clamp(24px,6.5vw,94px)}
.hero-actions{justify-content:center}
@media(max-width:650px){.hero-actions .purchase-note{text-align:center}}

img.app-icon{object-fit:contain;background:transparent;padding:0;border-radius:0;flex-shrink:0}
img.app-icon{filter:drop-shadow(0 2px 3px #00000014) drop-shadow(0 5px 9px #00000012)}
img.app-icon.large{filter:drop-shadow(0 3px 5px #00000014) drop-shadow(0 10px 16px #0000001a)}

.hero>.app-icon{display:block;margin:0 auto 30px}
html{scroll-padding-top:32px}

.hero{padding-top:160px}
@media(max-width:650px){.hero{padding-top:100px}}

.hero-actions{flex-direction:column;align-items:center;gap:20px}
.hero-actions .purchase-note{margin:0;text-align:center}
.hero-actions .purchase-note br{display:block}
.hero-actions .purchase-note strong{margin-left:0}

.pillars{padding-top:60px}
.pillar{display:grid;grid-template-columns:1fr 1fr;gap:100px;padding:90px 0;border-bottom:1px solid #e5e5e5}

.pillar h2{font-size:clamp(40px,5vw,68px);line-height:1.05;letter-spacing:-.055em;margin:0 0 8px}
.pillar-intro>p{font-size:23px;line-height:1.45;letter-spacing:-.025em;color:#888;max-width:420px;margin:0}
.pillar-details{display:flex;flex-direction:column;gap:32px;padding-top:5px}
.pillar-details h3{font-size:23px;letter-spacing:-.035em;line-height:1.2;margin:0 0 10px}
.pillar-details p{font-size:17px;line-height:1.65;color:#888;margin:0;max-width:510px}
@media(max-width:1000px){.pillar{gap:55px;padding:70px 0}.pillar-intro>p{font-size:21px}}
@media(max-width:650px){.pillars{padding-top:20px}.pillar{grid-template-columns:1fr;gap:35px;padding:50px 0}.pillar h2{font-size:42px;margin-bottom:8px}.pillar-intro>p{font-size:20px}.pillar-details{gap:25px}.pillar-details h3{font-size:21px}.pillar-details p{font-size:15px}}

.pillar{grid-template-columns:1fr;gap:48px}
.pillar-intro>p{max-width:680px}
.pillar-details{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;padding-top:0}
.pillar-details>article{display:grid;grid-row:span 3;grid-template-rows:subgrid;row-gap:0}
@media(max-width:1000px){.pillar{gap:40px}.pillar-details{gap:28px}}
.pillar[aria-labelledby="take-title"] .pillar-details{column-gap:60px}
@media(max-width:1000px){.pillar[aria-labelledby="take-title"] .pillar-details{column-gap:42px}}
@media(max-width:650px){.pillar{gap:32px}.pillar-details{grid-template-columns:1fr;gap:25px}}

.pillar-intro{text-align:center}
.pillar-intro>p{margin-left:auto;margin-right:auto}


.pillar{border-bottom:0}
/* Full-width, faint section gradients with a crisp reset below each section. */
.hero,.pillar,.faq,.closing{position:relative;isolation:isolate}
.hero::before,.pillar::before,.faq::before,.closing::before{content:"";position:absolute;inset:0;z-index:-1;border-image:linear-gradient(to bottom,rgba(255,255,255,0) 0%,#fefefe 55%,#fafafa 100%) fill 0 / 0 / 0 100vmax;pointer-events:none}

.closing>img.app-icon{display:block;margin:0 auto 30px}
.closing h2{font-size:clamp(24px,6.5vw,94px);line-height:1.02;letter-spacing:-.065em;font-weight:750;margin:20px 0 48px}
.closing .hero-actions{margin-bottom:0}

.hero>img.app-icon,.closing>img.app-icon{margin-bottom:18px}
.hero>.app-name,.closing>.app-name{margin:0 0 28px;text-align:center;font-size:20px;font-weight:700;line-height:1.3;letter-spacing:-.025em;color:var(--ink)}

/* Let the app preview peek into shorter desktop viewports. */
@media(min-width:1001px){
  .hero{padding-top:clamp(20px,calc(45vh - 300px),112px)}
  .hero h1{margin-bottom:clamp(24px,calc(20vh - 120px),48px)}
  .hero .hero-actions{margin-bottom:clamp(20px,calc(20vh - 120px),48px)}
  .hero .app-preview{margin-top:-48px}
}
@media(min-width:1001px) and (max-height:700px){
  .hero h1{font-size:clamp(48px,10vh,94px)}
  .hero>img.app-icon{margin-bottom:10px}
  .hero>.app-name{margin-bottom:16px}
}

/* A single, centered FAQ column. */
.faq{grid-template-columns:minmax(0,1fr);gap:40px}
.faq>h2,.faq>.questions{width:100%;max-width:900px;margin:0 auto}
.faq>h2{text-align:center}
@media(max-width:650px){.faq{gap:28px}}

/* The chevron bends through a horizontal line when the answer toggles. */
.questions summary:after{display:none}
.faq-chevron{position:absolute;right:0;top:50%;width:22px;height:12px;transform:translateY(-50%);color:#86868b;overflow:visible}
.faq-chevron polyline{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.questions details:not(.faq-enhanced)[open] .faq-chevron{transform:translateY(-50%) scaleY(-1)}
.questions summary:hover .faq-chevron{color:var(--ink)}

.abejas-return-control{position:fixed;top:calc(18px + env(safe-area-inset-top,0px));left:calc(18px + env(safe-area-inset-left,0px));z-index:30;display:grid;place-items:center;width:48px;height:48px;padding:0;border:1px solid #d7d7dc;border-radius:50%;background:#ffffffd9;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 3px 12px #00000012;color:#86868b;cursor:pointer;opacity:0;visibility:hidden;pointer-events:none;transform:scale(.78);transition:opacity 260ms ease,transform 420ms cubic-bezier(.34,1.45,.46,1),visibility 0s linear 420ms}
.abejas-return-control.is-visible{opacity:1;visibility:visible;pointer-events:auto;transform:scale(1);transition:opacity 300ms ease,transform 480ms cubic-bezier(.18,1.3,.32,1),visibility 0s}
.abejas-return-control .faq-chevron{position:static;transform:none;color:inherit}
.abejas-return-control:hover{background:#fff;color:var(--ink);border-color:#c8c8cd}

/* Native features get a full-width charcoal treatment. */
.pillar-dark{color:#f5f5f7}
.pillar-dark::before{border-image:linear-gradient(to bottom,#1d1d1f,#111112) fill 0 / 0 / 0 100vmax}
.pillar-dark .pillar-intro>p,.pillar-dark .pillar-details p{color:#a1a1a6}

/* Native feature cards: SF Symbols and coloured benefit statements. */
.native-inventory{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.native-feature{--card-accent:#3b86f7;position:relative;min-height:250px;padding:32px 32px 48px;border-radius:28px;background:#252527}
.native-feature[data-accent="orange"]{--card-accent:rgb(240, 147, 67)}
.native-feature[data-accent="yellow"]{--card-accent:rgb(247, 206, 70)}
.native-feature[data-accent="teal"]{--card-accent:rgb(88, 192, 205)}
.native-feature[data-accent="blue"]{--card-accent:rgb(59, 134, 247)}
.native-feature[data-accent="purple"]{--card-accent:rgb(187, 62, 217)}
.native-feature[data-accent="red"]{--card-accent:rgb(235, 76, 70)}
.native-feature[data-accent="green"]{--card-accent:rgb(101, 196, 102)}
@supports (color:color(display-p3 1 1 1)){
.native-feature[data-accent="orange"]{--card-accent:color(display-p3 0.94117647 0.57647059 0.26274510)}
.native-feature[data-accent="yellow"]{--card-accent:color(display-p3 0.96862745 0.80784314 0.27450980)}
.native-feature[data-accent="teal"]{--card-accent:color(display-p3 0.34509804 0.75294118 0.80392157)}
.native-feature[data-accent="blue"]{--card-accent:color(display-p3 0.23137255 0.52549020 0.96862745)}
.native-feature[data-accent="purple"]{--card-accent:color(display-p3 0.73333333 0.24313725 0.85098039)}
.native-feature[data-accent="red"]{--card-accent:color(display-p3 0.92156863 0.29803922 0.27450980)}
.native-feature[data-accent="green"]{--card-accent:color(display-p3 0.39607843 0.76862745 0.40000000)}
}
.native-icon{display:block;width:38px;height:38px;margin-bottom:24px;color:var(--card-accent)}
.native-feature h3{font-size:27px;line-height:1.2;letter-spacing:-.035em;margin:0;font-weight:650;text-wrap:pretty}
.native-feature h3 em{font-style:normal;color:var(--card-accent)}
.platform-label{position:absolute;bottom:20px;left:32px;padding:3px 6px;border:1px solid #505055;border-radius:5px;color:#b7b7be;font-size:11px;line-height:1.2}
@media(max-width:1000px){.native-inventory{gap:20px}.native-feature{padding:26px 24px 46px;min-height:240px}.native-feature h3{font-size:24px}.platform-label{left:24px}}
@media(max-width:800px){.native-inventory{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:500px){.native-inventory{grid-template-columns:1fr;gap:16px}.native-feature{min-height:220px;padding:28px 28px 48px}.native-feature h3{font-size:26px}.platform-label{left:28px}}

/* Official Apple badge: preserve artwork and proportions. */
.app-store-link{position:relative;isolation:isolate;display:inline-block;line-height:0;border-radius:10px}
.app-store-link img{display:block;width:180px;height:auto}
.app-store-link::before{content:"";position:absolute;inset:1px;z-index:-1;pointer-events:none;border-radius:inherit;background:linear-gradient(110deg,#ff8c24,#ff375f,#cb30dc,#0095ff,#00bfc8,#30c54b,#ff8c24);background-size:300% 100%;filter:blur(14px);opacity:0;scale:.85;transition:opacity 550ms ease-in-out 150ms,scale 700ms ease-in-out;animation:badge-glow 5s ease-in-out infinite alternate;animation-play-state:paused}
@keyframes badge-glow{from{background-position:0% 50%;transform:scale(1.03,1.08)}to{background-position:100% 50%;transform:scale(1.09,1.2)}}
@media(hover:hover) and (pointer:fine){
  .app-store-link:hover::before{opacity:.6;scale:1;transition:opacity 700ms ease,scale 700ms cubic-bezier(.22,1,.36,1);animation-play-state:running}
}
.app-store-link:focus-visible::before{opacity:.6;scale:1;transition:opacity 700ms ease,scale 700ms cubic-bezier(.22,1,.36,1);animation-play-state:running}
@media(prefers-reduced-motion:reduce){
  .app-store-link::before{animation:none;transition:none;scale:1}
}

/* Native radio controls retain keyboard navigation and selection semantics. */
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.platform-filter{--selected:0;position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:min(100%,320px);margin:26px auto 0;padding:3px;border:1px solid #343437;border-radius:999px;background:#252527;isolation:isolate}
.platform-filter[hidden],.native-feature[hidden]{display:none}
.platform-filter::before{content:"";position:absolute;inset:3px auto 3px 3px;width:calc((100% - 6px)/3);border-radius:999px;background:#454549;box-shadow:none;transform:translateX(calc(var(--selected)*100%));transition:transform 280ms cubic-bezier(.22,1,.36,1);z-index:-1}
.platform-filter label{position:relative;cursor:pointer;min-width:0}
.platform-filter input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:pointer}
.platform-filter span{display:block;padding:9px 6px;color:#b7b7bd;font-size:13px;line-height:20px;font-weight:500;text-align:center;white-space:nowrap;border-radius:999px;transition:color 180ms}
.platform-filter input:checked+span{color:#fff}
.platform-filter input:focus-visible+span{outline:2px solid #fff;outline-offset:2px}
.platform-filter label:hover span{color:#fff}
.native-inventory{align-content:start}

/* Prevent Safari Live Text and image dragging across site artwork. */
img,svg,.map-avatar{-webkit-user-select:none;user-select:none;-webkit-user-drag:none}
