:root { --ink:#062d31; --ink-soft:#31565b; --teal:#008886; --teal-dark:#006b69; --mint:#dff8f2; --mist:#f5fbfa; --coral:#ff715c; --coral-soft:#ffe6e1; --violet:#6751d7; --line:#d9ece9; --white:#fff; --shadow:0 28px 70px rgba(1,63,66,.13); font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color:var(--ink); background:var(--white); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; background:#fff; }
a { color:inherit; text-decoration:none; }
.skip-link { position:fixed; top:12px; left:12px; z-index:50; transform:translateY(-150%); padding:10px 14px; border-radius:10px; background:var(--ink); color:#fff; font-weight:800; transition:transform .2s; }.skip-link:focus { transform:translateY(0); }
.site-header { position:absolute; inset:0 0 auto; z-index:10; }.nav-shell { width:min(1180px, calc(100% - 48px)); min-height:92px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:24px; }.brand { display:flex; align-items:center; gap:10px; }.brand img { width:44px; height:44px; border-radius:13px; box-shadow:0 8px 20px rgba(0,90,87,.18); }.brand span { display:grid; gap:1px; }.brand b { font-size:19px; letter-spacing:-.65px; }.brand small { color:#4d7276; font-size:10px; font-weight:760; letter-spacing:.05em; text-transform:uppercase; }.nav-links { display:flex; align-items:center; gap:26px; color:#35565a; font-size:13px; font-weight:750; }.nav-links > a:not(.nav-cta) { transition:color .2s; }.nav-links > a:not(.nav-cta):hover { color:var(--teal-dark); }.nav-cta { display:flex; align-items:center; gap:8px; padding:11px 15px; border-radius:12px; background:var(--ink); color:#fff; box-shadow:0 8px 18px rgba(2,36,40,.13); }.nav-cta span { color:#8ffff0; font-size:17px; }.nav-toggle { display:none; }
.hero { position:relative; overflow:hidden; min-height:810px; padding-top:126px; background:linear-gradient(140deg,#f8fffe 0%,#edfafa 48%,#e8f6ff 100%); }.hero::after { content:""; position:absolute; left:-8%; right:-8%; bottom:-1px; height:114px; border-radius:50% 50% 0 0 / 100% 100% 0 0; background:#fff; }.hero-glow { position:absolute; border-radius:50%; filter:blur(6px); pointer-events:none; }.hero-glow-one { width:520px; height:520px; top:-210px; left:-150px; background:radial-gradient(circle,#a3fff1 0%,rgba(163,255,241,0) 69%); }.hero-glow-two { width:600px; height:600px; right:-240px; top:-45px; background:radial-gradient(circle,#c0baff 0%,rgba(192,186,255,0) 66%); }.hero-shell { position:relative; z-index:2; width:min(1180px, calc(100% - 48px)); margin:0 auto; display:grid; grid-template-columns:1.02fr .98fr; gap:34px; align-items:center; }.hero-copy { padding:46px 0 105px; }.eyebrow { display:flex; align-items:center; gap:8px; margin:0 0 17px; color:#057f7b; font-size:12px; font-weight:850; letter-spacing:.085em; text-transform:uppercase; }.spark { display:grid; place-items:center; width:20px; height:20px; border-radius:7px; background:#cafff4; color:#007c78; font-size:13px; }.hero h1,.section-intro h2,.journey-copy h2,.summary-copy h2,.compare-copy h2,.screens-heading h2,.reminder-copy h2,.closing-shell h2 { margin:0; letter-spacing:-.065em; line-height:.99; }.hero h1 { max-width:650px; font-size:clamp(47px,5.6vw,76px); }.hero h1 em,.section-intro h2 em,.journey-copy h2 em,.summary-copy h2 em,.compare-copy h2 em,.screens-heading h2 em,.reminder-copy h2 em,.closing-shell h2 em { color:var(--teal); font-style:normal; }.hero-lede { max-width:555px; margin:26px 0 27px; color:#45666a; font-size:18px; line-height:1.62; }.hero-actions { display:flex; align-items:center; gap:22px; }.button { display:inline-flex; align-items:center; justify-content:center; gap:16px; padding:15px 19px; border-radius:13px; font-size:14px; font-weight:850; transition:transform .2s,box-shadow .2s; }.button:hover { transform:translateY(-2px); }.button-primary { background:var(--teal); color:#fff; box-shadow:0 13px 24px rgba(0,128,124,.24); }.button-primary span { font-size:19px; }.text-button { display:inline-flex; align-items:center; gap:9px; color:var(--teal-dark); font-size:14px; font-weight:850; }.text-button span { font-size:18px; transition:transform .2s; }.text-button:hover span { transform:translateX(4px); }.hero-trust { display:flex; flex-wrap:wrap; gap:10px 16px; margin-top:32px; color:#527378; font-size:12px; font-weight:750; }.hero-trust span { display:flex; align-items:center; gap:5px; }.hero-trust i { display:grid; place-items:center; width:17px; height:17px; border-radius:50%; background:#d3f5e9; color:#127953; font-size:11px; font-style:normal; }
.hero-visual { position:relative; height:590px; }.creative-backdrop { position:absolute; width:520px; height:545px; right:-64px; top:4px; overflow:hidden; border-radius:44px; box-shadow:var(--shadow); transform:rotate(4deg); }.creative-backdrop::after { content:""; position:absolute; inset:0; background:linear-gradient(140deg,rgba(5,88,84,.05),rgba(93,68,205,.12)); }.creative-backdrop img { width:100%; height:100%; object-fit:cover; object-position:57% center; }.hero-phone { position:absolute; left:41px; bottom:-28px; width:265px; overflow:hidden; border:8px solid #102b2e; border-radius:36px; background:#fff; box-shadow:0 30px 45px rgba(0,42,47,.26); transform:rotate(-5deg); }.hero-phone img { display:block; width:100%; }.float-card { position:absolute; z-index:2; display:flex; align-items:center; gap:9px; padding:11px 13px; border:1px solid rgba(255,255,255,.8); border-radius:14px; background:rgba(255,255,255,.94); box-shadow:0 15px 28px rgba(0,63,66,.16); backdrop-filter:blur(12px); }.float-card small { display:block; margin-bottom:2px; color:#6d878a; font-size:10px; font-weight:730; }.float-card b { display:block; font-size:12px; }.float-card-top { top:90px; left:-9px; }.float-card-bottom { right:-13px; bottom:67px; }.float-icon { display:grid; place-items:center; width:34px; height:34px; border-radius:11px; font-size:18px; font-weight:900; }.float-icon.teal { color:#007d79; background:#dcf6f2; }.float-icon.coral { color:#e55948; background:#ffe8e4; }.hero-strip { position:absolute; z-index:3; bottom:18px; left:50%; display:flex; align-items:center; justify-content:center; gap:27px; width:min(1180px, calc(100% - 48px)); color:#386368; font-size:12px; font-weight:800; transform:translateX(-50%); white-space:nowrap; }.hero-strip b { color:#16aaa2; }
.hero-visual { position:relative; height:590px; }.creative-backdrop { position:absolute; width:520px; height:545px; right:-64px; top:4px; overflow:hidden; border-radius:44px; box-shadow:var(--shadow); transform:rotate(4deg); }.creative-backdrop::after { content:""; position:absolute; inset:0; background:linear-gradient(140deg,rgba(5,88,84,.05),rgba(93,68,205,.12)); }.creative-backdrop img { width:100%; height:100%; object-fit:cover; object-position:57% center; }.hero-phone { position:absolute; left:41px; bottom:-28px; width:265px; overflow:hidden; border:8px solid #102b2e; border-radius:36px; background:#fff; box-shadow:0 30px 45px rgba(0,42,47,.26); transform:rotate(-5deg); }.hero-phone img { display:block; width:100%; }.float-card { position:absolute; z-index:2; display:flex; align-items:center; gap:9px; padding:11px 13px; border:1px solid rgba(255,255,255,.8); border-radius:14px; background:rgba(255,255,255,.94); box-shadow:0 15px 28px rgba(0,63,66,.16); backdrop-filter:blur(12px); }.float-card small { display:block; margin-bottom:2px; color:#6d878a; font-size:10px; font-weight:730; }.float-card b { display:block; font-size:12px; }.float-card-top { top:90px; left:-9px; }.float-card-bottom { right:-13px; bottom:67px; }.float-icon { display:grid; place-items:center; width:34px; height:34px; border-radius:11px; font-size:18px; font-weight:900; }.float-icon.teal { color:#007d79; background:#dcf6f2; }.float-icon.coral { color:#e55948; background:#ffe8e4; }.hero-strip { position:absolute; z-index:3; bottom:18px; left:50%; display:flex; align-items:center; justify-content:center; gap:27px; width:min(1180px, calc(100% - 48px)); color:#386368; font-size:12px; font-weight:800; transform:translateX(-50%); white-space:nowrap; }.hero-strip b { color:#16aaa2; }
@media (min-width:901px) { .hero { min-height:0; padding-bottom:72px; }.hero-phone { bottom:14px; }.hero-strip { position:relative; z-index:4; bottom:auto; left:auto; justify-content:space-between; gap:20px; width:min(1180px, calc(100% - 48px)); margin:6px auto 0; padding:17px 25px; border:1px solid rgba(211,232,229,.92); border-radius:18px; background:rgba(255,255,255,.94); box-shadow:0 15px 31px rgba(1,70,73,.1); transform:none; } }
.section-shell { width:min(1180px, calc(100% - 48px)); margin:0 auto; }.problem-section { padding:125px 0 115px; }.section-intro { max-width:820px; }.eyebrow-dark { color:#117874; }.section-intro h2 { font-size:clamp(35px,4.5vw,58px); }.section-intro p:not(.eyebrow) { max-width:680px; margin:24px 0 0; color:#557176; font-size:17px; line-height:1.65; }.benefit-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:55px; }.benefit-card { position:relative; min-height:252px; padding:27px; overflow:hidden; border:1px solid var(--line); border-radius:19px; background:#fff; transition:transform .25s, box-shadow .25s; }.benefit-card:hover { transform:translateY(-5px); box-shadow:0 20px 40px rgba(3,79,79,.09); }.benefit-number { position:absolute; top:18px; right:20px; color:#d8e8e6; font-size:30px; font-weight:850; letter-spacing:-.07em; }.benefit-icon { display:grid; place-items:center; width:47px; height:47px; margin-bottom:36px; border-radius:15px; font-size:25px; font-weight:850; }.teal-icon { color:#008b85; background:#dff8f3; }.violet-icon { color:#5a45bf; background:#eeeaff; }.coral-icon { color:#e15644; background:#ffe6e1; }.benefit-card h3 { margin:0 0 11px; font-size:20px; letter-spacing:-.045em; }.benefit-card p { margin:0; color:#597378; font-size:14px; line-height:1.6; }
.journey-section { overflow:hidden; padding:104px 0 84px; background:#063f43; color:#fff; }.journey-shell { position:relative; width:min(1180px,calc(100% - 48px)); margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }.journey-copy { padding:18px 0; }.journey-copy .eyebrow,.compare-copy .eyebrow,.reminder-copy .eyebrow { color:#7ff6e5; }.journey-copy h2 { font-size:clamp(37px,4.5vw,57px); }.journey-copy h2 em { color:#8ffff0; }.journey-copy > p:not(.eyebrow) { max-width:550px; margin:24px 0 30px; color:#b2d2d1; font-size:16px; line-height:1.65; }.steps { display:grid; gap:14px; margin:0; padding:0; list-style:none; }.steps li { display:flex; gap:14px; padding:14px 14px 14px 0; border-bottom:1px solid rgba(205,255,249,.14); color:#bed6d6; }.steps li > span { display:grid; flex:0 0 auto; place-items:center; width:31px; height:31px; border:1px solid #4e8e8c; border-radius:10px; color:#aeece5; font-size:13px; font-weight:850; }.steps li.active > span { border-color:#9afbea; background:#9afbea; color:#075358; }.steps li b { display:block; color:#fff; font-size:15px; }.steps li p { margin:4px 0 0; font-size:13px; line-height:1.45; }.journey-visual { position:relative; min-height:600px; }.orb { position:absolute; border-radius:50%; }.orb-one { width:400px; height:400px; top:28px; right:30px; background:linear-gradient(145deg,#34d8c9,#5e52cf); opacity:.85; }.orb-two { width:250px; height:250px; bottom:22px; left:35px; border:1px solid #72eadd; }.journey-phone { position:absolute; z-index:2; top:8px; left:135px; width:275px; overflow:hidden; border:8px solid #071f22; border-radius:37px; box-shadow:0 33px 50px rgba(0,0,0,.35); }.journey-phone img { display:block; width:100%; }.preference-card { position:absolute; z-index:3; right:0; bottom:57px; width:230px; padding:17px; border:1px solid rgba(214,255,250,.4); border-radius:16px; background:rgba(4,74,76,.88); box-shadow:0 20px 30px rgba(0,0,0,.18); backdrop-filter:blur(12px); }.preference-card > span { color:#9deee4; font-size:11px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }.preference-card b { display:block; margin:6px 0 12px; font-size:16px; line-height:1.22; }.preference-card div { display:flex; gap:6px; }.preference-card i { padding:5px 7px; border-radius:8px; background:#1d7574; color:#d5fffa; font-size:10px; font-style:normal; font-weight:760; }
.summary-section { padding:112px 0; }.summary-panel { display:grid; grid-template-columns:1.02fr .98fr; gap:45px; align-items:center; padding:48px; border:1px solid #cce6e2; border-radius:29px; background:linear-gradient(125deg,#effcf9,#f7fbff 67%,#f0ecff); }.summary-copy h2 { font-size:clamp(35px,4vw,52px); }.summary-copy p:not(.eyebrow) { max-width:500px; margin:21px 0 24px; color:#526f73; font-size:16px; line-height:1.65; }.text-button.dark { color:#064f51; }.summary-demo { padding:20px; border:1px solid #c6e5e1; border-radius:22px; background:rgba(255,255,255,.67); box-shadow:0 18px 35px rgba(21,92,90,.08); }.demo-head { display:flex; align-items:center; gap:9px; padding:2px 4px 16px; color:#006a68; font-size:13px; letter-spacing:.01em; }.demo-spark { display:grid; place-items:center; width:28px; height:28px; border-radius:9px; background:#c4f8ef; }.demo-row { display:flex; align-items:center; gap:13px; margin-top:10px; padding:14px; border:1px solid #d9eeeb; border-radius:15px; background:#fff; }.demo-symbol { display:grid; flex:0 0 auto; place-items:center; width:43px; height:43px; border-radius:13px; font-size:20px; font-weight:850; }.demo-symbol.coral { color:#df5141; background:#ffe6e3; }.demo-symbol.teal { color:#007f7a; background:#dff7f4; }.demo-symbol.violet { color:#5e46c0; background:#eeeaff; }.demo-row small { display:block; margin-bottom:3px; color:#6f888b; font-size:11px; font-weight:770; }.demo-row b { display:block; color:#193e42; font-size:14px; }
.compare-section { overflow:hidden; padding:28px 0 100px; }.compare-shell { display:grid; grid-template-columns:.92fr 1.08fr; gap:80px; align-items:center; }.compare-creative { position:relative; height:560px; overflow:hidden; border-radius:30px; box-shadow:var(--shadow); }.compare-creative img { width:100%; height:100%; object-fit:cover; object-position:center; }.compare-copy h2 { font-size:clamp(37px,4.3vw,56px); }.compare-copy p:not(.eyebrow) { max-width:530px; margin:23px 0; color:#506e72; font-size:16px; line-height:1.65; }.check-list { display:grid; gap:12px; margin:0; padding:0; list-style:none; color:#315b60; font-size:14px; font-weight:720; }.check-list li { display:flex; align-items:center; gap:10px; }.check-list span { display:grid; place-items:center; width:22px; height:22px; border-radius:8px; background:#d8f6ef; color:#087c6f; font-size:13px; }
.screens-section { padding:50px 0 118px; }.screens-heading { display:flex; align-items:end; justify-content:space-between; gap:40px; }.screens-heading h2 { font-size:clamp(36px,4vw,54px); }.screens-heading > p { max-width:380px; margin:0 0 5px; color:#587277; font-size:15px; line-height:1.6; }.screen-showcase { display:grid; grid-template-columns:1.18fr 1fr 1fr; gap:17px; margin-top:49px; align-items:end; }.screen-card { min-width:0; padding:17px 17px 21px; border:1px solid #dbeaea; border-radius:20px; background:#fbfdfd; transition:transform .25s,box-shadow .25s; }.screen-card:hover { transform:translateY(-5px); box-shadow:0 20px 40px rgba(1,75,75,.1); }.screen-card-large { padding:21px; background:#f0fbf9; }.screen-frame { overflow:hidden; height:295px; margin-bottom:19px; border-radius:13px; background:#d9eeee; }.screen-card-large .screen-frame { height:365px; }.screen-frame img { display:block; width:100%; height:100%; object-fit:cover; object-position:top center; }.screen-card span { color:#00817d; font-size:11px; font-weight:850; letter-spacing:.065em; text-transform:uppercase; }.screen-card h3 { margin:8px 0 8px; font-size:20px; letter-spacing:-.04em; }.screen-card p { margin:0; color:#61797d; font-size:13px; line-height:1.55; }
.reminder-section { position:relative; min-height:520px; overflow:hidden; color:#fff; background:#063e44; }.reminder-image,.reminder-shade { position:absolute; inset:0; }.reminder-image img { width:100%; height:100%; object-fit:cover; object-position:center 55%; }.reminder-shade { background:linear-gradient(90deg,rgba(2,43,50,.94) 0%,rgba(2,56,60,.8) 41%,rgba(2,45,55,.09) 82%); }.reminder-copy { position:relative; z-index:2; padding-top:121px; }.reminder-copy h2 { max-width:700px; font-size:clamp(39px,5vw,65px); }.reminder-copy h2 em { color:#9fffee; }.reminder-copy > p:not(.eyebrow) { max-width:530px; margin:23px 0 0; color:#c1dedd; font-size:17px; line-height:1.65; }
.closing-section { position:relative; overflow:hidden; padding:112px 24px 118px; background:#f7fdfc; text-align:center; }.closing-glow { position:absolute; left:50%; top:5px; width:650px; height:420px; border-radius:50%; background:radial-gradient(circle,rgba(155,255,237,.8),rgba(198,231,255,.14) 50%,transparent 71%); transform:translateX(-50%); }.closing-shell { position:relative; z-index:2; max-width:750px; margin:0 auto; }.closing-icon { border-radius:21px; box-shadow:0 16px 30px rgba(0,85,82,.18); }.closing-shell .eyebrow { justify-content:center; margin-top:18px; }.closing-shell h2 { font-size:clamp(40px,5vw,64px); }.closing-shell > p:not(.eyebrow) { max-width:590px; margin:25px auto; color:#557176; font-size:16px; line-height:1.65; }.store-row { display:flex; justify-content:center; flex-wrap:wrap; gap:14px; margin-top:31px; }.store-badge { position:relative; display:flex; align-items:center; gap:12px; min-width:192px; padding:11px 17px 12px; border:1px solid #111820; border-radius:12px; background:linear-gradient(145deg,#20242a,#030405); color:#fff; text-align:left; box-shadow:0 12px 24px rgba(7,24,29,.17); }.store-link { text-decoration:none; transition:transform .2s ease,box-shadow .2s ease; }.store-link:hover,.store-link:focus-visible { box-shadow:0 18px 32px rgba(2,105,103,.23); outline:3px solid rgba(32,193,178,.23); outline-offset:3px; transform:translateY(-3px); }.play-mark { display:grid; place-items:center; flex:0 0 auto; width:29px; height:32px; }.play-mark svg { width:28px; height:31px; filter:drop-shadow(0 1px 1px rgba(0,0,0,.35)); }.apple-mark { display:grid; place-items:center; width:29px; height:32px; color:#fff; font-size:30px; line-height:1; }.store-copy { display:grid; gap:2px; }.store-copy small { color:#b9c0c4; font-size:8px; font-weight:850; letter-spacing:.105em; text-transform:uppercase; }.store-copy b { color:#fff; font-size:18px; letter-spacing:-.04em; line-height:1; }.store-badge-soon { cursor:default; opacity:.78; }.soon-tag { position:absolute; top:-8px; right:10px; padding:3px 6px; border-radius:7px; background:#815ee9; color:#fff; font-size:8px; font-weight:900; letter-spacing:.07em; }.store-note { display:block; margin-top:17px; color:#72898c; font-size:11px; }.social-follow { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:10px 17px; margin-top:22px; }.instagram-link { display:inline-flex; align-items:center; gap:8px; padding:9px 12px 9px 10px; border:1px solid #e9d9ea; border-radius:999px; background:#fff; color:#55345d; font-size:12px; font-weight:820; box-shadow:0 7px 15px rgba(100,37,108,.07); transition:transform .2s ease,box-shadow .2s ease; }.instagram-link:hover,.instagram-link:focus-visible { box-shadow:0 12px 22px rgba(100,37,108,.16); outline:3px solid rgba(202,68,137,.16); outline-offset:3px; transform:translateY(-2px); }.instagram-icon { display:grid; place-items:center; width:22px; height:22px; border-radius:8px; background:linear-gradient(135deg,#f9a342,#d7467e 52%,#7048b5); color:#fff; font-size:19px; line-height:1; }.instagram-link b { color:#c5427e; font-size:14px; }.whatsapp-soon { display:inline-flex; align-items:center; gap:6px; color:#71898b; font-size:11px; font-weight:760; }.whatsapp-soon > span { display:grid; place-items:center; width:22px; height:22px; border-radius:50%; background:#e4f7ec; color:#3ca46d; font-size:17px; }.site-footer { width:min(1180px,calc(100% - 48px)); margin:0 auto; padding:34px 0; display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:28px; color:#678084; font-size:12px; }.footer-brand img { width:34px; height:34px; border-radius:10px; }.footer-brand b { font-size:16px; }.footer-brand small { font-size:8px; }.site-footer p { margin:9px 0 0; }.footer-links { display:flex; flex-wrap:wrap; justify-content:center; gap:15px; font-weight:700; }.footer-links a:hover { color:#087a76; }
.reveal { opacity:0; transform:translateY(20px); transition:opacity .65s ease,transform .65s ease; }.reveal.visible { opacity:1; transform:translateY(0); }.reveal-delay { transition-delay:.12s; }.reveal-delay-2 { transition-delay:.22s; }
@media (max-width:900px) { .nav-links { gap:15px; }.hero { min-height:auto; }.hero-shell,.journey-shell,.summary-panel,.compare-shell { grid-template-columns:1fr; }.hero-copy { padding-bottom:28px; }.hero-visual { width:min(570px,100%); margin:0 auto; }.hero-strip { position:relative; bottom:auto; left:auto; width:auto; margin:23px 0 0; padding:16px 24px 21px; justify-content:flex-start; overflow:auto; transform:none; }.hero::after { display:none; }.benefit-grid { grid-template-columns:1fr; }.benefit-card { min-height:200px; }.journey-visual { width:min(540px,100%); margin:0 auto; }.summary-panel { gap:29px; }.compare-shell { gap:40px; }.compare-creative { height:480px; max-width:570px; width:100%; }.screens-heading { align-items:start; flex-direction:column; gap:18px; }.screen-showcase { grid-template-columns:1fr 1fr; }.screen-card-large { grid-column:1 / -1; }.screen-card-large .screen-frame { height:420px; }.reminder-copy { padding-top:100px; }.site-footer { grid-template-columns:1fr; text-align:center; }.footer-brand { justify-content:center; }.footer-links { order:3; }.site-footer > small { order:2; } }
@media (max-width:640px) { .nav-shell,.section-shell,.journey-shell,.site-footer { width:min(100% - 32px,1180px); }.nav-shell { min-height:74px; }.nav-toggle { display:grid; grid-template-columns:19px 1fr; align-items:center; gap:3px 8px; border:0; padding:8px; background:transparent; color:#41656a; font:700 11px inherit; cursor:pointer; }.nav-toggle span { grid-column:1; width:18px; height:2px; border-radius:3px; background:var(--ink); }.nav-toggle i { grid-column:2; grid-row:1 / 4; font-style:normal; }.nav-links { position:absolute; top:67px; right:16px; left:16px; display:none; padding:12px; border:1px solid #d6e8e7; border-radius:16px; background:rgba(255,255,255,.98); box-shadow:0 18px 35px rgba(0,68,69,.15); }.nav-links.open { display:grid; }.nav-links a { padding:11px 10px; }.nav-cta { justify-content:space-between; }.hero { padding-top:98px; }.hero-copy { padding-top:28px; }.hero h1 { font-size:47px; }.hero-lede { font-size:16px; }.hero-actions { flex-wrap:wrap; gap:17px; }.hero-visual { height:435px; }.creative-backdrop { width:370px; height:405px; right:-44px; border-radius:30px; }.hero-phone { left:18px; width:193px; border-width:6px; border-radius:28px; }.float-card { padding:9px 10px; }.float-card-top { top:42px; left:-4px; }.float-card-bottom { right:-3px; bottom:30px; }.float-card b { font-size:10px; }.float-icon { width:29px; height:29px; }.hero-strip { gap:16px; font-size:11px; }.problem-section,.summary-section { padding:78px 0; }.section-intro h2,.journey-copy h2,.summary-copy h2,.compare-copy h2,.screens-heading h2,.reminder-copy h2,.closing-shell h2 { font-size:38px; }.section-intro p:not(.eyebrow),.journey-copy > p:not(.eyebrow),.summary-copy p:not(.eyebrow),.compare-copy p:not(.eyebrow),.reminder-copy > p:not(.eyebrow),.closing-shell > p:not(.eyebrow) { font-size:15px; }.journey-section { padding:72px 0 48px; }.journey-visual { min-height:465px; }.orb-one { width:310px; height:310px; top:30px; right:4px; }.journey-phone { left:59px; width:215px; border-radius:30px; }.preference-card { right:0; bottom:28px; width:185px; padding:13px; }.preference-card b { font-size:13px; }.summary-panel { padding:27px 20px; border-radius:22px; }.demo-row { padding:11px; }.demo-row b { font-size:12px; }.compare-section { padding-bottom:70px; }.compare-creative { height:390px; }.screen-showcase { grid-template-columns:1fr; }.screen-card-large { grid-column:auto; }.screen-frame,.screen-card-large .screen-frame { height:360px; }.reminder-section { min-height:490px; }.reminder-shade { background:linear-gradient(90deg,rgba(2,43,50,.94),rgba(2,54,58,.72)); }.reminder-copy { padding-top:85px; }.closing-section { padding:80px 16px; }.store-row { flex-direction:column; align-items:center; }.store-badge { width:min(100%,220px); }.social-follow { flex-direction:column; gap:11px; }.site-footer { padding:27px 0; }.footer-links { gap:10px 15px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.reveal { opacity:1; transform:none; transition:none; }.button,.screen-card,.benefit-card { transition:none; } }

.screen-card[data-preview] { cursor:zoom-in; }
.screen-card[data-preview]:focus-visible { outline:3px solid #23b6aa; outline-offset:4px; }
.screen-card[data-preview] .screen-frame::after { content:"Tam boy görüntüle  ↗"; position:absolute; right:11px; bottom:11px; padding:7px 9px; border-radius:9px; background:rgba(2,41,45,.78); color:#fff; font-size:10px; font-weight:800; letter-spacing:.02em; opacity:0; transform:translateY(5px); transition:opacity .2s ease,transform .2s ease; }
.screen-card[data-preview]:hover .screen-frame::after,.screen-card[data-preview]:focus-visible .screen-frame::after { opacity:1; transform:translateY(0); }
.screen-frame { position:relative; }
.image-lightbox[hidden] { display:none; }
.image-lightbox { position:fixed; z-index:100; inset:0; display:grid; place-items:center; padding:32px; background:rgba(2,23,28,.81); backdrop-filter:blur(8px); }
.image-lightbox-dialog { position:relative; width:min(100%,620px); max-height:calc(100vh - 64px); padding:11px; border:1px solid rgba(255,255,255,.2); border-radius:24px; background:#fff; box-shadow:0 30px 90px rgba(0,0,0,.35); }
.image-lightbox figure { display:grid; gap:9px; max-height:calc(100vh - 86px); margin:0; }
.image-lightbox img { display:block; max-width:100%; max-height:calc(100vh - 132px); margin:0 auto; border-radius:16px; object-fit:contain; }
.image-lightbox figcaption { padding:1px 7px 4px; color:#33575b; font-size:12px; font-weight:780; text-align:center; }
.image-lightbox-close { position:absolute; z-index:1; top:-14px; right:-14px; display:grid; place-items:center; width:38px; height:38px; border:2px solid #fff; border-radius:50%; background:#073e43; color:#fff; font-size:29px; line-height:1; cursor:pointer; box-shadow:0 8px 18px rgba(0,0,0,.25); }
.image-lightbox-close:hover,.image-lightbox-close:focus-visible { background:#008886; outline:3px solid rgba(154,255,239,.9); outline-offset:3px; }
body.lightbox-open { overflow:hidden; }
@media (max-width:640px) { .image-lightbox { padding:18px; }.image-lightbox-dialog { width:min(100%,390px); max-height:calc(100vh - 36px); padding:8px; border-radius:20px; }.image-lightbox img { max-height:calc(100vh - 96px); border-radius:13px; }.image-lightbox-close { top:-10px; right:-6px; width:35px; height:35px; }.screen-card[data-preview] .screen-frame::after { opacity:1; transform:none; font-size:9px; } }

.social-hub { max-width:665px; margin:28px auto 0; padding:20px; border:1px solid #d8eae7; border-radius:22px; background:linear-gradient(135deg,#fff 0%,#f0fbf9 57%,#f7f4ff 100%); box-shadow:0 14px 32px rgba(4,86,83,.09); text-align:left; }
.social-hub-heading { display:flex; align-items:center; gap:11px; margin:0 2px 16px; }.social-hub-heading p { margin:0 0 2px; color:#638084; font-size:10px; font-weight:850; letter-spacing:.075em; text-transform:uppercase; }.social-hub-heading h3 { margin:0; color:#103e43; font-size:19px; letter-spacing:-.04em; }.social-hub-spark { display:grid; place-items:center; flex:0 0 auto; width:34px; height:34px; border-radius:12px; background:#d7f8f1; color:#00817a; font-size:18px; }
.social-channel-grid { display:grid; grid-template-columns:1.12fr 1fr 1fr; gap:9px; }.social-channel { position:relative; display:flex; align-items:center; gap:9px; min-height:70px; padding:10px; border:1px solid #dce9e7; border-radius:14px; background:#fff; color:#153f43; }.social-channel small { display:block; margin-bottom:4px; color:#799094; font-size:8px; font-weight:850; letter-spacing:.055em; }.social-channel b { display:block; font-size:11px; line-height:1.25; letter-spacing:-.015em; }.social-channel-icon { display:grid; place-items:center; flex:0 0 auto; width:30px; height:30px; border-radius:10px; font-size:19px; font-weight:850; }.social-channel-instagram { border-color:#edcfdf; box-shadow:0 8px 15px rgba(175,55,120,.08); text-decoration:none; transition:transform .2s ease,box-shadow .2s ease; }.social-channel-instagram:hover,.social-channel-instagram:focus-visible { box-shadow:0 13px 22px rgba(175,55,120,.17); outline:3px solid rgba(213,68,134,.17); outline-offset:3px; transform:translateY(-2px); }.social-channel-instagram .social-channel-icon { background:linear-gradient(135deg,#f8af48,#d84280 51%,#724aba); color:#fff; }.social-channel-instagram em { margin-left:auto; color:#c8427b; font-size:17px; font-style:normal; }.social-channel-x { background:linear-gradient(145deg,#1d2528,#071114); border-color:#071114; color:#fff; }.social-channel-x small { color:#a9bec0; }.social-channel-x .social-channel-icon { background:#fff; color:#081113; font-size:16px; }.social-channel-whatsapp { background:#f5fcf8; }.social-channel-whatsapp .social-channel-icon { background:#dff7e8; color:#2d9b61; font-size:21px; }.channel-status { position:absolute; top:8px; right:8px; padding:3px 5px; border-radius:5px; background:rgba(255,255,255,.16); color:#d8eff0; font-size:7px; font-style:normal; font-weight:900; letter-spacing:.055em; }.social-channel-whatsapp .channel-status { background:#ddf3e5; color:#498266; }
@media (max-width:640px) { .social-hub { padding:17px 14px; border-radius:18px; }.social-channel-grid { grid-template-columns:1fr; }.social-channel { min-height:62px; }.social-channel b { font-size:12px; }.social-hub-heading h3 { font-size:18px; } }