/* Service page template (Phase 7, 2026-11-11). Loaded only on /services/<slug>. */
/* ---------- Service page ---------- */
#hero.svc-hero { position:relative; height:auto; min-height:86vh; display:block; padding:160px 0 90px; overflow:hidden; isolation:isolate; background:radial-gradient(circle at 85% 20%, rgba(255,102,0,.16), transparent 38%), linear-gradient(140deg,#030727,#07133f 55%,#101d5c); color:#fff; }
#hero.svc-hero > .container { width:100%; }
#hero.svc-hero::after { content:""; position:absolute; left:0; right:0; bottom:0; z-index:1; height:120px; background:linear-gradient(to bottom, rgba(255,255,255,0), #fff); pointer-events:none; opacity:.0; }
#hero.svc-hero .crumbs { margin-bottom:22px; color:rgba(255,255,255,.72); font-size:13px; }
#hero.svc-hero .crumbs a { color:rgba(255,255,255,.84); } #hero.svc-hero .crumbs a:hover { color:#ff8b3d; }
#hero.svc-hero .eyebrow { display:block; margin-bottom:22px; color:#ff8b3d; font-size:12px; font-weight:900; letter-spacing:.18em; }
#hero.svc-hero p.lead { max-width:640px; margin:0 0 30px; color:rgba(255,255,255,.84); font-size:17px; line-height:1.7; }
.btn-quote { display:inline-flex; align-items:center; gap:14px; padding:14px 22px; border-radius:10px; background:#c2410c; color:#fff; font-size:13px; font-weight:700; transition:transform .2s ease, box-shadow .2s ease, background .2s ease; }
.btn-quote:hover { color:#fff; background:#a8380a; transform:translateY(-3px); box-shadow:0 12px 28px rgba(194,65,12,.3); }
.btn-quote i { transition:transform .25s cubic-bezier(.22,1,.36,1); } .btn-quote:hover i { transform:translateX(4px); }
html { scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } }
.spec-table tr { transition:background .2s ease; } .spec-table tr:hover td { background:#fffaf6; }
.svc-card i { transition:transform .35s cubic-bezier(.22,1,.36,1), background .35s ease, color .35s ease; }
.svc-card:hover i { transform:translateY(-3px) rotate(-6deg); background:#ff6600; color:#fff; }
.btn-ghost { display:inline-flex; align-items:center; gap:10px; margin-left:12px; padding:13px 20px; border:1px solid rgba(255,255,255,.35); border-radius:10px; color:#fff; font-size:13px; font-weight:700; }
.btn-ghost:hover { color:#fff; border-color:#ff8b3d; }

.svc-body { padding:80px 0 90px; background:#fff; }
.svc-layout { display:grid; grid-template-columns:230px minmax(0,1fr); gap:56px; align-items:start; }
.svc-toc { position:sticky; top:110px; padding:18px; border:1px solid #e0e6ef; border-radius:18px; background:#f7f9fc; }
.svc-toc p { margin:0 0 10px; color:#07133f; font-size:12px; font-weight:900; letter-spacing:.14em; }
.svc-toc a { display:block; padding:8px 10px; border-radius:8px; color:#3b4660; font-size:14px; font-weight:600; transition:background .2s ease, color .2s ease; }
.svc-toc a:hover, .svc-toc a.is-active { background:#fff1e8; color:#c2410c; }
.svc-toc .btn-quote { width:100%; justify-content:center; margin-top:14px; color:#fff; }
.svc-toc .btn-quote:hover { color:#fff; background:#a8380a; }
.svc-section { padding-bottom:56px; scroll-margin-top:110px; }
.svc-section + .svc-section { padding-top:56px; border-top:1px solid #e7ebf1; }
.svc-section h2 { margin:0 0 16px; color:#07133f; font:700 clamp(28px,3vw,40px)/1.1 "Raleway",sans-serif; letter-spacing:-.035em; }
.svc-section p { color:#566178; font-size:15px; line-height:1.8; }
.svc-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:24px; }
.svc-card { padding:24px; border:1px solid #e0e6ef; border-radius:18px; background:#fff; box-shadow:0 16px 42px rgba(7,19,63,.06); transition:transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s ease; }
.svc-card:hover { transform:translateY(-4px); box-shadow:0 26px 60px rgba(7,19,63,.12); }
.svc-card i { display:grid; place-items:center; width:48px; height:48px; margin-bottom:16px; border-radius:14px; background:#fff1e8; color:#ff6600; font-size:24px; }
.svc-card h3 { margin:0 0 8px; color:#07133f; font:700 19px "Raleway",sans-serif; }
.svc-card p { margin:0; font-size:14px; line-height:1.7; }
.spec-table { width:100%; margin-top:10px; border-collapse:separate; border-spacing:0; overflow:hidden; border:1px solid #e0e6ef; border-radius:16px; }
.spec-table th, .spec-table td { padding:14px 18px; border-bottom:1px solid #e7ebf1; font-size:14px; vertical-align:top; }
.spec-table tr:last-child th, .spec-table tr:last-child td { border-bottom:0; }
.spec-table th { width:38%; background:#f7f9fc; color:#07133f; font-weight:700; }
.spec-table td { color:#3b4660; }
.ph { display:inline-block; padding:2px 8px; border:1px dashed #c2410c; border-radius:6px; background:#fff7f1; color:#a8380a; font-size:12px; font-weight:700; }
.chips { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.chips a { padding:9px 15px; border:1px solid #dfe5ee; border-radius:999px; color:#07133f; font-size:13px; font-weight:600; transition:border-color .2s ease, color .2s ease; }
.chips a:hover { border-color:#c2410c; color:#c2410c; }
.faq details { margin-top:12px; border:1px solid #e0e6ef; border-radius:14px; background:#fff; }
.faq summary { position:relative; padding:18px 52px 18px 20px; color:#07133f; font:700 16px "Raleway",sans-serif; cursor:pointer; list-style:none; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:"+"; position:absolute; right:20px; top:14px; color:#c2410c; font-size:22px; font-weight:400; transition:transform .2s ease; }
.faq details[open] summary::after { transform:rotate(45deg); }
.faq details p { margin:0; padding:0 20px 18px; }

.svc-related { padding:80px 0; background:linear-gradient(140deg,#030727,#07133f); }
.svc-related h2 { margin:0 0 28px; color:#fff; font:700 clamp(28px,3vw,40px) "Raleway",sans-serif; letter-spacing:-.035em; }
.svc-related .svc-card { border-color:rgba(255,255,255,.1); background:rgba(255,255,255,.04); box-shadow:none; }
.svc-related .svc-card h3 { color:#fff; } .svc-related .svc-card p { color:rgba(255,255,255,.72); }
.svc-related .svc-card i { background:rgba(255,102,0,.14); }
.svc-related a.svc-card:hover { border-color:rgba(255,139,61,.5); }
.svc-cta { padding:56px 0; background:#fff1e8; }
.svc-cta .inner { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px; }
.svc-cta h2 { margin:0 0 6px; color:#07133f; font:700 30px "Raleway",sans-serif; letter-spacing:-.03em; }
.svc-cta p { margin:0; color:#566178; }

@media (max-width:991px) {
  .svc-layout { grid-template-columns:minmax(0,1fr); gap:24px; }
  .svc-toc { position:sticky; top:72px; z-index:5; display:flex; gap:6px; overflow-x:auto; padding:8px; border-radius:14px; white-space:nowrap; }
  .svc-toc p, .svc-toc .btn-quote { display:none; }
  .svc-cards { grid-template-columns:1fr 1fr; }
}
@media (max-width:575px) {
  #hero.svc-hero { min-height:0; padding:120px 0 54px; }
  .btn-ghost { margin:12px 0 0; }
  .svc-cards { grid-template-columns:1fr; }
  .spec-table th { width:45%; }
}
@media (prefers-reduced-motion: reduce) { .svc-card, .btn-quote { transition:none; } }

/* ---------- 2. How it works ---------- */
.how { position:relative; padding:24px; border:1px solid #e0e6ef; border-radius:20px; background:linear-gradient(160deg,#f7f9fc,#fff); }
.how svg { display:block; width:100%; height:auto; }
.how .track { stroke:#dfe5ee; }
.how .progress { stroke:#ff6600; stroke-dasharray:1200; stroke-dashoffset:1200; transition:stroke-dashoffset 2.6s cubic-bezier(.65,0,.35,1); }
.how.in-view .progress { stroke-dashoffset:0; }
.how .node circle.ring { fill:#fff; stroke:#e0e6ef; stroke-width:2; transition:stroke .4s ease, fill .4s ease; }
.how .node text { fill:#07133f; font:700 15px "Raleway",sans-serif; text-anchor:middle; }
.how .node .ico { fill:none; stroke:#07133f; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; transition:stroke .4s ease; }
.how.in-view .node circle.ring { stroke:#ff6600; fill:#fff1e8; }
.how.in-view .node .ico { stroke:#c2410c; }
.how.in-view .node.n2 circle.ring, .how.in-view .node.n2 .ico { transition-delay:.7s; }
.how.in-view .node.n3 circle.ring, .how.in-view .node.n3 .ico { transition-delay:1.4s; }
.how.in-view .node.n4 circle.ring, .how.in-view .node.n4 .ico { transition-delay:2.1s; }
.how .packet { opacity:0; } .how.in-view .packet { opacity:1; }
.how-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin:20px 0 0; padding:0; counter-reset:step; }
.how-steps li { position:relative; padding:18px 18px 18px 52px; border-radius:14px; background:#fff; border:1px solid #e7ebf1; list-style:none; color:#566178; font-size:14px; line-height:1.6; }
.how-steps li::before { counter-increment:step; content:counter(step); position:absolute; left:16px; top:16px; display:grid; place-items:center; width:26px; height:26px; border-radius:50%; background:#07133f; color:#fff; font:700 13px "Raleway",sans-serif; }
.how-steps strong { display:block; margin-bottom:4px; color:#07133f; font-family:"Raleway",sans-serif; }

/* ---------- 3. Quote form ---------- */
.svc-quote { padding:90px 0; background:linear-gradient(180deg,#fff1e8,#fff 70%); }
.quote-grid { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:48px; align-items:start; }
.quote-copy .eyebrow { display:block; margin-bottom:12px; color:#c2410c; font-size:12px; font-weight:900; letter-spacing:.18em; }
.quote-copy h2 { margin:0 0 16px; color:#07133f; font:700 clamp(30px,3.4vw,46px)/1.08 "Raleway",sans-serif; letter-spacing:-.04em; }
.quote-copy p { color:#566178; font-size:15px; line-height:1.8; }
.quote-contact { margin:26px 0 0; padding:0; list-style:none; }
.quote-contact li { display:flex; gap:12px; align-items:center; margin-bottom:12px; color:#07133f; font-weight:600; }
.quote-contact a { color:#07133f; } .quote-contact a:hover { color:#c2410c; }
.quote-contact i { display:grid; place-items:center; width:40px; height:40px; border-radius:12px; background:#fff; color:#ff6600; font-size:19px; box-shadow:0 10px 24px rgba(7,19,63,.08); }
.quote-card { padding:30px; border:1px solid #e0e6ef; border-radius:20px; background:#fff; box-shadow:0 30px 65px rgba(7,19,63,.12); }
.quote-card .row2 { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.quote-card label { display:block; margin:0 0 6px; color:#07133f; font-size:13px; font-weight:700; }
.quote-card label .opt { color:#8a94a6; font-weight:400; }
.quote-card input, .quote-card select, .quote-card textarea { width:100%; margin-bottom:14px; padding:12px 14px; border:1px solid #dfe5ee; border-radius:10px; background:#f7f9fc; color:#07133f; font-size:14px; transition:border-color .2s ease, background .2s ease, box-shadow .2s ease; }
.quote-card input:focus, .quote-card select:focus, .quote-card textarea:focus { outline:none; border-color:#c2410c; background:#fff; box-shadow:0 0 0 4px rgba(194,65,12,.12); }
.quote-card .btn-quote { width:100%; justify-content:center; border:0; cursor:pointer; font-size:14px; }
.quote-card .note { margin:12px 0 0; color:#8a94a6; font-size:12px; text-align:center; }
.quote-done { display:none; padding:30px 10px; text-align:center; }
.quote-done i { color:#16a34a; font-size:48px; }
.quote-card.is-sent form { display:none; } .quote-card.is-sent .quote-done { display:block; }

@media (max-width:991px) {
  #hero.svc-hero .hero-grid { grid-template-columns:minmax(0,1fr); }
  .how-steps { grid-template-columns:1fr 1fr; }
  .quote-grid { grid-template-columns:minmax(0,1fr); gap:30px; }
}
@media (max-width:575px) {
  .how { padding:14px; }
  .how-steps, .quote-card .row2 { grid-template-columns:minmax(0,1fr); }
  .quote-card { padding:22px; }
}
@media (prefers-reduced-motion: reduce) {
  .how .progress { transition:none; }
}
.chips { margin:18px 0 0; padding:0; list-style:none; }
.chips li { padding:9px 15px; border:1px solid #dfe5ee; border-radius:999px; color:#07133f; font-size:13px; font-weight:600; }
.quote-error { min-height:0; margin:0 0 10px; color:#b91c1c; font-size:13px; font-weight:600; }
.quote-error:empty { display:none; }
.quote-done:focus { outline:none; }
.svc-related .scroll-word-reveal { margin:0 0 28px; color:#fff; font:700 clamp(28px,3vw,40px) "Raleway",sans-serif; letter-spacing:-.035em; }

/* Hero stats bar */
#hero.svc-hero .hero-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); max-width:860px; margin:48px 0 0; padding:0; list-style:none; border:1px solid rgba(255,255,255,.12); border-radius:20px; background:linear-gradient(135deg,rgba(255,255,255,.07),rgba(255,255,255,.02)); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); box-shadow:0 24px 60px rgba(2,6,35,.35), inset 0 1px 0 rgba(255,255,255,.08); overflow:hidden; }
#hero.svc-hero .hero-stats li { position:relative; padding:24px 26px 22px; }
#hero.svc-hero .hero-stats li + li::before { content:""; position:absolute; left:0; top:22px; bottom:22px; width:1px; background:linear-gradient(to bottom,transparent,rgba(255,255,255,.18),transparent); }
#hero.svc-hero .hero-stats strong { display:flex; align-items:baseline; gap:2px; color:#fff; font-family:"Raleway",sans-serif; font-weight:700; font-size:clamp(30px,2.8vw,40px); line-height:1; letter-spacing:-.02em; font-variant-numeric:lining-nums tabular-nums; font-feature-settings:"lnum" 1,"tnum" 1; }
#hero.svc-hero .hero-stats .unit { color:#ff8b3d; font-size:.62em; font-weight:700; letter-spacing:0; }
#hero.svc-hero .hero-stats .label { display:block; margin-top:12px; color:rgba(255,255,255,.66); font:700 11px/1.45 "Open Sans",sans-serif; letter-spacing:.12em; text-transform:uppercase; }
#hero.svc-hero .hero-stats li::after { content:""; position:absolute; left:26px; bottom:0; width:28px; height:2px; border-radius:2px; background:#ff6600; opacity:.0; transform:scaleX(0); transform-origin:left; transition:opacity .4s ease, transform .5s cubic-bezier(.22,1,.36,1); }
#hero.svc-hero .hero-stats li:hover::after { opacity:1; transform:scaleX(1); }
@media (max-width:767px) {
  #hero.svc-hero .hero-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #hero.svc-hero .hero-stats li { padding:20px 18px; }
  #hero.svc-hero .hero-stats li:nth-child(3)::before { display:none; }
  #hero.svc-hero .hero-stats li:nth-child(n+3) { border-top:1px solid rgba(255,255,255,.1); }
}

/* Photos */
.overview-grid { display:block; }
.has-figure .overview-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:34px; align-items:start; }
.svc-figure, .photo-strip figure { position:relative; margin:0; overflow:hidden; border-radius:18px; background:#eef2f8; box-shadow:0 22px 50px rgba(7,19,63,.14); }
.svc-figure img, .photo-strip img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.22,1,.36,1); }
.svc-figure img { aspect-ratio:4/3.4; }
.svc-figure:hover img, .photo-strip figure:hover img { transform:scale(1.05); }
.svc-figure figcaption, .photo-strip figcaption { position:absolute; left:12px; right:12px; bottom:12px; padding:9px 13px; border-radius:10px; background:rgba(7,19,63,.72); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); color:#fff; font-size:12.5px; font-weight:600; line-height:1.4; }
.svc-photos { padding-top:0 !important; border-top:0 !important; }
.photo-strip { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.photo-strip figure { aspect-ratio:16/10; }
@media (max-width:767px) {
  .has-figure .overview-grid, .photo-strip { grid-template-columns:minmax(0,1fr); }
}
@media (prefers-reduced-motion: reduce) { .svc-figure img, .photo-strip img { transition:none; } }

/* Single-column body (side menu removed) */
.svc-layout.svc-layout--single { display:block; max-width:1040px; margin:0 auto; }
.svc-layout--single .svc-cards { grid-template-columns:repeat(3,minmax(0,1fr)); }
@media (max-width:991px) { .svc-layout--single .svc-cards { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:575px) { .svc-layout--single .svc-cards { grid-template-columns:minmax(0,1fr); } }

/* How-it-works diagram v2: navy panel, neural mesh, looping packets (2026-11-12) */
.how { overflow:hidden; border:0; background:radial-gradient(circle at 30% 20%,rgba(62,92,211,.35),transparent 55%),linear-gradient(150deg,#050a36,#07133f 60%,#0a1d52); box-shadow:0 24px 55px rgba(7,19,63,.18); }
.how-net { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.how svg { position:relative; }
.how .track { stroke:rgba(255,255,255,.12); }
.how .progress { stroke:#ff6600; opacity:.35; }
.how .flow { stroke:#ff8b3d; stroke-dasharray:6 18; opacity:0; animation:howFlow 1.2s linear infinite; transition:opacity .6s ease 2.4s; }
.how.in-view .flow { opacity:.9; }
@keyframes howFlow { to { stroke-dashoffset:-24; } }
.how .packet { opacity:0; transition:opacity .5s ease 2.6s; } .how.in-view .packet { opacity:1; }
.how .packet-glow { fill:rgba(255,102,0,.25); } .how .packet-core { fill:#fff; stroke:#ff6600; stroke-width:3; }
.how .node circle.ring { fill:#0b1a4d; stroke:rgba(255,255,255,.2); }
.how.in-view .node circle.ring { fill:#0e2160; stroke:#ff6600; }
.how .node .ico { stroke:rgba(255,255,255,.7); }
.how.in-view .node .ico { stroke:#ff9a55; }
.how .node text { fill:#fff; }
.how .pulse { fill:none; stroke:#ff6600; stroke-width:2; opacity:0; transform-box:fill-box; transform-origin:center; }
.how.in-view .pulse { animation:howPulse 3.3s cubic-bezier(.22,1,.36,1) infinite; }
.how.in-view .pulse.p2 { animation-delay:.9s; } .how.in-view .pulse.p3 { animation-delay:1.9s; } .how.in-view .pulse.p4 { animation-delay:2.7s; }
@keyframes howPulse { 0% { transform:scale(1); opacity:.7; } 70%,100% { transform:scale(1.7); opacity:0; } }
@media (prefers-reduced-motion: reduce) {
  .how .flow, .how.in-view .pulse { animation:none; }
  .how .packet { display:none; }
}
.how .node .ico { stroke-width:1.8; } .how .node .ico .f { fill:rgba(255,255,255,.7); stroke:none; transition:fill .4s ease; }
.how.in-view .node .ico .f { fill:#ff9a55; }

/* Plans: pixel cards (2026-11-12) */
.pixel-card { position:relative; overflow:hidden; isolation:isolate; outline:none; -webkit-tap-highlight-color:transparent; }
.pixel-card-canvas { position:absolute; inset:0; z-index:0; display:block; width:100%; height:100%; pointer-events:none; }
.pixel-card > :not(.pixel-card-canvas) { position:relative; z-index:1; }
.plan-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:26px 14px; align-items:stretch; padding-top:16px; }
.plan-card { --plan:#07133f; --plan-tint:#f5f8fc; display:flex; flex-direction:column; overflow:visible; border-radius:18px; background:linear-gradient(180deg,var(--plan-tint),#fff 70%); box-shadow:0 18px 40px -22px rgba(7,19,63,.35); text-align:center; transition:transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s; }
.plan-card .pixel-card-canvas { border-radius:inherit; }
.plan-card::after { content:""; position:absolute; inset:0; z-index:2; border-radius:inherit; box-shadow:inset 0 0 0 1px rgba(7,19,63,.08); pointer-events:none; transition:box-shadow .26s; }
.plan-card[data-active]::after { box-shadow:inset 0 0 0 1.5px var(--plan); }
.plan-card:hover { transform:translateY(-4px); box-shadow:0 26px 52px -22px rgba(7,19,63,.45); }
.plan-body { flex:1; display:flex; flex-direction:column; padding:0 14px 16px; }
.svc-plans .plan-ribbon { position:relative; z-index:3; align-self:center; margin:-16px 0 14px; padding:7px 18px; border-radius:0 0 10px 10px; background:var(--plan); color:#fff; font:800 15px "Raleway",sans-serif; letter-spacing:.04em; text-transform:uppercase; box-shadow:0 8px 18px -8px var(--plan); }
.plan-tag { position:absolute; top:-10px; right:-14px; padding:3px 8px; border-radius:999px; background:#fff; color:var(--plan); font-size:9.5px; font-weight:800; letter-spacing:.12em; box-shadow:0 4px 10px rgba(7,19,63,.2); }
.svc-plans .plan-users { margin:0 0 12px; color:#566178; font-size:13px; }
.svc-plans .plan-users strong { color:var(--plan); font-size:15px; }
.plan-acts { display:grid; grid-template-columns:1fr 1fr; grid-auto-rows:min-content; align-content:start; gap:6px 8px; min-height:94px; margin:0 0 12px; padding:0; list-style:none; text-align:left; }
.plan-acts li { display:flex; align-items:center; gap:5px; color:#566178; font-size:11px; line-height:1.25; }
.plan-acts i { flex:none; color:var(--plan); font-size:15px; }
.svc-plans .plan-label { margin:2px 0 8px; color:#07133f; font:700 13px "Raleway",sans-serif; }
.plan-speeds { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.plan-speeds div { display:flex; flex-direction:column; overflow:hidden; border-radius:8px; background:#fff; box-shadow:0 4px 12px rgba(7,19,63,.1); }
.plan-speeds strong { padding-top:7px; color:#07133f; font:700 26px/1 "Raleway",sans-serif; font-variant-numeric:lining-nums; letter-spacing:-.03em; }
.plan-speeds small { color:#566178; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.plan-speeds span { margin-top:6px; padding:4px 0; background:var(--plan); color:#fff; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.svc-plans .plan-data { margin:12px -14px 0; padding:9px 12px; background:var(--plan); color:#fff; font-size:13px; }
.svc-plans .plan-data strong { font:800 17px "Raleway",sans-serif; font-variant-numeric:lining-nums; font-feature-settings:'lnum' 1; margin-left:4px; }
.plan-card strong { font-variant-numeric:lining-nums; font-feature-settings:'lnum' 1; }
.plan-hours { display:flex; align-items:center; justify-content:center; gap:10px; margin:12px 0 14px; text-align:left; }
.plan-hours i { color:var(--plan); font-size:32px; }
.svc-plans .plan-hours p { margin:0; color:#566178; font-size:11.5px; line-height:1.45; }
.plan-hours strong { color:var(--plan); font-size:13px; }
.plan-cta, .plan-cta:hover { text-decoration:none; }
.plan-cta { margin-top:auto; display:inline-flex; justify-content:center; align-items:center; gap:6px; padding:11px 16px; border-radius:10px; background:var(--plan); color:#fff; font-size:13px; font-weight:700; transition:filter .25s, transform .25s; }
.plan-cta:hover, .plan-cta:focus-visible { color:#fff; filter:brightness(.9); transform:translateY(-2px); }
.svc-plans .plan-note { margin:18px 0 0; color:#687487; font-size:12.5px; }
@media (max-width:991px) { .plan-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px 16px; } }
@media (max-width:575px) { .plan-grid { grid-template-columns:minmax(0,1fr); max-width:340px; margin:0 auto; } }
@media (prefers-reduced-motion: reduce) { .plan-card, .plan-cta { transition:none; } .plan-card:hover { transform:none; } }
.plan-card > .plan-body { z-index:3; }

/* Plan extras: partner logos + fair usage policy (2026-11-12) */
.plan-extras { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:16px; margin-top:26px; }
.plan-partners, .plan-policy { border-radius:18px; padding:26px 28px; }
.plan-partners { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; background:radial-gradient(circle at 80% 10%,rgba(62,92,211,.45),transparent 55%),linear-gradient(150deg,#050a36,#07133f 60%,#0a1d52); color:rgba(255,255,255,.78); }
.plan-partners .eyebrow { margin-bottom:10px; color:#ff9a55; font-size:12px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
.plan-partners img { display:block; width:min(300px,100%); height:auto; margin:0 0 10px -10px; }
.svc-plans .plan-partners p { margin:0; color:rgba(255,255,255,.75); font-size:14px; }
.plan-policy { display:flex; align-items:center; gap:22px; border:1px solid #e0e6ef; background:#f7f9fc; }
.plan-policy img { flex:none; width:132px; height:132px; border-radius:12px; background:#fff; box-shadow:0 10px 24px -12px rgba(7,19,63,.35); image-rendering:pixelated; }
.svc-plans .plan-policy h3 { margin:0 0 6px; color:#07133f; font:700 21px "Raleway",sans-serif; letter-spacing:-.02em; }
.svc-plans .plan-policy p { margin:0 0 12px; font-size:14px; line-height:1.6; }
.plan-policy-link { display:inline-flex; align-items:center; gap:6px; color:#c2410c; font-size:13px; font-weight:700; text-decoration:none; }
.plan-policy-link:hover { color:#9a3412; text-decoration:underline; }
@media (max-width:767px) { .plan-extras { grid-template-columns:minmax(0,1fr); } }
@media (max-width:420px) { .plan-policy { flex-direction:column; align-items:flex-start; } }

/* Overview as photo banner (2026-11-12) */
.ov-pill { display:inline-flex; align-items:center; gap:6px; margin-bottom:14px; padding:7px 14px; border-radius:999px; background:#eef3ff; color:#3b54d6; font-size:13px; font-weight:700; }
.ov-pill i { font-size:16px; }
.ov-hero { position:relative; margin:22px 0 34px; overflow:hidden; border-radius:22px; box-shadow:0 30px 65px -30px rgba(7,19,63,.45); }
.ov-hero img { display:block; width:100%; height:auto; aspect-ratio:1100/418; object-fit:cover; transform:scale(1.04); transition:transform 1.2s cubic-bezier(.22,1,.36,1); }
.ov-hero[data-aos].aos-animate img, .ov-hero:not([data-aos]) img { transform:none; }
.ov-hero::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(7,19,63,0) 55%,rgba(7,19,63,.55)); pointer-events:none; }
.ov-stat { position:absolute; z-index:2; display:flex; flex-direction:column; padding:12px 16px; border:1px solid rgba(255,255,255,.55); border-radius:14px; background:rgba(255,255,255,.82); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:0 16px 34px -14px rgba(7,19,63,.45); animation:ovFloat 6s ease-in-out infinite; }
.ov-stat strong { color:#07133f; font:700 26px/1.05 "Raleway",sans-serif; font-variant-numeric:lining-nums; font-feature-settings:'lnum' 1; letter-spacing:-.03em; }
.ov-stat span { color:#566178; font-size:12px; font-weight:600; }
.ov-stat--1 { top:22px; left:46%; }
.ov-stat--2 { top:42%; right:24px; animation-delay:-3s; }
@keyframes ovFloat { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-8px); } }
.ov-badges { position:absolute; z-index:2; left:22px; bottom:20px; display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; list-style:none; }
.ov-badges li { display:flex; align-items:center; gap:7px; padding:8px 13px; border-radius:10px; background:#ff6600; color:#fff; font-size:12.5px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; box-shadow:0 10px 22px -10px rgba(255,102,0,.8); }
.ov-badges i { font-size:18px; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.ov-body { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:44px; align-items:start; }
.ov-copy p:first-child { color:#07133f; font-size:18px; line-height:1.7; }
.ov-side { padding:24px; border:1px solid #e0e6ef; border-radius:18px; background:#f7f9fc; }
.svc-section .ov-side h3 { margin:0 0 12px; color:#07133f; font:700 13px "Raleway",sans-serif; letter-spacing:.14em; text-transform:uppercase; }
.ov-chips { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 22px; padding:0; list-style:none; }
.ov-chips li { display:flex; align-items:center; gap:6px; padding:7px 12px; border:1px solid #dfe5ee; border-radius:999px; background:#fff; color:#07133f; font-size:13px; font-weight:600; }
.ov-chips i { color:#c2410c; font-size:16px; }
.ov-contact { display:grid; gap:8px; margin-bottom:18px; }
.ov-contact a { display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:10px; background:#fff; border:1px solid #e7ebf1; color:#07133f; font-size:14px; font-weight:600; text-decoration:none; transition:border-color .2s, transform .2s; }
.ov-contact a:hover { border-color:#ff6600; transform:translateX(3px); color:#07133f; }
.ov-contact i { display:grid; place-items:center; width:30px; height:30px; border-radius:8px; background:#fff1e8; color:#c2410c; font-size:16px; }
.ov-cta { display:flex; justify-content:center; align-items:center; gap:6px; padding:12px; border-radius:10px; background:#c2410c; color:#fff; font-size:13px; font-weight:700; text-decoration:none; transition:background .2s, transform .2s; }
.ov-cta:hover { background:#9a3412; color:#fff; transform:translateY(-2px); }
@media (max-width:991px) { .ov-body { grid-template-columns:minmax(0,1fr); gap:24px; } }
@media (max-width:767px) {
  .ov-hero img { aspect-ratio:4/3; object-position:30% center; }
  .ov-stat { padding:8px 11px; } .ov-stat strong { font-size:19px; } .ov-stat span { font-size:11px; }
  .ov-stat--1 { top:14px; left:auto; right:14px; } .ov-stat--2 { top:auto; bottom:64px; right:14px; }
  .ov-badges { left:14px; bottom:14px; gap:6px; } .ov-badges li { padding:6px 9px; font-size:11px; }
}
@media (prefers-reduced-motion: reduce) { .ov-stat { animation:none; } .ov-hero img { transform:none; transition:none; } }

/* Overview banner v2: navy panel + dish photo on the right (2026-11-12) */
.ov-hero { display:flex; min-height:360px; background:radial-gradient(circle at 20% 15%,rgba(62,92,211,.4),transparent 55%),linear-gradient(150deg,#050a36,#07133f 60%,#0a1d52); }
.ov-hero::after { display:none; }
.ov-hero img { position:absolute; top:0; right:0; width:58%; height:100%; aspect-ratio:auto; object-fit:cover; object-position:center 35%; -webkit-mask-image:linear-gradient(to right,transparent 0,#000 38%); mask-image:linear-gradient(to right,transparent 0,#000 38%); }
.ov-hero__panel { position:relative; z-index:2; display:flex; flex-direction:column; justify-content:center; gap:22px; width:56%; padding:38px 40px; }
.ov-stats { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.ov-stat { position:static; padding:14px 16px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.07); box-shadow:none; animation:none; }
.ov-stat strong { color:#fff; font-size:30px; }
.ov-stat span { color:rgba(255,255,255,.7); }
.ov-badges { position:static; }
@media (max-width:767px) {
  .ov-hero { flex-direction:column; min-height:0; }
  .ov-hero img { position:relative; width:100%; height:220px; -webkit-mask-image:linear-gradient(to bottom,#000 60%,transparent); mask-image:linear-gradient(to bottom,#000 60%,transparent); }
  .ov-hero__panel { width:100%; padding:4px 18px 22px; }
  .ov-stat strong { font-size:22px; }
}
/* Overview body: balance text and side panel (2026-11-12) */
.ov-body { align-items:stretch; gap:36px; }
.ov-copy { display:flex; flex-direction:column; justify-content:center; }
.ov-copy p:last-child { margin-bottom:0; }
.ov-side { padding:20px; }
.svc-section .ov-side h3 { margin-bottom:10px; font-size:12px; }
.ov-chips { gap:6px; margin-bottom:16px; }
.ov-chips li { padding:5px 10px; font-size:12.5px; }
.ov-contact { grid-template-columns:1fr; gap:6px; margin-bottom:12px; }
.ov-contact a { gap:8px; padding:8px 10px; font-size:13px; min-width:0; }
.ov-contact a span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ov-contact i { width:26px; height:26px; flex:none; font-size:15px; }
.ov-cta { padding:11px; }

/* Earth-station photo framing (2026-11-12) */
.ov-banner .ov-hero img { width:60%; object-position:18% 40%; -webkit-mask-image:linear-gradient(to right,transparent 0,#000 30%); mask-image:linear-gradient(to right,transparent 0,#000 30%); }
.ov-banner .ov-hero__panel { width:52%; }
@media (max-width:767px) { .ov-banner .ov-hero img { width:100%; object-position:30% 35%; -webkit-mask-image:linear-gradient(to bottom,#000 60%,transparent); mask-image:linear-gradient(to bottom,#000 60%,transparent); } .ov-banner .ov-hero__panel { width:100%; } }
.ov-banner .ov-hero img { width:44%; object-position:center 45%; -webkit-mask-image:linear-gradient(to right,transparent 0,#000 22%); mask-image:linear-gradient(to right,transparent 0,#000 22%); }
.ov-banner .ov-hero__panel { width:58%; }
/* Grids sized to their item count, so no orphan rows (2026-11-12) */
@media (min-width:992px) {
  .photo-strip:has(> figure:nth-child(3):last-child) { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .photo-strip:has(> figure:nth-child(3):last-child) figure { aspect-ratio:4/3; }
  .svc-layout--single .svc-cards:has(> :nth-child(4):last-child) { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .svc-layout--single .svc-cards:has(> :nth-child(5):last-child) { grid-template-columns:repeat(6,minmax(0,1fr)); }
  .svc-layout--single .svc-cards:has(> :nth-child(5):last-child) > * { grid-column:span 2; }
  .svc-layout--single .svc-cards:has(> :nth-child(5):last-child) > :nth-child(n+4) { grid-column:span 3; }
}

/* "How it works" star network variant (SERVICE_EXTRAS how_style = star, e.g. iDirect) */
.how--star { background:radial-gradient(circle at 75% 80%,rgba(255,102,0,.12),transparent 45%),radial-gradient(circle at 20% 10%,rgba(62,92,211,.35),transparent 55%),linear-gradient(150deg,#050a36,#07133f 60%,#0a1d52); }
.how--star .link { fill:none; stroke:rgba(255,255,255,.12); stroke-width:2; }
.how--star .link.trunk { stroke-width:3; }
.how--star .flow { fill:none; stroke-width:2; stroke-linecap:round; }
.how--star .flow.trunk { stroke-width:3; }
.how--star .orbit { fill:none; stroke:rgba(255,255,255,.18); stroke-dasharray:3 9; animation:howFlow 1.6s linear infinite; }
.how--star .group-label { fill:#8fa3d9; font:700 12px "Open Sans",sans-serif; letter-spacing:.12em; text-transform:uppercase; text-anchor:end; }
.how--star .site circle { fill:#0b1a4d; stroke:rgba(255,255,255,.25); stroke-width:2; transition:stroke .4s ease calc(var(--i) * .15s); }
.how--star .site .dot { fill:rgba(255,255,255,.5); stroke:none; transition:fill .4s ease calc(var(--i) * .15s); }
.how--star.in-view .site circle { stroke:#ff6600; }
.how--star.in-view .site .dot { fill:#ff9a55; }
.how--star .site text { fill:#dbe3f7; font:600 14px "Raleway",sans-serif; text-anchor:end; }
.how--star .hub-glow { opacity:0; transition:opacity 1s ease 1.4s; }
.how--star.in-view .hub-glow { opacity:1; }
.how--star .packet { transition-delay:1.2s; }
@media (prefers-reduced-motion: reduce) { .how--star .orbit { animation:none; } }

/* Photo strip v2: one look for studio shots and outdoor photos */
.photo-strip figure { border-radius:20px; background:radial-gradient(circle at 50% 35%,#ffffff,#e6ecf6 75%); box-shadow:0 18px 40px rgba(7,19,63,.12); transition:transform .5s cubic-bezier(.22,1,.36,1), box-shadow .5s ease; }
.photo-strip figure::before { content:""; position:absolute; inset:0; z-index:1; border-radius:inherit; box-shadow:inset 0 0 0 1px rgba(7,19,63,.06); pointer-events:none; }
.photo-strip figure::after { content:""; position:absolute; left:0; right:0; bottom:0; height:70%; background:linear-gradient(to top,rgba(5,10,54,.9),rgba(7,19,63,.45) 35%,rgba(7,19,63,.12) 65%,transparent); pointer-events:none; }
.photo-strip img { mix-blend-mode:multiply; }
.photo-strip figure:hover { transform:translateY(-6px); box-shadow:0 28px 55px rgba(7,19,63,.2); }
.photo-strip figcaption { z-index:2; left:20px; right:20px; bottom:18px; display:flex; align-items:center; gap:12px; padding:0; border-radius:0; background:none; backdrop-filter:none; -webkit-backdrop-filter:none; font:700 15px/1.35 "Raleway",sans-serif; }
.photo-strip .ph-num { flex:none; display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:#ff6600; color:#fff; font:700 12px "Raleway",sans-serif; box-shadow:0 0 0 4px rgba(255,102,0,.25); }
.photo-strip .ph-cap { position:relative; padding-bottom:6px; }
.photo-strip .ph-cap::after { content:""; position:absolute; left:0; bottom:0; width:28px; height:2px; background:#ff9a55; transition:width .5s ease; }
.photo-strip figure:hover .ph-cap::after { width:100%; }
@media (prefers-reduced-motion: reduce) { .photo-strip figure { transition:none; } .photo-strip figure:hover { transform:none; } }

/* Services overview page (service_solutions.php) */
.svc-group { margin-top:34px; scroll-margin-top:110px; }
.svc-group__title { display:flex; align-items:center; gap:12px; margin:0 0 16px; color:#ff6600; font:700 13px "Open Sans",sans-serif; letter-spacing:.14em; text-transform:uppercase; }
.svc-group__title::after { content:""; flex:1; height:1px; background:#e7ebf1; }
.svc-tiles { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:16px; }
.svc-tile { position:relative; display:flex; flex-direction:column; padding:24px; border:1px solid #e0e6ef; border-radius:18px; background:#fff; color:inherit; box-shadow:0 16px 42px rgba(7,19,63,.06); transition:transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s ease, border-color .3s ease; }
.svc-tile:hover { color:inherit; text-decoration:none; transform:translateY(-5px); border-color:#ffc9a3; box-shadow:0 26px 60px rgba(7,19,63,.12); }
.svc-tile > i { display:grid; place-items:center; width:48px; height:48px; margin-bottom:16px; border-radius:14px; background:#fff1e8; color:#ff6600; font-size:24px; transition:transform .35s cubic-bezier(.22,1,.36,1), background .35s ease, color .35s ease; }
.svc-tile:hover > i { transform:translateY(-3px) rotate(-6deg); background:#ff6600; color:#fff; }
.svc-tile h4 { margin:0 0 6px; color:#07133f; font:700 18px "Raleway",sans-serif; }
.svc-tile p { flex:1; margin:0 0 16px; color:#566178; font-size:14px; line-height:1.6; }
.svc-tile__go { display:inline-flex; align-items:center; gap:4px; color:#c2410c; font:700 13.5px "Raleway",sans-serif; }
.svc-tile__go i { transition:transform .3s ease; } .svc-tile:hover .svc-tile__go i { transform:translateX(4px); }
.more-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:48px; align-items:center; margin-top:40px; scroll-margin-top:110px; }
.more-row + .more-row { padding-top:40px; border-top:1px solid #eef1f6; }
.more-row--flip .more-row__img { order:2; }
.more-row__img { position:relative; margin:0; overflow:hidden; aspect-ratio:4/3; border-radius:20px; background:#eef2f8; box-shadow:0 22px 50px rgba(7,19,63,.14); }
.more-row__img::after { content:""; position:absolute; inset:0; background:linear-gradient(to top,rgba(7,19,63,.25),transparent 50%); }
.more-row__img img { width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.22,1,.36,1); }
.more-row:hover .more-row__img img { transform:scale(1.05); }
.more-row__copy .eyebrow { color:#ff6600; }
.more-row__copy h3 { margin:6px 0 14px; color:#07133f; font:700 clamp(24px,2.4vw,32px)/1.15 "Raleway",sans-serif; letter-spacing:-.03em; }
.more-points { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:18px 0 24px; padding:0; list-style:none; }
.more-points li { display:flex; align-items:center; gap:10px; padding:10px 12px; border:1px solid #e7ebf1; border-radius:12px; background:#f7f9fc; color:#07133f; font-size:14px; font-weight:600; }
.more-points i { flex:none; display:grid; place-items:center; width:30px; height:30px; border-radius:9px; background:#fff1e8; color:#ff6600; font-size:17px; }
@media (max-width:767px) {
  .more-row { grid-template-columns:minmax(0,1fr); gap:22px; }
  .more-row--flip .more-row__img { order:0; }
  .more-points { grid-template-columns:minmax(0,1fr); }
}
@media (prefers-reduced-motion: reduce) { .svc-tile, .more-row__img img { transition:none; } }
/* the old page styled these ids (#terrestrial_networks etc.) with background images */
.more-row { background:none !important; padding-left:0; padding-right:0; }
.svc-tiles { grid-template-columns:repeat(3,minmax(0,1fr)); }
@media (max-width:991px) { .svc-tiles { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:575px) { .svc-tiles { grid-template-columns:minmax(0,1fr); } }

/* Services overview v2 */
.svc-hero .container { position:relative; }
.ss-collage { position:absolute; right:15px; top:50%; width:min(42%,500px); height:340px; transform:translateY(-42%); pointer-events:none; }
.ss-collage img { position:absolute; object-fit:cover; border-radius:20px; border:3px solid rgba(255,255,255,.12); box-shadow:0 30px 60px rgba(0,0,0,.45); }
.ss-collage .c1 { right:0; top:0; width:62%; height:62%; animation:ssFloat 7s ease-in-out infinite; }
.ss-collage .c2 { left:0; top:30%; width:56%; height:46%; animation:ssFloat 8s ease-in-out infinite -2s; }
.ss-collage .c3 { right:8%; bottom:0; width:44%; height:40%; animation:ssFloat 9s ease-in-out infinite -4s; }
@keyframes ssFloat { 50% { transform:translateY(-12px); } }
@media (max-width:1100px) { .ss-collage { display:none; } }
.svc-head { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px; }
.svc-head h2 { margin:0; }
.svc-jump { display:flex; flex-wrap:wrap; gap:8px; }
.svc-jump a { padding:8px 16px; border:1px solid #e0e6ef; border-radius:999px; background:#fff; color:#07133f; font:600 13.5px "Raleway",sans-serif; transition:all .25s ease; }
.svc-jump a:hover { border-color:#ff6600; background:#ff6600; color:#fff; text-decoration:none; }
.svc-tile { overflow:hidden; isolation:isolate; }
.svc-tile::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(150deg,#07133f,#0e2160); opacity:0; transition:opacity .4s ease; }
.svc-tile::after { content:""; position:absolute; left:24px; right:24px; top:0; height:3px; border-radius:0 0 3px 3px; background:linear-gradient(90deg,#ff6600,#ffb27a); transform:scaleX(.25); transform-origin:left; transition:transform .45s cubic-bezier(.22,1,.36,1); }
.svc-tile:hover::before { opacity:1; }
.svc-tile:hover::after { transform:scaleX(1); }
.svc-tile:hover h4 { color:#fff; } .svc-tile:hover p { color:rgba(255,255,255,.75); } .svc-tile:hover .svc-tile__go { color:#ff9a55; }
.svc-tile h4, .svc-tile p, .svc-tile__go { transition:color .35s ease; }
.more-row__img { overflow:visible; aspect-ratio:16/11; }
.more-row__img img { border-radius:20px; }
.more-row__img::before { content:""; position:absolute; z-index:-1; inset:18px -18px -18px 18px; border-radius:22px; border:2px solid #ffd2b3; background:repeating-linear-gradient(45deg,#fff7f1 0 6px,#fff 6px 12px); }
.more-row--flip .more-row__img::before { inset:18px 18px -18px -18px; }
.more-row__img::after { border-radius:20px; }
.more-row__img { isolation:isolate; }
.more-row__badge { position:absolute; z-index:2; left:-14px; bottom:26px; display:inline-flex; align-items:center; gap:10px; padding:12px 18px 12px 12px; border-radius:14px; background:#fff; color:#07133f; font:700 14px "Raleway",sans-serif; box-shadow:0 18px 40px rgba(7,19,63,.18); animation:ssFloat 6s ease-in-out infinite; }
.more-row--flip .more-row__badge { left:auto; right:-14px; }
.more-row__badge i { display:grid; place-items:center; width:34px; height:34px; border-radius:10px; background:#ff6600; color:#fff; font-size:18px; }
.more-row__copy { position:relative; }
.more-row__num { position:absolute; right:0; top:-18px; color:transparent; -webkit-text-stroke:1.5px #e3e8f0; font:800 88px/1 "Raleway",sans-serif; pointer-events:none; }
.more-points li { transition:border-color .25s ease, background .25s ease, transform .25s ease; }
.more-points li:hover { border-color:#ffc9a3; background:#fff; transform:translateX(3px); }
#Telecom_Products .more-row__img img { object-fit:contain; background:#fff; padding:12px; }
@media (max-width:767px) { .more-row__img::before { display:none; } .more-row__badge { left:12px; } .more-row--flip .more-row__badge { right:12px; } .more-row__num { font-size:60px; } }
@media (prefers-reduced-motion: reduce) { .ss-collage img, .more-row__badge { animation:none; } }
#Telecom_Products .more-row__img::after { display:none; }
#Telecom_Products .more-row__img img { box-shadow:inset 0 0 0 1px #e7ebf1; }
/* Telecom products: 2x2 named product cards */
.product-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.more-row--flip .product-grid { order:2; }
.product { position:relative; margin:0; padding:14px 14px 0; border:1px solid #e7ebf1; border-radius:18px; background:radial-gradient(circle at 50% 40%,#fff,#f1f4f9); overflow:hidden; transition:transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease, border-color .35s ease; }
.product img { display:block; width:100%; aspect-ratio:4/3; object-fit:contain; mix-blend-mode:multiply; transition:transform .6s cubic-bezier(.22,1,.36,1); }
.product figcaption { margin:0 -14px; padding:11px 14px; border-top:1px solid #e7ebf1; background:#fff; color:#07133f; font:700 13.5px/1.3 "Raleway",sans-serif; text-align:center; }
.product:hover { transform:translateY(-4px); border-color:#ffc9a3; box-shadow:0 20px 44px rgba(7,19,63,.12); }
.product:hover img { transform:scale(1.06); }
#featured-services .more-row:first-of-type { margin-top:0; }
@media (max-width:767px) { .more-row--flip .product-grid { order:0; } }

/* Animated diagrams in the Services page rows (includes/service_diagrams.php) */
.more-row { overflow:visible; }
#featured-services { overflow-x:clip; padding-left:20px; padding-right:20px; margin:0 -20px; }
.dg-panel { display:grid; place-items:center; background:radial-gradient(circle at 30% 20%,rgba(62,92,211,.4),transparent 55%),linear-gradient(150deg,#050a36,#07133f 60%,#0a1d52); }
.dg-panel::after { display:none; }
.dg-panel svg { width:92%; height:auto; overflow:visible; }
.dg-line { fill:none; stroke:rgba(255,255,255,.14); stroke-width:2.5; stroke-linecap:round; }
.dg-flow { fill:none; stroke:#ff8b3d; stroke-width:2.5; stroke-linecap:round; stroke-dasharray:5 14; opacity:.85; animation:howFlow 1.2s linear infinite; }
.dg-flow--slow { stroke:#93a3f3; opacity:.5; animation-duration:2.4s; }
.dg-pglow { fill:rgba(255,102,0,.3); } .dg-pcore { fill:#fff; stroke:#ff6600; stroke-width:2.5; }
.dg-site circle { fill:#0b1a4d; stroke:#ff6600; stroke-width:2; }
.dg-site .dg-dot { fill:#ff9a55; stroke:none; }
.dg-site .dg-ring { fill:none; stroke:#ff6600; opacity:0; transform-box:fill-box; transform-origin:center; animation:howPulse 2.4s cubic-bezier(.22,1,.36,1) infinite; }
.dg-panel text { fill:#fff; font:700 14px "Raleway",sans-serif; text-anchor:middle; }
.dg-panel text.dg-muted { fill:rgba(255,255,255,.55); font-weight:600; font-size:12px; }
.dg-panel text.dg-cap { fill:#c9d3f0; font-size:12.5px; font-weight:600; }
.dg-panel text.dg-end { text-anchor:end; }
.dg-hub circle { fill:#0e2160; stroke:#ff6600; stroke-width:2.5; }
.dg-ico { fill:none; stroke:#ff9a55; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.dg-glow { animation:dgBreath 4s ease-in-out infinite; }
@keyframes dgBreath { 50% { opacity:.5; } }
.dg-ground { stroke:rgba(255,255,255,.15); stroke-width:2; }
.dg-tower path { fill:none; stroke:#c9d3f0; stroke-width:2.4; stroke-linejoin:round; stroke-linecap:round; }
.dg-tower .dg-dish { fill:#ff6600; }
.dg-wave { fill:none; stroke:#ff9a55; stroke-width:2.2; stroke-linecap:round; opacity:0; animation:dgWave 1.8s ease-out infinite; }
@keyframes dgWave { 0% { opacity:0; } 30% { opacity:.9; } 100% { opacity:0; } }
.dg-measure { fill:none; stroke:rgba(255,255,255,.35); stroke-width:1.5; stroke-dasharray:4 4; }
.dg-chip { fill:#ff6600; } .dg-panel text.dg-chip-t { font-size:13px; }
.dg-bldg rect { fill:#0e2160; stroke:#c9d3f0; stroke-width:2; } .dg-bldg path { fill:none; stroke:#c9d3f0; stroke-width:2; stroke-linecap:round; }
@media (prefers-reduced-motion: reduce) { .dg-flow, .dg-wave, .dg-glow, .dg-site .dg-ring { animation:none; } .dg-wave { opacity:.6; } .dg-packet { display:none; } }
.dg-panel::before { display:none; }
.dg-panel { box-shadow:0 0 0 2px #ffd2b3, 14px 14px 0 0 #fff4ec, 14px 14px 0 2px #ffd2b3, 0 24px 50px rgba(7,19,63,.18); }
.more-row--flip .dg-panel { box-shadow:0 0 0 2px #ffd2b3, -14px 14px 0 0 #fff4ec, -14px 14px 0 2px #ffd2b3, 0 24px 50px rgba(7,19,63,.18); }
.dg-rack > rect { fill:#0b1a4d; stroke:#c9d3f0; stroke-width:2; }
.dg-rack .dg-unit { fill:#10235f; stroke:rgba(255,255,255,.18); stroke-width:1.2; }
.dg-vent { stroke:rgba(255,255,255,.22); stroke-width:1.5; stroke-linecap:round; }
.dg-led { fill:#ff9a55; animation:dgBlink 1.6s steps(2) infinite; } .dg-led--b { fill:#7cc15f; animation-duration:2.3s; }
@keyframes dgBlink { 50% { opacity:.2; } }
@media (prefers-reduced-motion: reduce) { .dg-led { animation:none; } }
.dg-panel text.dg-head { fill:#ff9a55; font:800 12px "Open Sans",sans-serif; letter-spacing:.16em; text-transform:uppercase; }
.dg-divider { stroke:rgba(255,255,255,.14); stroke-width:1.5; stroke-dasharray:4 6; }
.dg-check circle { fill:#4f9a37; stroke:#0b1a4d; stroke-width:2; } .dg-check path { fill:none; stroke:#fff; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.dg-check { opacity:0; animation:dgCheck 2.4s ease infinite; }
@keyframes dgCheck { 0%,20% { opacity:0; } 35%,85% { opacity:1; } 100% { opacity:0; } }
.dg-hub .dg-ring2 { fill:none; stroke:#ff6600; opacity:0; transform-box:fill-box; transform-origin:center; animation:howPulse 2.4s cubic-bezier(.22,1,.36,1) infinite; }
@media (prefers-reduced-motion: reduce) { .dg-check { animation:none; opacity:1; } .dg-hub .dg-ring2 { animation:none; } }
/* keep slide-in animations from causing sideways scroll (replaces the #featured-services margin trick) */
#featured-services { padding-left:0; padding-right:0; margin:0; overflow-x:visible; }
.svc-body, .svc-quote { overflow-x:clip; }

/* Phones: keep diagram labels readable (SVG text shrinks with the drawing) */
.more-row__copy p { text-align:left !important; }
@media (max-width:575px) {
  .how svg .node text { font-size:30px; }
  .how--star .site text { display:none; }          /* the use-case list below names each site */
  .how--star .group-label { font-size:24px; }
  .dg-panel svg { width:100%; }
  .dg-panel text { font-size:19px !important; }
  .dg-panel text.dg-cap, .dg-panel text.dg-muted, .dg-panel text.dg-head { font-size:15px !important; }
  .dg-panel text.dg-chip-t { font-size:15px !important; }
  .more-row__num { font-size:52px; top:-6px; }
}
@media (max-width:767px) {
  .ov-banner .ov-hero img { width:100%; height:240px; object-position:center 40%; -webkit-mask-image:linear-gradient(to bottom,#000 65%,transparent); mask-image:linear-gradient(to bottom,#000 65%,transparent); }
  .ov-banner .ov-hero__panel { width:100%; }
  .svc-body { padding:48px 0 60px; }
}
@media (max-width:575px) {
  .how--star .node text { font-size:22px; }
  .dg-panel text { font-size:17px !important; }
}