/* ============================================================
   TIDOW — LANDING PAGE
   ============================================================ */

/* RESET */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;max-width:100%;overflow-x:hidden}
body{
  font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',system-ui,sans-serif;
  background:#fff;color:#0D1F1D;line-height:1.5;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;max-width:100%;
}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
button{font-family:inherit;border:none;cursor:pointer}
ul{list-style:none}

/* TOKENS */
:root{
  --g:#268477;--g-dk:#1C6B60;--g-lt:#32A892;
  --g-bg:#E8F5F3;--g-glo:rgba(38,132,119,.14);
  --amb:#E0842D;--amb-bg:#FEF3E8;
  --t1:#0D1F1D;--t2:#4A6965;--t3:#8CA8A4;
  --bg0:#fff;--bg1:#F5FDFC;--bg2:#EEF9F7;
  --bdr:rgba(38,132,119,.12);--bdr0:rgba(38,132,119,.06);
  --sh-sm:0 2px 8px rgba(38,132,119,.08);
  --sh-md:0 4px 28px rgba(38,132,119,.13);
  --sh-lg:0 12px 56px rgba(38,132,119,.18);
  --sh-win:0 48px 96px rgba(0,0,0,.22),0 16px 40px rgba(0,0,0,.10),0 0 0 1px rgba(0,0,0,.05);
  --r-sm:8px;--r-md:14px;--r-lg:20px;--r-xl:28px;--r-2xl:36px;--r-pill:9999px;
  --max:1120px;--gap:140px;
}

/* LAYOUT */
.container{max-width:var(--max);margin:0 auto;padding:0 36px}

/* TYPE */
h1{font-size:clamp(38px,5.5vw,68px);font-weight:700;letter-spacing:-.033em;line-height:1.06;color:var(--t1)}
h1 em{font-style:normal;color:var(--g)}
h2{font-size:clamp(28px,4vw,50px);font-weight:700;letter-spacing:-.028em;line-height:1.1;color:var(--t1)}
h3{font-size:22px;font-weight:600;letter-spacing:-.015em;line-height:1.3;color:var(--t1)}
h4{font-size:17px;font-weight:600;letter-spacing:-.01em;color:var(--t1)}
p{color:var(--t2);line-height:1.68}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--g);margin-bottom:14px}
.eyebrow--light{color:rgba(255,255,255,.6)}
.section-intro{text-align:center;max-width:640px;margin:0 auto 72px}
.hero-demo-intro{
  position:relative;
  margin-top:76px;
  padding-top:36px;
}
.hero-demo-intro::before{
  content:'';
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:min(620px,88vw);
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(38,132,119,.26),transparent);
}
.section-sub{font-size:18px;margin-top:16px;max-width:520px;margin-left:auto;margin-right:auto}

