/* v7.2 targeted readability fixes for Website / Build and Search sections.
   Keeps the v7 structure and motion; only corrects contrast, spacing, and element clarity. */
:root{
  --sj-blue:#4069aa;
  --sj-blue-dark:#173a5b;
  --sj-blue-soft:#8fb7e0;
  --vz-orange:#ff5215;
  --vz-orange-soft:#ff8a4c;
  --ink:#122538;
  --muted:#607286;
}

/* Website / build section -------------------------------------------------- */
body.motion-v7 #website .section-intro{
  margin-bottom:28px!important;
}
body.motion-v7 #website .section-intro h2{
  color:var(--ink)!important;
}
body.motion-v7 #website .section-intro p{
  color:#52677b!important;
}

body.motion-v7 #website .website-promise{
  margin:0 0 24px!important;
  padding:18px 22px!important;
  display:flex!important;
  align-items:flex-start!important;
  gap:12px!important;
  background:linear-gradient(180deg,#fff7f1,#fffaf6)!important;
  border:1px solid rgba(255,82,21,.18)!important;
  border-radius:18px!important;
  color:var(--ink)!important;
  box-shadow:0 10px 26px rgba(16,42,66,.04)!important;
}
body.motion-v7 #website .website-promise .pulse{
  flex:0 0 10px!important;
  width:10px!important;
  height:10px!important;
  margin-top:6px!important;
  background:var(--vz-orange)!important;
}
body.motion-v7 #website .website-promise span,
body.motion-v7 #website .website-promise b{
  color:#294259!important;
}
body.motion-v7 #website .website-promise > span:last-child{
  font-size:13px!important;
  line-height:1.72!important;
}

body.motion-v7 #website .website-stage{
  grid-template-columns:minmax(340px,.86fr) minmax(0,1.14fr)!important;
  border:1px solid rgba(40,75,109,.10)!important;
  background:#fff!important;
  align-items:stretch!important;
}
body.motion-v7 #website .included-card{
  padding:34px!important;
  background:linear-gradient(180deg,#f8fbff,#eef5fc)!important;
  border:0!important;
  border-right:1px solid rgba(40,75,109,.10)!important;
  color:var(--ink)!important;
}
body.motion-v7 #website .included-card .included-tag{
  display:inline-flex!important;
  width:max-content!important;
  max-width:100%!important;
  padding:9px 12px!important;
  border-radius:999px!important;
  background:#fff3ed!important;
  border:1px solid rgba(255,82,21,.24)!important;
  color:#c9481b!important;
  font-size:10px!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
}
body.motion-v7 #website .included-card h3{
  color:#17324a!important;
  font-family:"Bodoni Moda",serif!important;
  font-size:clamp(34px,3.2vw,48px)!important;
  line-height:1.04!important;
  margin:18px 0 14px!important;
}
body.motion-v7 #website .included-card p{
  color:#52677b!important;
  font-size:14px!important;
  line-height:1.78!important;
  margin:0!important;
}
body.motion-v7 #website .included-list{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:8px!important;
  margin-top:22px!important;
}
body.motion-v7 #website .included-list span{
  position:relative!important;
  display:block!important;
  padding:12px 14px 12px 38px!important;
  border-radius:14px!important;
  background:#fff!important;
  border:1px solid rgba(64,105,170,.11)!important;
  color:#35506a!important;
  font-size:12px!important;
  line-height:1.62!important;
}
body.motion-v7 #website .included-list span::before{
  content:"✓"!important;
  position:absolute!important;
  left:14px!important;
  top:11px!important;
  color:var(--sj-blue)!important;
  font-weight:900!important;
}
body.motion-v7 #website .web-preview{
  background:#eef3f8!important;
}
body.motion-v7 #website .browser-bar{
  background:#dfe8f0!important;
  border-bottom:1px solid rgba(40,75,109,.10)!important;
}
body.motion-v7 #website .preview-screen{
  min-height:440px!important;
}
body.motion-v7 #website .preview-copy h4,
body.motion-v7 #website .preview-copy p,
body.motion-v7 #website .preview-copy small{
  text-shadow:0 2px 10px rgba(0,0,0,.20)!important;
}

body.motion-v7 #website .scope-grid{
  margin-top:22px!important;
  gap:14px!important;
  border:0!important;
}
body.motion-v7 #website .scope-card{
  border:1px solid rgba(40,75,109,.10)!important;
  background:linear-gradient(180deg,#fff,#f8fafc)!important;
  color:var(--ink)!important;
  padding:26px!important;
  border-radius:22px!important;
}
body.motion-v7 #website .scope-card h3{color:#17324a!important}
body.motion-v7 #website .scope-card p,
body.motion-v7 #website .scope-card li{color:#5b7084!important}

