/* AKIŞ Task V14.39.3 · Tanıtım sitesi / uygulama görsel eşleşmesi
   Yalnızca halka açık tanıtım sayfasına uygulanır.
   Mevcut bağlantılar, kayıt akışı, cihaz maketleri ve JS işlevleri korunur. */
body:not(.auth-view){
  --lp-blue:#0786f6;--lp-cyan:#3bc5f8;--lp-navy:#103456;--lp-ink:#1e4163;
  --lp-muted:#5c7c98;--lp-edge:#dbeaf7;--lp-bg:#eaf6ff;
  --lp-green:#18b78a;--lp-amber:#f3b432;--lp-purple:#9067f3;--lp-red:#f36b82;
  --lp-shadow:0 15px 38px rgba(19,86,144,.095),0 2px 8px rgba(13,83,144,.04);
  background:#f4faff!important;color:var(--lp-ink);font-synthesis:none;
}
body:not(.auth-view) :is(.section-heading h2,.showcase-text h2,.faq-intro h2,.feature-card h3,.step-card h3,.screen-card h3){color:var(--lp-navy);text-wrap:balance}
body:not(.auth-view) :is(.section-heading>p,.showcase-text>p,.faq-intro>p){color:var(--lp-muted);font-size:15px;line-height:1.78}
body:not(.auth-view) :is(button,a,summary,input):focus-visible{outline:3px solid #53aef5!important;outline-offset:3px!important}
/* Navigation mirrors the application's bright white chrome. */
body:not(.auth-view) .site-header{
  position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94)!important;
  border-bottom:1px solid var(--lp-edge)!important;box-shadow:0 6px 24px rgba(31,93,153,.065)!important;
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
}
body:not(.auth-view) .site-header .nav-wrap{min-height:84px;gap:24px}
body:not(.auth-view) .site-header .brand{font-size:25px;font-weight:850;letter-spacing:-.065em!important;color:#0b2f56!important}
body:not(.auth-view) .site-header .brand .brand-light{color:#108cf8!important;font-weight:600}
body:not(.auth-view) .site-header .brand-mark{width:48px;height:48px!important;border-radius:14px!important}
body:not(.auth-view) .site-header .nav-menu{gap:clamp(14px,1.65vw,26px);font-size:13px}
body:not(.auth-view) .site-header .nav-menu a{color:#466989!important;border-radius:10px;padding:10px 4px;transition:color .18s}
body:not(.auth-view) .site-header .nav-menu a:hover{color:var(--lp-blue)!important}
body:not(.auth-view) .site-header .nav-login{font-size:13px;color:#245e93!important}
body:not(.auth-view) .site-header .nav-actions .btn-primary{min-height:44px;padding:11px 17px!important}
body:not(.auth-view) :is(.hero-actions .btn-primary,.site-header .nav-actions .btn-primary){
  background:linear-gradient(110deg,#12a1ff,#0575e8)!important;
  box-shadow:0 11px 23px rgba(8,125,236,.26),inset 0 1px 0 rgba(255,255,255,.28)!important;
  border:1px solid #128beb!important;border-radius:13px!important;color:#fff!important;
}
body:not(.auth-view) :is(.hero-actions .btn-primary,.site-header .nav-actions .btn-primary):hover{transform:translateY(-2px);box-shadow:0 17px 31px rgba(8,125,236,.35)!important}
/* Hero uses the same light blue canvas as app dashboard, with purposeful contrast. */
body:not(.auth-view) .hero{
  isolation:isolate;color:var(--lp-navy)!important;
  background:radial-gradient(ellipse 57% 80% at 84% 38%,#c4eaff 0%,#e1f3ff 49%,transparent 95%),
    linear-gradient(122deg,#f7fcff 0%,#e7f5ff 60%,#f6fbff 100%)!important;
}
body:not(.auth-view) .hero:before{background:#43b9ff!important;opacity:.17;filter:blur(105px);width:540px;height:540px;right:-100px;top:-135px}
body:not(.auth-view) .hero:after{background:#91a8ff!important;opacity:.13;filter:blur(115px)}
body:not(.auth-view) .hero-grid{min-height:665px;gap:20px;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);padding-top:64px;padding-bottom:45px}
body:not(.auth-view) .hero-copy{padding:0 0 14px}
body:not(.auth-view) .hero .eyebrow{color:#157ac7!important;background:#fff!important;border:1px solid #c9e7fa!important;box-shadow:0 5px 16px rgba(13,103,182,.08);font-size:11px;font-weight:800;padding:11px 16px}
body:not(.auth-view) .hero h1{font-size:clamp(46px,4.6vw,71px);line-height:1.11;letter-spacing:-.065em!important;margin:27px 0 22px;font-weight:850;color:#0d3257!important;max-width:720px}
body:not(.auth-view) .hero h1 span{background:linear-gradient(105deg,#0785f5,#2bbbf5 82%);-webkit-background-clip:text;background-clip:text;color:transparent!important}
body:not(.auth-view) .hero-copy>p{font-size:16px;line-height:1.8;color:#4c6b86!important;max-width:540px;margin-bottom:30px}
body:not(.auth-view) .hero-actions{gap:12px}
body:not(.auth-view) .hero-actions .btn{min-height:56px;font-size:14px;padding:16px 23px}
body:not(.auth-view) .hero-actions .btn-glass{background:#fff!important;color:#196caf!important;border:1px solid #cce5f9!important;box-shadow:0 8px 20px rgba(21,87,150,.07)!important}
body:not(.auth-view) .hero-actions .btn-glass:hover{background:#eaf6ff!important}
body:not(.auth-view) .hero-trust{margin-top:23px;color:#557b9a!important;font-size:11px}
body:not(.auth-view) .hero-trust .trust-check{background:#dff8ed;color:#159d74}
body:not(.auth-view) .hero-orbit-one{background:linear-gradient(155deg,#49c5fa,#1788f7 70%,#4c72df);opacity:.58}
body:not(.auth-view) .hero-orbit-two{border-color:#1f9cf765;opacity:.5}
body:not(.auth-view) .hero-visual{filter:drop-shadow(0 24px 26px rgba(44,100,160,.16))}
body:not(.auth-view) .phone{border-color:#152c48;box-shadow:0 28px 50px rgba(15,70,131,.27),0 0 0 2px #7299b8}
body:not(.auth-view) .phone-screen{background:linear-gradient(155deg,#e5f4ff,#fafdff 82%)}
body:not(.auth-view) .floating-badge{border:1px solid #d5e8f7;border-radius:15px;box-shadow:0 16px 35px rgba(34,92,161,.18);transform:rotate(-2deg)}
body:not(.auth-view) .hero-bottom{background:#fff!important;border-top:1px solid #ddecf8!important}
body:not(.auth-view) .hero-bottom-inner{min-height:76px;color:#416d94!important;font-size:12px;font-weight:750}
body:not(.auth-view) .hero-bottom-inner svg{color:#0c88ef!important}
/* All feature cards share application card material and distinct accent bars. */
body:not(.auth-view) .section{padding:104px 0}
body:not(.auth-view) .intro-section{background:linear-gradient(180deg,#f4faff,#ebf6ff)!important}
body:not(.auth-view) .section-heading{margin-bottom:48px}
body:not(.auth-view) .section-label{color:#0a81e7;font-size:11px;font-weight:850;letter-spacing:.16em}
body:not(.auth-view) .section-heading h2,
body:not(.auth-view) .showcase-text h2,
body:not(.auth-view) .faq-intro h2{font-size:clamp(35px,3.9vw,53px);line-height:1.16;letter-spacing:-.052em!important;font-weight:850;margin:16px 0 18px}
body:not(.auth-view) .section-heading h2 span,
body:not(.auth-view) .showcase-text h2 span,
body:not(.auth-view) .faq-intro h2 span{color:#0788ef}
body:not(.auth-view) .feature-grid{gap:20px}
body:not(.auth-view) :is(.feature-card,.step-card,.screen-card){
  position:relative;overflow:hidden;background:linear-gradient(155deg,#fff,#f7fbff 100%)!important;
  border:1px solid #deebf7!important;border-radius:21px!important;
  box-shadow:var(--lp-shadow)!important;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
body:not(.auth-view) .feature-card{padding:30px;min-height:246px}
body:not(.auth-view) .feature-card::before{content:"";position:absolute;left:0;top:0;width:100%;height:4px;background:linear-gradient(90deg,#078af6,#5ed3fc)}
body:not(.auth-view) .feature-card:nth-child(6n+2)::before{background:linear-gradient(90deg,#15b38b,#5fe1b7)}
body:not(.auth-view) .feature-card:nth-child(6n+3)::before{background:linear-gradient(90deg,#f1ab2c,#ffd86f)}
body:not(.auth-view) .feature-card:nth-child(6n+4)::before{background:linear-gradient(90deg,#9a71f0,#bd9dff)}
body:not(.auth-view) .feature-card:nth-child(6n+5)::before{background:linear-gradient(90deg,#23b9c8,#70dce3)}
body:not(.auth-view) .feature-card:nth-child(6n+6)::before{background:linear-gradient(90deg,#f06b85,#ffb2bf)}
body:not(.auth-view) .feature-icon{width:58px;height:58px;border-radius:18px;box-shadow:0 6px 15px rgba(27,92,150,.07);margin-bottom:19px}
body:not(.auth-view) .feature-icon svg{width:26px;height:26px}
body:not(.auth-view) .feature-card h3{font-size:18px!important;font-weight:850;line-height:1.33;letter-spacing:-.025em;margin-bottom:11px}
body:not(.auth-view) .feature-card p{font-size:13px!important;line-height:1.75;color:#607e98!important;min-height:0;margin-bottom:17px}
body:not(.auth-view) .feature-tag{background:#e7f4ff;color:#116fb9;border:1px solid #d0e9fa;border-radius:9px;font-size:11px;padding:8px 11px}
@media(hover:hover){body:not(.auth-view) :is(.feature-card,.step-card,.screen-card):hover{transform:translateY(-5px);border-color:#b5dff8!important;box-shadow:0 23px 44px rgba(22,93,151,.16)!important}}
/* Product showcase screens remain interactive, now dressed like the real app. */
body:not(.auth-view) .showcase-section{background:#fff!important}
body:not(.auth-view) .sharing-section{background:linear-gradient(180deg,#eff8ff,#f8fcff)!important}
body:not(.auth-view) .showcase-grid{gap:clamp(35px,5vw,90px)}
body:not(.auth-view) .showcase-text>p{font-size:15px;color:#597a95;line-height:1.82}
body:not(.auth-view) .checks{gap:18px}
body:not(.auth-view) .checks>div{font-size:14px;color:#355b7b}
body:not(.auth-view) .checks svg{background:#dbf9ec;color:#14a77e;border-radius:9px;padding:4px}
body:not(.auth-view) .text-link{color:#087ce4;font-size:13px}
body:not(.auth-view) .showcase-glow{border-radius:110px;background:linear-gradient(145deg,#d7efff,#a9dafe);opacity:.8}
body:not(.auth-view) .showcase-glow.green-glow{background:linear-gradient(135deg,#c5f3e4,#d5eafd)}
body:not(.auth-view) .demo-phone{border-color:#132f4a;box-shadow:0 26px 58px rgba(20,75,128,.24),0 0 0 2px #809fbb}
body:not(.auth-view) .demo-surface{background:linear-gradient(150deg,#eaf7ff,#fcfeff 79%)}
body:not(.auth-view) :is(.calendar-card,.task-preview,.shopping-info,.share-panel,.segmented,.sharing-tabs,.timeline-demo>div){box-shadow:0 7px 19px rgba(22,81,137,.07);border:1px solid #e2eef9}
body:not(.auth-view) :is(.calendar-day.selected,.segmented button.active,.sharing-tabs button.active){background:linear-gradient(140deg,#168eff,#0874e6);box-shadow:0 7px 14px rgba(9,119,224,.3)}
body:not(.auth-view) .progress{height:8px;border-radius:99px;background:#dceffb;overflow:hidden}
body:not(.auth-view) .progress i{display:block;position:relative;border-radius:99px;background:linear-gradient(90deg,#087ff3,#47ccfa);box-shadow:0 2px 7px rgba(24,141,223,.16)}
body:not(.auth-view) .progress i::after{content:"";position:absolute;inset:0 auto 0 -30%;width:30%;background:linear-gradient(90deg,transparent,#ffffffa3,transparent);transform:skewX(-20deg);animation:lp-shimmer 3.2s linear infinite}
@keyframes lp-shimmer{to{transform:translateX(450%) skewX(-20deg)}}
/* Onboarding steps and mobile previews use consistent surface materials. */
body:not(.auth-view) .start-section{background:linear-gradient(120deg,#102b54,#17477e 58%,#1178cc)!important}
body:not(.auth-view) .start-section .section-heading h2{color:#fff}
body:not(.auth-view) .start-section .section-heading h2 span{color:#77d9ff}
body:not(.auth-view) .start-section .section-label{color:#80cfff}
body:not(.auth-view) .steps-grid{gap:18px}
body:not(.auth-view) .step-card{padding:32px 30px;background:linear-gradient(150deg,#fff,#edf7ff)!important;border-color:#ffffffb8!important;box-shadow:0 17px 40px rgba(3,22,56,.19)!important}
body:not(.auth-view) .step-card .step-index{color:#7ebbf7;opacity:.58;font-weight:900}
body:not(.auth-view) .step-card h3{font-size:17px!important;font-weight:830}
body:not(.auth-view) .step-card p{font-size:13px;color:#607e97;line-height:1.7}
body:not(.auth-view) .screens-section{background:#f5fbff!important}
body:not(.auth-view) .screens-grid{gap:20px}
body:not(.auth-view) .screen-card{padding-bottom:9px}
body:not(.auth-view) .screen-card-art{background:radial-gradient(circle at 80% 15%,#caedff,transparent 72%),linear-gradient(150deg,#e4f4ff,#f5fbff)!important;border-radius:18px 18px 9px 9px}
body:not(.auth-view) .screen-card h3{font-size:16px!important;font-weight:840;letter-spacing:-.025em;margin-top:18px}
body:not(.auth-view) .screen-card p{font-size:12px!important;color:#65819a!important;line-height:1.65}
body:not(.auth-view) .faq-section{background:linear-gradient(180deg,#edf7ff,#f9fcff)!important}
body:not(.auth-view) .faq-list{gap:13px}
body:not(.auth-view) .faq-list details{background:#fff;border:1px solid #deebf7!important;box-shadow:0 6px 18px rgba(21,83,142,.055);border-radius:16px!important;padding:0 23px}
body:not(.auth-view) .faq-list details[open]{box-shadow:0 15px 30px rgba(21,83,142,.10)}
body:not(.auth-view) .faq-list summary{font-size:14px;color:#254e70;font-weight:800;padding-block:23px}
body:not(.auth-view) .faq-list p{font-size:13px;color:#637f99;line-height:1.72}
body:not(.auth-view) .final-cta{background:#fff!important;padding:90px 0}
body:not(.auth-view) .cta-panel{background:linear-gradient(111deg,#0879ec,#168efa 65%,#24b4f6)!important;border-radius:25px;box-shadow:0 25px 48px rgba(11,112,214,.23)!important;min-height:300px}
body:not(.auth-view) .cta-panel h2{font-weight:850;letter-spacing:-.055em;color:#fff}
body:not(.auth-view) .cta-panel .btn-white{border-radius:13px;box-shadow:0 11px 27px rgba(5,54,120,.16)}
body:not(.auth-view) .footer{background:linear-gradient(115deg,#102a4e,#0b1c35)!important;color:#fff}
body:not(.auth-view) .footer-brand .brand-light{color:#75c7ff}
body:not(.auth-view) .footer-main p,body:not(.auth-view) .copyright{color:#b1c7dd}
/* Keep real phone layouts usable rather than overlapping on tablets. */
@media(max-width:1100px){
 body:not(.auth-view) .site-header .nav-wrap{gap:12px}
 body:not(.auth-view) .hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
 body:not(.auth-view) .hero h1{font-size:clamp(41px,4.6vw,60px)}
}
@media(max-width:920px){
 body:not(.auth-view) .site-header .nav-menu.open{background:#fff!important;border:1px solid #daebf8!important;border-radius:0 0 20px 20px;box-shadow:0 20px 40px rgba(20,92,161,.15)!important}
 body:not(.auth-view) .site-header .nav-menu a{padding:12px 10px;color:#315d82!important}
 body:not(.auth-view) .hero-grid{grid-template-columns:1fr;gap:4px;padding:59px 0 24px}
 body:not(.auth-view) .hero-copy{text-align:center;padding-bottom:15px}
 body:not(.auth-view) .hero h1{font-size:clamp(42px,7vw,62px)}
 body:not(.auth-view) .hero-copy>p{margin-inline:auto}
 body:not(.auth-view) .hero-visual{max-width:530px;margin-inline:auto;transform:none}
 body:not(.auth-view) .showcase-grid{gap:32px}
}
@media(max-width:600px){
 body:not(.auth-view) .site-header .nav-wrap{min-height:70px;gap:7px}
 body:not(.auth-view) .site-header .brand{font-size:21px}
 body:not(.auth-view) .site-header .brand-mark{width:36px;height:36px!important}
 body:not(.auth-view) .site-header .nav-actions{gap:7px}
 body:not(.auth-view) .site-header .nav-login{font-size:11px}
 body:not(.auth-view) .site-header .nav-actions .btn-primary{min-height:40px;font-size:11px;padding:10px 11px!important}
 body:not(.auth-view) .hero-grid{padding:46px 0 12px}
 body:not(.auth-view) .hero h1{font-size:clamp(36px,9vw,49px);line-height:1.14;margin-top:22px}
 body:not(.auth-view) .hero .eyebrow{font-size:9px;line-height:1.35}
 body:not(.auth-view) .hero-copy>p{font-size:13px;line-height:1.8}
 body:not(.auth-view) .hero-actions .btn{width:100%;min-height:49px;font-size:12px}
 body:not(.auth-view) .hero-trust{font-size:10px}
 body:not(.auth-view) .hero-visual{transform:none;transform-origin:top center;height:380px;max-width:none}
 body:not(.auth-view) .section{padding:77px 0}
 body:not(.auth-view) .section-heading h2,body:not(.auth-view) .showcase-text h2,body:not(.auth-view) .faq-intro h2{font-size:clamp(29px,7vw,38px)}
 body:not(.auth-view) .section-heading>p,body:not(.auth-view) .showcase-text>p,body:not(.auth-view) .faq-intro>p{font-size:13px}
 body:not(.auth-view) .feature-grid{gap:14px}
 body:not(.auth-view) .feature-card{padding:24px;min-height:auto}
 body:not(.auth-view) .feature-card h3{font-size:16px!important}
 body:not(.auth-view) .feature-card p{font-size:12px!important}
 body:not(.auth-view) .steps-grid{gap:12px}
 body:not(.auth-view) .step-card{padding:23px}
 body:not(.auth-view) .screens-grid{gap:12px}
 body:not(.auth-view) .screen-card h3{font-size:13px!important}
 body:not(.auth-view) .screen-card p{font-size:10px!important}
 body:not(.auth-view) .showcase-device{transform:scale(.87);transform-origin:center}
 body:not(.auth-view) .faq-list summary{font-size:12.5px;padding-block:20px}
 body:not(.auth-view) .cta-panel{padding:38px 24px;min-height:330px}
 body:not(.auth-view) .final-cta{padding:66px 0}
}
@media(max-width:370px){
 body:not(.auth-view) .hero-visual{transform:none;height:335px}
 body:not(.auth-view) .nav-login{display:none}
 body:not(.auth-view) .showcase-device{transform:scale(.80)}
}
@media(prefers-reduced-motion:reduce){
 body:not(.auth-view) *,body:not(.auth-view) *::before,body:not(.auth-view) *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
/* V14.39.3 responsive acceptance fix: prevent decorative phone backplates from
   expanding the page and keep mobile hero copy in the available viewport. */
body:not(.auth-view) :is(.showcase-section,.sharing-section){overflow:clip}
body:not(.auth-view) .showcase-grid{min-width:0}
body:not(.auth-view) .showcase-device{min-width:0}
@media(max-width:920px){
 body:not(.auth-view) .hero-grid{display:flex!important;flex-direction:column;align-items:stretch;min-width:0}
 body:not(.auth-view) .hero-grid .hero-copy{flex:0 0 auto;width:100%;min-width:0;max-width:100%;margin-inline:auto}
 body:not(.auth-view) .hero-visual{--hero-art-scale:1;flex:0 0 auto;align-self:center;width:min(520px,100%);max-width:100%;left:auto;margin:4px 0 0;overflow:visible}
 body:not(.auth-view) .hero-visual :is(.hero-orbit,.phone,.floating-badge){transform-origin:top left}
 body:not(.auth-view) .hero-visual .hero-orbit-one{transform:scale(var(--hero-art-scale)) rotate(-21deg)}
 body:not(.auth-view) .hero-visual .hero-orbit-two{transform:scale(var(--hero-art-scale)) rotate(20deg)}
 body:not(.auth-view) .hero-visual .phone-main{transform:scale(var(--hero-art-scale)) rotate(-7deg)}
 body:not(.auth-view) .hero-visual .phone-back{transform:scale(var(--hero-art-scale)) rotate(9deg)}
 body:not(.auth-view) .hero-visual .floating-badge-one{transform:scale(var(--hero-art-scale)) rotate(-2deg)}
 body:not(.auth-view) .hero-visual .floating-badge-two{transform:scale(var(--hero-art-scale)) rotate(4deg)}
 body:not(.auth-view) .showcase-grid{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:600px){
 body:not(.auth-view) .hero-visual{width:100%;left:auto!important;margin:22px 0 0!important;transform-origin:top center}
 body:not(.auth-view) .hero-actions{width:100%}
 body:not(.auth-view) .hero-actions .btn{max-width:100%}
}
/* The art itself scales through --hero-art-scale, so reveal transforms should not
   resize the container and reintroduce horizontal overflow. */
@media(max-width:920px){body:not(.auth-view) .hero-visual.reveal{transform:none!important;transform-origin:top center}}

/* V14.39.4 — three-step onboarding icons: restore legibility on pale cards.
   Keep these selectors scoped to the public landing section only. */
body:not(.auth-view) .start-section .steps-grid .step-card .step-icon {
  width: 54px;
  height: 54px;
  margin-bottom: 21px;
  border-radius: 15px;
  display: inline-grid;
  place-items: center;
  background: linear-gradient(145deg, #e4f3ff 0%, #c7e5ff 100%);
  color: #076ac7 !important;
  border: 1px solid #a3d1f7;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 7px 17px rgba(12,113,207,.12);
}
body:not(.auth-view) .start-section .steps-grid .step-card .step-icon svg {
  width: 28px !important;
  height: 28px !important;
  display: block;
  opacity: 1 !important;
  visibility: visible !important;
  fill: none !important;
  color: inherit !important;
  stroke: currentColor !important;
  stroke-width: 2.6px !important;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: none !important;
}
body:not(.auth-view) .start-section .steps-grid .step-card:nth-child(2) .step-icon {
  color: #087d55 !important;
  background: linear-gradient(145deg, #e5fbf1 0%, #bef1da 100%);
  border-color: #a1e5c6;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 7px 17px rgba(17,148,104,.12);
}
body:not(.auth-view) .start-section .steps-grid .step-card:nth-child(3) .step-icon {
  color: #6544c5 !important;
  background: linear-gradient(145deg, #f3edff 0%, #dfd1ff 100%);
  border-color: #ccbcf9;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 7px 17px rgba(101,68,197,.12);
}
@media (max-width: 600px) {
  body:not(.auth-view) .start-section .steps-grid .step-card .step-icon {
    width: 48px;
    height: 48px;
    margin-bottom: 11px;
  }
  body:not(.auth-view) .start-section .steps-grid .step-card .step-icon svg {
    width: 25px !important;
    height: 25px !important;
  }
}