/* iPhone Data Tool - product pages (We Repair Computers Harwich) */
:root{
  --paper:#F7F8FB; --white:#FFFFFF; --ink:#0F172A; --ink2:#334155; --muted:#64748B; --line:#E3E8F0;
  --blue:#2563EB; --violet:#7C3AED; --mint:#10B981; --amber:#F59E0B; --red:#DC2626;
  --grad:linear-gradient(135deg,#2563EB 0%,#7C3AED 100%);
  --display:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;
  --body:"Instrument Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --r-lg:28px; --r-md:16px; --r-sm:10px;
  --wrap:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.6 var(--body);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--blue)}
:focus-visible{outline:3px solid #93C5FD;outline-offset:2px;border-radius:6px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
h1,h2,h3{font-family:var(--display);letter-spacing:-.025em;line-height:1.05;margin:0}
h2{font-size:clamp(32px,4.2vw,52px);font-weight:700}
h3{font-size:21px;font-weight:650;letter-spacing:-.01em;line-height:1.25}
p{margin:0 0 1em}
.lede{font-size:19px;color:var(--ink2);max-width:60ch}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;height:54px;padding:0 24px;border-radius:14px;border:0;font:600 16.5px var(--body);
     text-decoration:none;cursor:pointer;white-space:nowrap;transition:transform .15s ease,box-shadow .15s ease}
