/*
Theme Name: GetFuturix
Theme URI: https://getfuturix.com/
Author: GetFuturix
Author URI: https://getfuturix.com/
Description: Fast, SEO-friendly business theme for GetFuturix – Build • Grow • Automate. Home, Services, Blog, Single Post and Contact designs with Customizer settings, Services / Tools / Testimonials managers and an auto-sliding blog.
Version: 1.3.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: getfuturix
Tags: blog, business, custom-logo, custom-menu, featured-images, full-width-template, one-column, two-columns, translation-ready, threaded-comments
*/

/* ===== BRAND TOKENS – edit these 5 to match the exact logo colours ===== */
:root{
  --navy:#0c1733;--navy2:#182848;--blue:#0aa6dd;--cyan:#00c8f0;--hover:#0788b8;--slate:#485870;
  --bg:#f3f6ff;--surface:#fff;--ink:#0d1538;--muted:#5a6488;--line:#dfe5f7;--shadow:0 14px 34px rgba(20,40,120,.12);
  /* derived from the colours above, so every preset restyles the whole site */
  --cyan-l:color-mix(in srgb,var(--cyan) 55%,#fff);--cyan-t:color-mix(in srgb,var(--cyan) 14%,#fff);
  --navy3:color-mix(in srgb,var(--navy2) 70%,var(--blue));--navy-d:color-mix(in srgb,var(--navy) 85%,#000);--blue-d:color-mix(in srgb,var(--blue) 60%,var(--navy));
  --violet:color-mix(in srgb,var(--blue) 55%,#6d5cff);--orange:color-mix(in srgb,var(--blue) 35%,#14b8a6);
}
html{scroll-padding-top:90px;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--wrap,1200px);margin:0 auto;padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right))}
svg.fxi{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ================= HERO ================= */
.hero{position:relative;overflow:hidden;color:#fff;padding:76px 0 0;
  background:radial-gradient(900px 500px at 85% 0%,color-mix(in srgb,var(--cyan) 30%,transparent),transparent 60%),radial-gradient(700px 500px at 0% 100%,rgba(34,211,238,.22),transparent 60%),linear-gradient(160deg,var(--navy),var(--navy2) 60%,var(--navy3))}
.hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:46px 46px;-webkit-mask-image:radial-gradient(ellipse at 60% 30%,#000,transparent 70%);mask-image:radial-gradient(ellipse at 60% 30%,#000,transparent 70%)}
.hero .wrap{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:10px;padding:7px 16px;border-radius:99px;font-size:.82rem;font-weight:700;letter-spacing:.04em;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(8px)}
.eyebrow i{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 0 var(--cyan);animation:ping 2s infinite}
@keyframes ping{70%{box-shadow:0 0 0 10px transparent}}
h1{font-size:clamp(2.2rem,4.8vw,3.8rem);line-height:1.08;letter-spacing:-.025em;margin:20px 0 18px}
h1 span{background:linear-gradient(90deg,var(--cyan),var(--cyan-l) 60%,#fff);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:1.1rem;color:#c3cdf5;max-width:580px;margin:0 0 26px}
.lead b{color:#fff}
.pills{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 30px;padding:0;list-style:none}
.pills a{display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border-radius:12px;font-size:.88rem;font-weight:600;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);transition:.25s}
.pills a:hover{background:rgba(255,255,255,.16);transform:translateY(-3px);border-color:var(--cyan)}
.pills svg{font-size:1.15rem;color:var(--cyan)}
.cta{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-flex;align-items:center;gap:9px;padding:15px 28px;border-radius:14px;font-weight:800;font-size:1rem;transition:transform .2s,box-shadow .2s}
.btn:hover{transform:translateY(-3px)}
.btn-p{background:linear-gradient(135deg,var(--cyan),var(--cyan-l));color:var(--navy);box-shadow:0 12px 28px color-mix(in srgb,var(--cyan) 40%,transparent)}
.btn-g{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.28);color:#fff}
.btn-s{background:var(--surface);border:1px solid var(--line);color:var(--ink)}

/* orbit visual */
.orbit{--r:165px;position:relative;width:min(440px,100%);aspect-ratio:1;margin:0 auto}
.rg{position:absolute;inset:0;border-radius:50%;border:1px dashed rgba(255,255,255,.25)}
.rg.r2{inset:18%;border-color:rgba(34,211,238,.35)}
.core{position:absolute;inset:34%;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:0 0 0 10px rgba(255,255,255,.12),0 0 70px color-mix(in srgb,var(--cyan) 65%,transparent);animation:pulse 4s ease-in-out infinite}.core i{width:62%;height:62%;background:var(--x) center/contain no-repeat}
.core small{position:absolute;bottom:-26px;font-size:.7rem;font-weight:700;letter-spacing:.16em;color:#bfe9ff;white-space:nowrap}
@keyframes pulse{50%{transform:scale(1.07)}}
.ring{position:absolute;inset:0;animation:spin 46s linear infinite}
.node{position:absolute;top:50%;left:50%;width:58px;height:58px;margin:-29px;transform:rotate(var(--a)) translateX(var(--r)) rotate(calc(-1*var(--a)))}
.node div{width:100%;height:100%;display:grid;place-items:center;border-radius:16px;font-size:1.6rem;color:#fff;background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:0 10px 24px rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.3);animation:spin 46s linear infinite reverse}
.node span{position:absolute;top:64px;left:50%;transform:translateX(-50%);font-size:.7rem;font-weight:700;white-space:nowrap;color:#dbe4ff;animation:spin 46s linear infinite reverse;display:none}
@keyframes spin{to{transform:rotate(360deg)}}
.node{--c1:var(--blue);--c2:var(--cyan)}
.n2{--c1:var(--violet);--c2:var(--cyan)}.n3{--c1:var(--navy2);--c2:var(--blue)}.n4{--c1:var(--orange);--c2:var(--cyan)}.n5{--c1:#485870;--c2:var(--blue)}.n6{--c1:var(--blue);--c2:var(--violet)}
.fc{position:absolute;display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:16px;color:var(--ink);background:rgba(255,255,255,.95);box-shadow:0 18px 40px rgba(0,0,0,.35);animation:float 6s ease-in-out infinite;z-index:3}
.fc svg{font-size:1.6rem;padding:8px;box-sizing:content-box;border-radius:12px;color:#fff;background:linear-gradient(135deg,var(--blue),var(--cyan))}
.fc b{display:block;font-size:1.05rem;line-height:1.2;color:#0d1538}
.fc small{color:#5a6488;font-size:.74rem;font-weight:600}
.fc.a{top:2%;right:-2%}.fc.b{bottom:4%;left:-4%;animation-delay:-3s}.fc.b svg{background:linear-gradient(135deg,var(--orange),var(--cyan))}
@keyframes float{50%{transform:translateY(-12px)}}

/* stats strip */
.stats{position:relative;z-index:2;margin-top:64px;display:grid;grid-template-columns:repeat(4,1fr);border-radius:22px 22px 0 0;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.15);border-bottom:0;backdrop-filter:blur(10px)}
.stats div{padding:22px 16px;text-align:center;border-right:1px solid rgba(255,255,255,.12)}
.stats div:last-child{border:0}
.stats b{display:block;font-size:1.8rem;line-height:1.1;background:linear-gradient(90deg,#fff,var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
.stats span{font-size:.82rem;color:#b5c2f0}
.marq{overflow:hidden;background:linear-gradient(90deg,var(--blue),var(--violet),var(--navy2));color:#fff;font-weight:800;font-size:.9rem;letter-spacing:.08em;text-transform:uppercase}
.marq div{display:flex;width:max-content;gap:40px;padding:12px 0;animation:mq 26s linear infinite}
.marq span::after{content:"✦";margin-left:40px;opacity:.7}
@keyframes mq{to{transform:translateX(-50%)}}

/* ================= TOOLS ================= */
.tools{padding:84px 0 100px;position:relative}
.sec-head{text-align:center;max-width:700px;margin:0 auto 30px}
.kicker{display:inline-block;padding:5px 14px;border-radius:99px;font-size:.76rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);background:color-mix(in srgb,var(--blue) 12%,transparent)}
h2{font-size:clamp(1.8rem,3.4vw,2.6rem);line-height:1.18;margin:14px 0 12px;letter-spacing:-.015em}
h2 span{background:linear-gradient(90deg,var(--blue),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
.sec-head p{color:var(--muted);margin:0}
.filters{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0 0 38px}
.chip{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:9px 18px;border-radius:99px;font:700 .88rem inherit;font-family:inherit;cursor:pointer;transition:.2s}
.chip:hover{border-color:var(--blue);transform:translateY(-2px)}
.chip.on{background:linear-gradient(135deg,var(--blue),var(--violet));border-color:transparent;color:#fff;box-shadow:0 8px 20px color-mix(in srgb,var(--blue) 35%,transparent)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(262px,100%),1fr));gap:26px}
.card{--c:var(--blue);position:relative;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:22px;overflow:hidden;transition:transform .3s,box-shadow .3s,border-color .3s}
.card::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--c);z-index:3}
.card:hover{transform:translateY(-8px);border-color:var(--c);box-shadow:0 22px 44px color-mix(in srgb,var(--c) 28%,transparent)}
.card[hidden]{display:none}
.c-edu{--c:var(--blue)}.c-wri{--c:var(--cyan)}.c-doc{--c:var(--orange)}.c-seo{--c:var(--violet)}
.thumb{position:relative;aspect-ratio:16/10;display:grid;place-items:center;overflow:hidden;color:var(--c);background:radial-gradient(circle at 80% 10%,color-mix(in srgb,var(--c) 35%,transparent),transparent 60%),linear-gradient(135deg,color-mix(in srgb,var(--c) 16%,var(--surface)),var(--surface))}
.thumb>svg{width:46%;height:auto;filter:drop-shadow(0 12px 18px color-mix(in srgb,var(--c) 40%,transparent));transition:transform .4s}
.card:hover .thumb>svg{transform:scale(1.1) rotate(-3deg)}
.thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.badge{position:absolute;top:14px;left:14px;z-index:2;display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:99px;font-size:.7rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--c);box-shadow:0 4px 12px color-mix(in srgb,var(--c) 50%,transparent)}
.free{position:absolute;top:14px;right:14px;z-index:2;font-size:.68rem;font-weight:800;padding:5px 11px;border-radius:99px;background:var(--surface);color:var(--ink);border:1px solid var(--line)}
.body{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
.card h3{margin:0 0 8px;font-size:1.15rem;line-height:1.3}
.card p{margin:0 0 20px;color:var(--muted);font-size:.93rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.go{margin-top:auto;display:flex;justify-content:space-between;align-items:center;font-weight:800;color:var(--c);font-size:.92rem}
.go i{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:color-mix(in srgb,var(--c) 14%,transparent);transition:.3s}
.card:hover .go i{background:var(--c);color:#fff;transform:translateX(4px)}
.stretch::after{content:"";position:absolute;inset:0;z-index:4}
.soon{border:2px dashed var(--line);background:transparent;align-items:center;justify-content:center;text-align:center;padding:40px 24px;color:var(--muted)}
.soon::before{display:none}.soon:hover{transform:none;box-shadow:none;border-color:var(--blue)}
.soon svg{font-size:2.4rem;color:var(--blue)}
.soon strong{display:block;color:var(--ink);font-size:1.1rem;margin:10px 0 4px}
.all{text-align:center;margin-top:46px}
:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
@media (max-width:920px){
  .hero{padding-top:50px}.hero .wrap{grid-template-columns:1fr}.orbit{--r:140px;width:min(380px,100%);margin-top:20px}
  .stats{grid-template-columns:repeat(2,1fr)}.stats div:nth-child(2){border-right:0}.stats div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.12)}
  .tools{padding:60px 0 76px}}
@media (max-width:480px){.orbit{--r:112px}.node{width:46px;height:46px;margin:-23px}.node div{font-size:1.25rem;border-radius:13px}.fc.a{right:0}.fc.b{left:0}}

.xm{display:inline-block;width:18px;height:15px;background:var(--x) center/contain no-repeat;vertical-align:-2px;margin-right:7px}
.wm{position:absolute;right:-80px;top:30px;width:580px;height:500px;opacity:.07;background:var(--x) center/contain no-repeat;filter:brightness(2)}
.svc{position:relative;overflow:hidden;color:#fff;padding:92px 0 96px;background:radial-gradient(800px 420px at 10% 0%,color-mix(in srgb,var(--cyan) 22%,transparent),transparent 60%),linear-gradient(170deg,var(--navy),var(--navy2))}
.svc::before{content:"";position:absolute;right:-120px;top:-60px;width:520px;height:460px;background:var(--x) center/contain no-repeat;opacity:.06}
.svc .wrap{position:relative}.svc h2{color:#fff}.svc .sec-head p{color:#b5c2f0}.svc .kicker{color:var(--cyan);background:color-mix(in srgb,var(--cyan) 12%,transparent)}.svc h2 span{background:linear-gradient(90deg,var(--cyan),var(--cyan-l));-webkit-background-clip:text;background-clip:text;color:transparent}
.sgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(250px,100%),1fr));gap:22px;margin-top:38px}
.s{position:relative;overflow:hidden;padding:28px 24px 24px;border-radius:22px;background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.14);transition:.3s}
.s:hover{transform:translateY(-8px);border-color:var(--cyan);box-shadow:0 22px 44px color-mix(in srgb,var(--cyan) 20%,transparent)}
.s .n{position:absolute;top:14px;right:20px;font-size:2.7rem;font-weight:900;line-height:1;color:rgba(255,255,255,.07)}
.ic{width:58px;height:58px;display:grid;place-items:center;border-radius:16px;font-size:1.7rem;color:var(--navy);background:linear-gradient(135deg,var(--cyan),var(--cyan-l));margin-bottom:18px;box-shadow:0 10px 24px color-mix(in srgb,var(--cyan) 35%,transparent);transition:.3s}
.s:hover .ic{transform:rotate(-6deg) scale(1.08)}
.s h3{margin:0 0 8px;font-size:1.15rem}.s p{margin:0 0 18px;color:#b5c2f0;font-size:.92rem}
.s a{display:inline-flex;align-items:center;gap:6px;font-weight:800;font-size:.88rem;color:var(--cyan)}.s a::after{content:"";position:absolute;inset:0}
.pil{display:grid;grid-template-columns:repeat(3,1fr);margin-top:52px;border-radius:24px;overflow:hidden;border:1px solid rgba(255,255,255,.14)}
.pil div{padding:30px 28px;background:rgba(255,255,255,.04);border-right:1px solid rgba(255,255,255,.12)}.pil div:last-child{border:0}
.pil b{display:flex;align-items:center;gap:12px;font-size:1.3rem;margin-bottom:8px}.pil b svg{font-size:1.5rem;color:var(--cyan)}.pil p{margin:0;color:#b5c2f0;font-size:.93rem}
.cta2{position:relative;overflow:hidden;margin-top:40px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;padding:34px 36px;border-radius:24px;color:var(--navy);background:linear-gradient(120deg,var(--cyan),var(--blue) 55%,var(--violet))}
.cta2::after{content:"";position:absolute;right:-20px;top:-40px;width:260px;height:230px;background:var(--x) center/contain no-repeat;opacity:.2;filter:brightness(0) invert(1)}
.cta2 h3{margin:0 0 4px;font-size:1.5rem}.cta2 p{margin:0;font-weight:600}.cta2 .btn{background:var(--navy);color:#fff;position:relative;z-index:1}
@media (max-width:820px){.pil{grid-template-columns:1fr}.pil div{border-right:0;border-bottom:1px solid rgba(255,255,255,.12)}.svc{padding:64px 0 70px}.wm{width:380px;height:330px}}

.blogsec{padding:90px 0 84px;background:var(--bg);overflow:hidden}
.bhead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:26px}
.bhead .sec-head{text-align:left;margin:0;max-width:660px}
.ctl{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:99px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:700 .85rem inherit;font-family:inherit;cursor:pointer;transition:.2s}
.ctl:hover{border-color:var(--cyan);transform:translateY(-2px)}
.mrow{overflow:hidden;padding:12px 0 16px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.mtrack{display:flex;width:max-content;animation:mq var(--dur,70s) linear infinite;will-change:transform}
.mrow.rev .mtrack{animation-direction:reverse}
.mrow:hover .mtrack,.mrow:focus-within .mtrack,.mrow.hold .mtrack,.blogsec.paused .mtrack{animation-play-state:paused}
.post{position:relative;flex:0 0 clamp(270px,78vw,340px);margin-right:24px;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:22px;overflow:hidden;transition:transform .3s,box-shadow .3s,border-color .3s}
.post:hover{transform:translateY(-6px);border-color:var(--cyan);box-shadow:0 20px 40px color-mix(in srgb,var(--cyan) 20%,transparent)}
.pimg{position:relative;aspect-ratio:16/10;overflow:hidden;background:linear-gradient(135deg,var(--navy),var(--navy3))}
.pimg::before{content:"";position:absolute;inset:18%;background:var(--x) center/contain no-repeat;opacity:.25}
.pimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.post:hover .pimg img{transform:scale(1.07)}
.pcat{position:absolute;top:14px;left:14px;z-index:2;padding:5px 12px;border-radius:99px;font-size:.7rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;background:var(--cyan);color:var(--navy)}
.pb{padding:18px 20px 20px;display:flex;flex-direction:column;flex:1}
.meta{font-size:.78rem;font-weight:600;color:var(--muted);margin-bottom:8px}
.post h3{margin:0 0 8px;font-size:1.05rem;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.post p{margin:0 0 14px;color:var(--muted);font-size:.88rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rm{margin-top:auto;display:inline-flex;align-items:center;gap:6px;font-weight:800;font-size:.86rem;color:var(--blue)}
.post a.stretch::after{z-index:4}
.tst{padding:90px 0;background:var(--surface);border-top:1px solid var(--line);position:relative;overflow:hidden}
.tview{overflow:hidden;margin:34px -12px 0;padding:22px 0 26px;touch-action:pan-y;cursor:grab}
.ttrack{display:flex;transition:transform .85s cubic-bezier(.65,0,.25,1)}
.ts{flex:0 0 33.3333%;padding:0 12px;display:flex}
.t{position:relative;width:100%;margin:0;padding:32px 28px;border-radius:24px;display:flex;flex-direction:column;color:var(--ink);background:var(--bg);border:1px solid var(--line);transform:scale(.95);opacity:.8;transition:transform .7s cubic-bezier(.2,.8,.2,1),opacity .7s,box-shadow .7s,color .5s}
.t::before{content:"";position:absolute;inset:-1px;border-radius:inherit;background:linear-gradient(160deg,var(--navy),var(--navy2));opacity:0;transition:opacity .6s}
.t::after{content:"";position:absolute;right:-16px;bottom:-16px;width:140px;height:120px;background:var(--x) center/contain no-repeat;opacity:0;transition:opacity .6s}
.t>*{position:relative;z-index:1}
.t.on{transform:scale(1.03);opacity:1;color:#fff;box-shadow:0 26px 50px rgba(12,23,51,.32)}
.t.on::before{opacity:1}.t.on::after{opacity:.12}
.stars{color:#fbbf24;letter-spacing:3px;font-size:1.05rem}
.q{display:block;font:900 3.6rem/.7 Georgia,serif;color:var(--cyan);margin:14px 0 4px}
.t p{margin:0 0 24px;color:var(--muted);flex:1;transition:color .5s}.t.on p{color:#c3cdf5}
.who{display:flex;align-items:center;gap:12px}
.av{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;font-weight:900;color:var(--navy);background:linear-gradient(135deg,var(--cyan),var(--cyan-l));flex:none}
.who b{display:block;line-height:1.25}.who small{color:var(--muted);transition:color .5s}.t.on .who small{color:#9fb0e6}
.tctl{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:16px}
.nb{width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:var(--bg);color:var(--ink);cursor:pointer;font-size:1.2rem;display:grid;place-items:center;transition:.2s}
.nb:hover{background:var(--cyan);border-color:var(--cyan);color:var(--navy);transform:scale(1.08)}
.dots{display:flex;gap:8px;align-items:center}
.dots button{position:relative;width:10px;height:10px;padding:0;border:0;border-radius:99px;background:var(--line);cursor:pointer;overflow:hidden;transition:width .45s,background .3s}
.dots button.on{width:46px;background:color-mix(in srgb,var(--cyan) 22%,var(--line))}
.dots button.on::after{content:"";position:absolute;inset:0;background:var(--cyan);transform-origin:left;animation:fill var(--tdelay,6s) linear forwards}
@keyframes fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.tst.hold .dots button.on::after{animation-play-state:paused}
@media (max-width:1000px){.ts{flex-basis:50%}}
@media (max-width:680px){.ts{flex-basis:100%}.tview{margin:28px 0 0}}
@media (prefers-reduced-motion:reduce){.mrow{overflow-x:auto}.clone{display:none}.ttrack{transition:none}}
.ct{position:relative;overflow:hidden;color:#fff;padding:92px 0;background:radial-gradient(700px 420px at 95% 100%,color-mix(in srgb,var(--cyan) 28%,transparent),transparent 60%),linear-gradient(170deg,var(--navy),var(--navy2))}
.ct::before{content:"";position:absolute;left:-100px;bottom:-80px;width:480px;height:420px;background:var(--x) center/contain no-repeat;opacity:.06}
.cgrid{position:relative;display:grid;grid-template-columns:.9fr 1.1fr;gap:52px;align-items:center}
.ct h2{color:#fff;text-align:left}.ct .kicker{color:var(--cyan);background:color-mix(in srgb,var(--cyan) 12%,transparent)}
.ct .lead2{color:#b5c2f0;margin:0 0 18px}
.cinfo a{display:flex;align-items:center;gap:16px;padding:15px 18px;margin-top:14px;border-radius:16px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);transition:.25s}
.cinfo a:hover{border-color:var(--cyan);transform:translateX(6px)}
.cinfo .ic{width:48px;height:48px;font-size:1.3rem;margin:0;flex:none}
.cinfo small{display:block;color:#9fb0e6;font-size:.78rem}.cinfo b{font-size:1.02rem}
.fm{background:var(--surface);color:var(--ink);padding:34px;border-radius:26px;box-shadow:0 30px 60px rgba(0,0,0,.4)}
.fm h3{margin:0 0 4px;font-size:1.45rem}.fm>p{margin:0 0 10px;color:var(--muted);font-size:.93rem}
.row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fm label{display:block;font-size:.82rem;font-weight:700;margin:14px 0 6px}
.fm input,.fm select,.fm textarea{width:100%;padding:13px 15px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit}
.fm input:focus,.fm select:focus,.fm textarea:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 0 4px color-mix(in srgb,var(--cyan) 20%,transparent)}
.fm button{margin-top:20px;width:100%;justify-content:center;border:0;cursor:pointer;font-family:inherit}
.fm small{display:block;margin-top:12px;text-align:center;color:var(--muted);font-size:.78rem}
@media (max-width:900px){.cgrid{grid-template-columns:1fr}.blogsec,.tst,.ct{padding:62px 0}}
@media (max-width:520px){.row{grid-template-columns:1fr}.fm{padding:24px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important}}

/* ===================== THEME ADDITIONS ===================== */
.sr,.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;background:#fff;color:#000;padding:10px 16px;z-index:300;border-radius:0 0 10px 0}.skip:focus{left:0}
img{max-width:100%;height:auto}
.narrow{max-width:820px}
/* header */
.hdr{--h-bg:rgba(255,255,255,.95);--h-ink:#0d1538;--h-line:#e4e9f7;--h-hbg:var(--cyan-t);--h-hink:var(--hover);--h-drawer:#fff;position:relative;z-index:100;background:var(--h-bg);color:var(--h-ink);border-bottom:1px solid var(--h-line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:background .3s,box-shadow .3s,color .3s}
.hdr--dark{--h-bg:color-mix(in srgb,var(--navy) 97%,transparent);--h-ink:#fff;--h-line:rgba(255,255,255,.12);--h-hbg:rgba(255,255,255,.1);--h-hink:var(--cyan);--h-drawer:var(--navy)}
.hdr--transparent{--h-bg:transparent;--h-ink:#fff;--h-line:transparent;--h-hbg:rgba(255,255,255,.12);--h-hink:var(--cyan);--h-drawer:var(--navy);position:absolute;left:0;right:0;top:0;-webkit-backdrop-filter:none;backdrop-filter:none}
.hdr--transparent.stuck{--h-bg:rgba(255,255,255,.96);--h-ink:#0d1538;--h-line:#e4e9f7;--h-hbg:var(--cyan-t);--h-hink:var(--hover);--h-drawer:#fff}
.hdr--sticky{position:sticky;top:0}.hdr--transparent.hdr--sticky{position:fixed}
.admin-bar .hdr--sticky{top:32px}
.hdr.stuck{box-shadow:0 8px 24px rgba(12,23,51,.12)}.hdr--transparent:not(.stuck){box-shadow:none}
.topbar{background:var(--tb,var(--navy));color:#dbe4ff;font-size:.82rem;max-height:60px;overflow:hidden;transition:max-height .3s,opacity .3s}
.hdr.stuck .topbar{max-height:0;opacity:0}
.tb-in{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:38px}
.tb-r{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.tb-r a{display:inline-flex;align-items:center;gap:6px;transition:color .2s}.tb-r a:hover{color:var(--cyan)}
.topbar .soc{margin:0;gap:6px}.topbar .soc a{width:28px;height:28px;border-radius:8px;font-size:.9rem}
.hdr-in{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:74px}
.brand{display:inline-flex;align-items:center;flex:none}
.brand img{height:var(--logo-h,46px);width:auto;max-width:240px;display:block}
.brand .logo-l{display:none}
.hdr--dark .brand .logo-d,.hdr--transparent:not(.stuck) .brand .logo-d{display:none}
.hdr--dark .brand .logo-l,.hdr--transparent:not(.stuck) .brand .logo-l{display:block}
img.inv{filter:brightness(0) invert(1)}
.nav{display:flex;align-items:center;gap:20px}
.menu{display:flex;gap:4px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.menu li{position:relative}
.menu a{display:block;padding:9px 14px;border-radius:10px;font-weight:600;font-size:.95rem;color:var(--h-ink);transition:background .2s,color .2s}
.menu a:hover,.menu a:focus-visible,.menu .current-menu-item>a,.menu .current_page_item>a{background:var(--h-hbg);color:var(--h-hink)}
.menu .sub-menu{position:absolute;left:0;top:100%;min-width:210px;list-style:none;margin:0;padding:8px;background:#fff;border:1px solid #e4e9f7;border-radius:14px;box-shadow:0 18px 40px rgba(12,23,51,.14);opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s}
.menu .sub-menu a{color:#0d1538}.menu .sub-menu a:hover{background:var(--cyan-t);color:var(--hover)}
.menu li:hover>.sub-menu,.menu li:focus-within>.sub-menu{opacity:1;visibility:visible;transform:none}
.hdr--m-center .nav{flex:1}.hdr--m-center .menu{margin:0 auto}
.hdr-cta{padding:11px 22px;font-size:.92rem;white-space:nowrap}
.hdr-cta--o{background:transparent;border:2px solid var(--cyan);color:var(--h-ink)}.hdr-cta--o:hover{background:var(--cyan);color:var(--navy)}
.burger{display:none;width:46px;height:46px;border-radius:12px;border:1px solid var(--h-line);background:var(--h-hbg);color:var(--h-ink);font-size:1.4rem;cursor:pointer;place-items:center}
.hdr--transparent:not(.stuck) .burger{border-color:rgba(255,255,255,.3)}
.hdr-over{--hh:74px}.hdr-over.has-topbar{--hh:112px}
.hdr-over .hero{padding-top:calc(var(--hh) + 44px)}.hdr-over .phero{padding-top:calc(var(--hh) + 36px)}
@media (max-width:782px){.admin-bar .hdr--sticky{top:46px}}
@media (max-width:900px){
  .burger{display:grid}
  .nav{position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:14px;background:var(--h-drawer);color:var(--h-ink);padding:14px 20px 24px;border-bottom:1px solid var(--h-line);box-shadow:0 20px 30px rgba(12,23,51,.18);opacity:0;visibility:hidden;transform:translateY(-10px);transition:.25s;max-height:calc(100vh - 120px);overflow:auto}
  .nav.open{opacity:1;visibility:visible;transform:none}
  .hdr--m-center .nav{flex:none}.hdr--m-center .menu{margin:0}
  .menu{flex-direction:column}.menu .sub-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:0 0 0 14px;background:transparent}
  .menu .sub-menu a{color:var(--h-ink)}.menu .sub-menu a:hover{color:var(--h-hink);background:var(--h-hbg)}
  .hdr-cta{text-align:center;justify-content:center}
  .tb-l{display:none}.tb-in{justify-content:center}.tb-mail{display:none}
}
/* page hero */
.phero{position:relative;overflow:hidden;color:#fff;padding:58px 0 54px;background:radial-gradient(800px 420px at 90% 0%,color-mix(in srgb,var(--cyan) 30%,transparent),transparent 60%),linear-gradient(160deg,var(--navy),var(--navy2) 65%,var(--navy3))}
.phero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(ellipse at 70% 20%,#000,transparent 70%);mask-image:radial-gradient(ellipse at 70% 20%,#000,transparent 70%)}
.phero .wrap{position:relative;z-index:1}
.phero h1{font-size:clamp(2rem,4.2vw,3.2rem);margin:14px 0 12px;max-width:900px}
.phero .lead{max-width:680px;margin:0}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:.85rem;color:#b5c2f0}.crumbs a:hover{color:var(--cyan)}.crumbs span{opacity:.5}
.phero-s{max-width:520px;margin-top:22px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.chips .chip{padding:8px 16px;font-size:.84rem}
.pmeta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;margin-top:18px;color:#b5c2f0;font-size:.92rem}
.pmeta span{display:inline-flex;align-items:center;gap:7px}.pmeta b{color:#fff}.by img{border-radius:50%}
.pcat-s{position:static;display:inline-block;margin-top:16px}
/* layout + sidebar */
.lay{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:40px;padding-top:56px;padding-bottom:80px;align-items:start}
.side{position:sticky;top:96px;display:grid;gap:22px}
.wd{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:22px}
.wd-t{margin:0 0 16px;font-size:1.05rem;position:relative;padding-left:14px}
.wd-t::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:4px;border-radius:4px;background:var(--cyan)}
.wd ul{list-style:none;padding:0;margin:0}.wd li{padding:8px 0;border-bottom:1px dashed var(--line)}.wd li:last-child{border:0}
.wd a:hover{color:var(--blue)}
.rp{display:grid;gap:14px}.rp li{padding:0;border:0}
.rp a{display:flex;gap:12px;align-items:center}
.rp-i{flex:none;width:68px;height:68px;border-radius:12px;overflow:hidden;background:linear-gradient(135deg,var(--navy),var(--navy3))}
.rp-i img{width:100%;height:100%;object-fit:cover;display:block}
.rp-t b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.9rem;line-height:1.35;transition:color .2s}
.rp a:hover b{color:var(--blue)}.rp-t small{color:var(--muted);font-size:.76rem}
.cl li{display:flex;justify-content:space-between;gap:10px;font-weight:600;font-size:.92rem;color:var(--muted)}.cl a{color:var(--ink)}
.sform{position:relative}
.sform input{width:100%;padding:14px 56px 14px 18px;border-radius:14px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit}
.sform input:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 0 4px color-mix(in srgb,var(--cyan) 20%,transparent)}
.sform button{position:absolute;right:6px;top:6px;bottom:6px;width:42px;border:0;border-radius:10px;background:var(--cyan);color:var(--navy);cursor:pointer;font-size:1.1rem;display:grid;place-items:center}
.wd-cta{position:relative;overflow:hidden;color:#fff;background:linear-gradient(160deg,var(--navy),var(--navy2));border:0}
.wd-cta .xm{width:44px;height:38px;margin:0 0 10px;display:block}.wd-cta h3{margin:0 0 6px;font-size:1.2rem}.wd-cta p{margin:0 0 16px;color:#b5c2f0;font-size:.92rem}
.wd-cta::after{content:"";position:absolute;right:-20px;bottom:-20px;width:140px;height:120px;background:var(--x) center/contain no-repeat;opacity:.08}
@media (max-width:980px){.lay{grid-template-columns:1fr}.side{position:static}}
/* blog list */
.pgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px}
.pgrid .post,.rgrid .post{flex:none;margin:0}
.pgrid .feat{grid-column:1/-1;flex-direction:row}
.feat .pimg{flex:1.1;aspect-ratio:auto;min-height:300px}.feat .pb{flex:1;padding:30px;justify-content:center}
.feat h2{font-size:1.6rem;line-height:1.25;margin:8px 0 12px}.feat p{-webkit-line-clamp:3;margin-bottom:14px}.feat .meta{margin-bottom:12px}
.ftag{display:inline-flex;gap:6px;align-items:center;font-size:.74rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--blue)}
@media (max-width:700px){.pgrid{grid-template-columns:1fr}.pgrid .feat{flex-direction:column}.feat .pimg{min-height:0;aspect-ratio:16/10}}
.empty{text-align:center;padding:60px 20px;background:var(--surface);border:1px dashed var(--line);border-radius:22px}.empty svg{font-size:3rem;color:var(--cyan)}
.pager{margin-top:40px}.nav-links{display:flex;gap:8px;justify-content:center;align-items:center;flex-wrap:wrap}
.page-numbers{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:46px;height:46px;padding:0 14px;border-radius:14px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-weight:700;font-size:.95rem;transition:background .2s,border-color .2s,color .2s,transform .2s,box-shadow .2s}
a.page-numbers:hover{border-color:var(--cyan);color:var(--hover);transform:translateY(-3px);box-shadow:0 10px 22px color-mix(in srgb,var(--cyan) 22%,transparent)}
.page-numbers.current{background:linear-gradient(135deg,var(--cyan),var(--cyan-l));color:var(--navy);border-color:transparent;box-shadow:0 10px 22px color-mix(in srgb,var(--cyan) 38%,transparent)}
.page-numbers.dots{border-color:transparent;background:transparent;min-width:28px;padding:0;color:var(--muted)}
.page-numbers.prev,.page-numbers.next{padding:0 20px;background:var(--navy);border-color:var(--navy);color:#fff}
a.page-numbers.prev:hover,a.page-numbers.next:hover{background:var(--cyan);border-color:var(--cyan);color:var(--navy)}
.pgnote{text-align:center;margin:16px 0 0;color:var(--muted);font-size:.86rem;font-weight:600}
@media (max-width:560px){.page-numbers{min-width:40px;height:40px;padding:0 10px;font-size:.88rem;border-radius:12px}.page-numbers.prev span,.page-numbers.next span{display:none}.page-numbers.prev,.page-numbers.next{padding:0 14px}}
.lm{text-align:center;margin-top:40px}
.lm-btn{min-width:240px;justify-content:center;cursor:pointer;font-family:inherit}
.lm-btn.loading{pointer-events:none;opacity:.8}
.lm-btn.loading::before{content:"";width:16px;height:16px;border-radius:50%;border:2px solid var(--line);border-top-color:var(--cyan);animation:spin .7s linear infinite}
.lm-end{margin:0;color:var(--muted);font-weight:600}
.pgrid .post.in{animation:rise .55s cubic-bezier(.2,.8,.2,1) both}
@keyframes rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
/* single + entry */
.rprog{position:fixed;top:0;left:0;height:4px;width:0;z-index:300;background:linear-gradient(90deg,var(--cyan),var(--blue))}.admin-bar .rprog{top:32px}
.entry{font-size:1.06rem;line-height:1.85}
.entry>*:first-child{margin-top:0}
.entry h2{font-size:1.75rem;margin:1.9em 0 .6em;line-height:1.25}.entry h3{font-size:1.35rem;margin:1.6em 0 .5em}.entry h4{font-size:1.15rem}
.entry p,.entry ul,.entry ol{margin:0 0 1.25em}.entry ul,.entry ol{padding-left:1.4em}.entry li{margin:.35em 0}
.entry a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}.entry a:hover{color:var(--cyan)}
.entry blockquote{margin:1.6em 0;padding:18px 24px;border-left:5px solid var(--cyan);background:color-mix(in srgb,var(--cyan) 8%,var(--surface));border-radius:0 16px 16px 0;font-size:1.12rem}
.entry img{border-radius:14px}.entry figure{margin:1.5em 0}.entry figcaption,.wp-caption-text{font-size:.85rem;color:var(--muted);text-align:center;margin-top:8px}
.entry pre{background:var(--navy);color:#dbe4ff;padding:18px;border-radius:14px;overflow:auto;font-size:.9rem}.entry code{background:color-mix(in srgb,var(--cyan) 14%,transparent);padding:2px 6px;border-radius:6px;font-size:.92em}.entry pre code{background:none;padding:0}
.entry table{width:100%;border-collapse:collapse;display:block;overflow-x:auto;margin:1.5em 0}.entry th,.entry td{border:1px solid var(--line);padding:10px 14px;text-align:left}.entry th{background:var(--bg)}
.alignleft{float:left;margin:0 22px 12px 0}.alignright{float:right;margin:0 0 12px 22px}.aligncenter{display:block;margin:0 auto}.alignwide,.alignfull{max-width:100%}
.ef-wrap{margin:0 0 30px}.ef{width:100%;height:auto;border-radius:22px;display:block;box-shadow:var(--shadow)}
.pg{padding-top:56px;padding-bottom:80px}
.tags{margin-top:34px}.tags a{display:inline-block;margin:0 8px 8px 0;padding:6px 14px;border-radius:99px;background:var(--bg);border:1px solid var(--line);font-size:.82rem;font-weight:600;text-decoration:none;color:var(--ink)}.tags a::before{content:"#";color:var(--cyan)}
.share{display:flex;align-items:center;gap:10px;margin:28px 0;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.share b{margin-right:6px}.share a,.share button{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:1.1rem;cursor:pointer;transition:.2s;text-decoration:none}
.share a:hover,.share button:hover{background:var(--cyan);border-color:var(--cyan);color:var(--navy);transform:translateY(-3px)}
.author{display:flex;gap:18px;align-items:center;padding:24px;border-radius:20px;background:var(--bg);border:1px solid var(--line)}
.author img{border-radius:50%;flex:none}.author small{color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.7rem}.author h4{margin:2px 0 6px;font-size:1.15rem}.author p{margin:0;color:var(--muted);font-size:.92rem}
.post-navigation .nav-links{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:30px}
.post-navigation a{display:block;padding:18px 20px;border:1px solid var(--line);border-radius:16px;background:var(--surface);transition:.25s;height:100%}
.post-navigation a:hover{border-color:var(--cyan);transform:translateY(-3px)}
.post-navigation small{display:block;color:var(--blue);font-weight:800;font-size:.78rem;margin-bottom:4px}.post-navigation span{font-weight:700;line-height:1.35;display:block}.nav-next{text-align:right}
.related{margin-top:54px}.related h3{font-size:1.4rem;margin:0 0 20px}.rgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(230px,100%),1fr));gap:20px}
.comments{margin-top:54px}.comments h3,.comment-reply-title{font-size:1.4rem;margin:0 0 18px}.clist{list-style:none;padding:0;margin:0 0 30px}.clist .children{list-style:none;padding-left:26px}
.comment-body{padding:18px 20px;border:1px solid var(--line);border-radius:16px;margin-bottom:14px;background:var(--surface)}.comment-author img{border-radius:50%;vertical-align:middle;margin-right:10px}.comment-meta{font-size:.8rem;color:var(--muted);margin-bottom:8px}
.comment-form input[type=text],.comment-form input[type=email],.comment-form input[type=url],.comment-form textarea{width:100%;padding:13px 15px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit}
.comment-form .btn{border:0;cursor:pointer;font-family:inherit}
/* footer */
.fcta-sec{padding:0 0 60px}.fcta-sec .cta2{margin:0}
.ftr{--f-ink:#b5c2f0;--f-head:#fff;--f-line:rgba(255,255,255,.12);--f-hover:var(--cyan);position:relative;overflow:hidden;background:var(--navy-d);color:var(--f-ink);padding:64px 0 0}
.ftr--gradient{background:linear-gradient(135deg,var(--navy),var(--navy3) 60%,var(--blue-d))}
.ftr--light{--f-ink:var(--muted);--f-head:var(--ink);--f-line:var(--line);--f-hover:var(--hover);background:var(--surface);border-top:1px solid var(--line)}
.ftr::before{content:"";position:absolute;right:-60px;top:-30px;width:360px;height:310px;background:var(--x) center/contain no-repeat;opacity:.05;pointer-events:none}
.ftr .wrap{position:relative}
.fgrid{display:grid;gap:40px}.ftr h4{color:var(--f-head);margin:0 0 16px;font-size:1.05rem}.ftr p{margin:14px 0 0;max-width:420px;font-size:.93rem}
.fbrand .brand img{height:calc(var(--logo-h,46px) * .95)}
.fmenu{list-style:none;padding:0;margin:0;display:grid;gap:10px;font-size:.93rem}.fmenu a{transition:color .2s}.fmenu a:hover{color:var(--f-hover)}
.soc{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}.soc a{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#fff;transition:.2s}.soc a:hover{background:var(--cyan);color:var(--navy);border-color:var(--cyan);transform:translateY(-3px)}
.ftr--light .soc a{background:var(--bg);border-color:var(--line);color:var(--ink)}
.fbar{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;padding-top:22px;padding-bottom:26px;margin-top:44px;border-top:1px solid var(--f-line);font-size:.86rem}
.totop{position:fixed;right:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:90;width:48px;height:48px;border-radius:50%;border:0;cursor:pointer;display:grid;place-items:center;font-size:1.3rem;color:var(--navy);background:linear-gradient(135deg,var(--cyan),var(--cyan-l));box-shadow:0 10px 24px color-mix(in srgb,var(--cyan) 40%,transparent);opacity:0;visibility:hidden;transform:translateY(10px);transition:.3s}
.totop.show{opacity:1;visibility:visible;transform:none}.totop:hover{transform:translateY(-4px)}
@media (max-width:900px){.fgrid{grid-template-columns:1fr 1fr!important}.fbrand{grid-column:1/-1}}
@media (max-width:560px){.fgrid{grid-template-columns:1fr!important}}
/* services page */
.svc-page{padding-top:80px}.sgrid.wide{grid-template-columns:repeat(auto-fill,minmax(min(340px,100%),1fr))}
.ticks{list-style:none;padding:0;margin:0 0 18px;display:grid;gap:8px;font-size:.9rem;color:#dbe4ff}.ticks li{display:flex;gap:9px;align-items:flex-start}.ticks svg{color:var(--cyan);margin-top:4px}
.proc{padding:84px 0;background:var(--surface)}
.steps{list-style:none;margin:40px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:22px}
.steps li{padding:28px 24px;border-radius:22px;background:var(--bg);border:1px solid var(--line);transition:.3s}.steps li:hover{transform:translateY(-6px);border-color:var(--cyan);box-shadow:var(--shadow)}
.steps li span{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:14px;font-weight:900;color:var(--navy);background:linear-gradient(135deg,var(--cyan),var(--cyan-l));margin-bottom:14px}
.steps h3{margin:0 0 6px;font-size:1.2rem}.steps p{margin:0;color:var(--muted);font-size:.93rem}
.cta-band{padding:70px 0}.cta-band .cta2{margin:0}
/* contact page */
.cpage{padding:76px 0;background:var(--bg)}.cpage .cgrid{align-items:start}.cpage h2{text-align:left;color:var(--ink)}.cpage .lead2{color:var(--muted);margin:0 0 18px}
.ci-a{display:flex;align-items:center;gap:16px;padding:15px 18px;margin-top:14px;border-radius:16px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14)}
.cpage .cinfo a,.cpage .ci-a{background:var(--surface);border-color:var(--line);color:var(--ink)}.cpage .cinfo small{color:var(--muted)}.cpage .soc{margin-top:22px}.cpage .soc a{background:var(--surface);border-color:var(--line);color:var(--ink)}
.faq{padding:80px 0;background:var(--surface);border-top:1px solid var(--line)}
.faq details{border:1px solid var(--line);border-radius:16px;padding:0 22px;margin-bottom:12px;background:var(--bg);transition:.3s}.faq details[open]{border-color:var(--cyan);box-shadow:var(--shadow)}
.faq summary{cursor:pointer;list-style:none;font-weight:700;padding:18px 0;display:flex;justify-content:space-between;gap:12px}.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--cyan);font-size:1.5rem;line-height:1}.faq details[open] summary::after{content:"–"}.faq details p{margin:0 0 18px;color:var(--muted)}
.note{padding:12px 14px;border-radius:12px;font-weight:600;font-size:.9rem;margin:10px 0}.note.ok{background:#e6fbf3;color:#0a7a52;border:1px solid #9ae6c8}.note.bad{background:#fff0f0;color:#a11;border:1px solid #f5b5b5}
.hp{position:absolute;left:-9999px;height:0;overflow:hidden}
.e404{text-align:center;padding:90px 0 110px}.e404 h1{font-size:6rem;margin:0;line-height:1;background:linear-gradient(90deg,var(--blue),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}.e404 p{color:var(--muted)}.e404 .sform{max-width:460px;margin:20px auto 0}

/* ===================== v1.1 ADDITIONS ===================== */
h1,h2,h3,h4{overflow-wrap:break-word}
.ico-pause,.ico-play{display:inline-flex}
.ctl[aria-pressed="true"] .ico-pause,.ctl[aria-pressed="false"] .ico-play{display:none}
/* tools page */
.tools-page{padding-top:56px}
.tbar{display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center;justify-content:space-between;margin-bottom:14px}
.tsearch{flex:1 1 280px;max-width:420px}
.tbar .filters{margin:0;justify-content:flex-end}
.chip em{font-style:normal;font-size:.72rem;padding:1px 8px;border-radius:99px;background:color-mix(in srgb,var(--cyan) 18%,transparent)}
.chip.on em{background:rgba(255,255,255,.25)}
.tcount{margin:0 0 22px;color:var(--muted);font-size:.9rem;font-weight:600}
@media (max-width:700px){.tbar .filters{justify-content:flex-start}.tsearch{max-width:none}}
/* ---- hover colour system (readable on every background) ---- */
a{transition:color .2s}
.btn-p:hover{filter:brightness(1.06);color:var(--navy);box-shadow:0 14px 30px color-mix(in srgb,var(--cyan) 45%,transparent)}
.btn-g:hover{background:rgba(255,255,255,.18);border-color:var(--cyan);color:#fff}
.btn-s:hover{border-color:var(--cyan);color:var(--hover);box-shadow:var(--shadow)}
.cta2 .btn:hover{background:#fff;color:var(--navy)}
.pills a:hover{color:#fff}
.chip:hover{color:var(--hover)}.chip.on,.chip.on:hover{color:#fff}
.card:hover h3 a{color:var(--c)}.c-wri:hover h3 a,.c-doc:hover h3 a{color:var(--hover)}
.c-wri .badge,.c-doc .badge{color:var(--navy)}
.c-wri:hover .go i,.c-doc:hover .go i{color:var(--navy)}
.s:hover h3{color:var(--cyan)}.s a:hover{color:#fff}
.post:hover h3 a,.post:hover .rm{color:var(--hover)}
.entry a:hover,.wd a:hover,.crumbs a:hover{color:var(--hover)}.phero .crumbs a:hover{color:var(--cyan)}
.cinfo a:hover b{color:var(--cyan)}.cpage .cinfo a:hover b{color:var(--hover)}
.menu a:hover{color:var(--h-hink)}
.rp a:hover b,.cl a:hover{color:var(--hover)}
.tags a:hover{border-color:var(--cyan);color:var(--hover)}
.fmenu a:hover,.tb-r a:hover{color:var(--f-hover,var(--cyan))}
.topbar .tb-r a:hover{color:var(--cyan)}
/* stop "sticky hover" on touch screens */
@media (hover:none){.card:hover,.post:hover,.s:hover,.steps li:hover,.t:hover,.btn:hover,.pills a:hover{transform:none}}
/* ---- small-screen fixes ---- */
@media (max-width:600px){
  .hero .wrap{gap:28px}.hero{padding-bottom:0}
  .cta .btn{flex:1 1 100%;justify-content:center}
  .stats b{font-size:1.45rem}.stats div{padding:16px 10px}
  .cta2{padding:26px 22px}.cta2 .btn{width:100%;justify-content:center}
  .sec-head{margin-bottom:24px}
  .bhead{align-items:flex-start}
  .fm{padding:22px}
  .tview{margin-left:0;margin-right:0}
}
@media (max-width:380px){.orbit{--r:100px;width:min(300px,100%)}.node{width:42px;height:42px;margin:-21px}.fc{padding:8px 12px}.fc b{font-size:.92rem}.eyebrow{font-size:.72rem}}

/* ===================== PRICING ===================== */
.pricing{padding:90px 0;background:var(--surface);overflow:hidden}
.pricing-page{padding-top:64px}
.billwrap{text-align:center;margin:0 0 40px}
.bill{display:inline-flex;gap:4px;padding:5px;border-radius:99px;background:var(--bg);border:1px solid var(--line)}
.bill button{display:inline-flex;align-items:center;border:0;background:transparent;color:var(--ink);font:700 .9rem inherit;font-family:inherit;padding:10px 22px;border-radius:99px;cursor:pointer;transition:background .25s,color .25s,box-shadow .25s}
.bill button:hover{color:var(--hover)}
.bill button.on,.bill button.on:hover{background:linear-gradient(135deg,var(--cyan),var(--cyan-l));color:var(--navy);box-shadow:0 8px 20px color-mix(in srgb,var(--cyan) 35%,transparent)}
.bill em{font-style:normal;font-size:.68rem;font-weight:800;margin-left:8px;padding:2px 9px;border-radius:99px;background:var(--navy);color:var(--cyan)}
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(290px,100%),1fr));gap:26px;align-items:stretch;padding-top:16px}
.plan{position:relative;display:flex;flex-direction:column;padding:36px 28px 30px;border-radius:26px;background:var(--bg);border:1px solid var(--line);transition:transform .3s,box-shadow .3s,border-color .3s}
.plan:hover{transform:translateY(-8px);border-color:var(--cyan);box-shadow:var(--shadow)}
.plan h3{margin:0 0 6px;font-size:1.3rem}
.plan .pd{margin:0 0 22px;color:var(--muted);font-size:.93rem;min-height:2.8em}
.pr{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px;margin-bottom:24px}
.pr .cur{font-size:1.5rem;font-weight:800;align-self:flex-start;margin-top:8px}
.pr .amount{font-size:3.3rem;font-weight:900;line-height:1;letter-spacing:-.03em}
.pr .per{color:var(--muted);font-weight:600;margin-left:2px}
.plan[data-txt] .cur,.plan[data-txt] .per{display:none}.plan[data-txt] .amount{font-size:2.4rem}
.amount.flip{animation:flip .45s}
@keyframes flip{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.pbtn{justify-content:center;width:100%;background:var(--surface);color:var(--ink);border:2px solid var(--line)}
.pbtn:hover{border-color:var(--cyan);color:var(--hover);transform:translateY(-2px)}
.pf{list-style:none;margin:26px 0 0;padding:24px 0 0;border-top:1px dashed var(--line);display:grid;gap:13px;font-size:.94rem}
.pf li{display:flex;gap:10px;align-items:flex-start}.pf svg{flex:none;margin-top:4px;color:var(--cyan)}
.pf .no{color:var(--muted);opacity:.75}.pf .no span{text-decoration:line-through}.pf .no svg{color:var(--muted)}
.plan--f{color:#fff;border-color:transparent;background:linear-gradient(165deg,var(--navy),var(--navy2));box-shadow:0 30px 60px color-mix(in srgb,var(--navy) 35%,transparent);transform:scale(1.03)}
.plan--f:hover{transform:scale(1.03) translateY(-8px);border-color:var(--cyan)}
.plan--f::after{content:"";position:absolute;right:14px;bottom:14px;width:150px;height:130px;background:var(--x) center/contain no-repeat;opacity:.07;pointer-events:none}
.plan--f .pd,.plan--f .per,.plan--f .pf .no{color:#b5c2f0}
.plan--f .pbtn{background:linear-gradient(135deg,var(--cyan),var(--cyan-l));border-color:transparent;color:var(--navy)}
.plan--f .pbtn:hover{filter:brightness(1.06);color:var(--navy)}
.plan--f .pf{border-color:rgba(255,255,255,.2)}
.ribbon{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);white-space:nowrap;padding:6px 18px;border-radius:99px;font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;background:linear-gradient(135deg,var(--cyan),var(--cyan-l));color:var(--navy);box-shadow:0 8px 20px color-mix(in srgb,var(--cyan) 40%,transparent)}
.incl{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:18px;margin-top:60px}
.incl>div{display:flex;gap:14px;align-items:flex-start;padding:20px;border-radius:18px;background:var(--bg);border:1px solid var(--line)}
.incl .ic{width:46px;height:46px;font-size:1.3rem;margin:0;flex:none;border-radius:14px}
.incl b{display:block}.incl small{color:var(--muted);font-size:.85rem}
@media (max-width:900px){.pricing{padding:62px 0}.plan--f,.plan--f:hover{transform:none}.plan--f:hover{transform:translateY(-6px)}}
@media (hover:none){.plan:hover,.plan--f:hover{transform:none}}
[hidden]{display:none!important}

/* ===================== COOKIE NOTICE ===================== */
.ck{position:fixed;z-index:400;font-size:.92rem;line-height:1.55}
.ck--bar{left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px))}
.ck--left{left:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));width:min(420px,calc(100% - 32px))}
.ck--right{right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));width:min(420px,calc(100% - 32px))}
.ck--center{inset:0;display:grid;place-items:center;padding:16px;background:rgba(5,10,36,.55);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.ck-in{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:22px;box-shadow:0 24px 60px rgba(12,23,51,.3);padding:22px 24px;max-height:calc(100vh - 32px);overflow:auto}
.ck--center .ck-in{width:min(520px,100%)}
.ck--bar .ck-in{max-width:var(--wrap,1200px);margin:0 auto;display:grid;grid-template-columns:1fr auto;gap:14px 30px;align-items:center}
.ck.show .ck-in{animation:ckin .5s cubic-bezier(.2,.8,.2,1)}
@keyframes ckin{from{opacity:0;transform:translateY(24px) scale(.98)}to{opacity:1;transform:none}}
.ck--dark .ck-in{background:var(--navy);color:#fff;border-color:rgba(255,255,255,.14)}
.ck--brand .ck-in{background:linear-gradient(135deg,var(--navy),var(--navy2) 55%,var(--blue-d));color:#fff;border-color:rgba(255,255,255,.14)}
.ck-head{display:flex;align-items:center;gap:10px;margin-bottom:6px;font-size:1.05rem}
.ck-ic{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font-size:1.2rem;color:var(--navy);background:linear-gradient(135deg,var(--cyan),var(--cyan-l))}
.ck p{margin:0 0 4px;color:var(--muted)}.ck--dark p,.ck--brand p{color:#c3cdf5}
.ck p a{color:var(--hover);font-weight:700;text-decoration:underline;text-underline-offset:3px}.ck--dark p a,.ck--brand p a{color:var(--cyan)}
.ck-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;align-items:center}
.ck--bar .ck-btns{margin:0;justify-content:flex-end}
.ck-b{font:800 .9rem inherit;font-family:inherit;padding:11px 20px;border-radius:12px;border:2px solid transparent;cursor:pointer;transition:transform .2s,background .2s,color .2s,border-color .2s}
.ck-b:hover{transform:translateY(-2px)}
.ck-b--p{background:linear-gradient(135deg,var(--cyan),var(--cyan-l));color:var(--navy);box-shadow:0 8px 20px color-mix(in srgb,var(--cyan) 35%,transparent)}
.ck-b--s{background:transparent;border-color:var(--line);color:inherit}.ck-b--s:hover{border-color:var(--cyan)}
.ck--dark .ck-b--s,.ck--brand .ck-b--s{border-color:rgba(255,255,255,.3)}
.ck-b--t{background:transparent;color:var(--hover);padding-left:8px;padding-right:8px;text-decoration:underline;text-underline-offset:3px}.ck--dark .ck-b--t,.ck--brand .ck-b--t{color:var(--cyan)}
.ck-prefs{margin-top:10px}
.ck-row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 0;border-top:1px solid var(--line)}.ck--dark .ck-row,.ck--brand .ck-row{border-color:rgba(255,255,255,.16)}
.ck-row b{display:block}.ck-row small{display:block;color:var(--muted);font-size:.8rem}.ck--dark .ck-row small,.ck--brand .ck-row small{color:#b5c2f0}
.sw{position:relative;flex:none;width:46px;height:26px}.sw input{position:absolute;inset:0;opacity:0;cursor:pointer;z-index:2;margin:0}
.sw i{position:absolute;inset:0;border-radius:99px;background:#c5cbe0;transition:.25s}.sw i::after{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.25);transition:.25s}
.sw input:checked+i{background:var(--cyan)}.sw input:checked+i::after{transform:translateX(20px)}.sw input:disabled{cursor:not-allowed}.sw.on i{opacity:.6}
.ck-fab{position:fixed;left:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:350;width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--hover);font-size:1.3rem;display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow);transition:.25s}
.ck-fab:hover{background:var(--cyan);color:var(--navy);transform:translateY(-3px) rotate(-12deg)}
@media (max-width:640px){.ck--bar .ck-in{grid-template-columns:1fr}.ck--bar .ck-btns{justify-content:flex-start}.ck--left,.ck--right{left:12px;right:12px;width:auto}.ck-btns .ck-b--p{flex:1 1 100%}.ck-in{padding:18px}}
/* ===================== TOOL UPGRADES ===================== */
.hot{position:absolute;left:14px;bottom:14px;z-index:2;display:inline-flex;align-items:center;gap:5px;padding:5px 12px;border-radius:99px;font-size:.7rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#fff;background:linear-gradient(135deg,#ff7a18,#ff3d6e);box-shadow:0 6px 16px rgba(255,80,60,.4)}
.ti-b .hot,.tl .hot{position:static;margin-left:8px;padding:2px 9px;vertical-align:middle;font-size:.62rem;box-shadow:none}
.entry .card a,.entry .tool-inline a,.entry .rtools a,.entry .tl a,.entry .fx-embed-open{text-decoration:none;color:inherit}
.entry .tool-inline .btn-p,.entry .tool-inline .btn-p:hover{color:var(--navy)}
.fx-tools-grid{grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));margin:1.6em 0}
.fx-tool-one{max-width:380px;margin:1.6em 0}
@media (max-width:900px){.fx-tools-grid{grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr))}}
.tool-inline{--c:var(--blue);position:relative;display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:1.8em 0;padding:18px 20px;border-radius:20px;background:var(--surface);border:1px solid var(--line);border-left:5px solid var(--c);box-shadow:var(--shadow)}
.ti-ic{flex:none;width:52px;height:52px;display:grid;place-items:center;border-radius:15px;font-size:1.6rem;color:var(--navy);background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 55%,#fff))}
.tool-inline .ti-b{flex:1 1 220px}.ti-b b{display:block;line-height:1.3}.ti-b small{display:block;color:var(--muted);font-size:.88rem;line-height:1.45;margin-top:2px}
.tool-inline .btn{padding:11px 20px;font-size:.9rem}
.rtools{margin:2.4em 0;padding:24px;border-radius:24px;background:linear-gradient(160deg,color-mix(in srgb,var(--cyan) 9%,var(--surface)),var(--surface));border:1px solid var(--line)}
.rt-h{display:flex;align-items:center;gap:10px;margin-bottom:16px}.rt-h h3{margin:0;font-size:1.25rem}
.rt-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:14px}
.rt{--c:var(--blue);display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:16px;background:var(--surface);border:1px solid var(--line);transition:transform .25s,border-color .25s,box-shadow .25s}
.rt:hover{transform:translateY(-4px);border-color:var(--c);box-shadow:0 14px 30px color-mix(in srgb,var(--c) 20%,transparent)}
.rt .ti-ic{width:46px;height:46px;font-size:1.35rem;border-radius:13px}.rt .ti-b{flex:1;min-width:0}.rt .ti-b b{font-size:.98rem}
.rt-go{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 14%,transparent);color:var(--c);transition:.25s}.rt:hover .rt-go{background:var(--c);color:var(--navy);transform:translateX(3px)}
.tl{display:grid;gap:10px}.tl li{padding:0!important;border:0!important}
.tl a{--c:var(--blue);display:flex;align-items:center;gap:12px;padding:8px;border-radius:14px;transition:background .2s}.tl a:hover{background:color-mix(in srgb,var(--c) 10%,transparent)}
.tl .ti-ic{width:40px;height:40px;font-size:1.15rem;border-radius:12px}.tl b{font-size:.92rem;line-height:1.3}
.c-edu{--c:var(--blue)}.c-wri{--c:var(--cyan)}.c-doc{--c:var(--orange)}.c-seo{--c:var(--violet)}
/* live tool embeds */
.fx-embed-wrap{margin:2em 0;border-radius:22px;overflow:hidden;border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow)}
.fx-embed-frame{display:block;width:100%;border:0;min-height:320px;background:var(--surface)}
.fx-embed-open{display:flex;justify-content:flex-end;align-items:center;gap:6px;padding:10px 16px;border-top:1px solid var(--line);font-size:.85rem;font-weight:700;color:var(--hover)}
.fx-embed .hdr,.fx-embed .ftr,.fx-embed .phero,.fx-embed .fcta-sec,.fx-embed .totop,.fx-embed .ck,.fx-embed .ck-fab,.fx-embed .skip,.fx-embed .cta-band,.fx-embed .rtools,.fx-embed .side{display:none!important}
.fx-embed{background:var(--surface)}.fx-embed .pg,.fx-embed .lay{padding-top:12px;padding-bottom:12px}.fx-embed .lay{grid-template-columns:1fr}