/* ANIMATIONS */
[data-animate]{opacity:0;transform:translateY(26px);transition:opacity .72s cubic-bezier(.25,.1,.25,1),transform .72s cubic-bezier(.25,.1,.25,1)}
[data-animate].visible{opacity:1;transform:translateY(0)}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:500;border-radius:var(--r-pill);transition:all .2s cubic-bezier(.25,.1,.25,1);cursor:pointer;white-space:nowrap}
.btn-primary{background:var(--g);color:#fff;padding:13px 26px;font-size:15px;box-shadow:0 4px 18px rgba(38,132,119,.38)}
.btn-primary:hover{background:var(--g-dk);transform:scale(1.02);box-shadow:0 6px 28px rgba(38,132,119,.48)}
.btn-primary:active{transform:scale(.98)}
.btn-ghost{color:var(--t2);padding:13px 18px;font-size:15px}
.btn-ghost:hover{color:var(--g)}
.btn-lg{padding:15px 30px;font-size:16px}
.btn-xl{padding:17px 36px;font-size:17px}

/* ============================================================
   NAV — FLOATING PILL
   ============================================================ */
.nav{position:fixed;top:20px;left:0;right:0;z-index:100;display:flex;justify-content:center;padding:0 36px;pointer-events:none;transition:top .3s ease,padding .3s ease}
.nav-scrolled{top:12px}
.nav-container{
  width:100%;max-width:var(--max);display:flex;align-items:center;
  padding:7px 7px 7px 22px;border-radius:var(--r-pill);
  background:rgba(240,250,248,.82);
  backdrop-filter:blur(36px) saturate(200%);-webkit-backdrop-filter:blur(36px) saturate(200%);
  border:1px solid rgba(38,132,119,.15);position:relative;pointer-events:all;
  box-shadow:0 8px 40px rgba(0,0,0,.09),0 2px 8px rgba(0,0,0,.05),0 0 0 1px rgba(38,132,119,.09),inset 0 1px 0 rgba(255,255,255,.95);
  transition:max-width .3s ease,background .25s,box-shadow .25s;
}
.nav-scrolled .nav-container{max-width:840px}
.nav-container::before{content:'';position:absolute;top:0;left:12%;right:12%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.9),transparent);border-radius:50%;pointer-events:none}
.nav-container:hover{box-shadow:0 12px 52px rgba(0,0,0,.12),0 2px 8px rgba(0,0,0,.06),0 0 0 1px rgba(38,132,119,.16),inset 0 1px 0 rgba(255,255,255,.98);background:rgba(244,252,250,.9)}
.nav-brand{display:flex;align-items:center;gap:10px;flex-shrink:0}
.nav-icon{width:28px;height:28px;border-radius:7px}
.nav-name{font-size:16px;font-weight:700;letter-spacing:-.022em;color:var(--t1)}
.nav-links{display:flex;gap:2px;margin-left:auto}
.nav-links a{font-size:14px;font-weight:500;color:var(--t2);padding:8px 14px;border-radius:var(--r-pill);transition:color .2s,background .2s}
.nav-links a:hover{color:var(--g);background:rgba(38,132,119,.08)}
.nav-links a.active{color:var(--g);background:rgba(38,132,119,.1)}
.nav-cta{display:flex;align-items:center;gap:7px;background:var(--g);color:#fff;padding:9px 18px;border-radius:var(--r-pill);font-size:14px;font-weight:600;margin-left:8px;box-shadow:0 2px 14px rgba(38,132,119,.36),inset 0 1px 0 rgba(255,255,255,.22);transition:all .2s;flex-shrink:0}
.nav-cta:hover{background:var(--g-dk);transform:scale(1.03);box-shadow:0 4px 22px rgba(38,132,119,.5)}
.nav-menu-btn{
  display:none;
  width:38px;
  height:38px;
  border-radius:11px;
  border:1px solid rgba(38,132,119,.16);
  background:rgba(255,255,255,.78);
  align-items:center;
  justify-content:center;
  margin-left:auto;
  position:relative;
}
.nav-menu-btn span{
  position:absolute;
  left:50%;
  width:16px;
  height:1.8px;
  margin-left:-8px;
  background:var(--t2);
  border-radius:2px;
  transform-origin:center;
  transition:transform .22s ease,opacity .18s ease;
}
.nav-menu-btn span:nth-child(1){top:12px}
.nav-menu-btn span:nth-child(2){top:18px}
.nav-menu-btn span:nth-child(3){top:24px}
.mobile-menu{display:none}

/* ============================================================
   HERO
   ============================================================ */
.hero{position:relative;padding:140px 0 100px;background:linear-gradient(180deg,#EFF9F7 0%,#F8FFFE 45%,#fff 100%)}
.hero-glow{position:absolute;top:-240px;left:50%;transform:translateX(-50%);width:1000px;height:800px;background:radial-gradient(ellipse,rgba(38,132,119,.13) 0%,transparent 68%);pointer-events:none}
.hero-layout{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:var(--g-bg);color:var(--g);padding:6px 14px;border-radius:var(--r-pill);font-size:13px;font-weight:500;margin-bottom:24px;border:1px solid rgba(38,132,119,.16)}
.pulse-dot{width:7px;height:7px;background:var(--g);border-radius:50%;animation:pulse 2.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(38,132,119,.55)}70%{box-shadow:0 0 0 7px rgba(38,132,119,0)}100%{box-shadow:0 0 0 0 rgba(38,132,119,0)}}
.hero-desc{font-size:18px;line-height:1.65;margin:22px 0 36px;max-width:460px;color:var(--t2)}
.hero-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:18px}
.hero-note{font-size:13px;color:var(--t3)}

/* app window */
.hero-visual{position:relative}
.window-tilt{position:relative;transform:perspective(1200px) rotateY(-6deg) rotateX(3deg);transition:transform .6s cubic-bezier(.25,.1,.25,1)}
.window-tilt:hover{transform:perspective(1200px) rotateY(-2deg) rotateX(1deg)}
.window-shadow{position:absolute;bottom:-36px;left:10%;right:10%;height:60px;background:radial-gradient(ellipse,rgba(38,132,119,.22) 0%,transparent 70%);filter:blur(16px);pointer-events:none}
.hero-realshot{
  width:100%;
  border-radius:16px;
  border:1px solid rgba(0,0,0,.07);
  box-shadow:var(--sh-win);
  display:block;
}
.app-window{background:#fff;border-radius:14px;box-shadow:var(--sh-win);overflow:hidden;border:1px solid rgba(0,0,0,.055)}
.win-bar{display:flex;align-items:center;padding:12px 16px;background:#F4F4F4;border-bottom:1px solid rgba(0,0,0,.07);user-select:none}
.win-dots{display:flex;gap:7px}
.wd{width:12px;height:12px;border-radius:50%;flex-shrink:0}
.wd-r{background:#FF5F57}.wd-y{background:#FEBC2E}.wd-g{background:#28C840}
.win-label{flex:1;text-align:center;font-size:12px;font-weight:500;color:#555}
.win-body{display:flex;height:300px}
.win-sidebar{width:150px;background:#F8F8F8;border-right:1px solid rgba(0,0,0,.06);padding:10px 8px;display:flex;flex-direction:column;gap:2px;flex-shrink:0}
.ws-item{display:flex;align-items:center;gap:7px;padding:7px 10px;border-radius:7px;font-size:12px;color:#555;cursor:default;position:relative;transition:background .15s}
.ws-item:hover{background:rgba(38,132,119,.05)}
.ws-active{background:rgba(38,132,119,.1)!important;color:var(--g);font-weight:500}
.ws-badge{margin-left:auto;background:var(--g);color:#fff;font-size:10px;font-weight:600;padding:1px 6px;border-radius:10px;min-width:18px;text-align:center}
.win-main{flex:1;padding:14px;display:flex;flex-direction:column;gap:8px;overflow:hidden}
.wm-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}
.wm-title{font-size:13px;font-weight:600;color:#111}
.wm-new{font-size:11px;color:var(--g);background:var(--g-bg);padding:2px 8px;border-radius:10px;font-weight:500}
.fcard{display:flex;align-items:center;gap:9px;padding:9px 11px;background:#F6FDFC;border:1px solid rgba(38,132,119,.1);border-radius:9px;transition:box-shadow .15s}
.fcard--anim{animation:cardIn .5s calc(var(--d)) both}
@keyframes cardIn{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:translateX(0)}}
.fcard:hover{box-shadow:0 2px 10px rgba(38,132,119,.1)}
.ftype{font-size:9px;font-weight:700;letter-spacing:.04em;padding:3px 6px;border-radius:4px;flex-shrink:0;min-width:30px;text-align:center}
.ftype.pdf{background:#FEEAEA;color:#D83D3D}.ftype.img{background:#E3F2FD;color:#2D75C6}.ftype.dmg{background:#F3E8FF;color:#755BB7}.ftype.zip{background:#FFF3E3;color:#B77F38}
.finfo{flex:1;overflow:hidden}
.fname{display:block;font-size:11px;font-weight:500;color:#1A1A1A;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fdest{display:block;font-size:10px;color:var(--g);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fbtns{display:flex;gap:4px;flex-shrink:0}
.fb{width:23px;height:23px;border-radius:50%;font-size:10px;display:flex;align-items:center;justify-content:center;transition:all .15s}
.fb-ok{background:var(--g);color:#fff}.fb-ok:hover{background:var(--g-dk)}
.fb-no{background:#EEE;color:#888}.fb-no:hover{background:#E0E0E0}
.wm-apply{margin-top:auto}
.wm-apply-btn{width:100%;padding:8px;background:var(--g);color:#fff;border-radius:8px;font-size:12px;font-weight:500;border:none;cursor:pointer;transition:background .15s}
.wm-apply-btn:hover{background:var(--g-dk)}

/* hero demo frame */
.hero-demo-frame{margin-top:56px;border-radius:var(--r-xl);padding:28px 30px;background:linear-gradient(180deg,#F4FBFA 0%,#EEF7F6 100%);border:1px solid rgba(0,0,0,.045);box-shadow:0 22px 52px rgba(11,29,33,.12)}
.demo-dots{display:flex;gap:6px}
.demo-content{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 190px minmax(0,1fr);
  align-items:center;
  gap:18px
}
.demo-content::before{
  content:'';
  position:absolute;
  left:10%;
  right:10%;
  top:50%;
  height:8px;
  transform:translateY(-50%);
  z-index:0;
  pointer-events:none;
  background-image:radial-gradient(circle, rgba(38,132,119,.28) 2px, transparent 2.4px);
  background-size:18px 8px;
  background-repeat:repeat-x;
  animation:flowDotsX 2.2s linear infinite;
}
.demo-window{background:#fff;border:1px solid rgba(12,18,20,.08);border-radius:20px;overflow:hidden;box-shadow:0 18px 38px rgba(10,29,33,.10)}
.demo-window-bar{display:flex;align-items:center;gap:12px;background:#F4F4F4;border-bottom:1px solid rgba(0,0,0,.07);padding:10px 14px}
.demo-window-title{font-size:12px;font-weight:600;color:#555;flex:1;text-align:center}
.demo-window-spacer{width:54px}
.demo-folder-view{
  background:#fff;
  border:1px solid var(--bdr);
  border-top:none;
  border-radius:0 0 var(--r-lg) var(--r-lg);
  padding:24px;
  position:relative
}
.demo-folder-header{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--t1);margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--bdr)}
.demo-folder-header svg{color:var(--g)}
.demo-file-count{margin-left:auto;font-size:12px;font-weight:400;color:var(--t3)}
.demo-file-count--empty{color:var(--g);font-weight:600}
.demo-files{display:flex;flex-direction:column;gap:8px}
.demo-file{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--t1)}
.df-icon{font-size:9px;font-weight:700;padding:3px 6px;border-radius:4px;flex-shrink:0}
.df-icon.pdf{background:#FEEAEA;color:#D83D3D}.df-icon.img{background:#E3F2FD;color:#2D75C6}.df-icon.zip{background:#FFF3E3;color:#B77F38}
.df-icon.dmg{background:#F3E8FF;color:#755BB7}.df-icon.doc{background:#E8EFFE;color:#3A5FCC}.df-icon.mp4{background:#FFE8E8;color:#CC4444}
.demo-folder-view--messy .demo-files{max-height:226px;overflow:hidden}
.demo-files-fade{height:52px;margin-top:-52px;background:linear-gradient(to bottom,transparent,#fff);pointer-events:none;position:relative;z-index:1}
.df-name{font-size:12px;font-weight:500;color:var(--t1)}
.demo-before-label{position:absolute;bottom:12px;right:16px;font-size:11px;font-weight:600;color:var(--t3);text-transform:uppercase;letter-spacing:.07em}
.demo-after-label{color:var(--g)}
.demo-window,.demo-magic-center{position:relative;z-index:1}
.demo-magic-center{display:flex;align-items:center;justify-content:center;height:280px;z-index:2}
.demo-magic-orbit{position:absolute;border:1px dashed rgba(38,132,119,.28);border-radius:999px}
.demo-magic-orbit--one{width:132px;height:132px;animation:spin 8s linear infinite}
.demo-magic-orbit--two{width:172px;height:172px;animation:spin 13s linear reverse infinite}
.demo-magic-core{position:relative;z-index:2;width:126px;height:126px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 30% 25%,#BFF6EC 0%,#58CFB8 42%,#258477 100%);box-shadow:0 12px 34px rgba(20,120,106,.32),0 0 42px rgba(74,204,180,.40)}
.demo-magic-logo{width:70px;height:70px;object-fit:contain;filter:drop-shadow(0 6px 14px rgba(14,67,59,.40))}
.demo-sorted-folders{display:flex;flex-direction:column;gap:8px}
.demo-sorted{display:flex;align-items:center;gap:10px;padding:8px 10px;background:var(--bg1);border-radius:8px}
.ds-icon{font-size:18px}
.ds-info{display:flex;flex-direction:column;gap:1px}
.ds-info span:first-child{font-size:12px;font-weight:600;color:var(--t1)}
.ds-sub{font-size:11px;color:var(--g)}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes flowDotsX{
  from{background-position:0 50%}
  to{background-position:36px 50%}
}
@keyframes flowDotsY{
  from{background-position:50% 0}
  to{background-position:50% 36px}
}

/* ============================================================
   BENEFIT STRIP
   ============================================================ */
/* benefit strip removed — content merged into showcase section */

/* ============================================================
   ORGANIZE SHOWCASE
   ============================================================ */
/* showcase callouts */
.showcase-callouts{display:flex;flex-direction:column;gap:0}
.sc-item{display:flex;align-items:flex-start;gap:16px;padding:28px 0;border-bottom:1px solid var(--bdr)}
.sc-item:last-child{border-bottom:none}
.sc-icon{width:44px;height:44px;border-radius:12px;background:var(--ib);color:var(--ic);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.sc-item h4{margin-bottom:6px}
.sc-item p{font-size:15px;line-height:1.65}
.showcase-callouts--compact{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0 28px;
  margin-top:26px;
}
.showcase-callouts--compact .sc-item{
  padding:18px 0 0;
  border-bottom:none;
}
@media(max-width:900px){
  .showcase-callouts--compact{
    grid-template-columns:1fr 1fr;
    gap:0 20px;
  }
}
@media(max-width:640px){
  .showcase-callouts--compact{
    grid-template-columns:1fr;
    gap:20px;
    margin-top:24px;
  }
  .showcase-callouts--compact .sc-item{
    padding:0;
    border-bottom:1px solid var(--bdr);
    border-left:none;
    border-right:none;
  }
  .showcase-callouts--compact .sc-item:last-child{
    border-bottom:none;
  }
}
/* folder callout inside showcase */
.sc-item--folder .sc-icon{background:rgba(38,132,119,.1)}
.sc-paths{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.sc-paths span{font-size:11px;font-weight:600;padding:4px 10px;border-radius:8px;background:var(--g-bg);color:var(--g);border:1px solid rgba(38,132,119,.18);white-space:nowrap;letter-spacing:-.01em}
.sc-paths span:last-child{background:transparent;color:var(--t3);border-color:var(--bdr);font-weight:500;font-style:italic}

/* ============================================================
   CLEANUP SECTION
   ============================================================ */
.cleanup-section{padding:var(--gap) 0;background:#FFF6EE;text-align:center}
.cleanup-header{margin-bottom:56px}
.cleanup-section-icon{display:flex;justify-content:center;margin-bottom:28px}
.cleanup-stats{display:flex;align-items:center;justify-content:center;margin-bottom:56px}
.cstat{display:flex;flex-direction:column;align-items:center;gap:8px;padding:0 56px}
.cstat-num{font-size:52px;font-weight:700;color:var(--amb);letter-spacing:-.04em;line-height:1;display:flex;align-items:flex-end;gap:4px}
.cstat-unit{font-size:28px;font-weight:700;margin-bottom:4px}
.cstat-label{font-size:14px;color:var(--t2);font-weight:500;max-width:160px;text-align:center;line-height:1.4}
.cstat-div{width:1px;height:60px;background:rgba(224,132,45,.2)}
.cleanup-types-label{font-size:13px;font-weight:600;color:var(--t3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:16px}
.cleanup-pills{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.cpill{padding:8px 18px;border-radius:var(--r-pill);font-size:14px;font-weight:500;border:1px solid}
.cpill--dmg{background:#F3E8FF;color:#755BB7;border-color:rgba(117,91,183,.2)}
.cpill--dup{background:#E3F2FD;color:#2D75C6;border-color:rgba(45,117,198,.2)}
.cpill--zip{background:#FFF3E3;color:#B77F38;border-color:rgba(183,127,56,.2)}
.cpill--tmp{background:#FEEAEA;color:#D83D3D;border-color:rgba(216,61,61,.2)}
.cpill--old{background:var(--amb-bg);color:var(--amb);border-color:rgba(224,132,45,.2)}
.cpill--img{background:var(--g-bg);color:var(--g);border-color:var(--bdr)}

/* ============================================================
   USE CASES CAROUSEL
   ============================================================ */
.usecases-section{padding:var(--gap) 0;background:#fff;overflow:visible}
.usecases-rig{position:relative;margin-top:64px;padding:0 72px;overflow:visible}
.usecases-stage{
  position:relative;
  height:520px;
  padding:18px 0 30px;
  overflow:visible;
  touch-action:pan-y;
  -webkit-user-select:none;
  user-select:none;
}
/* arrows */
.uc-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:20;
  width:54px;height:54px;border-radius:50%;
  background:linear-gradient(150deg,#2FA091 0%,#1A7268 100%);
  border:none;
  box-shadow:0 6px 22px rgba(38,132,119,.44),0 2px 6px rgba(0,0,0,.1),inset 0 1px 0 rgba(255,255,255,.28);
  display:flex;align-items:center;justify-content:center;
  color:#fff;cursor:pointer;
  transition:transform .22s cubic-bezier(.25,.1,.25,1),box-shadow .22s,background .2s;
  overflow:hidden;
}
.uc-arrow::before{
  content:'';position:absolute;top:0;left:0;right:0;height:54%;
  background:linear-gradient(to bottom,rgba(255,255,255,.28),rgba(255,255,255,0));
  border-radius:50% 50% 0 0;pointer-events:none;
}
.uc-arrow:hover{
  background:linear-gradient(150deg,#35B09F 0%,#21806F 100%);
  box-shadow:0 10px 32px rgba(38,132,119,.56),0 2px 8px rgba(0,0,0,.12),inset 0 1px 0 rgba(255,255,255,.32);
  transform:translateY(-50%) scale(1.08);
}
.uc-arrow:active{transform:translateY(-50%) scale(0.95)}
.uc-arrow--prev{left:0}.uc-arrow--next{right:0}
/* any-folder callout */
.uc-anyfolder{
  max-width:860px;margin:48px auto 0;
  display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center;
  padding:26px 32px;border-radius:22px;
  background:linear-gradient(135deg,#EEF9F6 0%,#E4F6F0 100%);
  border:1px solid rgba(38,132,119,.16);
  box-shadow:0 4px 20px rgba(38,132,119,.07),inset 0 1px 0 rgba(255,255,255,.9);
  position:relative;overflow:hidden;
}
.uc-anyfolder::before{
  content:'';position:absolute;top:0;left:0;right:0;height:50%;
  background:linear-gradient(to bottom,rgba(255,255,255,.35),transparent);pointer-events:none;
}
.uc-af-left{display:flex;align-items:flex-start;gap:18px;position:relative;z-index:1}
.uc-af-icon{
  width:52px;height:52px;border-radius:14px;flex-shrink:0;
  background:linear-gradient(150deg,#2FA091,#1A7268);
  display:flex;align-items:center;justify-content:center;color:#fff;
  box-shadow:0 4px 16px rgba(38,132,119,.32),inset 0 1px 0 rgba(255,255,255,.26);
  overflow:hidden;position:relative;
}
.uc-af-icon::before{
  content:'';position:absolute;top:0;left:0;right:0;height:52%;
  background:linear-gradient(to bottom,rgba(255,255,255,.26),transparent);pointer-events:none;
}
.uc-af-text h4{font-size:16px;font-weight:700;letter-spacing:-.014em;color:var(--t1);margin-bottom:7px}
.uc-af-text p{font-size:14px;color:var(--t2);line-height:1.6;max-width:380px}
.uc-af-paths{display:flex;flex-direction:column;gap:6px;position:relative;z-index:1;flex-shrink:0}
.uc-af-path{
  display:flex;align-items:center;gap:8px;
  padding:7px 13px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(38,132,119,.1);
  border-radius:10px;
  font-size:12px;font-weight:500;color:var(--t1);
  white-space:nowrap;
  box-shadow:0 1px 4px rgba(0,0,0,.04),inset 0 1px 0 rgba(255,255,255,.9);
}
.uc-af-path-icon{color:var(--g);flex-shrink:0}
.uc-af-path--hint{
  justify-content:center;font-size:11px;font-weight:600;letter-spacing:.04em;
  color:var(--g);background:rgba(38,132,119,.08);border-color:rgba(38,132,119,.14);
  border-style:dashed;
}
@media(max-width:760px){
  .uc-anyfolder{grid-template-columns:1fr;gap:24px}
  .uc-af-paths{flex-direction:row;flex-wrap:wrap}
  .uc-af-path{font-size:11px;padding:6px 11px}
}
/* card base */
.uc-card{position:absolute;top:0;left:50%;width:360px;margin-left:-180px;border-radius:26px;padding:28px 26px;overflow:hidden;cursor:pointer;
  transition:transform .55s cubic-bezier(.4,0,.2,1),opacity .45s ease,box-shadow .4s ease;
  box-shadow:0 16px 48px rgba(0,0,0,.09),0 4px 14px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.85);
  border:1px solid rgba(255,255,255,.75)}
/* glossy sheen */
.uc-card::before{content:'';position:absolute;top:0;left:0;right:0;height:52%;background:linear-gradient(to bottom,rgba(255,255,255,.38),rgba(255,255,255,0));border-radius:26px 26px 0 0;pointer-events:none;z-index:1}
/* positions */
.uc-card[data-pos="center"]{transform:translateX(0) scale(1);opacity:1;z-index:10;filter:blur(0) saturate(1);box-shadow:0 28px 72px rgba(0,0,0,.13),0 8px 22px rgba(0,0,0,.09),inset 0 1px 0 rgba(255,255,255,.9)}
.uc-card[data-pos="left"]{transform:translateX(-390px) scale(0.86);opacity:.28;z-index:5;filter:blur(2.5px) saturate(.6)}
.uc-card[data-pos="right"]{transform:translateX(390px) scale(0.86);opacity:.28;z-index:5;filter:blur(2.5px) saturate(.6)}
.uc-card[data-pos="far-left"]{transform:translateX(-780px) scale(0.7);opacity:0;z-index:1;pointer-events:none}
.uc-card[data-pos="far-right"]{transform:translateX(780px) scale(0.7);opacity:0;z-index:1;pointer-events:none}
/* card colours */
.uc-card--indigo{background:linear-gradient(145deg,#F0F4FF 0%,#E4ECFF 100%);--uc-accent:#4F6EF7}
.uc-card--emerald{background:linear-gradient(145deg,#EAFDF6 0%,#D0F5E8 100%);--uc-accent:#268477}
.uc-card--violet{background:linear-gradient(145deg,#F6F1FF 0%,#EDE5FF 100%);--uc-accent:#7B5CF0}
.uc-card--amber{background:linear-gradient(145deg,#FFFBEE 0%,#FFF1CC 100%);--uc-accent:#D97706}
.uc-card--teal{background:linear-gradient(145deg,#EAFAF8 0%,#CCEDE9 100%);--uc-accent:#0D8C7A}
.uc-card--rose{background:linear-gradient(145deg,#FFF1F4 0%,#FFE0E5 100%);--uc-accent:#D43E6A}
/* interior */
.uc-top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:18px;position:relative;z-index:2}
.uc-icon{width:60px;height:60px;border-radius:16px;background:rgba(255,255,255,.7);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.95);flex-shrink:0}
.uc-pill-tag{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--uc-accent);background:rgba(255,255,255,.7);padding:5px 11px;border-radius:20px;border:1px solid rgba(255,255,255,.8);align-self:flex-start;margin-top:4px}
.uc-title{font-size:19px;font-weight:700;letter-spacing:-.018em;line-height:1.3;color:var(--t1);margin-bottom:16px;position:relative;z-index:2}
/* rule flow */
.uc-rule{display:flex;flex-direction:column;gap:0;margin-bottom:16px;position:relative;z-index:2}
.uc-rule-block{border-radius:11px;padding:10px 13px;background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.75);backdrop-filter:blur(6px)}
.uc-rule-block--dest{background:rgba(255,255,255,.7);border-color:rgba(255,255,255,.9)}
.uc-rule-kw{display:block;font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--uc-accent);margin-bottom:6px}
.uc-rule-tags{display:flex;flex-wrap:wrap;gap:5px}
.uc-rule-tag{font-size:11px;font-weight:500;padding:3px 9px;border-radius:7px;background:rgba(255,255,255,.8);color:var(--t1);border:1px solid rgba(0,0,0,.06)}
.uc-connector{display:flex;align-items:center;justify-content:center;gap:5px;padding:7px 0;font-size:11px;font-weight:600;letter-spacing:.04em;color:var(--uc-accent);opacity:.75}
.uc-rule-dest{font-size:12px;font-weight:600;color:var(--t1);display:flex;align-items:center;gap:6px;line-height:1.4}
/* chips */
.uc-chips{display:flex;flex-wrap:wrap;gap:6px;position:relative;z-index:2}
.uc-chip{font-size:11px;font-weight:500;padding:4px 10px;border-radius:8px;background:rgba(255,255,255,.6);color:var(--t2);border:1px solid rgba(255,255,255,.7)}
/* dots */
.uc-dots{display:flex;gap:8px;justify-content:center;margin-top:16px}
.uc-dot{width:8px;height:8px;border-radius:50%;background:var(--bdr);cursor:pointer;border:none;padding:0;transition:all .25s}
.uc-dot--active{background:var(--g);width:22px;border-radius:4px}
/* responsive */
@media(max-width:960px){
  .usecases-rig{padding:0 54px}
  .uc-card[data-pos="left"]{transform:translateX(-320px) scale(0.86);opacity:.22;filter:blur(2px) saturate(.5)}
  .uc-card[data-pos="right"]{transform:translateX(320px) scale(0.86);opacity:.22;filter:blur(2px) saturate(.5)}
}
@media(max-width:640px){
  .usecases-rig{padding:0 24px}
  .uc-card{width:280px;margin-left:-140px}
  .usecases-stage{height:540px;padding:20px 14px 32px}
  .uc-card[data-pos="center"]{box-shadow:0 20px 48px rgba(0,0,0,.16),0 6px 18px rgba(0,0,0,.1),inset 0 1px 0 rgba(255,255,255,.9)}
  .uc-card[data-pos="left"],.uc-card[data-pos="right"]{opacity:0;pointer-events:none}
}

/* ============================================================
   SMART RULES (DARK)
   ============================================================ */
.rules-section{padding:var(--gap) 0;background:linear-gradient(135deg,#0B211E 0%,#122B26 50%,#0E2420 100%)}
.rules-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;align-items:center}
.rules-intro{text-align:left;margin:0}
.rules-h2{color:#fff;margin-bottom:14px}
.rules-sub{font-size:17px;color:rgba(255,255,255,.58);max-width:500px;margin:0}
.rules-demo{max-width:500px}
.rules-demo-card{
  background:#ECECEC;
  border:1px solid rgba(12,18,20,.18);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 18px 42px rgba(0,0,0,.3),0 7px 18px rgba(0,0,0,.18);
}
.rules-demo-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 12px;
  border-bottom:1px solid rgba(0,0,0,.09);
  background:linear-gradient(180deg,#F3F3F3 0%,#ECECEC 100%);
}
.rules-demo-title{font-size:15px;font-weight:700;letter-spacing:-.008em;color:#2A2A2A;line-height:1.1}
.rules-close-btn{
  width:18px;height:18px;border-radius:50%;
  background:rgba(90,90,90,.7);color:#fff;
  display:flex;align-items:center;justify-content:center;
  border:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.25);
}
.rules-panel-body{padding:10px 12px 10px}
.rules-label{font-size:12px;font-weight:700;color:#6A6A6A;margin-bottom:6px;letter-spacing:-.003em;line-height:1.2}
.rules-input-shell{
  min-height:76px;
  border-radius:9px;
  border:2px solid rgba(47,160,145,.62);
  background:#E9E9E9;
  padding:8px 28px 8px 8px;
  position:relative;
}
.rules-typed-text{
  font-size:12px;
  line-height:1.4;
  color:#1E1E1E;
  letter-spacing:-.01em;
  min-height:16px;
}
.rules-typed-text::after{
  content:'';
  display:inline-block;
  width:1.5px;height:11px;margin-left:2px;
  background:#2A2A2A;vertical-align:-5px;
  animation:rulesBlink .9s step-end infinite;
}
.rules-typed-text.is-complete::after{opacity:0}
.rules-fake-scroll{
  position:absolute;right:6px;top:7px;bottom:7px;
  width:8px;border-radius:6px;background:#DFDFDF;
}
.rules-suggestions{margin-top:10px;display:flex;flex-direction:column;gap:6px}
.rules-suggestion{
  border-radius:7px;
  background:#DDE3E3;
  padding:5px 8px;
  font-size:10px;font-weight:600;color:#2D8F84;
}
.rules-suggestion.is-active{background:#D7DEDE}
.rules-detected{
  margin-top:9px;
  opacity:0;transform:translateY(8px);
  transition:opacity .45s ease,transform .45s ease;
}
.rules-detected.is-visible{opacity:1;transform:translateY(0)}
.rules-detected-head{
  display:flex;align-items:center;gap:9px;
  color:#2D8F84;font-weight:700;font-size:12px;letter-spacing:-.006em;
  margin-bottom:6px;
}
.rules-detected-card{
  border:1px solid rgba(0,0,0,.1);
  border-radius:8px;overflow:hidden;background:#ECECEC;
}
.rules-detected-row{
  display:flex;align-items:center;gap:14px;
  padding:6px 8px;
}
.rules-detected-row + .rules-detected-row{border-top:1px solid rgba(0,0,0,.09)}
.rules-detected-icon{font-size:13px;width:16px;text-align:center}
.rules-detected-copy{display:flex;flex-direction:column;gap:2px}
.rules-detected-k{font-size:10px;font-weight:600;color:#7A7A7A;line-height:1.1}
.rules-detected-v{font-size:12px;font-weight:600;color:#2A2A2A;line-height:1.1}
.rules-test-btn{
  margin-top:8px;width:100%;
  border-radius:8px;
  border:1px solid rgba(45,143,132,.28);
  background:#DDE5E5;color:#2D8F84;
  font-size:11px;font-weight:700;
  display:flex;align-items:center;justify-content:center;gap:8px;
  padding:6px 8px;
}
.rules-bottom-cta{
  margin:10px -12px -10px;
  padding:8px 12px 10px;
  border-top:1px solid rgba(0,0,0,.1);
  background:#ECECEC;
}
.rules-apply-btn{
  width:100%;
  border-radius:8px;
  border:none;
  background:linear-gradient(180deg,#2F9C8D 0%,#2A8E80 100%);
  color:#fff;
  font-size:12px;font-weight:700;
  display:flex;align-items:center;justify-content:center;gap:10px;
  padding:8px 10px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 2px 10px rgba(42,142,128,.35);
}
@keyframes rulesBlink{0%,100%{opacity:1}50%{opacity:0}}

/* ============================================================
   HOW IT WORKS
   ============================================================ */
.howto-section{padding:var(--gap) 0;background:#fff}
.howto-compact{padding:calc(var(--gap) * .75) 0}
.howto-compact-head{text-align:center;margin-bottom:48px}
.howto-compact-h2{font-size:clamp(32px,4vw,44px);letter-spacing:-.02em;line-height:1.1;margin-top:10px}
/* ---- ONBOARD GRID ---- */
.onboard-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
  max-width:1140px;
  margin:0 auto;
}
.onboard-card{
  position:relative;
  min-height:280px;
  padding:32px 28px 28px;
  border-radius:20px;
  background:linear-gradient(135deg,#fff 0%,#FAFDFC 100%);
  border:1.5px solid var(--bdr);
  transition:all .35s cubic-bezier(.25,.46,.45,.94);
  box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 12px 32px -8px rgba(38,132,119,.14);
}
.onboard-card:hover{
  border-color:rgba(38,132,119,.25);
  transform:translateY(-6px);
  box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 24px 56px -12px rgba(38,132,119,.24);
}
.onboard-card::before{
  content:'';
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(180deg,rgba(255,255,255,.5) 0%,rgba(255,255,255,0) 50%);
  pointer-events:none;
}
.onboard-card-top{
  position:relative;
  z-index:1;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  margin-bottom:24px;
}
.onboard-card-num{
  display:inline-block;
  font-size:28px;
  font-weight:900;
  letter-spacing:.08em;
  color:var(--g);
  text-transform:uppercase;
  margin-bottom:8px;
}
.onboard-card-icon{
  width:80px;
  height:80px;
  border-radius:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#FFFFFF;
  background:linear-gradient(135deg,#35A292 0%,#268477 100%);
  border:1px solid rgba(255,255,255,.3);
  box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 16px 40px rgba(38,132,119,.22);
  transition:transform .35s cubic-bezier(.25,.46,.45,.94);
}
.onboard-card:hover .onboard-card-icon{
  transform:scale(1.08);
}
.onboard-card-icon svg{
  width:36px;
  height:36px;
  stroke-width:1.8;
}
.onboard-card-title{
  position:relative;
  z-index:1;
  font-size:20px;
  font-weight:800;
  line-height:1.15;
  letter-spacing:-.02em;
  color:var(--t1);
  margin-bottom:12px;
}
.onboard-card-text{
  position:relative;
  z-index:1;
  font-size:14px;
  line-height:1.65;
  color:var(--t2);
  margin:0;
}
.onboard-card-note{
  display:none;
}

/* ============================================================
   FAQ
   ============================================================ */
.faq-page-hero{
  position:relative;
  padding:156px 0 84px;
  background:linear-gradient(180deg,#EFF9F7 0%,#F8FFFE 68%,#fff 100%);
  overflow:hidden;
}
.faq-page-hero::before{
  content:'';
  position:absolute;
  left:50%;
  top:-260px;
  width:980px;
  height:720px;
  transform:translateX(-50%);
  background:radial-gradient(ellipse,rgba(38,132,119,.14) 0%,transparent 68%);
  pointer-events:none;
}
.faq-page-head{
  position:relative;
  max-width:820px;
  margin:0 auto;
  text-align:center;
}
.faq-page-head h1{
  max-width:760px;
  margin:0 auto;
}
.faq-page-head p:not(.eyebrow){
  max-width:640px;
  margin:24px auto 0;
  font-size:19px;
}
.faq-section{
  position:relative;
  padding:var(--gap) 0;
  background:
    linear-gradient(180deg,#fff 0%,#F3FBF9 44%,#EEF9F7 100%);
  overflow:hidden;
}
.faq-section::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(38,132,119,.08) 1px,transparent 1px),
    linear-gradient(180deg,rgba(38,132,119,.06) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:linear-gradient(180deg,transparent 0%,#000 18%,#000 76%,transparent 100%);
  opacity:.38;
  pointer-events:none;
}
.faq-shell{
  position:relative;
  max-width:980px;
  margin:0 auto;
}
.faq-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.faq-item{
  position:relative;
  border-radius:16px;
  background:rgba(255,255,255,.82);
  border:1px solid rgba(38,132,119,.13);
  box-shadow:0 12px 30px rgba(38,132,119,.09),inset 0 1px 0 rgba(255,255,255,.9);
  overflow:hidden;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease;
}
.faq-item:hover{
  transform:translateY(-2px);
  border-color:rgba(38,132,119,.24);
  box-shadow:0 18px 42px rgba(38,132,119,.13),inset 0 1px 0 rgba(255,255,255,.96);
}
.faq-item[open]{
  background:#fff;
  border-color:rgba(38,132,119,.27);
}
.faq-item summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  min-height:68px;
  padding:20px 22px;
  cursor:pointer;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-q{
  font-size:17px;
  font-weight:800;
  letter-spacing:-.015em;
  line-height:1.3;
  color:var(--t1);
}
.faq-toggle{
  position:relative;
  width:28px;
  height:28px;
  border-radius:9px;
  flex-shrink:0;
  background:var(--g-bg);
  border:1px solid rgba(38,132,119,.12);
}
.faq-toggle::before,
.faq-toggle::after{
  content:'';
  position:absolute;
  left:50%;
  top:50%;
  width:12px;
  height:2px;
  border-radius:2px;
  background:var(--g);
  transform:translate(-50%,-50%);
  transition:transform .22s ease,opacity .22s ease;
}
.faq-toggle::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq-item[open] .faq-toggle::after{
  opacity:0;
  transform:translate(-50%,-50%) rotate(0deg);
}
.faq-answer{
  padding:0 22px 22px;
  margin-top:-4px;
  max-width:720px;
}
.faq-answer p{
  font-size:15px;
  line-height:1.75;
  color:var(--t2);
}
.faq-section--page{
  padding-top:96px;
}
.faq-page-cta{
  padding:0 0 var(--gap);
  background:#EEF9F7;
}
.faq-cta-card{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:28px;
  max-width:980px;
  margin:0 auto;
  padding:34px 40px;
  border-radius:28px;
  background:#fff;
  border:1px solid rgba(38,132,119,.16);
  box-shadow:0 20px 54px rgba(38,132,119,.13),inset 0 1px 0 rgba(255,255,255,.9);
}
.faq-cta-card .cta-appicon{
  width:70px;
  height:70px;
  margin:0;
}
.faq-cta-card h2{
  font-size:clamp(26px,3vw,38px);
}
.faq-cta-card p:not(.eyebrow){
  margin-top:8px;
  font-size:16px;
}
.faq-cta-card--support{
  background:linear-gradient(135deg,#FFFFFF 0%,#F4FBFA 100%);
}
.faq-support-icon{
  width:70px;
  height:70px;
  border-radius:20px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  color:#fff;
  background:linear-gradient(135deg,#35A292 0%,#268477 100%);
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 1px 0 rgba(255,255,255,.35) inset,0 14px 32px rgba(38,132,119,.28);
}
.faq-support-icon svg{
  width:32px;
  height:32px;
}

/* ============================================================
   PRIVACY
   ============================================================ */
.privacy-hero{
  position:relative;
  padding:156px 0 82px;
  background:linear-gradient(180deg,#EFF9F7 0%,#F8FFFE 70%,#fff 100%);
  overflow:hidden;
}
.privacy-hero::before{
  content:'';
  position:absolute;
  left:50%;
  top:-260px;
  width:980px;
  height:720px;
  transform:translateX(-50%);
  background:radial-gradient(ellipse,rgba(38,132,119,.14) 0%,transparent 68%);
  pointer-events:none;
}
.privacy-head{
  position:relative;
  max-width:820px;
  margin:0 auto;
  text-align:center;
}
.privacy-head h1{
  max-width:760px;
  margin:0 auto;
}
.privacy-head p:not(.eyebrow){
  max-width:620px;
  margin:24px auto 0;
  font-size:19px;
}
.privacy-updated{
  display:inline-flex;
  margin-top:24px;
  padding:7px 14px;
  border-radius:var(--r-pill);
  background:rgba(255,255,255,.72);
  border:1px solid rgba(38,132,119,.14);
  color:var(--g-dk);
  font-size:12px;
  font-weight:700;
  box-shadow:0 10px 24px rgba(38,132,119,.08);
}
.privacy-section{
  position:relative;
  padding:96px 0 var(--gap);
  background:
    radial-gradient(circle at 12% 18%,rgba(38,132,119,.08),transparent 30%),
    linear-gradient(180deg,#fff 0%,#F4FBFA 44%,#EEF9F7 100%);
}
.privacy-layout{
  display:grid;
  grid-template-columns:minmax(260px,330px) minmax(0,1fr);
  gap:46px;
  align-items:start;
}
.privacy-aside{
  position:sticky;
  top:112px;
}
.privacy-summary-card{
  padding:28px;
  border-radius:28px;
  background:rgba(255,255,255,.82);
  border:1px solid rgba(38,132,119,.16);
  box-shadow:0 20px 54px rgba(38,132,119,.12),inset 0 1px 0 rgba(255,255,255,.95);
  backdrop-filter:blur(24px) saturate(160%);
  -webkit-backdrop-filter:blur(24px) saturate(160%);
}
.privacy-summary-icon{
  width:62px;
  height:62px;
  border-radius:16px;
  margin-bottom:22px;
  box-shadow:0 14px 30px rgba(38,132,119,.18);
}
.privacy-summary-card h2{
  font-size:24px;
  margin-bottom:16px;
}
.privacy-summary-card ul{
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-bottom:24px;
}
.privacy-summary-card li{
  position:relative;
  padding-left:24px;
  color:var(--t2);
  font-size:14px;
  line-height:1.5;
}
.privacy-summary-card li::before{
  content:'';
  position:absolute;
  left:0;
  top:.48em;
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--g);
  box-shadow:0 0 0 5px rgba(38,132,119,.1);
}
.privacy-cookie-btn,
.privacy-inline-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:var(--r-pill);
  background:var(--g);
  color:#fff;
  font-size:14px;
  font-weight:700;
  padding:11px 18px;
  box-shadow:0 8px 22px rgba(38,132,119,.24);
  transition:transform .2s ease,background .2s ease,box-shadow .2s ease;
}
.privacy-cookie-btn:hover,
.privacy-inline-btn:hover{
  transform:translateY(-1px);
  background:var(--g-dk);
  box-shadow:0 12px 28px rgba(38,132,119,.32);
}
.privacy-content{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.privacy-card{
  padding:30px 34px;
  border-radius:24px;
  background:#fff;
  border:1px solid rgba(38,132,119,.13);
  box-shadow:0 14px 36px rgba(38,132,119,.09),inset 0 1px 0 rgba(255,255,255,.95);
}
.privacy-card h2{
  font-size:24px;
  letter-spacing:-.018em;
  margin-bottom:12px;
}
.privacy-card p{
  font-size:15px;
  line-height:1.78;
}
.privacy-card p + p{
  margin-top:12px;
}
.privacy-inline-btn{
  margin-top:18px;
  background:rgba(38,132,119,.1);
  color:var(--g-dk);
  box-shadow:none;
  border:1px solid rgba(38,132,119,.14);
}
.privacy-inline-btn:hover{
  color:#fff;
}

/* ============================================================
   COOKIE CONSENT
   ============================================================ */
.cookie-consent{
  position:fixed;
  left:50%;
  bottom:22px;
  z-index:1000;
  width:min(720px,calc(100vw - 32px));
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:center;
  padding:16px 16px 16px 20px;
  border-radius:22px;
  background:rgba(250,255,254,.92);
  border:1px solid rgba(38,132,119,.18);
  box-shadow:0 24px 70px rgba(13,31,29,.18),0 8px 28px rgba(38,132,119,.14),inset 0 1px 0 rgba(255,255,255,.95);
  backdrop-filter:blur(28px) saturate(180%);
  -webkit-backdrop-filter:blur(28px) saturate(180%);
  transform:translateX(-50%) translateY(0);
  opacity:1;
  transition:opacity .22s ease,transform .22s ease;
}
.cookie-consent--hidden{
  opacity:0;
  transform:translateX(-50%) translateY(18px);
  pointer-events:none;
}
.cookie-consent__copy{
  display:flex;
  flex-direction:column;
  gap:3px;
}
.cookie-consent__copy strong{
  color:var(--t1);
  font-size:15px;
  letter-spacing:-.01em;
}
.cookie-consent__copy span{
  color:var(--t2);
  font-size:13px;
  line-height:1.45;
}
.cookie-consent__copy a{
  width:max-content;
  color:var(--g);
  font-size:12px;
  font-weight:800;
  margin-top:4px;
}
.cookie-consent__actions{
  display:flex;
  gap:8px;
}
.cookie-consent__btn{
  min-width:92px;
  border-radius:var(--r-pill);
  padding:10px 16px;
  font-size:13px;
  font-weight:800;
  transition:transform .2s ease,background .2s ease,color .2s ease,box-shadow .2s ease;
}
.cookie-consent__btn:hover{
  transform:translateY(-1px);
}
.cookie-consent__btn--ghost{
  background:rgba(38,132,119,.08);
  color:var(--g-dk);
}
.cookie-consent__btn--ghost:hover{
  background:rgba(38,132,119,.13);
}
.cookie-consent__btn--primary{
  background:var(--g);
  color:#fff;
  box-shadow:0 8px 22px rgba(38,132,119,.26);
}
.cookie-consent__btn--primary:hover{
  background:var(--g-dk);
  box-shadow:0 12px 30px rgba(38,132,119,.34);
}

/* ============================================================
   PRICING
   ============================================================ */
.pricing-section{padding:var(--gap) 0;background:var(--bg2)}
.pricing-card{background:#fff;border:1px solid var(--bdr);border-radius:var(--r-xl);padding:56px 68px;display:grid;grid-template-columns:1fr 1fr;gap:68px;align-items:start;box-shadow:var(--sh-sm);max-width:920px;margin:0 auto}
.trial-pill{display:inline-flex;background:var(--g-bg);color:var(--g);font-size:13px;font-weight:600;padding:6px 16px;border-radius:var(--r-pill);margin-bottom:20px;border:1px solid rgba(38,132,119,.15)}
.price-row{display:flex;align-items:baseline;gap:4px;margin-bottom:6px}
.price-amt{font-size:58px;font-weight:700;letter-spacing:-.045em;color:var(--t1);line-height:1}
.price-per{font-size:20px;color:var(--t2)}
.price-after{font-size:13px;color:var(--t3);margin-bottom:32px}
.no-cc{font-size:13px;color:var(--t3);margin-top:12px}
.incl-title{font-weight:600;color:var(--t1);margin-bottom:18px;font-size:15px}
.incl-list{display:flex;flex-direction:column;gap:13px}
.incl-list li{display:flex;align-items:flex-start;gap:10px;font-size:15px;color:var(--t2)}
.chk{color:var(--g);font-weight:700;flex-shrink:0;margin-top:1px}

/* ============================================================
   FINAL CTA
   ============================================================ */
.final-cta{padding:var(--gap) 0;background:#fff}
.cta-inner{text-align:center;max-width:660px;margin:0 auto}
.cta-appicon{width:88px;height:88px;border-radius:22px;margin:0 auto 28px;box-shadow:0 12px 40px rgba(0,0,0,.12)}
.cta-inner h2{margin-bottom:16px}
.cta-inner p{font-size:18px;margin-bottom:36px}
.cta-note{font-size:13px;color:var(--t3);margin-top:16px}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{padding:48px 0;border-top:1px solid var(--bdr0);background:#FAFFFE}
.footer-inner{display:flex;align-items:center;gap:32px;flex-wrap:wrap}
.footer-brand{display:flex;align-items:center;gap:10px}
.footer-appicon{width:28px;height:28px;border-radius:7px}
.footer-name{font-size:15px;font-weight:700;letter-spacing:-.02em;color:var(--t1)}
.footer-links{display:flex;gap:24px;margin-left:auto}
.footer-links a{font-size:13px;color:var(--t3);transition:color .2s}
.footer-links a:hover{color:var(--g)}
.footer-copy{font-size:13px;color:var(--t3)}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:1024px){
  :root{--gap:100px}
  .showcase-callouts{flex-direction:row;flex-wrap:wrap;gap:0}
  .sc-item{flex:1;min-width:240px;padding:20px}
  .sc-item:first-child{border-bottom:1px solid var(--bdr);border-right:1px solid var(--bdr)}
  .sc-item:last-child{border-top:1px solid var(--bdr)}
  .showcase-callouts--compact{grid-template-columns:1fr;gap:0}
  .showcase-callouts--compact .sc-item{
    border-right:none;
    border-top:none;
    border-bottom:1px solid var(--bdr);
    padding:20px 0;
  }
  .showcase-callouts--compact .sc-item:first-child,
  .showcase-callouts--compact .sc-item:last-child{border-right:none;border-top:none}
  .showcase-callouts--compact .sc-item:last-child{border-bottom:none}
}
@media(max-width:900px){
  .hero-layout{grid-template-columns:1fr;gap:48px}
  .hero-text{text-align:center}
  .hero-desc{margin-left:auto;margin-right:auto}
  .hero-actions{justify-content:center}
  .hero-note{text-align:center}
  .window-tilt{transform:none}
  .window-tilt:hover{transform:none}
  .hero-demo-frame{padding:22px}
  .demo-content{grid-template-columns:1fr;gap:22px}
  .demo-content::before{display:none}
  .demo-magic-center::before,
  .demo-magic-center::after{
    content:'';
    position:absolute;
    left:50%;
    width:8px;
    height:86px;
    transform:translateX(-50%);
    z-index:0;
    pointer-events:none;
    background-image:radial-gradient(circle, rgba(38,132,119,.28) 2px, transparent 2.4px);
    background-size:8px 18px;
    background-repeat:repeat-y;
    animation:flowDotsY 2.2s linear infinite;
  }
  .demo-magic-center::before{top:-86px}
  .demo-magic-center::after{bottom:-86px}
  .demo-magic-center{height:170px;z-index:1}
  .demo-window{z-index:2}
  .demo-window-spacer{display:none}
  .onboard-grid{grid-template-columns:1fr 1fr}
  .rules-layout{grid-template-columns:1fr;gap:28px}
  .rules-intro{order:2;text-align:center}
  .rules-sub{margin:0 auto}
  .rules-demo{order:1;max-width:100%}
  .pricing-card{grid-template-columns:1fr;gap:40px;padding:44px 36px}
  .cleanup-stats{flex-wrap:wrap;gap:32px}
  .cstat{padding:0 24px}
  .cstat-div{display:none}
  .privacy-layout{grid-template-columns:1fr;gap:28px}
  .privacy-aside{position:relative;top:auto}
  .privacy-summary-card{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:22px;align-items:start}
  .privacy-summary-icon{grid-row:1 / span 3;margin-bottom:0}
  .privacy-cookie-btn{width:max-content}
}
@media(max-width:640px){
  :root{--gap:72px}
  .container{padding:0 20px}
  .usecases-rig{padding:0 12px}
  h1{font-size:36px}
  h2{font-size:28px}
  .demo-magic-orbit{display:none}
  .pricing-card{padding:32px 24px}
  .price-amt{font-size:46px}
  .hero{padding:110px 0 56px}
  .section-intro{margin-bottom:48px}
  .hero-demo-intro{margin-top:68px;padding-top:28px}
  .section-sub{font-size:16px}
  .sc-item{min-width:100%}
  .cleanup-pills{gap:8px}
  .rules-demo-card{border-radius:var(--r-lg)}
  .rules-demo-header{padding:10px 12px}
  .rules-demo-title{font-size:16px}
  .rules-close-btn{width:20px;height:20px}
  .rules-panel-body{padding:12px}
  .rules-label{font-size:13px}
  .rules-input-shell{min-height:84px;padding:9px 30px 9px 9px}
  .rules-typed-text{font-size:13px}
  .rules-typed-text::after{height:12px;vertical-align:-2px}
  .rules-fake-scroll{width:9px;right:7px;top:8px;bottom:8px}
  .rules-suggestion{font-size:11px;padding:6px 8px}
  .rules-detected-head{font-size:13px}
  .rules-detected-row{padding:7px 9px;gap:8px}
  .rules-detected-icon{font-size:14px;width:18px}
  .rules-detected-k{font-size:11px}
  .rules-detected-v{font-size:13px}
  .rules-test-btn{font-size:12px;padding:7px}
  .rules-bottom-cta{margin:10px -12px -12px;padding:9px 12px 12px}
  .rules-apply-btn{font-size:13px;padding:9px}
  .onboard-grid{grid-template-columns:1fr;gap:10px}
  .onboard-card{min-height:0;padding:16px;border-radius:20px}
  .onboard-card-top{margin-bottom:16px}
  .onboard-card-icon{width:62px;height:62px;border-radius:18px}
  .onboard-card-icon svg{width:26px;height:26px}
  .onboard-card-title{font-size:20px}
  .onboard-card-text{font-size:13px;max-width:none}
  .onboard-card-note{margin-top:14px}
  .faq-shell{max-width:980px}
  .faq-item summary{min-height:62px;padding:17px 18px}
  .faq-q{font-size:16px}
  .faq-answer{padding:0 18px 18px}
  .nav{padding:0 10px}
  .nav-container{
    padding:8px 10px;
    border-radius:20px;
    display:grid;
    grid-template-columns:auto 1fr auto auto;
    align-items:center;
    column-gap:10px;
    position:relative;
  }
  .nav-brand{min-width:0;grid-column:1;grid-row:1}
  .nav-name{font-size:15px}
  .nav-links{display:none}
  .nav-menu-btn{display:flex;grid-column:4;grid-row:1;margin-left:0;justify-self:end}
  .nav-cta{
    grid-column:3;
    grid-row:1;
    margin-left:0;
    justify-self:end;
    padding:8px 14px;
    font-size:13px;
    white-space:nowrap;
  }
  .mobile-menu{
    position:absolute;
    left:10px;
    right:10px;
    top:calc(100% + 8px);
    display:none;
    flex-direction:column;
    gap:2px;
    padding:8px;
    border-radius:14px;
    background:rgba(244,252,250,.96);
    border:1px solid rgba(38,132,119,.16);
    box-shadow:0 14px 30px rgba(0,0,0,.1);
    backdrop-filter:blur(24px) saturate(180%);
    -webkit-backdrop-filter:blur(24px) saturate(180%);
  }
  .mobile-menu a{
    font-size:14px;
    font-weight:600;
    color:var(--t2);
    padding:10px 12px;
    border-radius:10px;
  }
  .mobile-menu a:hover{background:rgba(38,132,119,.08);color:var(--g)}
  .mobile-menu a.active{background:rgba(38,132,119,.1);color:var(--g)}
  .nav-container.mobile-menu-open .mobile-menu{display:flex}
  .nav-container.mobile-menu-open .nav-menu-btn span:nth-child(1){transform:translateY(6px) rotate(45deg)}
  .nav-container.mobile-menu-open .nav-menu-btn span:nth-child(2){opacity:0}
  .nav-container.mobile-menu-open .nav-menu-btn span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
  .privacy-hero{padding:128px 0 60px}
  .privacy-head p:not(.eyebrow){font-size:16px}
  .privacy-section{padding:72px 0 86px}
  .privacy-summary-card{display:block;padding:24px;border-radius:22px}
  .privacy-summary-icon{width:56px;height:56px;margin-bottom:18px}
  .privacy-card{padding:24px 20px;border-radius:20px}
  .privacy-card h2{font-size:20px}
  .privacy-card p{font-size:14px}
  .cookie-consent{
    grid-template-columns:1fr;
    gap:14px;
    bottom:14px;
    width:calc(100vw - 24px);
    padding:16px;
    border-radius:20px;
  }
  .cookie-consent__actions{width:100%}
  .cookie-consent__btn{flex:1}
}

@media(max-width:640px){
  .faq-page-hero{padding:128px 0 60px}
  .faq-page-head p:not(.eyebrow){font-size:16px}
  .faq-section{padding:86px 0}
  .faq-section--page{padding-top:76px}
  .faq-list{gap:8px}
  .faq-item{border-radius:14px}
  .faq-item summary{gap:14px;padding:16px 14px}
  .faq-answer{padding:0 14px 16px}
  .faq-answer p{font-size:14px}
  .faq-cta-card{grid-template-columns:1fr;text-align:center;padding:30px 22px}
  .faq-cta-card .cta-appicon,
  .faq-cta-card .faq-support-icon{margin:0 auto}
  .faq-cta-card .btn{justify-content:center}
}