.btn svg{width:20px;height:20px}
.btn.primary{background:var(--ink);color:#fff;box-shadow:0 10px 30px rgba(15,23,42,.18)}
.btn.primary:hover{transform:translateY(-1px);box-shadow:0 14px 34px rgba(15,23,42,.24)}
.btn.pro{background:var(--grad);color:#fff;box-shadow:0 12px 32px rgba(124,58,237,.3)}
.btn.ghost{background:transparent;color:var(--ink);border:1.5px solid #CBD5E1}
.btn.ghost:hover{border-color:var(--ink)}
.btn:disabled{opacity:.6;cursor:wait}

/* nav */
.nav{position:sticky;top:0;z-index:20;background:rgba(247,248,251,.86);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid transparent;transition:border-color .2s}
.nav.scrolled{border-bottom-color:var(--line)}
.nav .wrap{display:flex;align-items:center;gap:28px;height:72px}
.nav .logo{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font:700 18px var(--display);letter-spacing:-.01em}
.nav .logo img{height:34px;width:auto}
.nav .links{display:flex;gap:26px;margin-left:auto}
.nav .links a{color:var(--ink2);text-decoration:none;font-size:15.5px;font-weight:500}
.nav .links a:hover{color:var(--ink)}
.nav .btn{height:42px;padding:0 18px;font-size:15px}

/* hero */
.hero{padding:72px 0 96px;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.08fr .92fr;gap:56px;align-items:center}
.hero h1{font-size:clamp(46px,6.6vw,86px);font-weight:750;letter-spacing:-.04em;line-height:.98;margin-bottom:26px}
.hero h1 .strike{position:relative;white-space:nowrap}
.hero .lede{margin-bottom:34px}
.hero .ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:22px}
.hero .meta{font-size:14.5px;color:var(--muted);display:flex;gap:18px;flex-wrap:wrap}
.hero .meta span{display:inline-flex;align-items:center;gap:7px}
.hero .meta svg{width:16px;height:16px;color:var(--mint)}

/* the scanning iPhone */
.stage{position:relative;display:flex;justify-content:center}
.stage::before{content:"";position:absolute;inset:6% -10% 0;background:radial-gradient(closest-side,rgba(37,99,235,.18),transparent 70%),
               radial-gradient(closest-side at 70% 70%,rgba(124,58,237,.16),transparent 70%);z-index:0}
.phone{position:relative;z-index:1;width:330px;aspect-ratio:9/19;border-radius:54px;background:#0F172A;padding:13px;
       box-shadow:0 50px 90px rgba(15,23,42,.28),inset 0 0 0 2px #334155}
.phone .screen{position:relative;width:100%;height:100%;border-radius:42px;background:#fff;overflow:hidden}
.phone .island{position:absolute;top:12px;left:50%;transform:translateX(-50%);width:96px;height:28px;border-radius:20px;background:#0F172A;z-index:4}
.scanhead{padding:54px 18px 10px;display:flex;justify-content:space-between;align-items:baseline}
.scanhead b{font:700 19px var(--display)}
.scanhead small{font-size:12px;color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;padding:0 3px}
.grid i{aspect-ratio:1;border-radius:5px;background:#E2E8F0;background-size:118%;background-position:50% 50%;opacity:0;transform:scale(.6);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.grid i.on{opacity:1;transform:none;transition:opacity .4s ease,transform .4s ease}
.grid i.del{box-shadow:inset 0 0 0 2.5px var(--mint)}
@media (prefers-reduced-motion:no-preference){
 @keyframes kbzoom{0%{background-size:112%;background-position:30% 26%}50%{background-size:144%;background-position:70% 74%}100%{background-size:112%;background-position:30% 26%}}
 .grid i.on{animation:kbzoom 8.5s ease-in-out infinite;animation-delay:var(--d,0s)}
}
.sweep{position:absolute;left:0;right:0;height:120px;top:-120px;z-index:3;pointer-events:none;
       background:linear-gradient(180deg,transparent,rgba(37,99,235,.10) 70%,rgba(37,99,235,.55) 98%,transparent);border-bottom:2px solid rgba(37,99,235,.9)}
.tally{position:absolute;left:12px;right:12px;bottom:14px;z-index:3;background:rgba(15,23,42,.92);color:#fff;border-radius:20px;padding:14px 16px;
       display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;font-size:12.5px;backdrop-filter:blur(8px)}
.tally div{display:flex;justify-content:space-between;gap:8px}
.tally b{font:700 14px var(--display);font-variant-numeric:tabular-nums}
.tally .found b{color:#6EE7B7}
.tally .lock{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:4px;padding-top:10px;border-top:1px solid rgba(255,255,255,.12);color:#FCD34D;font-weight:600}
.floater{position:absolute;z-index:2;background:#fff;border:1px solid var(--line);border-radius:18px;padding:12px 14px;box-shadow:0 20px 40px rgba(15,23,42,.12);
         font-size:13.5px;display:flex;gap:10px;align-items:center;max-width:230px}
.floater .ic{flex:0 0 36px;height:36px;border-radius:11px;display:flex;align-items:center;justify-content:center;color:#fff}
.floater .ic svg{width:20px;height:20px}
.floater b{display:block;font-size:14px}
.floater small{color:var(--muted)}
.f1{left:-4%;top:22%}.f2{right:-6%;top:52%}
.f1 .ic{background:#25D366}.f2 .ic{background:var(--mint)}

/* free vs pro split */
.split{padding:110px 0;background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.split h2{max-width:18ch;margin-bottom:18px}
.split .lede{margin-bottom:56px}
.duo{display:grid;grid-template-columns:1fr 92px 1fr;align-items:stretch}
.side{border-radius:var(--r-lg);padding:36px}
.side.free{background:var(--paper);border:1px solid var(--line)}
.side.pro{background:#0F172A;color:#E2E8F0;position:relative;overflow:hidden}
.side.pro::after{content:"";position:absolute;right:-120px;top:-120px;width:340px;height:340px;border-radius:50%;background:var(--grad);opacity:.35;filter:blur(40px)}
.side h3{font-size:26px;margin-bottom:6px}
.side.pro h3{color:#fff}
.side .price{font-size:15px;color:var(--muted);margin-bottom:24px}
.side.pro .price{color:#A5B4FC}
.side ul{list-style:none;padding:0;margin:0;display:grid;gap:14px;position:relative;z-index:1}
.side li{display:flex;gap:12px;font-size:16px;line-height:1.45}
.side li svg{flex:0 0 22px;height:22px;margin-top:1px}
.side.free li svg{color:var(--blue)}
.side.pro li svg{color:#FCD34D}
.hinge{display:flex;align-items:center;justify-content:center;position:relative}
.hinge::before{content:"";position:absolute;top:10%;bottom:10%;left:50%;border-left:2px dashed #CBD5E1}
.hinge span{position:relative;width:58px;height:58px;border-radius:50%;background:var(--grad);display:flex;align-items:center;justify-content:center;color:#fff;
            box-shadow:0 12px 28px rgba(124,58,237,.35)}
.hinge svg{width:26px;height:26px}

/* features */
.features{padding:110px 0}
.features header{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:56px}
.flist{display:grid;grid-template-columns:repeat(2,1fr);gap:0 56px}
.feat{display:grid;grid-template-columns:52px 1fr;gap:18px;padding:28px 0;border-top:1px solid var(--line)}
.feat .ic{width:52px;height:52px;border-radius:15px;display:flex;align-items:center;justify-content:center;color:#fff}
.feat .ic svg{width:26px;height:26px}
.feat h3{margin:4px 0 6px}
.feat p{color:var(--ink2);font-size:16px;margin:0}
.feat .tier{display:inline-block;font-size:12.5px;font-weight:600;color:var(--muted);margin-top:8px}
.feat .tier em{font-style:normal;color:var(--violet)}

/* steps */
.steps{padding:110px 0;background:var(--ink);color:#CBD5E1}
.steps h2{color:#fff;margin-bottom:56px;max-width:20ch}
.steplist{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;counter-reset:s}
.step{position:relative;padding-top:74px}
.step::before{counter-increment:s;content:counter(s);position:absolute;top:0;left:0;font:700 56px/1 var(--display);
              background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.step h3{color:#fff;margin-bottom:8px}
.step p{font-size:16px}

/* pricing */
.pricing{padding:110px 0}
.pricing .head{text-align:center;max-width:720px;margin:0 auto 52px}
.pricing .head .lede{margin:16px auto 0}
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch}
.plan{background:var(--white);border:1.5px solid var(--line);border-radius:var(--r-lg);padding:32px;display:flex;flex-direction:column;position:relative;cursor:pointer;transition:border-color .15s}
.plan:hover{border-color:#A5B4FC}
.plan.sel{border-color:var(--violet);box-shadow:0 0 0 4px rgba(124,58,237,.12)}
.plan.best{background:linear-gradient(180deg,#F5F3FF,#fff 40%)}
.plan .badge{position:absolute;top:-13px;left:32px;background:var(--grad);color:#fff;font-size:12.5px;font-weight:700;padding:5px 12px;border-radius:99px}
.plan h3{font-size:19px;color:var(--ink2);margin-bottom:10px}
.plan .amt{font:750 54px/1 var(--display);letter-spacing:-.035em}
.plan .amt small{font:500 15px var(--body);color:var(--muted);letter-spacing:0;margin-left:6px}
.plan .per{font-size:14px;color:var(--muted);margin:10px 0 22px}
.plan ul{list-style:none;padding:0;margin:0 0 26px;display:grid;gap:11px;font-size:15.5px}
.plan li{display:flex;gap:10px}
.plan li svg{flex:0 0 19px;height:19px;color:var(--mint);margin-top:2px}
.plan .pick{margin-top:auto;display:flex;align-items:center;gap:10px;font-weight:600;font-size:15px;color:var(--ink2)}
.plan .pick i{width:22px;height:22px;border-radius:50%;border:2px solid #CBD5E1;display:inline-block;position:relative}
.plan.sel .pick i{border-color:var(--violet)}
.plan.sel .pick i::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--violet)}
.buy{margin:30px auto 0;max-width:780px;background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:28px 30px}
.buy .row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.buy label{font-size:13.5px;font-weight:600;color:var(--ink2)}
.buy input[type=text],.buy input[type=email]{display:block;width:100%;height:50px;margin-top:6px;border:1.5px solid var(--line);border-radius:12px;padding:0 14px;font:16px var(--body);background:#fff}
.buy input:focus{border-color:var(--blue);outline:none}
.buy .terms{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--ink2);font-weight:400;margin:6px 0 18px;line-height:1.5}
.buy .terms input{width:18px;height:18px;margin-top:2px;flex:0 0 18px}
.buy .go{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.buy .go .btn{flex:1;justify-content:center;min-width:240px}
.buy .secure{font-size:13.5px;color:var(--muted);display:flex;align-items:center;gap:8px}
.buy .secure svg{width:16px;height:16px}
.buy .err{color:var(--red);font-size:14px;margin-top:12px;min-height:20px}
.compare{margin:60px auto 0;max-width:900px;overflow-x:auto}
.compare table{width:100%;border-collapse:collapse;font-size:15px;background:var(--white);border-radius:var(--r-md);overflow:hidden;border:1px solid var(--line)}
.compare th,.compare td{padding:13px 16px;text-align:center;border-bottom:1px solid var(--line)}
.compare th:first-child,.compare td:first-child{text-align:left}
.compare thead th{background:var(--paper);font-weight:650}
.compare td.y{color:var(--mint);font-weight:700}.compare td.n{color:#CBD5E1}

/* honest */
.honest{padding:110px 0;background:var(--white);border-top:1px solid var(--line)}
.honest .cols{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:start}
.can,.cant{list-style:none;padding:0;margin:0 0 28px;display:grid;gap:12px}
.can li,.cant li{display:flex;gap:12px;font-size:16px;line-height:1.5}
.can li svg{color:var(--mint);flex:0 0 22px;height:22px}
.cant li svg{color:#94A3B8;flex:0 0 22px;height:22px}
.honest h3{margin-bottom:14px}

/* faq */
.faq{padding:110px 0}
.faq .cols{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px}
.faq details{border-top:1px solid var(--line);padding:20px 0}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;font:650 18.5px var(--display);letter-spacing:-.01em;list-style:none;display:flex;justify-content:space-between;gap:20px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:26px;line-height:.9;color:var(--muted);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--ink2);margin:12px 0 0;max-width:62ch}

/* shop */
.shop{padding:90px 0;background:var(--paper)}
.shopbox{display:grid;grid-template-columns:1.2fr .8fr;gap:48px;background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:44px;align-items:center}
.shopbox h2{font-size:clamp(28px,3.4vw,40px);margin-bottom:14px}
.shopbox address{font-style:normal;color:var(--ink2);line-height:1.8}

/* final cta */
.final{padding:110px 0;text-align:center;background:var(--ink);color:#CBD5E1;position:relative;overflow:hidden}
.final::before{content:"";position:absolute;left:50%;top:-240px;transform:translateX(-50%);width:900px;height:480px;background:var(--grad);opacity:.35;filter:blur(90px);border-radius:50%}
.final .wrap{position:relative}
.final h2{color:#fff;font-size:clamp(38px,5vw,64px);max-width:16ch;margin:0 auto 20px}
.final p{max-width:52ch;margin:0 auto 34px}
.final .btn.primary{background:#fff;color:var(--ink)}
.final .ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.final .btn.ghost{color:#fff;border-color:rgba(255,255,255,.35)}

footer{padding:40px 0;font-size:14px;color:var(--muted);background:var(--paper)}
footer .wrap{display:flex;gap:20px;flex-wrap:wrap;align-items:center}
footer a{color:var(--ink2);text-decoration:none}footer nav{display:flex;gap:20px;margin-left:auto;flex-wrap:wrap}
footer .fine{flex-basis:100%;font-size:12.5px}

/* simple pages (thank-you, terms, privacy) */
.page{padding:64px 0 100px}
.page .doc{max-width:760px;margin:0 auto;background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:48px}
.page .doc h1{font-size:clamp(34px,4.5vw,50px);margin-bottom:12px}
.page .doc h2{font-size:24px;margin:34px 0 10px;letter-spacing:-.015em}
.page .doc p,.page .doc li{color:var(--ink2);font-size:16.5px}
.keybox{margin:26px 0;background:#EEF2FF;border:1.5px dashed #A5B4FC;border-radius:18px;padding:24px;text-align:center}
.keybox code{display:block;font:700 clamp(18px,3vw,26px)/1.3 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.04em;color:#1E1B4B;word-break:break-all;margin-bottom:14px}
.keybox .btn{height:46px}
.spin{width:38px;height:38px;border-radius:50%;border:4px solid #E0E7FF;border-top-color:var(--violet);animation:sp 1s linear infinite;margin:20px auto}
@keyframes sp{to{transform:rotate(360deg)}}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:10px 0 24px}
.facts div{background:var(--paper);border-radius:14px;padding:14px 16px}
.facts small{display:block;color:var(--muted);font-size:13px}.facts b{font-size:16px}
ol.how{padding-left:22px}ol.how li{margin:8px 0}

@media (max-width:960px){
  .nav .links{display:none}
  .hero .wrap,.features header,.honest .cols,.faq .cols,.shopbox{grid-template-columns:1fr}
  .hero{padding-top:40px}
  .stage{margin-top:20px}
  .duo{grid-template-columns:1fr}.hinge{height:80px}.hinge::before{top:0;bottom:0}
  .flist,.steplist,.plans{grid-template-columns:1fr}
  .buy .row,.facts{grid-template-columns:1fr}
  .f1{left:0}.f2{right:0}
  .page .doc{padding:28px 22px}
}
@media (max-width:520px){.nav .logo{font-size:0;gap:0}.nav .logo img{height:30px}}
@media (max-width:420px){.phone{width:280px}.floater{display:none}.wrap{padding:0 16px}.side{padding:26px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}

/* ===================== DataLift additions ===================== */
.nav .logo img{height:34px;width:34px;border-radius:9px}
.nav .logo small{display:block;font:500 11.5px var(--body);color:var(--muted);letter-spacing:0;margin-top:-2px}
.nav .links a.on{color:var(--ink)}

/* five modules strip */
.strip{padding:0 0 84px}
.strip .row5{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.mod{display:block;text-decoration:none;color:var(--ink);background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:18px 18px 16px;transition:border-color .15s}
.mod:hover{border-color:#A5B4FC}
.mod .ic{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;margin-bottom:12px}
.mod .ic svg{width:22px;height:22px}
.mod b{font:700 18px var(--display);letter-spacing:-.01em;display:block}
.mod span{font-size:14px;color:var(--muted);line-height:1.45;display:block;margin-top:4px}

/* one app instead of several */
.instead{padding:110px 0;background:var(--ink);color:#CBD5E1;position:relative;overflow:hidden}
.instead h2{color:#fff;max-width:17ch;margin-bottom:18px}
.instead .lede{color:#CBD5E1;margin-bottom:48px}
.instead .grid2{display:grid;grid-template-columns:1.25fr .75fr;gap:28px;align-items:stretch}
.bill{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:var(--r-lg);padding:8px 26px}
.bill .ln{display:grid;grid-template-columns:1fr auto;gap:6px 18px;padding:18px 0;border-bottom:1px dashed rgba(255,255,255,.14)}
.bill .ln:last-child{border-bottom:0}
.bill .need{color:#fff;font-weight:600}
.bill .who{font-size:14px;color:#94A3B8;grid-column:1}
.bill .amt{font:700 20px var(--display);color:#fff;text-align:right;grid-row:1/3;grid-column:2;align-self:center;white-space:nowrap}
.bill .amt small{display:block;font:500 12px var(--body);color:#94A3B8}
.bill .tot{display:flex;justify-content:space-between;align-items:baseline;padding:18px 0 20px;border-top:1px solid rgba(255,255,255,.25);margin-top:4px;color:#fff;font-weight:600}
.bill .tot b{font:750 26px var(--display);text-decoration:line-through;text-decoration-color:rgba(248,113,113,.8);text-decoration-thickness:3px}
.ours{border-radius:var(--r-lg);padding:32px;background:var(--grad);color:#fff;display:flex;flex-direction:column;box-shadow:0 30px 70px rgba(124,58,237,.35)}
.ours img{width:56px;height:56px;border-radius:15px;box-shadow:0 0 0 3px rgba(255,255,255,.25)}
.ours h3{font-size:26px;margin:18px 0 6px;color:#fff}
.ours .price{font:750 64px/1 var(--display);letter-spacing:-.04em;margin:18px 0 4px}
.ours .price small{font:500 16px var(--body);letter-spacing:0;opacity:.85}
.ours ul{list-style:none;padding:0;margin:18px 0 26px;display:grid;gap:9px;font-size:15.5px}
.ours li{display:flex;gap:10px}.ours li svg{flex:0 0 18px;height:18px;margin-top:3px}
.ours .btn{margin-top:auto;background:#fff;color:var(--ink);justify-content:center}
.instead .note{font-size:13px;color:#94A3B8;margin:22px 0 0;max-width:90ch}
.instead .note a{color:#A5B4FC}

/* module explorer */
.explore{padding:110px 0}
.explore .head{max-width:700px;margin-bottom:40px}
.explore .head .lede{margin-top:16px}
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.tab{border:1.5px solid var(--line);background:var(--white);border-radius:999px;padding:10px 18px;font:600 15px var(--body);color:var(--ink2);cursor:pointer;display:inline-flex;gap:8px;align-items:center}
.tab svg{width:18px;height:18px}
.tab[aria-selected=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.panel{display:none;background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:38px;grid-template-columns:1fr 1fr;gap:40px}
.panel.on{display:grid}
.panel h3{font-size:28px;margin-bottom:10px}
.panel p{color:var(--ink2)}
.panel .vs{font-size:14px;color:var(--muted);border-left:3px solid #C4B5FD;padding-left:12px;margin-top:20px}
.panel ul{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.panel li{display:flex;gap:12px;font-size:16px;line-height:1.45}
.panel li svg{flex:0 0 22px;height:22px;color:var(--mint);margin-top:1px}
.panel li em{font-style:normal;font-size:12px;font-weight:700;color:var(--violet);background:#F5F3FF;border-radius:99px;padding:1px 8px;margin-left:6px;white-space:nowrap}
.panel .limits{margin-top:22px;font-size:14.5px;color:var(--muted)}
.panel .limits b{color:var(--ink2)}

/* privacy & security */
.trust{padding:100px 0;background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.trust h2{max-width:20ch;margin-bottom:46px}
.trust .t4{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.trust .t4 div svg{width:30px;height:30px;color:var(--blue);margin-bottom:12px}
.trust .t4 h3{font-size:18px;margin-bottom:6px}
.trust .t4 p{font-size:15px;color:var(--ink2);margin:0}

/* shops plan card */
.plan.shopplan{background:var(--paper);border-style:dashed}
.plan.shopplan .pick a{color:var(--blue);text-decoration:none;font-weight:600}
.plans.p4{grid-template-columns:repeat(3,1fr)}
.shopnote{margin:22px auto 0;max-width:780px;display:flex;gap:16px;align-items:center;background:var(--white);border:1px dashed #A5B4FC;border-radius:var(--r-md);padding:18px 22px;font-size:15px;color:var(--ink2)}
.shopnote svg{flex:0 0 28px;height:28px;color:var(--violet)}
.shopnote a{white-space:nowrap;font-weight:600}

/* footer */
footer.big{background:var(--ink);color:#94A3B8;padding:56px 0 34px}
footer.big .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px;margin-bottom:34px}
footer.big .brand{display:flex;gap:12px;align-items:center;color:#fff;font:700 20px var(--display)}
footer.big .brand img{width:38px;height:38px;border-radius:10px}
footer.big p{font-size:14px;margin:12px 0 0;max-width:36ch}
footer.big h4{color:#fff;font:600 14px var(--body);margin:4px 0 12px}
footer.big ul{list-style:none;padding:0;margin:0;display:grid;gap:8px;font-size:14.5px}
footer.big a{color:#CBD5E1;text-decoration:none}footer.big a:hover{color:#fff}
footer.big .fine{border-top:1px solid rgba(255,255,255,.1);padding-top:22px;font-size:12.5px;line-height:1.6}

/* download page */
.dl{padding:64px 0 100px}
.dl .top{display:grid;grid-template-columns:1fr .9fr;gap:48px;align-items:center;margin-bottom:56px}
.dl h1{font-size:clamp(40px,5.4vw,64px);letter-spacing:-.035em;margin-bottom:18px}
.dl .req{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.dl .req span{background:var(--white);border:1px solid var(--line);border-radius:99px;padding:6px 12px;font-size:13.5px;color:var(--ink2)}
.dl .card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:30px}
.dl ol.inst{counter-reset:i;list-style:none;padding:0;margin:0;display:grid;gap:20px}
.dl ol.inst li{counter-increment:i;display:grid;grid-template-columns:40px 1fr;gap:14px}
.dl ol.inst li::before{content:counter(i);width:34px;height:34px;border-radius:50%;background:var(--grad);color:#fff;font:700 16px var(--display);display:flex;align-items:center;justify-content:center}
.dl ol.inst li>div>b{display:block;margin-bottom:3px}
.dl ol.inst p{margin:0;color:var(--ink2);font-size:15.5px}
.callout{background:#FFFBEB;border:1px solid #FDE68A;border-radius:var(--r-md);padding:16px 18px;font-size:15px;color:#78350F;margin-top:24px}
.callout b{color:#78350F}
.win{margin-top:28px;background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:20px 22px;display:flex;gap:16px;align-items:center}
.win svg{flex:0 0 32px;height:32px;color:var(--muted)}

/* support page */
.sup{padding:64px 0 100px}
.sup .cols{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:start}
.sup .topics{display:grid;gap:12px}
.sup details{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:16px 20px}
.sup summary{cursor:pointer;font:650 17px var(--display);list-style:none}
.sup summary::-webkit-details-marker{display:none}
.sup details p,.sup details ol{color:var(--ink2);margin:10px 0 0;font-size:15.5px}
.sup .contact{background:var(--ink);color:#CBD5E1;border-radius:var(--r-lg);padding:30px;position:sticky;top:96px}
.sup .contact h2{color:#fff;font-size:28px;margin-bottom:10px}
.sup .contact a.btn{margin-top:14px}
.sup .contact ul{padding-left:18px;font-size:15px}

.e404{padding:120px 0;text-align:center}
.e404 h1{font-size:clamp(48px,7vw,88px);margin-bottom:14px}

@media (max-width:960px){
  .strip .row5{grid-template-columns:1fr 1fr}
  .instead .grid2,.panel.on,.dl .top,.sup .cols{grid-template-columns:1fr}
  .trust .t4{grid-template-columns:1fr 1fr}
  footer.big .cols{grid-template-columns:1fr 1fr}
  .plans.p4{grid-template-columns:1fr}
  .panel{padding:26px}
  .sup .contact{position:static}
}
@media (max-width:520px){.strip .row5,.trust .t4,footer.big .cols{grid-template-columns:1fr}.bill{padding:4px 18px}.ours .price{font-size:52px}}

@media (max-width:520px){
  .nav .logo{font-size:18px;gap:10px}.nav .logo small{display:none}
  .nav .wrap{gap:12px}.nav .btn{padding:0 14px;font-size:14px}
}
@media (max-width:420px){
  .tally{left:8px;right:8px;padding:11px 12px;gap:6px 10px;font-size:11px}
  .tally b{font-size:12.5px}
}

@media (max-width:960px){.nav .btn{margin-left:auto}}

/* ---- newsletter (footer) ---- */
.news{display:grid;grid-template-columns:1.1fr 1fr;gap:28px;align-items:center;background:linear-gradient(135deg,rgba(37,99,235,.18),rgba(124,58,237,.22));
  border:1px solid rgba(255,255,255,.08);border-radius:var(--r-lg);padding:28px 30px;margin-bottom:44px}
.news h3{color:#fff;font-size:24px;margin-bottom:6px}.news p{margin:0;font-size:15px;color:#CBD5E1;max-width:46ch}
.news form{display:flex;gap:10px;flex-wrap:wrap}
.news input[type=email]{flex:1;min-width:220px;height:52px;border-radius:14px;border:1.5px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:#fff;padding:0 16px;font:16px var(--body)}
.news input[type=email]::placeholder{color:#94A3B8}.news input[type=email]:focus{outline:none;border-color:#93C5FD}
.news .btn{height:52px}
.news .nmsg{flex-basis:100%;font-size:14px;min-height:20px;color:#A7F3D0;margin:2px 0 0}.news .nmsg.bad{color:#FCA5A5}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* ---- WhatsApp button ---- */
.wa-fab{position:fixed;right:22px;bottom:22px;z-index:60;display:flex;align-items:center;gap:10px;height:56px;padding:0 20px 0 16px;border-radius:999px;
  background:#16A34A;color:#fff;text-decoration:none;font:600 15.5px var(--body);box-shadow:0 14px 34px rgba(22,163,74,.38);transition:transform .15s ease}
.wa-fab:hover{transform:translateY(-2px)}.wa-fab svg{width:24px;height:24px}
@media (max-width:640px){.wa-fab{padding:0;width:56px;justify-content:center}.wa-fab span{display:none}}

/* ---- support: ticket form + contact options ---- */
.ticket{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:30px;margin-bottom:34px}
.ticket h2{font-size:30px;margin-bottom:6px}.ticket .sub{color:var(--muted);font-size:15.5px;margin-bottom:20px}
.ticket .row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.ticket label{display:block;font-size:13.5px;font-weight:600;color:var(--ink2)}
.ticket input[type=text],.ticket input[type=email],.ticket select,.ticket textarea{display:block;width:100%;margin-top:6px;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;font:16px var(--body);background:#fff;color:var(--ink)}
.ticket input,.ticket select{height:50px}.ticket textarea{min-height:150px;resize:vertical}
.ticket input:focus,.ticket select:focus,.ticket textarea:focus{border-color:var(--blue);outline:none}
.ticket .files{margin:14px 0 18px;font-size:14px;color:var(--muted)}.ticket .files input{margin-top:8px;font-size:14px}
.ticket .go{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.ticket .tmsg{font-size:15px;margin:14px 0 0;min-height:22px}.ticket .tmsg.bad{color:var(--red)}
.ticket .done{display:none;text-align:center;padding:20px 0}.ticket.sent form{display:none}.ticket.sent .done{display:block}
.ticket .done b{display:inline-block;font:700 26px var(--display);background:#EEF4FF;color:#1E3A8A;padding:10px 18px;border-radius:14px;margin:10px 0;letter-spacing:1px}
.ways{display:grid;gap:12px;margin:18px 0 6px}
.ways a{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:14px 16px;color:#fff;text-decoration:none}
.ways a:hover{background:rgba(255,255,255,.1)}.ways svg{width:22px;height:22px;flex:0 0 22px}.ways small{display:block;color:#94A3B8;font-size:13px}
.ways .wa svg{color:#4ADE80}
.policy table{border-collapse:collapse;width:100%;margin:10px 0 20px;font-size:15.5px}
.policy th,.policy td{border-bottom:1px solid var(--line);padding:10px 8px;text-align:left;vertical-align:top}.policy th{color:var(--muted);font-size:13.5px}
@media (max-width:960px){.news{grid-template-columns:1fr}.ticket .row{grid-template-columns:1fr}}
.news{width:100%}.news .nmsg{max-width:none}footer.big{padding-bottom:96px}

/* ---- locked / second-hand iPhone service page ---- */
.lk-hero{background:linear-gradient(135deg,#0F172A,#1E3A8A 55%,#5B21B6);color:#fff;padding:70px 0 64px}
.lk-hero .tag{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.16);padding:7px 14px;border-radius:999px;font-size:13.5px;font-weight:600;margin-bottom:22px}
.lk-hero .tag svg{width:16px;height:16px}
.lk-hero h1{font-size:clamp(34px,5vw,56px);max-width:16ch;margin-bottom:18px}
.lk-hero .lede{color:#CBD5E1;font-size:19px;max-width:60ch}
.lk-hero .ctas{display:flex;gap:14px;flex-wrap:wrap;margin:28px 0 20px}
.lk-hero .btn.ghost{background:rgba(255,255,255,.08);color:#fff;border:1.5px solid rgba(255,255,255,.22)}
.lk-hero .hon{display:flex;align-items:center;gap:9px;font-size:14.5px;color:#A5B4FC;margin:0}
.lk-hero .hon svg{width:18px;height:18px;flex:0 0 18px}.lk-hero .hon a{color:#fff}
h2.center,.center{text-align:center}
.lk-routes{padding:72px 0}
.lk-routes h2{text-align:center;margin-bottom:12px}
.lk-routes .lede{margin:0 auto 44px;text-align:center}
.routes{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.route{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:30px 28px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.route:hover{transform:translateY(-4px);box-shadow:0 18px 40px -22px rgba(15,23,42,.35);border-color:#C7D2FE}
.rt-ic{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.rt-ic svg{width:26px;height:26px;color:#fff}
.route h3{font-size:21px;margin-bottom:8px}
.route>p{color:var(--ink2);font-size:15.5px}
.route ol{margin:14px 0 16px;padding-left:20px;color:var(--ink2);font-size:15.5px;display:grid;gap:7px}
.route ol b{color:var(--ink)}
.rt-note{display:flex;align-items:flex-start;gap:9px;background:#F1F5F9;border-radius:12px;padding:12px 14px;font-size:14px;color:var(--ink2);margin:0}
.rt-note svg{width:17px;height:17px;flex:0 0 17px;color:var(--mint);margin-top:1px}
.lk-honest{background:var(--ink);color:#CBD5E1;padding:66px 0}
.lk-honest .cols{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center}
.lk-honest h2{color:#fff}.lk-honest .lede{color:#94A3B8}
.lk-honest .cant{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.lk-honest .cant li{display:flex;gap:14px;align-items:flex-start;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:16px 18px}
.lk-honest .cant svg{width:20px;height:20px;flex:0 0 20px;color:#F87171;margin-top:2px}
.lk-honest .cant b{color:#fff}.lk-honest .cant div{font-size:15px;line-height:1.55}
.lk-svc{padding:72px 0 100px}
.lk-svc h2{text-align:center;margin-bottom:12px}
.lk-svc .lede{margin:0 auto 40px;text-align:center}
.svc{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.svc-card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:24px 22px;display:flex;flex-direction:column;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.svc-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px -22px rgba(15,23,42,.35);border-color:#C7D2FE}
.svc-ic{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.svc-ic svg{width:23px;height:23px;color:#fff}
.svc-card h3{font-size:17.5px;margin-bottom:8px;line-height:1.25}
.svc-card p{color:var(--ink2);font-size:14px;flex:1;margin-bottom:14px}
.svc-card .price{font:700 30px var(--display);color:var(--ink);letter-spacing:-.02em}
.svc-card .price small{display:block;font:500 12.5px var(--body);color:var(--muted);letter-spacing:0}
.svc-note{color:var(--muted);font-size:14px;text-align:center;max-width:70ch;margin:24px auto 0}
.lk-contact{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:26px 30px;margin-top:40px}
.lk-contact h3{font-size:20px;margin-bottom:6px}.lk-contact address{font-style:normal;color:var(--ink2);font-size:15px;line-height:1.5}
.lk-ways{display:flex;gap:12px;flex-wrap:wrap}
.lk-ways a{display:inline-flex;align-items:center;gap:9px;border:1.5px solid var(--line);border-radius:12px;padding:12px 16px;text-decoration:none;color:var(--ink);font-weight:600;font-size:15px}
.lk-ways a:hover{border-color:var(--blue)}.lk-ways svg{width:20px;height:20px}
.lk-ways .wa{background:#16A34A;color:#fff;border-color:#16A34A}.lk-ways .wa svg{color:#fff}
@media (max-width:960px){.routes,.lk-honest .cols,.svc{grid-template-columns:1fr}.svc{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.svc{grid-template-columns:1fr}}

/* mobile safety: let grid tracks shrink and long buttons wrap */
.routes>*,.svc>*,.lk-honest .cols>*{min-width:0}
@media (max-width:620px){.lk-hero .btn,.lk-honest .btn{white-space:normal;text-align:center}}
/* locked - trust strip */
.lk-trust{list-style:none;margin:40px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.lk-trust li{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:14px 16px}
.lk-trust li svg{width:22px;height:22px;flex:0 0 22px;color:#A5B4FC}
.lk-trust b{display:block;color:#fff;font-size:14.5px;line-height:1.25}
.lk-trust span{display:block;color:#94A3B8;font-size:12.5px;margin-top:2px}
/* locked - route step numbers */
.route ol{counter-reset:step;list-style:none;padding-left:0}
.route ol li{position:relative;padding-left:34px}
.route ol li::before{counter-increment:step;content:counter(step);position:absolute;left:0;top:-1px;width:22px;height:22px;border-radius:7px;background:#EEF2FF;color:#4338CA;font:700 12.5px var(--body);display:flex;align-items:center;justify-content:center}
/* locked - FAQ */
.lk-faq{padding:4px 0 84px}
.lk-faq h2{text-align:center;margin-bottom:34px}
.lk-faq .faqs{max-width:820px;margin:0 auto;display:grid;gap:12px}
.lk-q{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;transition:border-color .18s ease,box-shadow .18s ease;padding:0}
.lk-q[open]{border-color:#C7D2FE;box-shadow:0 14px 34px -24px rgba(15,23,42,.4)}
.lk-q summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;font:600 17px var(--body);color:var(--ink)}
.lk-q summary::-webkit-details-marker{display:none}
.lk-q summary::after{content:none}
.lk-q summary svg{width:20px;height:20px;flex:0 0 20px;color:var(--blue);transition:transform .2s ease}
.lk-q[open] summary svg{transform:rotate(180deg)}
.lk-q>p{margin:0;padding:0 22px 20px;color:var(--ink2);font-size:15.5px;line-height:1.6;max-width:68ch}
.lk-q:not([open])>p{display:none}
/* locked - area */
.lk-area{padding:0 0 96px}
.area-card{background:linear-gradient(135deg,#0F172A,#1E3A8A 60%,#5B21B6);border-radius:var(--r-lg);padding:44px 46px;color:#fff;display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:center}
.area-card h2{color:#fff;margin-bottom:12px}
.area-card>div>p{color:#CBD5E1;font-size:16.5px;line-height:1.6;max-width:56ch}
.area-card b{color:#fff}
.area-card address{font-style:normal;display:flex;align-items:flex-start;gap:12px;margin-top:22px;color:#E2E8F0;font-size:15px;line-height:1.5}
.area-card address svg{width:22px;height:22px;flex:0 0 22px;color:#A5B4FC;margin-top:2px}
.area-ways{display:grid;gap:12px}
.area-ways a{display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:12px;padding:14px 18px;text-decoration:none;font-weight:600;font-size:15px;background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.2);color:#fff}
.area-ways a:hover{background:rgba(255,255,255,.16)}
.area-ways svg{width:20px;height:20px}
.area-ways .wa{background:#16A34A;border-color:#16A34A}
@media (max-width:960px){.lk-trust{grid-template-columns:1fr 1fr}.area-card{grid-template-columns:1fr;padding:34px 28px}}
@media (max-width:560px){.lk-trust{grid-template-columns:1fr}}
.btn.dark{background:#1E293B;color:#fff;box-shadow:0 10px 30px rgba(15,23,42,.18)}.btn.dark:hover{transform:translateY(-1px)}
/* ---- download page (clean two-card layout) ---- */
.dl2{padding:0 0 96px}
.dl2-head{background:linear-gradient(135deg,#0F172A,#1E3A8A 60%,#5B21B6);color:#fff;text-align:center;padding:54px 0 108px;margin-bottom:-68px}
.dl2-head .wrap{max-width:680px}
.dl2-ic{width:84px;height:84px;border-radius:21px;background:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;box-shadow:0 18px 40px -18px rgba(0,0,0,.55)}
.dl2-head h1{font-size:clamp(32px,5vw,50px);margin-bottom:14px;color:#fff}
.dl2-head .lede{color:#CBD5E1;font-size:18px}
.dlcards{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:860px;margin:0 auto}
.dlcard{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:26px;box-shadow:0 24px 54px -30px rgba(15,23,42,.45)}
.dlbtn{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:16px 18px;border-radius:14px;font:700 18px var(--display);letter-spacing:-.01em;color:#fff;text-decoration:none;transition:transform .15s ease,filter .15s ease}
.dlbtn svg{width:22px;height:24px;fill:currentColor;flex:0 0 auto}
.dlbtn.mac{background:linear-gradient(135deg,#1E293B,#0F172A)}
.dlbtn.win{background:linear-gradient(135deg,#2563EB,#1D4ED8)}
.dlbtn:hover{transform:translateY(-2px);filter:brightness(1.08)}
.spec{margin:22px 2px 0;display:grid;grid-template-columns:auto 1fr;gap:11px 14px;font-size:15px}
.spec dt{color:var(--muted)}
.spec dd{margin:0;text-align:right;font-weight:600;color:var(--ink)}
.dl-help{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--line);color:var(--ink2);font-size:14px;line-height:1.55}
.dl-steps{max-width:860px;margin:56px auto 0}
.dl-steps h2{text-align:center;margin-bottom:26px}
.dl-flow{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.dl-flow li{display:flex;gap:12px;align-items:flex-start}
.dl-flow li span{flex:0 0 30px;width:30px;height:30px;border-radius:9px;background:#EEF2FF;color:#4338CA;font:700 15px var(--body);display:flex;align-items:center;justify-content:center}
.dl-flow b{display:block;margin-bottom:3px}
.dl-flow p{margin:0;color:var(--ink2);font-size:14px;line-height:1.5}
.dl2-foot{text-align:center;color:var(--muted);font-size:14.5px;margin:48px auto 0;max-width:70ch}
@media (max-width:760px){.dlcards{grid-template-columns:1fr}.dl-flow{grid-template-columns:1fr 1fr}.dl2-head{margin-bottom:-58px;padding-bottom:98px}}
@media (max-width:460px){.dl-flow{grid-template-columns:1fr}}