:root{
  --bg:#f3f5f8;
  --surface:#ffffff;
  --surface-2:#f8f9fc;
  --ink:#0b1020;
  --muted:#667085;
  --line:#e3e7ef;
  --navy:#07111f;
  --navy-2:#0b1830;
  --violet:#7667f7;
  --cyan:#70c9ff;
  --violet-soft:#eeeaff;
  --shadow:0 24px 70px rgba(18,31,53,.08);
}
*,
*::before,
*::after{box-sizing:border-box}
html{width:100%;overflow-x:hidden;scroll-behavior:smooth}
body{
  width:100%;
  min-width:0;
  margin:0;
  overflow-x:hidden;
  background:
    radial-gradient(circle at 10% 0%,rgba(118,103,247,.06),transparent 28%),
    radial-gradient(circle at 95% 12%,rgba(112,201,255,.07),transparent 25%),
    var(--bg);
  color:var(--ink);
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.5;
}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
button,input,textarea,select{font:inherit}
.container{width:94%;margin:0 auto;min-width:0}

/* HEADER */
.site-header{
  position:sticky;
  top:0;
  z-index:1000;
  width:100%;
  height:76px;
  background:rgba(243,245,248,.88);
  border-bottom:1px solid rgba(215,221,232,.8);
  backdrop-filter:blur(18px);
}
.nav{
  width:94%;
  height:76px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.logo{font-size:21px;font-weight:900;letter-spacing:-1px}
.logo span{font-weight:400;color:#788294}
.nav-links{display:flex;align-items:center;justify-content:flex-end;gap:25px;font-size:15px}
.nav-links a{color:#4f596b;white-space:nowrap;transition:.2s}
.nav-links a:hover,.nav-links a.active{color:var(--ink)}
.nav-links a:last-child{
  padding:11px 17px;
  border:1px solid var(--ink);
  border-radius:999px;
  background:var(--ink);
  color:#fff;
}
.menu-btn{
  display:none;
  width:42px;height:42px;
  border:1px solid #ccd2dc;
  border-radius:50%;
  background:#fff;
  cursor:pointer;
}

/* BUTTONS */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:45px;
  padding:0 19px;
  border:1px solid #cfd5df;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
  transition:.22s ease;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(20,30,50,.12)}
.btn-light{background:#fff;color:var(--ink);border-color:#fff}
.btn-dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn-accent{background:linear-gradient(135deg,var(--violet),#5b8cff);color:#fff;border-color:transparent}

/* HERO */
.hero{width:100%;padding:20px 0 0}
.hero-slider{
  position:relative;
  width:100%;
  height:650px;
  overflow:hidden;
  border-radius:34px;
  background:var(--navy);
  box-shadow:var(--shadow);
}
.hero-slide{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:0;
  visibility:hidden;
  overflow:hidden;
  color:#fff;
  transition:opacity .9s ease,visibility .9s ease;
}
.hero-slide.active{opacity:1;visibility:visible;z-index:2}
.hero-grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:58px 58px;
}
.hero-content{
  position:absolute;
  z-index:6;
  left:7%;
  top:50%;
  width:60%;
  max-width:850px;
  min-width:0;
  transform:translateY(-50%);
}
.hero-slide:not(.active) .hero-content{transform:translateY(calc(-50% + 16px));opacity:0}
.hero-slide.active .hero-content{opacity:1;transition:opacity .8s ease,transform .9s ease}
.eyebrow{
  margin-bottom:18px;
  color:#a9c8ff;
  font-size:12px;
  font-weight:700;
  letter-spacing:2.5px;
  text-transform:uppercase;
}
.hero h1{
  max-width:850px;
  margin:0;
  font-size:clamp(52px,6.4vw,92px);
  line-height:.94;
  letter-spacing:-5px;
  font-weight:900;
}
.hero h1 span{
  color:#91c9ff;
  text-shadow:0 0 45px rgba(112,201,255,.14);
}
.hero p{
  max-width:600px;
  margin:27px 0 31px;
  color:#aeb8c9;
  font-size:18px;
  line-height:1.55;
}
.actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.btn-outline-dark{
  background:rgba(255,255,255,.04);
  color:#fff;
  border-color:rgba(255,255,255,.24);
}
.hero-orb{
  position:absolute;
  z-index:2;
  width:600px;height:600px;
  right:-100px;bottom:-210px;
  border-radius:50%;
  background:radial-gradient(circle at 31% 25%,#fff 0,#9fd2ff 15%,#667cf2 31%,#312d67 48%,#0b1220 67%,#07111f 75%);
  box-shadow:0 0 140px rgba(112,201,255,.2);
}
.hero-orb.violet{
  background:radial-gradient(circle at 31% 25%,#fff 0,#d7c8ff 15%,#9b74ff 31%,#3b2d73 48%,#11112a 67%,#07111f 75%);
}
.hero-orb.cyan{
  background:radial-gradient(circle at 31% 25%,#f4ffff 0,#a8f0ff 15%,#55c3e8 31%,#194f68 48%,#0c2534 67%,#07111f 75%);
}
.hero-badge{
  position:absolute;
  z-index:7;
  top:9%;
  right:5%;
  max-width:230px;
  padding:13px 16px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:16px;
  background:rgba(255,255,255,.055);
  color:#9da9bc;
  font-size:12px;
  backdrop-filter:blur(12px);
}
.hero-badge strong{display:block;margin-bottom:2px;color:#fff;font-size:13px}
.hero-dots{
  position:absolute;
  z-index:10;
  left:7%;
  bottom:28px;
  display:flex;
  gap:7px;
}
.hero-dot{
  width:7px;height:7px;padding:0;
  border:0;border-radius:50%;
  background:rgba(255,255,255,.28);
  cursor:pointer;
  transition:.3s;
}
.hero-dot.active{width:25px;border-radius:9px;background:#fff}

/* MARQUEE */
.marquee{
  width:100%;
  height:50px;
  margin-top:15px;
  overflow:hidden;
  border-radius:14px;
  background:linear-gradient(90deg,#070b15,#111a2b);
  box-shadow:0 10px 30px rgba(17,31,55,.1);
}
.marquee-track{
  display:flex;
  align-items:center;
  width:max-content;
  height:50px;
  animation:marquee 28s linear infinite;
}
.marquee-item{
  flex:0 0 auto;
  padding:0 25px;
  color:#e8edf7;
  font-size:12px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  white-space:nowrap;
}
.marquee-item::after{content:"✦";margin-left:25px;color:#8ecaff}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* STATS — large readable premium block */
.stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  width:100%;
  overflow:hidden;
  border:1px solid #dce2eb;
  border-radius:24px;
  background:rgba(255,255,255,.9);
  box-shadow:var(--shadow);
}
.stat{
  position:relative;
  min-width:0;
  padding:30px 27px 29px;
  border-right:1px solid #e4e8ef;
}
.stat:last-child{border-right:0}
.stat-icon{
  width:48px;height:48px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:21px;
  border-radius:15px;
  background:linear-gradient(135deg,#eef1ff,#eaf7ff);
  color:#5d6cf0;
}
.stat-icon svg{width:23px;height:23px}
.stat-value{
  display:block;
  margin-bottom:7px;
  color:var(--ink);
  font-size:34px;
  line-height:1;
  font-weight:900;
  letter-spacing:-1.5px;
}
.stat-title{
  display:block;
  color:#283247;
  font-size:16px;
  font-weight:700;
}
.stat-sub{
  display:block;
  margin-top:5px;
  color:#7a8495;
  font-size:11px;
}

/* SECTIONS */
.section{padding:100px 0}
.section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:45px;
  margin-bottom:40px;
}
.section-kicker{
  margin-bottom:11px;
  color:#657087;
  font-size:10px;
  font-weight:800;
  letter-spacing:2.3px;
  text-transform:uppercase;
}
.section h2{
  margin:0;
  color:var(--ink);
  font-size:60px;
  line-height:.98;
  letter-spacing:-3.5px;
}
.section-intro{
  max-width:500px;
  margin:0;
  color:#687386;
  font-size:14px;
}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}
.card{
  position:relative;
  min-width:0;
  min-height:265px;
  padding:30px;
  overflow:hidden;
  border:1px solid #dfe4ec;
  border-radius:25px;
  background:linear-gradient(145deg,#fff,#f8f9fc);
  box-shadow:0 8px 30px rgba(18,31,53,.035);
  transition:.25s ease;
}
.card:hover{transform:translateY(-6px);box-shadow:0 24px 55px rgba(18,31,53,.1)}
.card-icon{
  width:48px;height:48px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:28px;
  border-radius:15px;
  background:#edf0ff;
  color:#655cf1;
}
.card-icon svg{width:24px;height:24px}
.card-num{margin-bottom:35px;color:#8791a3;font-size:10px;letter-spacing:1.4px}
.card h3{margin:0 0 9px;font-size:23px;letter-spacing:-.5px}
.card p{margin:0;color:#687386;font-size:13px;line-height:1.6}

/* DARK CTA */
.dark-section{
  position:relative;
  overflow:hidden;
  padding:72px;
  border-radius:31px;
  background:
    radial-gradient(circle at 82% 30%,rgba(118,103,247,.3),transparent 26%),
    radial-gradient(circle at 96% 95%,rgba(112,201,255,.2),transparent 30%),
    linear-gradient(135deg,#06101e,#0b1730);
  color:#fff;
  box-shadow:0 25px 65px rgba(12,27,55,.13);
}
.dark-section::after{
  content:"";
  position:absolute;
  width:430px;height:430px;
  right:-200px;top:-200px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 0 0 60px rgba(255,255,255,.025),0 0 0 120px rgba(255,255,255,.018);
}
.dark-section>*{position:relative;z-index:2}
.dark-section h2{color:#fff}
.dark-section p{color:#b4bed0}

/* PAGE HERO */
.page-hero{padding:100px 0 70px}
.page-hero h1{
  max-width:1050px;
  margin:0;
  color:var(--ink);
  font-size:clamp(54px,7.5vw,102px);
  line-height:.93;
  letter-spacing:-5px;
}
.page-hero p{max-width:700px;margin:24px 0 0;color:#687386;font-size:19px}

/* TOOLS */
.tool-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}
.tool-card{
  min-width:0;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  padding:28px;
  border:1px solid #dfe4ec;
  border-radius:23px;
  background:#fff;
  box-shadow:0 8px 30px rgba(18,31,53,.035);
}
.tool-card:hover{box-shadow:0 22px 50px rgba(18,31,53,.08)}
.tool-card h3{margin:0 0 6px}
.tool-card p{margin:0;color:#6b7688;font-size:15px}
.arrow{font-size:24px;color:#5f63ec}

/* CONTACT */
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:18px}
.contact-info{
  padding:42px;
  border-radius:28px;
  background:linear-gradient(145deg,#07111f,#111d35);
  color:#fff;
  box-shadow:0 22px 55px rgba(12,27,55,.14);
}
.contact-info p{color:#b4bed0;margin:15px 0 35px}
.contact-line{padding:17px 0;border-top:1px solid rgba(255,255,255,.1)}
.form{
  padding:35px;
  border:1px solid #dfe4ec;
  border-radius:28px;
  background:#fff;
  box-shadow:0 12px 40px rgba(18,31,53,.04);
}
.form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.field{margin-bottom:18px}
.field label{display:block;margin-bottom:8px;color:#536076;font-size:10px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase}
.field input,.field textarea,.field select{width:100%;border:1px solid #d8dee8;border-radius:12px;padding:13px;font:inherit;background:#fafbfc;outline:none}
.field input:focus,.field textarea:focus,.field select:focus{border-color:#8e85f7;box-shadow:0 0 0 4px rgba(118,103,247,.1)}
.field textarea{min-height:150px;resize:vertical}
.form .btn{cursor:pointer}

/* FOOTER */
.footer-wrap{width:94%;margin:0 auto 30px}
.footer{
  width:100%;
  padding:78px 38px 25px;
  border-radius:34px;
  background:linear-gradient(145deg,#050b14,#0b1425);
  color:#fff;
  box-shadow:0 25px 70px rgba(12,27,55,.14);
}
.footer-top{text-align:center;padding-bottom:52px}
.footer-top h2{margin:0;font-size:62px;line-height:.95;letter-spacing:-4px}
.footer-top p{max-width:520px;margin:15px auto 25px;color:#aeb9cb;font-size:13px}
.footer-links{border-top:1px solid rgba(255,255,255,.1)}
.footer-row{display:flex;align-items:center;min-height:54px;border-bottom:1px solid rgba(255,255,255,.1);font-size:11px}
.footer-label{width:80px;flex:0 0 80px;color:#8ecaff;letter-spacing:1.4px;text-transform:uppercase}
.footer-row a{display:inline-block;margin-right:20px;color:#aeb9cb}
.footer-row a:hover{color:#fff}
.footer-bottom{padding-top:24px;text-align:center}
.footer-mark{
  width:46px;height:40px;
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 9px;
  border-radius:12px;
  background:linear-gradient(135deg,#fff,#dcecff);
  color:#10182a;
  font-size:12px;font-weight:900;
}
.footer-brand{font-size:11px;font-weight:900;letter-spacing:.5px}
.copyright{margin-top:10px;color:#6e7a8e;font-size:9px}

/* RESPONSIVE */
@media(max-width:900px){
  .nav-links{gap:16px;font-size:12px}
  .hero-content{width:65%}
  .hero h1{font-size:64px;letter-spacing:-3.5px}
  .hero-orb{width:470px;height:470px;right:-130px;bottom:-150px}
  .section h2{font-size:48px}
  .page-hero h1{font-size:74px}
}
@media(max-width:760px){
  .site-header,.nav{height:68px}
  .menu-btn{display:block}
  .nav-links{
    display:none;
    position:absolute;
    top:68px;left:0;
    width:100%;
    padding:18px 3%;
    flex-direction:column;
    align-items:flex-start;
    gap:15px;
    background:var(--bg);
    border-bottom:1px solid var(--line);
  }
  .nav-links.open{display:flex}
  .nav-links a:last-child{background:var(--ink);color:#fff}
  .hero-slider{height:590px;border-radius:25px}
  .hero-content{left:7%;top:46%;width:86%;max-width:none}
  .hero h1{font-size:48px;letter-spacing:-2.8px}
  .hero p{font-size:14px}
  .hero-orb{width:340px;height:340px;right:-125px;bottom:-75px}
  .hero-badge{display:none}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stat{padding:24px 21px;border-right:1px solid #e4e8ef;border-bottom:1px solid #e4e8ef}
  .stat:nth-child(2n){border-right:0}
  .stat:nth-last-child(-n+2){border-bottom:0}
  .section{padding:70px 0}
  .section-head{display:block}
  .section-intro{margin-top:18px}
  .section h2{font-size:43px}
  .cards,.tool-grid,.contact-grid{grid-template-columns:1fr}
  .dark-section{padding:43px 27px;border-radius:25px}
  .dark-section h2{font-size:43px}
  .form-row{grid-template-columns:1fr}
  .page-hero{padding:70px 0 48px}
  .page-hero h1{font-size:60px;letter-spacing:-3px}
  .footer-wrap{width:94%}
  .footer{padding:58px 21px 23px;border-radius:25px}
  .footer-top h2{font-size:45px}
  .footer-row{align-items:flex-start;padding:14px 0}
  .footer-label{width:70px;flex-basis:70px}
  .footer-row a{margin:0 12px 5px 0}
}
@media(max-width:430px){
  .hero-slider{height:570px}
  .hero h1{font-size:43px}
  .hero p{font-size:13px}
  .stats{grid-template-columns:1fr}
  .stat,.stat:nth-child(2n),.stat:nth-last-child(-n+2){border-right:0;border-bottom:1px solid #e4e8ef}
  .stat:last-child{border-bottom:0}
  .page-hero h1{font-size:50px}
  .section h2,.dark-section h2{font-size:39px}
}


/* READABILITY PASS
   Normal UI/body text is intentionally 2–3px larger.
   Hero headline is deliberately slimmer and smaller so it reads as premium
   rather than oversized.
*/
body{
  font-size:16px;
}

.nav-links{
  font-size:14px;
}

.eyebrow{
  font-size:11px;
  font-weight:600;
  letter-spacing:2.2px;
}

.hero h1{
  font-family:"Arial Narrow","Roboto Condensed","Aptos Narrow","Segoe UI",Arial,sans-serif;
  font-weight:600;
  font-size:clamp(48px,5.35vw,74px);
  line-height:.98;
  letter-spacing:-2.5px;
  max-width:780px;
}

.hero p{
  font-size:17px;
  line-height:1.6;
}

.hero-badge{
  font-size:12px;
}
.hero-badge strong{
  font-size:14px;
}

.marquee-item{
  font-size:11px;
  letter-spacing:1.45px;
}

.stat-value{
  font-size:36px;
}
.stat-title{
  font-size:15px;
}
.stat-sub{
  font-size:13px;
}

.section-kicker{
  font-size:11px;
}
.section-intro{
  font-size:16px;
  line-height:1.6;
}

.card-num{
  font-size:11px;
}
.card h3{
  font-size:24px;
}
.card p{
  font-size:15px;
  line-height:1.65;
}

.page-hero p{
  font-size:19px;
  line-height:1.6;
}

.tool-card p{
  font-size:15px;
  line-height:1.6;
}

.contact-info p,
.form,
.field input,
.field textarea,
.field select{
  font-size:15px;
}

.field label{
  font-size:11px;
}

.footer-top p{
  font-size:15px;
  line-height:1.6;
}
.footer-row{
  font-size:13px;
}
.footer-label{
  font-size:11px;
}
.copyright{
  font-size:11px;
}

/* Keep the banner elegant on smaller screens too. */
@media(max-width:760px){
  .hero h1{
    font-size:44px;
    line-height:1;
    letter-spacing:-1.8px;
    font-weight:600;
  }
  .hero p{
    font-size:16px;
  }
  .marquee-item{
    font-size:11px;
  }
  .stat-title{
    font-size:15px;
  }
  .stat-sub{
    font-size:13px;
  }
  .card p,
  .tool-card p{
    font-size:15px;
  }
}

@media(max-width:430px){
  .hero h1{
    font-size:39px;
    letter-spacing:-1.4px;
  }
}


/* =========================================================
   COMPACT 90% LAYOUT
   ========================================================= */
.container{
  width:90%!important;
  margin-left:5%!important;
  margin-right:5%!important;
}

.nav{
  width:90%!important;
  margin-left:5%!important;
  margin-right:5%!important;
}

.footer-wrap{
  width:90%!important;
  margin-left:5%!important;
  margin-right:5%!important;
}

/* Reduce excessive vertical whitespace */
.hero{
  padding-top:14px!important;
}

.section{
  padding-top:70px!important;
  padding-bottom:70px!important;
}

.page-hero{
  padding-top:72px!important;
  padding-bottom:48px!important;
}

.stats{
  margin-top:0!important;
}

.card{
  min-height:235px!important;
}

.card-num{
  margin-bottom:25px!important;
}

.dark-section{
  padding-top:58px!important;
  padding-bottom:58px!important;
}

.footer{
  padding-top:60px!important;
}

/* Keep the main visual strong without consuming too much vertical space */
.hero-slider{
  height:590px!important;
}

.marquee{
  height:46px!important;
}
.marquee-track{
  height:46px!important;
}

@media(max-width:760px){
  .container,
  .nav,
  .footer-wrap{
    width:92%!important;
    margin-left:4%!important;
    margin-right:4%!important;
  }

  .hero{
    padding-top:10px!important;
  }

  .hero-slider{
    height:550px!important;
  }

  .section{
    padding-top:52px!important;
    padding-bottom:52px!important;
  }

  .page-hero{
    padding-top:58px!important;
    padding-bottom:38px!important;
  }

  .dark-section{
    padding-top:42px!important;
    padding-bottom:42px!important;
  }
}


/* LIGHT GREY PAGE BACKGROUND */
html,
body{
  background:#eeeeec!important;
}

body{
  background:
    radial-gradient(circle at 8% 0%,rgba(118,103,247,.035),transparent 25%),
    radial-gradient(circle at 95% 10%,rgba(112,201,255,.045),transparent 22%),
    #eeeeec!important;
}

.site-header{
  background:rgba(238,238,236,.94)!important;
}

.nav-links{
  background:transparent;
}

.card,
.tool-card,
.form,
.stats{
  background:#ffffff!important;
}

.footer{
  background:linear-gradient(145deg,#050b14,#0b1425)!important;
}

@media(max-width:760px){
  .nav-links{
    background:#eeeeec!important;
  }
}

/* Featured free tools: isolated styling, existing pages unaffected */
.free-tools-feature{padding-top:44px!important;padding-bottom:65px!important}
.free-tools-heading{text-align:center;max-width:790px;margin:0 auto 32px}
.free-tools-heading h2{font-size:clamp(32px,3.6vw,49px);letter-spacing:-1.7px;margin:8px 0 14px;line-height:1.1}
.free-tools-heading p{font-size:16px;line-height:1.7;color:#596578;margin:0 auto;max-width:730px}
.free-tools-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.free-tool-card{position:relative;display:flex;flex-direction:column;min-width:0;min-height:340px;padding:31px 34px 29px;border-radius:26px;color:#fff;overflow:hidden;isolation:isolate;box-shadow:0 18px 38px rgba(30,35,70,.13);transition:transform .25s,box-shadow .25s}
.free-tool-card:hover{transform:translateY(-5px);box-shadow:0 26px 46px rgba(30,35,70,.22)}
.free-tool-card:focus-visible{outline:4px solid #111;outline-offset:4px}
.free-tool-seo{background:linear-gradient(120deg,#6536db 0%,#9e43d6 55%,#f36aa5 100%)}
.free-tool-speed{background:linear-gradient(120deg,#056b9b 0%,#068eb3 50%,#10caa2 100%)}
.free-tool-card:before{content:"";position:absolute;z-index:-1;right:-90px;top:50px;width:280px;height:280px;border:1px solid rgba(255,255,255,.25);border-radius:50%;box-shadow:0 0 0 50px rgba(255,255,255,.055),0 0 0 100px rgba(255,255,255,.04)}
.free-tool-top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.free-tool-pill{border:1px solid rgba(255,255,255,.55);background:rgba(255,255,255,.16);border-radius:30px;padding:8px 12px;font-size:11px;font-weight:700;letter-spacing:1px}
.free-tool-arrow{font-size:29px;line-height:1}
.free-tool-icon{width:70px;height:70px;display:grid;place-items:center;margin:27px 0 15px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.35);border-radius:19px}
.free-tool-icon svg{width:42px;height:42px}
.free-tool-card h3{font-size:clamp(23px,2.2vw,31px);line-height:1.15;letter-spacing:-.6px;margin:0 0 13px;color:#fff}
.free-tool-card p{font-size:15px;line-height:1.65;color:rgba(255,255,255,.95);margin:0 0 24px;max-width:490px}
.free-tool-link{margin-top:auto;display:inline-flex;align-items:center;gap:12px;font-size:14px;font-weight:800}
@media(max-width:760px){.free-tools-grid{grid-template-columns:1fr}.free-tool-card{min-height:310px;padding:26px}.free-tools-feature{padding-top:28px!important;padding-bottom:48px!important}.free-tools-heading p{font-size:15px}}
@media(prefers-reduced-motion:reduce){.free-tool-card{transition:none}}

/* Free tools detail page */
.tools-page-intro{padding-bottom:20px!important}
.tools-page-intro h1{font-size:clamp(44px,5.8vw,76px);letter-spacing:-2.7px;line-height:1.05}
.tools-page-intro p{max-width:780px}
.tools-editorial{padding-top:20px!important}
.tools-editorial-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.tools-editorial-card{padding:32px;border:1px solid #e0e3e9;border-radius:24px;background:#fff}
.tools-editorial-card h3{font-size:clamp(22px,2vw,29px);line-height:1.2;margin:0 0 20px}
.tools-editorial-card p{font-size:16px;line-height:1.75;color:#596578}
.tools-editorial-card p a{color:#5149b9;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.tools-text-link{display:inline-block;margin-top:8px;font-size:15px;font-weight:800;color:#5149b9}
.tools-note{font-size:13px;line-height:1.6;color:#667085;margin-top:24px}
@media(max-width:760px){.tools-editorial-grid{grid-template-columns:1fr}.tools-editorial-card{padding:25px}}

/* Homepage: customer-focused alternative to the old statistics bar */
.home-value-section{padding:64px 0 58px!important}
.value-intro{display:flex;align-items:end;justify-content:space-between;gap:36px;margin-bottom:25px}
.value-intro h2{font-size:clamp(36px,4vw,56px);line-height:1.04;letter-spacing:-2px;margin:0}
.value-intro h2 span{color:#6459cc}
.value-intro>p{max-width:525px;font-size:16px;line-height:1.7;color:#566276;margin:0}
.value-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:17px}
.value-feature{min-width:0;min-height:345px;padding:29px;border-radius:25px;display:flex;flex-direction:column;align-items:flex-start;overflow:hidden;position:relative}
.value-feature-main{background:linear-gradient(135deg,#142554,#453e9f 62%,#7252cc);color:#fff}
.value-feature-light{background:#e8f4ff;color:#142747;border:1px solid #d1e6f8}
.value-feature-warm{background:#fff0df;color:#473016;border:1px solid #f4ddc0}
.value-feature .value-icon{width:57px;height:57px;display:grid;place-items:center;border-radius:17px;background:rgba(255,255,255,.2);margin-bottom:25px}
.value-feature:not(.value-feature-main) .value-icon{background:rgba(255,255,255,.7)}
.value-icon svg{width:30px;height:30px}
.value-tag{font-size:11px;font-weight:800;letter-spacing:1.4px;opacity:.82;margin-bottom:12px}
.value-feature h3{font-size:clamp(22px,2.1vw,30px);line-height:1.2;letter-spacing:-.6px;margin:0 0 13px}
.value-feature p{font-size:15px;line-height:1.65;opacity:.86;margin:0 0 23px}
.value-feature a{margin-top:auto;font-size:14px;font-weight:800;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:3px}
.value-feature a:hover{opacity:.75}
@media(max-width:900px){.value-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.value-feature-main{grid-column:span 2;min-height:270px}.value-feature{min-height:300px}}
@media(max-width:760px){.value-intro{display:block}.value-intro>p{margin-top:17px}.value-grid{grid-template-columns:1fr}.value-feature-main{grid-column:auto}.value-feature{min-height:275px}.home-value-section{padding:42px 0!important}}

/* Match hero headings to the same typeface as the rest of the website. */
.hero h1, .hero h1 span {
  font-family: Arial, Helvetica, sans-serif !important;
  font-stretch: normal;
  font-weight: 600;
}

/* Organic, Apple-inspired motion — original CSS artwork, no borrowed imagery */
.value-intro-animated{position:relative;isolation:isolate;min-height:330px;padding:55px clamp(24px,5vw,75px);border-radius:30px;overflow:hidden;background:#fbfaff;align-items:center;border:1px solid #e8e6ef;box-shadow:0 16px 45px rgba(26,32,60,.06)}
.value-intro-animated>div:not(.ideas-color-motion):not(.ideas-shimmer),.value-intro-animated>p{position:relative;z-index:2}
.value-intro-animated>div:not(.ideas-color-motion):not(.ideas-shimmer){flex:0 1 48%}
.value-intro-animated>p{flex:0 1 38%;max-width:450px;color:#26334d;font-weight:500}
.value-intro-animated h2{font-size:clamp(40px,4.6vw,69px);line-height:1.02;letter-spacing:-2.4px;color:#10152c;text-shadow:0 1px 15px rgba(255,255,255,.8)}
.value-intro-animated h2 span{color:#4f42a6}
.ideas-color-motion{position:absolute;z-index:0;inset:0;pointer-events:none;overflow:hidden;filter:blur(15px);opacity:.88}
.motion-blob{position:absolute;display:block;width:40%;aspect-ratio:1;border-radius:38% 62% 65% 35% / 45% 40% 60% 55%;mix-blend-mode:multiply;will-change:transform,border-radius;animation:ideasFloat 12s ease-in-out infinite alternate,ideasMorph 8s ease-in-out infinite alternate}
.blob-coral{background:linear-gradient(135deg,#ff9e82,#fbd2a3);left:39%;top:-45%;animation-delay:-3s}
.blob-purple{background:linear-gradient(135deg,#b8a1ff,#edabf0);left:60%;top:-15%;animation-delay:-6s;animation-duration:15s,9s}
.blob-blue{background:linear-gradient(135deg,#8fd8ff,#9ca9ff);left:46%;top:38%;animation-delay:-9s;animation-duration:13s,11s}
.blob-gold{background:linear-gradient(135deg,#ffdf94,#ffc5ac);left:78%;top:40%;animation-delay:-1s;animation-duration:17s,10s}
.ideas-shimmer{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(251,250,255,.96) 0%,rgba(251,250,255,.85) 30%,rgba(251,250,255,.24) 70%,rgba(251,250,255,.12) 100%)}
@keyframes ideasFloat{0%{transform:translate(-8%,8%) rotate(-18deg) scale(.85)}50%{transform:translate(10%,-7%) rotate(12deg) scale(1.12)}100%{transform:translate(-5%,10%) rotate(40deg) scale(.95)}}
@keyframes ideasMorph{0%{border-radius:38% 62% 65% 35% / 45% 40% 60% 55%}50%{border-radius:67% 33% 37% 63% / 32% 61% 39% 68%}100%{border-radius:43% 57% 72% 28% / 64% 31% 69% 36%}}
@media(max-width:760px){.value-intro-animated{min-height:360px;padding:34px 26px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:20px}.value-intro-animated>div:not(.ideas-color-motion):not(.ideas-shimmer),.value-intro-animated>p{flex:none}.value-intro-animated h2{font-size:clamp(38px,9vw,54px)}.motion-blob{width:75%}.blob-coral{left:35%;top:-15%}.blob-purple{left:60%;top:0}.blob-blue{left:38%;top:50%}.blob-gold{left:70%;top:50%}.ideas-shimmer{background:linear-gradient(90deg,rgba(251,250,255,.92),rgba(251,250,255,.45))}}
@media(prefers-reduced-motion:reduce){.motion-blob{animation:none;will-change:auto}}

/* Premium bento inner pages */
.inner-page .page-hero{padding:44px 0 20px!important}
.inner-page .page-hero>.container{background:linear-gradient(135deg,#fff 0%,#f9faff 100%);border:1px solid #e5e8f0;border-radius:32px;padding:clamp(34px,5vw,78px);box-shadow:0 18px 55px rgba(23,34,59,.065)}
.inner-page .page-hero h1{font-size:clamp(42px,5.5vw,76px);line-height:1.03;letter-spacing:-2.8px;max-width:920px}
.inner-page .section{padding:24px 0 50px!important}
.inner-page .card,.inner-page .tool-card,.inner-page .tools-editorial-card,.inner-page .form{border-radius:30px;box-shadow:0 15px 38px rgba(23,34,59,.075);border:1px solid #e7e9ef;background:#fff;min-height:260px}
.inner-page .cards{gap:18px}
.inner-page .bento-cards .card:first-child{grid-column:span 2;background:linear-gradient(130deg,#e9f0ff,#f9faff)}
.inner-page .bento-cards .card:nth-child(3n){background:#f0eaff}
.inner-page .bento-cards .card:nth-child(4n){background:#eaf8f6}
.inner-page .bento-cards .card h3{font-size:clamp(23px,2.1vw,30px)}
.inner-page .bento-cards .card p{font-size:16px;line-height:1.75;max-width:680px}
.inner-page .dark-section{border-radius:32px;box-shadow:0 18px 55px rgba(23,34,59,.12)}
.inner-page .free-tool-card{border-radius:30px}
.inner-page .contact-info{border-radius:30px}
.bento-link{display:inline-block;margin-top:19px;color:#534cc2;font-weight:700;font-size:14px}
.inner-page .bento-feature{min-height:300px}
.inner-page .bento-content{background:linear-gradient(135deg,#fff0f2,#fff9ef)!important}
@media(max-width:760px){.inner-page .page-hero>.container{padding:32px 24px;border-radius:24px}.inner-page .bento-cards .card:first-child{grid-column:auto}.inner-page .card,.inner-page .tool-card,.inner-page .tools-editorial-card{border-radius:24px}.inner-page .page-hero h1{font-size:clamp(38px,9vw,52px);letter-spacing:-1.8px}}


/* Consolidated category-based multicolour card design */
html,body{background:#fff!important}
body{background:#fff!important}
.site-header{background:rgba(255,255,255,.97)!important}
@media(max-width:760px){.nav-links{background:#fff!important}}
:root{
 --theme-design:linear-gradient(125deg,#1743a7 0%,#3866d9 48%,#6554cf 100%);
 --theme-development:linear-gradient(125deg,#17385c 0%,#146b93 48%,#13a3ad 100%);
 --theme-commerce:linear-gradient(125deg,#9a3a30 0%,#c45a38 50%,#df9341 100%);
 --theme-seo:linear-gradient(125deg,#5530a6 0%,#7b42c7 48%,#ba49a1 100%);
 --theme-speed:linear-gradient(125deg,#075c75 0%,#087f99 50%,#0e9c81 100%);
 --theme-content:linear-gradient(125deg,#9a2860 0%,#bc447c 50%,#d36c88 100%);
 --theme-support:linear-gradient(125deg,#355e30 0%,#44884c 50%,#66a05c 100%);
 --theme-clarity:linear-gradient(125deg,#125b80 0%,#277fa5 55%,#409ab9 100%);
 --theme-flexibility:linear-gradient(125deg,#65409a 0%,#8155b1 55%,#aa6cb6 100%);
 --theme-practical:linear-gradient(125deg,#84501e 0%,#a77132 55%,#bf8b4a 100%);
 --theme-contact:linear-gradient(125deg,#144e75 0%,#26688b 55%,#4b7aa9 100%);
 --theme-general:linear-gradient(125deg,#263b6f 0%,#3f5598 50%,#7160a5 100%);
}
.card,.tool-card,.tools-editorial-card,.inner-page .form,.inner-page .contact-info,.value-feature{
 position:relative;isolation:isolate;overflow:hidden;
 background:var(--category-paint,var(--theme-general))!important;
 color:#fff!important;border:1px solid rgba(255,255,255,.15)!important;
 box-shadow:0 17px 40px rgba(20,30,60,.16)!important;
 transition:transform .35s ease,box-shadow .35s ease,filter .35s ease;
 animation:categoryEnter .65s ease both;
}
[data-service-theme="design"]{--category-paint:var(--theme-design)}
[data-service-theme="development"]{--category-paint:var(--theme-development)}
[data-service-theme="commerce"]{--category-paint:var(--theme-commerce)}
[data-service-theme="seo"]{--category-paint:var(--theme-seo)}
[data-service-theme="speed"]{--category-paint:var(--theme-speed)}
[data-service-theme="content"]{--category-paint:var(--theme-content)}
[data-service-theme="support"]{--category-paint:var(--theme-support)}
[data-service-theme="clarity"]{--category-paint:var(--theme-clarity)}
[data-service-theme="flexibility"]{--category-paint:var(--theme-flexibility)}
[data-service-theme="practical"]{--category-paint:var(--theme-practical)}
[data-service-theme="contact"]{--category-paint:var(--theme-contact)}
[data-service-theme="general"]{--category-paint:var(--theme-general)}
/* Category takes priority over earlier positional bento backgrounds */
.inner-page .bento-cards .card[data-service-theme],
.inner-page .bento-cards .card:first-child[data-service-theme],
.inner-page .bento-cards .card:nth-child(3n)[data-service-theme],
.inner-page .bento-cards .card:nth-child(4n)[data-service-theme],
.inner-page .bento-cards .bento-content[data-service-theme],
.value-feature[data-service-theme]{background:var(--category-paint)!important}
.card::before,.tool-card::before,.tools-editorial-card::before,.value-feature::before{
 content:"";position:absolute;inset:auto -15% -75% auto;width:65%;aspect-ratio:1;
 border-radius:45%;pointer-events:none;z-index:-1;
 background:radial-gradient(circle,rgba(255,255,255,.13),transparent 68%);
 animation:categoryGlow 10s ease-in-out infinite alternate;
}
.card:hover,.tool-card:hover,.tools-editorial-card:hover,.inner-page .contact-info:hover,.value-feature:hover{
 transform:translateY(-6px);box-shadow:0 25px 52px rgba(20,30,60,.23)!important
}
.card h3,.card p,.card .card-num,.card a,.card svg,.card .card-icon,
.tool-card h3,.tool-card p,.tool-card a,.tools-editorial-card h3,.tools-editorial-card p,
.tools-editorial-card a,.tools-editorial-card .section-kicker,.tools-editorial-card .tools-text-link,
.inner-page .contact-info h2,.inner-page .contact-info h3,.inner-page .contact-info p,
.inner-page .contact-info .contact-line,.inner-page .contact-info .section-kicker,
.value-feature h3,.value-feature p,.value-feature a,.value-feature .value-tag,
.inner-page .form label{color:#fff!important}
.card p,.tool-card p,.tools-editorial-card p,.value-feature p{opacity:.96!important}
.card a,.tools-editorial-card a,.value-feature a{text-underline-offset:4px}
.card .card-icon,.value-feature .value-icon{background:rgba(255,255,255,.17)!important}
.inner-page .form input,.inner-page .form textarea,.inner-page .form select{background:#fff!important;color:#16243a!important}
.inner-page .form input::placeholder,.inner-page .form textarea::placeholder{color:#566278!important}
.free-tool-seo{background:var(--theme-seo)!important}
.free-tool-speed{background:var(--theme-speed)!important}
.value-intro-animated{background:#fbfaff!important}
@keyframes categoryEnter{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:translateY(0)}}
@keyframes categoryGlow{from{transform:translate(-10%,10%) scale(.9)}to{transform:translate(10%,-10%) scale(1.18)}}
@media(prefers-reduced-motion:reduce){
 .card,.tool-card,.tools-editorial-card,.value-feature,.inner-page .form,.inner-page .contact-info,
 .card::before,.tool-card::before,.tools-editorial-card::before,.value-feature::before{animation:none!important;transition:none!important}
}

/* Final refinement: uniformly white canvas and restrained card elevation */
html,body,body::before,body::after{background-color:#fff!important}
html,body{background:#fff!important}
.site-header,.site-header::before{background:rgba(255,255,255,.98)!important}
main,.page-hero,.section,.home-value-section,.free-tools-feature,.tools-editorial,.tools-page-intro{background-color:#fff!important}
/* Keep intentionally coloured hero, cards and the dark footer untouched. */
.card,.tool-card,.free-tool-card,.tools-editorial-card,.value-feature,.stats,.form,.contact-info,.bento-card,.footer{
 box-shadow:0 9px 26px rgba(20,32,60,.12),0 2px 8px rgba(20,32,60,.055)!important;
}
.card:hover,.tool-card:hover,.free-tool-card:hover,.tools-editorial-card:hover,.value-feature:hover,.bento-card:hover{
 box-shadow:0 15px 34px rgba(20,32,60,.17),0 4px 12px rgba(20,32,60,.07)!important;
}
@media(max-width:760px){.nav-links{background:#fff!important}}

/* Immersive animated 3D hero artwork. No external images or JS dependencies. */
.hero-slide{background:radial-gradient(ellipse at 86% 65%,rgba(64,54,150,.28),transparent 50%),linear-gradient(115deg,#050d1b 0%,#091328 62%,#101b38 100%)}
.hero-slide:nth-child(2){background:radial-gradient(ellipse at 82% 70%,rgba(141,58,170,.29),transparent 52%),linear-gradient(115deg,#070c1c,#13102e 72%,#23163f)}
.hero-slide:nth-child(3){background:radial-gradient(ellipse at 82% 70%,rgba(0,172,201,.2),transparent 52%),linear-gradient(115deg,#05111c,#08223a 75%,#073442)}
.hero-content{width:55%!important;max-width:760px!important}
.hero-3d-scene{position:absolute;z-index:3;width:min(48vw,650px);height:min(48vw,650px);right:-2%;top:53%;transform:translateY(-50%);perspective:850px;pointer-events:none;filter:drop-shadow(0 30px 45px rgba(0,0,0,.35));animation:heroSceneFloat 7s ease-in-out infinite alternate}
.hero-3d-halo{position:absolute;inset:7%;border-radius:50%;background:conic-gradient(from 40deg,#fa51a0,#8452f5,#36d5ef,#39e7bb,#ffd168,#fa51a0);filter:blur(65px);opacity:.44;animation:heroHueSpin 15s linear infinite}
.hero-3d-core{position:absolute;inset:25%;border-radius:29%;transform:rotate(-26deg) rotateX(18deg) rotateY(-20deg);background:radial-gradient(circle at 26% 17%,rgba(255,255,255,.95),transparent 17%),radial-gradient(circle at 30% 23%,#ffb2d9 0%,#e654c5 22%,#834cf2 47%,#2679e5 72%,#133f9d 100%);box-shadow:inset -26px -30px 50px rgba(8,14,75,.52),inset 15px 15px 28px rgba(255,255,255,.3),18px 28px 60px rgba(0,0,0,.42),0 0 70px rgba(163,78,249,.34);animation:heroCoreTurn 12s ease-in-out infinite alternate}
.hero-3d-core-shine{position:absolute;inset:5%;border-radius:28%;border:2px solid rgba(255,255,255,.24);background:linear-gradient(140deg,rgba(255,255,255,.3),transparent 43%)}
.hero-3d-ring{position:absolute;inset:14%;border-radius:50%;border:20px solid transparent;transform-style:preserve-3d;box-shadow:inset 0 0 22px rgba(255,255,255,.09),0 0 20px rgba(127,85,250,.12)}
.ring-one{border-top-color:#ff6bb1;border-left-color:#bc66ff;border-right-color:#60d9ff;border-bottom-color:#49e5d4;transform:rotate(-30deg) rotateX(69deg);animation:heroOrbitOne 11s linear infinite}
.ring-two{inset:6%;border-width:13px;border-top-color:#ffcf75;border-right-color:#ff66ad;border-bottom-color:#8868ff;border-left-color:#45e4e6;transform:rotate(48deg) rotateY(65deg);animation:heroOrbitTwo 16s linear infinite}
.ring-three{inset:20%;border-width:10px;border-top-color:#6ce7ff;border-left-color:#a96dff;border-bottom-color:#ff95b8;border-right-color:#ffe49a;transform:rotate(20deg) rotateX(65deg);animation:heroOrbitThree 9s linear infinite}
.hero-3d-spark{position:absolute;width:20px;height:20px;border-radius:50%;background:radial-gradient(circle at 28% 25%,white,#6de5ff 50%,#3564df);box-shadow:0 0 25px #53cfff;animation:heroSpark 5s ease-in-out infinite alternate}
.spark-one{top:12%;left:22%}.spark-two{top:25%;right:6%;width:13px;height:13px;animation-delay:-2s;background:radial-gradient(circle at 25% 20%,white,#ff9fd7 60%,#d950ad);box-shadow:0 0 24px #ed6dbf}.spark-three{bottom:15%;left:14%;width:12px;height:12px;animation-delay:-3s}
.hero-slide:nth-child(2) .hero-3d-core{filter:hue-rotate(30deg)}.hero-slide:nth-child(3) .hero-3d-core{filter:hue-rotate(125deg)}
@keyframes heroSceneFloat{to{transform:translateY(calc(-50% - 17px)) rotate(4deg)}}
@keyframes heroHueSpin{to{transform:rotate(360deg)}}
@keyframes heroCoreTurn{to{transform:rotate(16deg) rotateX(-12deg) rotateY(24deg)}}
@keyframes heroOrbitOne{to{transform:rotate(330deg) rotateX(69deg)}}
@keyframes heroOrbitTwo{to{transform:rotate(-312deg) rotateY(65deg)}}
@keyframes heroOrbitThree{to{transform:rotate(380deg) rotateX(65deg)}}
@keyframes heroSpark{to{transform:translate(15px,-20px) scale(1.3);opacity:.65}}
@media(max-width:900px){.hero-3d-scene{width:450px;height:450px;right:-140px;opacity:.75}.hero-content{width:72%!important}}
@media(max-width:760px){.hero-3d-scene{width:330px;height:330px;top:77%;right:-125px;opacity:.5}.hero-content{width:88%!important}.hero-3d-ring{border-width:12px}.ring-two{border-width:9px}.ring-three{border-width:7px}}
@media(prefers-reduced-motion:reduce){.hero-3d-scene,.hero-3d-halo,.hero-3d-core,.hero-3d-ring,.hero-3d-spark{animation:none!important}}

/* Dimensional service icons; keep each card's category colour and text contrast */
.card .service-icon-3d{width:76px;height:76px;display:grid;place-items:center;position:relative;margin:0 0 22px;border-radius:23px;color:#fff;background:linear-gradient(145deg,rgba(255,255,255,.45),rgba(255,255,255,.08) 56%,rgba(0,0,0,.13));border:1px solid rgba(255,255,255,.5);box-shadow:inset 2px 3px 5px rgba(255,255,255,.33),inset -3px -4px 8px rgba(0,0,0,.15),0 11px 19px rgba(0,0,0,.23),0 3px 0 rgba(255,255,255,.14);transform:perspective(280px) rotateX(7deg) rotateY(-9deg);transition:transform .4s ease,box-shadow .4s ease;flex-shrink:0}
.card .service-icon-3d:before{content:"";position:absolute;inset:7px 9px auto 9px;height:23px;border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.27),transparent);pointer-events:none}
.card .service-icon-3d svg{width:38px;height:38px;filter:drop-shadow(0 3px 3px rgba(0,0,0,.22));position:relative;z-index:1}
.card:hover .service-icon-3d{transform:perspective(280px) rotateX(-7deg) rotateY(8deg) translateY(-4px);box-shadow:inset 2px 3px 5px rgba(255,255,255,.38),inset -3px -4px 8px rgba(0,0,0,.13),0 17px 24px rgba(0,0,0,.25)}
.card .service-category-label{font-size:11px;font-weight:750;letter-spacing:1.4px;color:rgba(255,255,255,.86)!important;margin-bottom:15px;text-transform:uppercase}
@media(prefers-reduced-motion:reduce){.card .service-icon-3d{transition:none!important}}

/* Unique multicolour raised 3D icons throughout website */
.universal-3d-icon,.card .service-icon-3d.universal-3d-icon,.value-feature .value-icon.universal-3d-icon,.free-tool-icon.universal-3d-icon{
 width:76px!important;height:76px!important;flex:none;display:grid!important;place-items:center!important;
 position:relative!important;isolation:isolate;border-radius:23px!important;
 color:white!important;background:linear-gradient(142deg,var(--icon-hi) 0%,var(--icon-low) 92%)!important;
 border:1px solid rgba(255,255,255,.55)!important;
 box-shadow:inset 2px 3px 3px rgba(255,255,255,.55),inset -4px -5px 8px rgba(0,0,0,.2),0 7px 0 rgba(0,0,0,.16),0 15px 20px rgba(0,0,0,.24)!important;
 transform:perspective(400px) rotateX(8deg) rotateY(var(--icon-tilt))!important;
 transition:transform .35s ease,box-shadow .35s ease!important;
}
.universal-3d-icon::before{content:""!important;position:absolute!important;inset:5px 8px auto!important;height:29px!important;border-radius:16px!important;background:linear-gradient(rgba(255,255,255,.37),transparent)!important;pointer-events:none!important}
.universal-3d-icon svg,.card .service-icon-3d.universal-3d-icon svg,.value-icon.universal-3d-icon svg,.free-tool-icon.universal-3d-icon svg{width:39px!important;height:39px!important;filter:drop-shadow(0 3px 2px rgba(0,0,0,.3));position:relative;z-index:1}
.card:hover .universal-3d-icon,.value-feature:hover .universal-3d-icon,.free-tool-card:hover .universal-3d-icon{transform:perspective(400px) rotateX(-6deg) rotateY(9deg) translateY(-5px)!important;box-shadow:inset 2px 3px 3px rgba(255,255,255,.55),inset -4px -5px 8px rgba(0,0,0,.2),0 10px 0 rgba(0,0,0,.14),0 19px 24px rgba(0,0,0,.28)!important}
@media(prefers-reduced-motion:reduce){.universal-3d-icon{transition:none!important}}

/* Contact page: edge-to-edge map and accessible business details */
.contact-page-hero{padding-bottom:34px!important}
.contact-details-section{padding:12px 0 56px}
.contact-details-grid{display:grid;grid-template-columns:1.3fr 1fr 1.2fr;gap:20px}
.contact-detail-card{padding:32px;border-radius:26px;min-width:0;box-shadow:0 16px 38px rgba(25,35,65,.13);color:#fff;display:flex;flex-direction:column;align-items:flex-start;min-height:275px}
.contact-address{background:linear-gradient(130deg,#213b8a,#6850b5)}
.contact-phone{background:linear-gradient(130deg,#076d7c,#1b9a89)}
.contact-email{background:linear-gradient(130deg,#a33769,#d06b84)}
.contact-detail-icon{font-size:30px;width:58px;height:58px;border-radius:17px;display:grid;place-items:center;background:rgba(255,255,255,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.35);margin-bottom:18px}
.contact-detail-card h2{font-size:25px;line-height:1.2;color:#fff;margin:0 0 12px}
.contact-detail-card p{font-size:16px;line-height:1.7;color:rgba(255,255,255,.95);margin:0 0 20px}
.contact-detail-card a{margin-top:auto;color:#fff;font-weight:700;font-size:15px;overflow-wrap:anywhere;text-underline-offset:5px}
.contact-map-section{padding:24px 0 55px}
.contact-map-heading{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:25px}
.contact-map-heading h2{font-size:clamp(30px,3vw,46px);margin:8px 0 0}
.contact-map-heading p{color:#566278;font-size:16px}
.contact-map-frame{width:100%;height:min(72vh,690px);min-height:420px;box-shadow:0 18px 42px rgba(25,35,65,.12);background:#edf2f6;overflow:hidden}
.contact-map-frame iframe{display:block;width:100%;height:100%;border:0}
.contact-map-action{padding-top:18px}
.contact-map-action a{color:#344ca0;font-weight:700}
.contact-enquiry-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:50px;align-items:start}
.contact-enquiry-layout h2{font-size:clamp(32px,3vw,46px)}
.contact-enquiry-layout>div>p{font-size:17px;line-height:1.7;color:#596578}
.contact-mail-note{font-size:12px;color:rgba(255,255,255,.88);margin:12px 0 0}
@media(max-width:850px){.contact-details-grid{grid-template-columns:1fr 1fr}.contact-address{grid-column:span 2}.contact-enquiry-layout{grid-template-columns:1fr;gap:25px}}
@media(max-width:600px){.contact-details-grid{grid-template-columns:1fr}.contact-address{grid-column:auto}.contact-detail-card{min-height:225px;padding:26px}.contact-map-heading{display:block}.contact-map-frame{min-height:390px;height:62vh}}

.contact-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}

/* Keep the three About page principles together in one desktop row. */
.inner-page .bento-cards{grid-template-columns:repeat(3,minmax(0,1fr))}
.inner-page .bento-cards .card:first-child{grid-column:auto}
@media(max-width:900px){.inner-page .bento-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.inner-page .bento-cards{grid-template-columns:1fr}}