/* Search section ---------------------------------------------------------- */
body.motion-v7 #search{
  background:#102a42!important;
}
body.motion-v7 #search .shell::before{
  background:linear-gradient(180deg,#102a42,#173a5b)!important;
}
body.motion-v7 #search .section-intro h2{color:#fff!important}
body.motion-v7 #search .section-intro p{color:rgba(239,246,252,.82)!important}
body.motion-v7 #search .section-kicker{color:#9fc4eb!important}

body.motion-v7 #search .search-ladder{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  border-top:1px solid rgba(255,255,255,.12)!important;
  border-left:1px solid rgba(255,255,255,.12)!important;
}
body.motion-v7 #search .search-ladder article{
  background:rgba(255,255,255,.055)!important;
  border-right:1px solid rgba(255,255,255,.12)!important;
  border-bottom:1px solid rgba(255,255,255,.12)!important;
  color:#fff!important;
}
body.motion-v7 #search .search-ladder small{color:#a7bdd1!important}
body.motion-v7 #search .search-ladder b{color:#fff!important}
body.motion-v7 #search .search-ladder span{color:#c8d7e4!important}

body.motion-v7 #search .search-board{
  grid-template-columns:minmax(330px,.72fr) minmax(0,1.28fr)!important;
  gap:0!important;
  border:1px solid rgba(255,255,255,.14)!important;
  background:#102a42!important;
}
body.motion-v7 #search .search-score{
  padding:34px!important;
  background:linear-gradient(180deg,#eef5fc,#e2eef9)!important;
  color:var(--ink)!important;
  border-right:1px solid rgba(64,105,170,.16)!important;
}
body.motion-v7 #search .search-score .section-kicker,
body.motion-v7 #search .search-score .section-kicker[style]{
  color:var(--sj-blue)!important;
}
body.motion-v7 #search .search-score h3{
  color:#17324a!important;
  font-size:clamp(35px,3.3vw,48px)!important;
  line-height:1.05!important;
  margin:12px 0 22px!important;
}
body.motion-v7 #search .search-score p{
  color:#4f6579!important;
  font-size:14px!important;
  line-height:1.78!important;
  margin:20px 0 0!important;
}
body.motion-v7 #search .search-score .ring{
  width:155px!important;
  height:155px!important;
  margin:16px auto!important;
  border:12px solid rgba(64,105,170,.18)!important;
  background:conic-gradient(var(--sj-blue) 0 290deg,rgba(64,105,170,.11) 290deg 360deg)!important;
}
body.motion-v7 #search .search-score .ring::before{display:none!important}
body.motion-v7 #search .search-score .ring div{
  width:116px!important;
  height:116px!important;
  border-radius:50%!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  background:#102a42!important;
  color:#fff!important;
}
body.motion-v7 #search .search-score .ring b{color:#fff!important;font-size:36px!important}
body.motion-v7 #search .search-score .ring span{color:#dbe8f3!important;font-size:12px!important;line-height:1.45!important;max-width:80px!important}

body.motion-v7 #search .plan-tabs{
  padding:30px!important;
  background:linear-gradient(180deg,#173a5b,#102a42)!important;
  color:#fff!important;
}
body.motion-v7 #search .tab-btn{
  background:rgba(255,255,255,.07)!important;
  color:#d7e4ef!important;
  border:1px solid rgba(255,255,255,.15)!important;
}
body.motion-v7 #search .tab-btn.active{
  background:linear-gradient(135deg,var(--sj-blue),#5b88c3)!important;
  color:#fff!important;
  border-color:transparent!important;
}
body.motion-v7 #search #seoTabPanel h3,
body.motion-v7 #search .tab-panel h3{color:#fff!important}
body.motion-v7 #search #seoTabPanel p,
body.motion-v7 #search .tab-panel p{color:#d0deea!important}
body.motion-v7 #search .task-grid{
  border-color:rgba(255,255,255,.12)!important;
}
body.motion-v7 #search .task-grid span{
  background:rgba(255,255,255,.035)!important;
  color:#e3edf5!important;
  border-color:rgba(255,255,255,.12)!important;
}
body.motion-v7 #search .action-bar .action-btn{
  background:#0a2135!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.10)!important;
}
body.motion-v7 #search .action-bar .action-btn:hover{
  background:#214d75!important;
}

@media(max-width:1050px){
  body.motion-v7 #website .website-stage,
  body.motion-v7 #search .search-board{grid-template-columns:1fr!important}
  body.motion-v7 #website .included-card{border-right:0!important;border-bottom:1px solid rgba(40,75,109,.10)!important}
  body.motion-v7 #search .search-score{border-right:0!important;border-bottom:1px solid rgba(255,255,255,.14)!important}
}
@media(max-width:760px){
  body.motion-v7 #search .search-ladder{grid-template-columns:1fr 1fr!important}
  body.motion-v7 #website .included-card,
  body.motion-v7 #search .search-score,
  body.motion-v7 #search .plan-tabs{padding:24px!important}
  body.motion-v7 #website .website-promise{padding:16px!important}
}
@media(max-width:520px){
  body.motion-v7 #search .search-ladder{grid-template-columns:1fr!important}
}
