/* Paid-search feature, scoped to Services section six. */
.services-google { padding-block:58px; background:var(--color-surface); }
.services-google__layout { display:grid; grid-template-columns:.9fr 1.3fr; gap:32px; align-items:start; }
.services-google__feature { min-width:0; border-radius:18px; background:linear-gradient(135deg,#00103d,#001b82); overflow:hidden; }
.services-google__intro { padding:32px; }
main.uprango-services .services-google .services-google__intro .section-eyebrow { color:#67e8f9; }
main .services-google .services-google__intro h2 { color:#fff; margin:0 0 20px; }
main .services-google .services-google__intro .body-copy { color:#d4ddf0; margin:0; }
.services-google__image { display:block; width:100%; height:auto; }
.services-google__capabilities { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.services-google__capability { min-width:0; padding:22px; background:#fff; border:1px solid var(--color-border); border-top:3px solid var(--color-yellow); border-radius:10px; }
.services-google__number { display:block; color:#866000; font:800 12px var(--font-body); margin-bottom:12px; }
.services-google__capability h3 { color:var(--color-ink); margin:0 0 12px; }
.services-google__capability .body-copy { color:var(--color-body); margin:0; }
@media(max-width:1100px) { .services-google__layout { gap:24px; }.services-google__intro { padding:24px; }.services-google__capability { padding:18px; } }
@media(max-width:980px) { .services-google { padding-block:48px; }.services-google__layout { grid-template-columns:1fr; }.services-google__feature { display:grid; grid-template-columns:1fr 1fr; align-items:center; }.services-google__image { border-radius:12px; } }
@media(max-width:600px) { .services-google { padding-block:34px; }.services-google__feature,.services-google__capabilities { grid-template-columns:1fr; }.services-google__image { border-radius:0; max-height:300px; object-fit:contain; background:#f7f8fc; } }

/* Organic social feature, scoped to Services section five. */
.services-social { padding-block:58px; background:#fff; }
.services-social__feature { display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:64px; margin-bottom:36px; }
.services-social__intro { grid-column:2; grid-row:1; min-width:0; }
.services-social__intro h2 { margin:0 0 20px; color:var(--color-ink); }
.services-social__intro .body-copy { margin:0; color:var(--color-body); }
.services-social__image { grid-column:1; grid-row:1; width:100%; height:auto; max-width:460px; border-radius:18px; display:block; }
.services-social__capabilities { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:28px 24px; }
.services-social__capability { min-width:0; padding-top:18px; border-top:2px solid var(--color-border); }
.services-social__capability:nth-child(4n+1) { border-color:var(--color-primary-blue); }
.services-social__capability:nth-child(4n+2) { border-color:var(--color-primary-orange); }
.services-social__capability:nth-child(4n+3) { border-color:var(--color-green); }
.services-social__capability:nth-child(4n+4) { border-color:var(--color-yellow); }
.services-social__number { display:block; color:var(--color-primary-orange); font:800 12px var(--font-body); margin-bottom:12px; }
.services-social__capability h3 { margin:0 0 12px; color:var(--color-ink); }
.services-social__capability .body-copy { margin:0; color:var(--color-body); }
@media(max-width:1100px) { .services-social__capabilities { grid-template-columns:repeat(2,minmax(0,1fr)); }.services-social__feature { gap:32px; } }
@media(max-width:980px) { .services-social { padding-block:48px; } }
@media(max-width:700px) { .services-social__feature { grid-template-columns:1fr; gap:24px; }.services-social__intro,.services-social__image { grid-column:auto; grid-row:auto; }.services-social__image { max-width:400px; justify-self:center; } }
@media(max-width:600px) { .services-social { padding-block:34px; }.services-social__capabilities { grid-template-columns:1fr; gap:24px; } }

/* AI discovery feature, scoped to Services section four. */
.services-ai { padding-block:58px; background:var(--color-surface); }
.services-ai__feature { display:grid; grid-template-columns:1.1fr .9fr; align-items:center; gap:64px; margin-bottom:36px; }
.services-ai__intro { min-width:0; }
.services-ai__intro h2 { color:var(--color-ink); margin:0 0 20px; }
.services-ai__intro .body-copy { color:var(--color-body); margin:0; }
.services-ai__image { display:block; width:100%; max-width:440px; justify-self:end; height:auto; border-radius:18px; }
.services-ai__capabilities { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.services-ai__capability { display:flex; align-items:flex-start; gap:18px; min-width:0; padding:24px; border:1px solid var(--color-border); border-left:3px solid var(--color-green); border-radius:10px; background:#fff; }
.services-ai__number { flex:none; color:var(--color-green); font:800 12px/1.8 var(--font-body); }
.services-ai__capability h3 { margin:0 0 10px; color:var(--color-ink); }
.services-ai__capability .body-copy { color:var(--color-body); margin:0; }
.services-ai__capability:last-child { grid-column:1 / -1; background:linear-gradient(100deg,#eef8f7,#fff); }
@media(max-width:980px) { .services-ai { padding-block:48px; }.services-ai__feature { gap:28px; }.services-ai__capability { padding:20px; gap:12px; } }
@media(max-width:700px) { .services-ai__feature { grid-template-columns:1fr; gap:24px; }.services-ai__image { max-width:400px; justify-self:center; }.services-ai__capabilities { grid-template-columns:1fr; } }
@media(max-width:600px) { .services-ai { padding-block:34px; }.services-ai__capability { padding:20px 16px; } }

/* SEO feature: independent scope preserves the approved hero and portfolio. */
.services-seo { padding-block:58px; background:#fff; }
.services-seo__layout { display:grid; grid-template-columns:.9fr 1.3fr; align-items:start; gap:48px; }
.services-seo__intro { min-width:0; }
.services-seo__intro h2 { margin:0 0 20px; color:var(--color-ink); }
.services-seo__intro .body-copy { margin:0; color:var(--color-body); }
.services-seo__image { display:block; width:100%; height:auto; margin-top:28px; border-radius:16px; }
.services-seo__capabilities { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px 28px; }
.services-seo__capability { min-width:0; border-top:1px solid var(--color-border); padding-top:18px; }
.services-seo__number { display:block; margin-bottom:10px; color:var(--color-green); font:800 12px var(--font-body); letter-spacing:.08em; }
.services-seo__capability h3 { color:var(--color-ink); margin:0 0 10px; }
.services-seo__capability .body-copy { margin:0; color:var(--color-body); }
@media(max-width:1100px) { .services-seo__layout { gap:28px; grid-template-columns:.85fr 1.3fr; }.services-seo__capabilities { gap:22px; } }
@media(max-width:980px) { .services-seo { padding-block:48px; }.services-seo__layout { grid-template-columns:1fr; gap:32px; }.services-seo__image { max-width:540px; margin-inline:auto; } }
@media(max-width:600px) { .services-seo { padding-block:34px; }.services-seo__capabilities { grid-template-columns:1fr; gap:24px; } }

/* Services portfolio is scoped separately from the approved hero. */
.services-portfolio { padding-block:58px; background:var(--color-surface); }
.services-portfolio__intro { max-width:880px; margin-bottom:32px; }
.services-portfolio__intro h2 { margin:0 0 18px; color:var(--color-ink); }
.services-portfolio__intro .body-copy { margin:0; color:var(--color-body); }
.services-portfolio__grid { display:grid; grid-template-columns:1fr; gap:18px; }
.services-portfolio__card { display:grid; grid-template-columns:1fr 1.1fr; align-items:center; gap:36px; min-width:0; padding:26px 28px; border:1px solid var(--color-border); border-left:4px solid var(--service-accent); border-radius:12px; background:#fff; box-shadow:0 8px 24px #00103d06; }
.services-portfolio__summary { min-width:0; }
.services-portfolio__card--navy { --service-accent:#001b82; --service-ink:#001b82; }
.services-portfolio__card--teal { --service-accent:#0f766e; --service-ink:#0f766e; }
.services-portfolio__card--magenta { --service-accent:#e8007d; --service-ink:#e8007d; }
.services-portfolio__card--gold { --service-accent:#fbbf24; --service-ink:#866000; }
.services-portfolio__card--cyan { --service-accent:#67e8f9; --service-ink:#086978; }
.services-portfolio__card-top { display:flex; align-items:center; gap:14px; margin-bottom:14px; }
.services-portfolio__card-top h3 { margin:0; }
.services-portfolio__card-top .services-portfolio__number { margin-left:auto; }
.services-portfolio__icon { display:grid; place-items:center; width:50px; height:50px; border-radius:10px; color:var(--service-ink); background:color-mix(in srgb,var(--service-accent) 12%,white); }
.services-portfolio__icon svg { width:27px; height:27px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.services-portfolio__number { font:800 32px/1 var(--font-heading); color:color-mix(in srgb,var(--service-accent) 24%,white); }
.services-portfolio__card h3 { margin:0 0 14px; color:var(--color-ink); font:800 23px/1.2 var(--font-heading); letter-spacing:-.028em; }
.services-portfolio__card .body-copy { color:var(--color-body); margin:0; }
.services-portfolio__labels { list-style:none; padding:6px 0 6px 30px; margin:0; border-left:1px solid var(--color-border); display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 20px; }
.services-portfolio__labels li { display:flex; align-items:baseline; gap:9px; color:var(--color-body); font:500 12px/1.55 var(--font-body); }
.services-portfolio__labels li::before { content:""; flex:none; width:5px; height:5px; background:var(--service-accent); }
@media(max-width:1100px) { .services-portfolio__card { padding:22px; } }
@media(max-width:980px) { .services-portfolio { padding-block:48px; }.services-portfolio__card { gap:24px; }.services-portfolio__labels { padding-left:20px; } }
@media(max-width:800px) { .services-portfolio__card { grid-template-columns:1fr; gap:20px; }.services-portfolio__labels { border-left:0; border-top:1px solid var(--color-border); padding:18px 0 0; } }
@media(max-width:600px) { .services-portfolio { padding-block:34px; }.services-portfolio__card-top { flex-wrap:wrap; }.services-portfolio__card-top h3 { flex:1; font-size:20px; }.services-portfolio__number { display:none; }.services-portfolio__icon { flex:none; } }

@media(max-width:359px) { .services-portfolio__labels { grid-template-columns:1fr; } }

/* Reuse the shared FAQ master with a six-card desktop arrangement. */
@media(min-width:1101px) { .uprango-services .services-faqs__grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(min-width:641px) and (max-width:1100px) { .uprango-services .services-faqs__grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* Shared strategy diagram, scoped to Services section eight. */
.services-connected { padding-block:58px; background:var(--color-surface); }
.services-connected__intro { max-width:940px; margin-bottom:36px; }
.services-connected__intro h2 { margin:0 0 20px; color:var(--color-ink); }
.services-connected .body-copy { margin:0; color:var(--color-body); }
.services-connected__system { display:grid; grid-template-columns:260px minmax(0,1fr); align-items:center; gap:64px; }
.services-connected__hub { position:relative; padding:38px 28px; border:1px solid #ffffff25; border-radius:18px; background:radial-gradient(ellipse at 90% 100%,#0f766e66,transparent 70%),linear-gradient(135deg,#001b82,#00103d); color:#fff; box-shadow:0 18px 40px #00103d15; }
.services-connected__hub::after { content:""; position:absolute; left:100%; top:50%; width:33px; height:2px; background:#a7bdce; }
.services-connected__hub > span { display:grid; place-items:center; width:50px; height:50px; background:#67e8f91a; color:#67e8f9; border-radius:10px; margin-bottom:24px; }
.services-connected__hub svg { width:28px; height:28px; fill:none; stroke:currentColor; stroke-width:1.7; }
.services-connected__hub h3 { color:#fff; font:800 36px/1.05 var(--font-heading); margin:0 0 20px; letter-spacing:-.03em; }
.services-connected__hub p { color:#bdebf0; font:600 14px/1.7 var(--font-body); margin:0; }
.services-connected__roles { position:relative; list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.services-connected__roles::before { content:""; position:absolute; top:0; bottom:0; left:-32px; width:2px; background:#a7bdce; }
.services-connected__role { --channel-accent:#0f766e; position:relative; display:grid; grid-template-columns:230px minmax(0,1fr); align-items:center; gap:24px; padding:22px 26px; background:#fff; border:1px solid var(--color-border); border-left:3px solid var(--channel-accent); border-radius:10px; }
.services-connected__role::before { content:""; position:absolute; right:100%; top:50%; width:32px; height:2px; background:#a7bdce; }
.services-connected__role:nth-child(2) { --channel-accent:#67e8f9; }
.services-connected__role:nth-child(3) { --channel-accent:#e8007d; }
.services-connected__role:nth-child(4) { --channel-accent:#fbbf24; }
.services-connected__role:nth-child(5) { --channel-accent:#001b82; }
.services-connected__role h3 { margin:0 0 8px; color:var(--color-ink); }
.services-connected__label { margin:0; color:#0f766e; font:700 12px/1.5 var(--font-body); }
.services-connected .services-connected__closing { margin-top:30px; padding:22px 26px; border-left:3px solid #0f766e; background:#eaf3f4; border-radius:0 10px 10px 0; }
@media(max-width:1100px) { .services-connected__system { grid-template-columns:220px minmax(0,1fr); }.services-connected__role { grid-template-columns:1fr; gap:10px; } }
@media(max-width:980px) { .services-connected { padding-block:48px; } }
@media(max-width:700px) { .services-connected__system { grid-template-columns:1fr; gap:24px; }.services-connected__hub { padding:24px; }.services-connected__hub h3 br,.services-connected__hub p br { display:none; }.services-connected__hub h3 { font-size:28px; }.services-connected__hub > span { margin-bottom:16px; }.services-connected__hub::after { left:15px; top:100%; width:2px; height:24px; }.services-connected__roles { margin-left:32px; }.services-connected__roles::before { left:-17px; }.services-connected__role::before { width:17px; }.services-connected__role { padding:20px; } }
@media(max-width:600px) { .services-connected { padding-block:34px; } }

/* Paid-social feature, scoped to Services section seven. */
.services-facebook { padding-block:58px; background:#fff; }
.services-facebook__feature { display:grid; grid-template-columns:1.1fr 1fr; gap:56px; align-items:center; margin-bottom:36px; }
.services-facebook__intro { min-width:0; }
.services-facebook__intro h2 { color:var(--color-ink); margin:0 0 20px; }
.services-facebook__intro .body-copy { color:var(--color-body); margin:0; }
.services-facebook__visual { position:relative; align-self:stretch; width:100%; min-width:0; border-radius:18px; background:#00208b; }
.services-facebook__image { position:absolute; inset:0; display:block; width:100%; height:100%; padding:12px; box-sizing:border-box; object-fit:contain; }
.services-facebook__capabilities { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.services-facebook__capability { --paid-social-accent:#001b82; min-width:0; padding:22px; border:1px solid var(--color-border); border-top:3px solid var(--paid-social-accent); border-radius:10px; background:linear-gradient(155deg,#f5f8fc,#fff 65%); box-shadow:0 6px 20px #00103d05; }
.services-facebook__capability:nth-child(4n+2) { --paid-social-accent:#e8007d; }
.services-facebook__capability:nth-child(4n+3) { --paid-social-accent:#67e8f9; }
.services-facebook__capability:nth-child(4n+4) { --paid-social-accent:#0f766e; }
.services-facebook__number { display:block; color:#0f766e; font:800 12px var(--font-body); margin-bottom:14px; }
.services-facebook__capability h3 { color:var(--color-ink); margin:0 0 12px; }
.services-facebook__capability .body-copy { color:var(--color-body); margin:0; }
@media(max-width:1100px) { .services-facebook__capabilities { grid-template-columns:repeat(2,minmax(0,1fr)); }.services-facebook__feature { gap:30px; } }
@media(max-width:980px) { .services-facebook { padding-block:48px; } }
@media(max-width:700px) { .services-facebook__feature { grid-template-columns:1fr; gap:24px; }.services-facebook__visual { aspect-ratio:2 / 1; min-height:180px; } }
@media(max-width:600px) { .services-facebook { padding-block:34px; }.services-facebook__capabilities { grid-template-columns:1fr; }.services-facebook__capability { padding:20px; } }

.uprango-services-hero {
  color: #fff;
  background: radial-gradient(ellipse at 90% 85%,rgba(15,118,110,.2),transparent 45%),linear-gradient(115deg,#00103d 20%,#001b82);
}
.uprango-services-hero__layout {
  min-height: 460px; display:grid; grid-template-columns:1.15fr 1fr;
  align-items:center; gap:48px; padding-block:42px;
}
.uprango-services-hero__copy { min-width:0; }
.uprango-services-hero__copy .section-eyebrow { color:#67e8f9; margin:0 0 18px; }
.uprango-services-hero h1 { color:#fff; margin:0; font:800 clamp(2rem,3.3vw,2.75rem)/1.08 var(--font-heading); letter-spacing:-.035em; text-wrap:balance; }
.uprango-services-hero__copy .body-copy { color:#d4ddf0; margin:20px 0 24px; }
.uprango-services-hero__copy a { border-radius:10px; min-height:48px; }
.uprango-services-hero__network { position:relative; width:100%; height:340px; isolation:isolate; }
.uprango-services-hero__network svg { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.uprango-services-hero__network ellipse { stroke:rgba(103,232,249,.12); }
.uprango-services-hero__network ellipse { transform-origin:250px 170px; animation:service-orbit-turn 48s linear infinite; }
.uprango-services-hero__network ellipse:nth-child(2) { animation-direction:reverse; animation-duration:60s; }
@keyframes service-orbit-turn { to { transform:rotate(360deg); } }
@media(prefers-reduced-motion:reduce) { .uprango-services-hero__network ellipse { animation:none; } }
.uprango-services-hero__network path { stroke:rgba(103,232,249,.4); stroke-width:1.3; }
.uprango-services-hero__hub { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:152px; height:144px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:9px; border:1px solid rgba(103,232,249,.4); border-radius:24px; background:linear-gradient(140deg,#123989,#00103d); box-shadow:0 16px 45px #00103d80,inset 0 1px 0 #ffffff20; }
.uprango-services-hero__hub > span { color:#67e8f9; font:700 9px var(--font-body); letter-spacing:.16em; }
.uprango-services-hero__hub strong { font:800 27px/1.05 var(--font-heading); text-align:center; }
.uprango-services-hero__hub i { width:32px; height:3px; background:#e8007d; }
.uprango-services-hero__node { position:absolute; transform:translate(-50%,-50%); display:flex; align-items:center; justify-content:center; gap:10px; padding:16px 18px; border:1px solid #ffffff26; border-bottom:3px solid var(--channel); border-radius:10px; background:#09245c; box-shadow:0 12px 24px #00103d55; white-space:nowrap; }
.uprango-services-hero__node strong { font:700 13px var(--font-body); }
.uprango-services-hero__dot { width:8px; height:8px; background:var(--channel); border-radius:2px; box-shadow:0 0 12px color-mix(in srgb,var(--channel) 35%,transparent); }
.uprango-services-hero__node--1 { left:50%; top:12%; --channel:#67e8f9; }
.uprango-services-hero__node--2 { left:17%; top:35%; --channel:#0f766e; }
.uprango-services-hero__node--3 { left:83%; top:35%; --channel:#e8007d; }
.uprango-services-hero__node--4 { left:26%; top:82%; --channel:#fbbf24; }
.uprango-services-hero__node--5 { left:74%; top:82%; --channel:#67e8f9; }
@media(max-width:1100px) {
  .uprango-services-hero__layout { gap:24px; }
  .uprango-services-hero__node { padding:14px 10px; gap:7px; }
  .uprango-services-hero__node strong { font-size:12px; }
  .uprango-services-hero__hub { width:130px; height:130px; }
}
@media(max-width:800px) {
  .uprango-services-hero__layout { grid-template-columns:1fr; gap:24px; min-height:0; }
  .uprango-services-hero__network { max-width:500px; margin-inline:auto; }
  .uprango-services-hero h1 { max-width:660px; font-size:clamp(2rem,5.6vw,2.75rem); }
}
@media(max-width:480px) {
  .uprango-services-hero__layout { padding-block:34px; gap:18px; }
  .uprango-services-hero__network { height:280px; }
  .uprango-services-hero__hub { width:108px; height:112px; }
  .uprango-services-hero__hub strong { font-size:23px; }
  .uprango-services-hero__hub > span { font-size:8px; }
  .uprango-services-hero__node { padding:12px 8px; gap:5px; }
  .uprango-services-hero__node strong { font-size:10px; }
  .uprango-services-hero__dot { width:5px; height:5px; }
  .uprango-services-hero__node--3 { left:81%; }
  .uprango-services-hero__node--2 { left:16%; }
}