/* Google Ads page: shares the SEO page layout, plus the searches kept/blocked illustration. */
/* page-organic-seo-ranking-services: rules from the approved mockup that main.css does not already have */
.sec-head p{grid-column:8 / span 5;margin:0;color:var(--dim);max-width:46ch}
.aform .btn{justify-content:center}
.links a.cur{color:var(--ink)}
.hero .display{font-size:clamp(2.2rem,6.4vw,5.4rem)}
.contact-copy .display{font-size:clamp(2.2rem,5vw,4.4rem)}
.duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.card.vs{gap:18px}
.card.win{border-color:rgba(51,217,242,.4);background:linear-gradient(160deg,rgba(51,217,242,.1),var(--panel) 55%)}
.ticks{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px;color:var(--dim);font-size:15.5px}
.ticks li{display:flex;gap:12px;align-items:flex-start}
.ticks li::before{content:"";flex-shrink:0;width:7px;height:7px;margin-top:9px;border-radius:2px;background:var(--cyan);transform:rotate(45deg)}
.ticks.dim li::before{background:var(--mute)}
.split{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:center}
.split-copy{grid-column:1 / span 5;display:flex;flex-direction:column;gap:20px;min-width:0}
.split-copy p{margin:0;color:var(--dim);max-width:52ch}
.mappack{grid-column:7 / span 6;position:relative;display:flex;flex-direction:column;gap:10px;padding:20px;border-radius:24px;border:1px solid var(--line);background:var(--panel);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);min-width:0}
.mappack .q{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:999px;padding:11px 16px;font-size:15px;background:rgba(255,255,255,.03)}
.mappack .q svg{width:18px;height:18px;color:var(--dim)}
.mapbox{position:relative;height:150px;border-radius:14px;overflow:hidden;border:1px solid var(--line); background:linear-gradient(90deg,rgba(150,170,230,.07) 1px,transparent 1px) 0 0/28px 28px,linear-gradient(rgba(150,170,230,.07) 1px,transparent 1px) 0 0/28px 28px, linear-gradient(115deg,transparent 46%,rgba(150,170,230,.16) 46.5% 49%,transparent 49.5%),linear-gradient(20deg,transparent 60%,rgba(150,170,230,.12) 60.5% 62.5%,transparent 63%),#0a1020}
.mapbox .p{position:absolute;width:28px;height:28px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);display:grid;place-items:center;font-style:normal;font-family:var(--mono);font-size:12px;background:var(--bar,#3b4466);color:var(--ink)}
.mapbox .p1{left:42%;top:30%;background:var(--cyan);color:#04050b;box-shadow:0 0 18px var(--cyan)}
.mapbox .p2{left:18%;top:52%}
.mapbox .p3{left:70%;top:58%}
.mapbox .p{line-height:1}
.lst{display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px;align-items:center;padding:10px 12px;border-radius:12px;border:1px solid transparent}
.lst b{font-family:var(--mono);font-size:13px;color:var(--mute)}
.lst div{display:flex;flex-direction:column;gap:5px;min-width:0}
.lst strong{font-family:var(--display);font-size:14px}
.lst span{font-size:12.5px;color:var(--dim)}
.lst .bar{display:block;height:8px;width:60%;border-radius:4px;background:rgba(154,162,186,.25)}
.lst .bar.s{width:40%}
.lst.you{border-color:rgba(51,217,242,.45);background:linear-gradient(90deg,rgba(51,217,242,.12),rgba(224,75,240,.06))}
.lst.you b{color:var(--cyan)}
.mappack .ill{position:absolute;bottom:12px;right:16px;font-size:10px;color:var(--mute)}
.six{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.six .card{gap:12px}
.six .card p,.steps .card p{font-size:14.5px}
.six .tag{align-self:flex-start}
.steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.steps .card{gap:12px}
.steps .n{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--cyan)}
.pkgs{grid-template-columns:repeat(3,minmax(0,1fr))}
.truths{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.truths.slim{margin-top:28px}
.truth{display:grid;grid-template-columns:56px minmax(0,1fr);gap:18px;align-items:start;padding-block:22px;border-bottom:1px solid var(--line)}
.truth .x{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-size:22px;color:#ff8a5c;border:1px solid rgba(255,138,92,.45);background:rgba(255,106,31,.08)}
.truth h3{margin-bottom:8px}
.truth p{margin:0;color:var(--dim);max-width:70ch}
.qa mark,.pkg mark{background:rgba(224,75,240,.18);color:var(--ink);border-radius:4px;padding:0 4px}
@media (max-width:1080px){
  .six{grid-template-columns:repeat(2,minmax(0,1fr))}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  .split-copy,.mappack,.searchbox{grid-column:1 / -1}
  .duo,.pkgs{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
  .six,.steps{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:860px){
  .hero-copy,.sec-head .t,.sec-head p,.seo-copy,.serp,.addons-copy,.contact-copy,.rb-form,.audit-copy,.aform,.faq-head,.faq-list{grid-column:1 / -1}
}

.searchbox{grid-column:7 / span 6;position:relative;display:flex;flex-direction:column;gap:8px;padding:20px 20px 38px;border-radius:24px;border:1px solid var(--line);background:var(--panel);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);min-width:0}
.searchbox .q{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:999px;padding:11px 16px;font-size:15px;background:rgba(255,255,255,.03);margin-bottom:6px}
.searchbox .q svg{width:18px;height:18px;color:var(--dim)}
.sr{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 14px;border-radius:12px;border:1px solid transparent;font-size:14px}
.sr b{font-family:var(--mono);font-size:14px;text-align:center}
.sr span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sr em{font-style:normal;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase}
.sr.keep{border-color:rgba(51,217,242,.45);background:linear-gradient(90deg,rgba(51,217,242,.12),rgba(224,75,240,.06))}
.sr.keep b,.sr.keep em{color:var(--cyan)}
.sr.cut{color:var(--mute)}
.sr.cut span{text-decoration:line-through;text-decoration-color:rgba(224,75,240,.6)}
.sr.cut b,.sr.cut em{color:var(--magenta)}
.searchbox .ill{position:absolute;bottom:12px;right:16px;font-size:10px;color:var(--mute)}
