
/* Individual service pages only. The original homepage styles and markup remain untouched. */
.service-page { background: #fff; color: var(--navy); }
.service-page .site-header { top: 0; }
.service-page .main-nav a.active::after { width: 100%; }
.service-hero {
  position: relative; isolation: isolate; overflow: hidden;
  background: linear-gradient(116deg,#f8fcff 0%,#edf7ff 50%,#f3fbea 100%);
  padding: 88px 0 92px; border-bottom: 1px solid #dfe9f2;
}
.service-hero::before {
  content: ''; position: absolute; inset: 0; z-index: -3;
  background: url('../images/hero-bg.webp') 72% center/cover no-repeat;
  filter: brightness(2.1) saturate(.45) contrast(.64); opacity: .18;
}
.service-hero::after {
  content:''; position:absolute; inset:0; z-index:-2;
  background: linear-gradient(90deg,rgba(250,253,255,.98),rgba(247,252,255,.82) 55%,rgba(244,251,238,.84));
}
.service-orb { position:absolute; border-radius:50%; filter:blur(2px); pointer-events:none; animation: serviceFloat 8s ease-in-out infinite; }
.service-orb.one { width:260px;height:260px;right:9%;top:-95px;background:radial-gradient(circle,rgba(77,181,46,.20),transparent 68%); }
.service-orb.two { width:220px;height:220px;left:43%;bottom:-120px;background:radial-gradient(circle,rgba(22,105,217,.17),transparent 68%);animation-delay:-3s; }
@keyframes serviceFloat { 50% { transform: translate3d(0,18px,0) scale(1.05); } }
.service-hero-grid { display:grid; grid-template-columns:minmax(0,1.16fr) minmax(340px,.84fr); align-items:center; gap:64px; }
.service-breadcrumb { display:flex; flex-wrap:wrap; gap:8px; color:#64738a; font-size:14px; margin-bottom:24px; }
.service-breadcrumb a { color:var(--blue); font-weight:700; }
.service-kicker { display:inline-flex; align-items:center; gap:9px; color:var(--green-dark); font-weight:800; letter-spacing:.13em; text-transform:uppercase; font-size:12px; margin:0 0 18px; }
.service-kicker::before { content:''; width:34px; height:3px; border-radius:999px; background:linear-gradient(90deg,var(--green),var(--blue)); }
.service-hero h1 { margin:0; color:#102142; font-size:clamp(44px,5vw,72px); line-height:1.02; letter-spacing:-.045em; max-width:790px; }
.service-hero h1 span { color:var(--green-dark); }
.service-lead { max-width:760px; margin:25px 0 28px; color:#43536b; font-size:19px; line-height:1.72; }
.service-actions { display:flex; flex-wrap:wrap; gap:14px; }
.service-trust { display:flex; flex-wrap:wrap; gap:16px 24px; margin-top:27px; color:#42516a; font-size:14px; font-weight:700; }
.service-trust span::before { content:'✓'; color:var(--green-dark); margin-right:7px; }
.service-visual { position:relative; min-height:460px; display:grid; place-items:center; }
.service-visual-card {
  position:relative; width:min(100%,450px); border:1px solid #dce7f0; border-radius:34px; padding:34px;
  background:rgba(255,255,255,.91); box-shadow:0 30px 70px rgba(32,76,130,.17); backdrop-filter:blur(12px);
  transform:rotate(1.5deg); transition:.35s ease;
}
.service-visual-card:hover { transform:rotate(0) translateY(-7px); }
.service-icon-large { width:110px; height:110px; border-radius:30px; display:grid; place-items:center; margin-bottom:28px; color:var(--blue); background:linear-gradient(135deg,#eaf4ff,#f1faea); box-shadow:inset 0 0 0 1px #dce8f2; font-size:50px; }
.service-visual-card h2 { font-size:30px; line-height:1.12; margin:0 0 14px; color:#102142; }
.service-visual-card p { color:#5d6c82; line-height:1.7; margin:0; }
.service-mini-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:24px; }
.service-mini-grid div { border:1px solid #e1e9f1; border-radius:16px; padding:15px; background:#fbfdff; color:#33445e; font-weight:700; font-size:13px; }
.service-van { position:absolute; width:255px; right:-55px; bottom:-70px; filter:drop-shadow(0 18px 22px rgba(38,71,105,.20)); animation:vanHover 5s ease-in-out infinite; }
@keyframes vanHover { 50% { transform:translateY(-9px); } }
.service-section { padding:96px 0; }
.service-section.soft { background:#f7fbff; border-top:1px solid #e6edf4; border-bottom:1px solid #e6edf4; }
.service-section.green-soft { background:linear-gradient(135deg,#f7fbff,#f5fbed); }
.section-heading-wrap { max-width:790px; margin:0 auto 52px; text-align:center; }
.section-heading-wrap.left { max-width:none; margin:0 0 34px; text-align:left; }
.section-heading-wrap h2 { margin:0; font-size:clamp(35px,4vw,54px); line-height:1.08; letter-spacing:-.035em; color:#102142; }
.section-heading-wrap p { margin:17px 0 0; color:#607087; font-size:17px; line-height:1.75; }
.problem-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:56px; align-items:center; }
.problem-panel { position:relative; overflow:hidden; border:1px solid #dfe9f1; border-radius:30px; padding:42px; background:#fff; box-shadow:0 20px 50px rgba(33,71,114,.10); }
.problem-panel::after { content:''; position:absolute; width:180px;height:180px;border-radius:50%;right:-80px;bottom:-90px;background:rgba(82,183,47,.12); }
.problem-panel p { color:#526279; font-size:18px; line-height:1.8; margin:0; position:relative; z-index:1; }
.sign-list { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.sign-item { display:flex; gap:13px; align-items:flex-start; padding:18px; border:1px solid #e1e9f1; border-radius:18px; background:#fff; box-shadow:0 10px 24px rgba(33,71,114,.055); transition:.25s; }
.sign-item:hover { transform:translateY(-4px); border-color:#cfe4c3; }
.sign-mark { flex:0 0 34px; width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:#eef8e8;color:var(--green-dark);font-weight:900; }
.sign-item span:last-child { color:#31425c; line-height:1.5; font-weight:700; }
.benefit-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.benefit-card { border:1px solid #dfe8f1; border-radius:24px; padding:27px; background:#fff; box-shadow:0 14px 32px rgba(33,71,114,.07); transition:.3s ease; }
.benefit-card:hover { transform:translateY(-7px); box-shadow:0 22px 42px rgba(33,71,114,.12); border-color:rgba(78,181,46,.42); }
.benefit-num { display:grid; place-items:center; width:44px;height:44px;border-radius:15px;background:linear-gradient(135deg,#edf7ff,#eff9e8);color:var(--blue);font-weight:900;margin-bottom:18px; }
.benefit-card p { margin:0; color:#3c4d66; font-weight:700; line-height:1.55; }
.process-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; counter-reset:process; }
.process-card { position:relative; border:1px solid #dfe8f1; border-radius:24px; padding:28px 24px; background:#fff; min-height:255px; overflow:hidden; }
.process-card::before { counter-increment:process; content:'0' counter(process); display:block; color:var(--blue); font-family:'Oswald',sans-serif; font-size:43px; font-weight:700; opacity:.18; margin-bottom:22px; }
.process-card::after { content:''; position:absolute; left:0; bottom:0; width:0;height:4px;background:linear-gradient(90deg,var(--green),var(--blue));transition:.35s; }
.process-card:hover::after { width:100%; }
.process-card h3 { margin:0 0 12px; color:#102142; font-size:21px; }
.process-card p { margin:0; color:#64738a; line-height:1.7; }
.faq-wrap { max-width:920px; margin:0 auto; display:grid; gap:14px; }
.faq-item { border:1px solid #dfe8f1; border-radius:20px; background:#fff; box-shadow:0 10px 24px rgba(33,71,114,.055); overflow:hidden; }
.faq-question { width:100%; border:0; background:transparent; color:#102142; display:flex; align-items:center; justify-content:space-between; gap:20px; text-align:left; padding:22px 24px; font-weight:800; cursor:pointer; }
.faq-plus { width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#eef7ff;color:var(--blue);font-size:21px;transition:.3s;flex:0 0 34px; }
.faq-answer { max-height:0; overflow:hidden; transition:max-height .38s ease; }
.faq-answer p { margin:0; padding:0 24px 24px; color:#607087; line-height:1.75; }
.faq-item.open .faq-plus { transform:rotate(45deg); background:#eef9e8;color:var(--green-dark); }
.related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.related-card { position:relative; overflow:hidden; border:1px solid #dfe8f1; border-radius:24px; padding:27px; background:#fff; box-shadow:0 14px 32px rgba(33,71,114,.07); }
.related-card::after { content:'→'; position:absolute;right:24px;bottom:22px;color:var(--blue);font-size:26px;transition:.25s; }
.related-card:hover::after { transform:translateX(5px); }
.related-card small { color:var(--green-dark);text-transform:uppercase;letter-spacing:.12em;font-weight:800; }
.related-card h3 { color:#102142;font-size:23px;margin:10px 38px 0 0; }
.service-cta { padding:28px 0 90px; background:#fff; }
.service-cta-inner { position:relative; overflow:hidden; display:grid;grid-template-columns:1fr auto;align-items:center;gap:32px;padding:48px;border-radius:30px;background:linear-gradient(110deg,#0c2c59,#071b3b);color:#fff;box-shadow:0 26px 60px rgba(13,42,80,.22); }
.service-cta-inner::before { content:''; position:absolute; width:380px;height:380px;border-radius:50%;right:-150px;top:-210px;background:rgba(78,181,46,.16); }
.service-cta h2 { position:relative;margin:0 0 10px;font-size:clamp(31px,4vw,48px);line-height:1.08; }
.service-cta p { position:relative;margin:0;color:rgba(255,255,255,.76);font-size:17px; }
.service-cta-actions { position:relative; display:flex; gap:12px; flex-wrap:wrap; justify-content:flex-end; }
.service-page .site-footer { padding-bottom:64px; }
.service-page .footer-services a { transition:.2s; }
.service-page .footer-services a:hover { color:#fff; padding-left:3px; }
@media (prefers-reduced-motion: reduce) { .service-orb,.service-van { animation:none; } }
@media (max-width: 1050px) {
  .service-hero-grid,.problem-grid { grid-template-columns:1fr; }
  .service-visual { min-height:390px; }
  .process-grid { grid-template-columns:repeat(2,1fr); }
  .benefit-grid { grid-template-columns:repeat(2,1fr); }
  .service-cta-inner { grid-template-columns:1fr; }
  .service-cta-actions { justify-content:flex-start; }
}
@media (max-width: 900px) {
  .service-hero { padding:58px 0 70px; }
  .service-page .main-nav { top:100%; }
  .service-page .site-footer { padding-bottom:64px; }
}
@media (max-width: 700px) {
  .service-hero h1 { font-size:clamp(39px,11vw,54px); }
  .service-hero-grid { gap:34px; }
  .service-visual { min-height:350px; }
  .service-visual-card { padding:25px; border-radius:26px; }
  .service-van { width:210px; right:-34px; bottom:-58px; }
  .service-section { padding:72px 0; }
  .benefit-grid,.process-grid,.related-grid,.sign-list { grid-template-columns:1fr; }
  .problem-panel { padding:28px; }
  .service-cta-inner { padding:34px 25px; }
  .service-actions .btn,.service-cta-actions .btn { width:100%; }
}

/* Leave room for the shared floating action dock on service pages. */
@media (max-width: 900px) { .service-page.home-page .site-footer { padding-bottom: 125px; } }

/* Leave room for the shared floating action dock on service and local pages. */
@media (max-width: 900px) { .service-page.home-page .site-footer, .local-page.home-page .site-footer { padding-bottom: 125px; } }
