/* inner.css — service / area / about / contact / info page styles for A.R.C.C. Mechanical */

/* ---- page hero ---- */
.page-hero{position:relative;isolation:isolate;overflow:hidden;padding:clamp(120px,16vh,180px) 0 clamp(56px,7vw,90px);border-bottom:1px solid var(--border)}
.page-hero__bg{position:absolute;inset:0;z-index:-1;background:
  radial-gradient(80% 90% at 80% 0%,color-mix(in srgb,var(--heat) 16%,transparent),transparent 60%),
  radial-gradient(70% 80% at 10% 100%,color-mix(in srgb,var(--cool) 16%,transparent),transparent 60%),
  var(--background)}
.page-hero.ph-cool .page-hero__bg{background:radial-gradient(80% 90% at 80% 0%,color-mix(in srgb,var(--cool) 18%,transparent),transparent 60%),radial-gradient(70% 80% at 10% 100%,color-mix(in srgb,var(--gold) 9%,transparent),transparent 60%),var(--background)}
.page-hero.ph-heat .page-hero__bg{background:radial-gradient(80% 90% at 80% 0%,color-mix(in srgb,var(--heat) 18%,transparent),transparent 60%),radial-gradient(70% 80% at 10% 100%,color-mix(in srgb,var(--cool) 9%,transparent),transparent 60%),var(--background)}
.page-hero h1{font-size:clamp(2.2rem,5.5vw,3.8rem);max-width:18ch}
.page-hero .lede{max-width:60ch}
.page-hero__cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.crumbs{display:flex;align-items:center;gap:8px;font-size:.82rem;color:var(--steel);margin-bottom:22px;flex-wrap:wrap}
.crumbs a{color:var(--steel)}.crumbs a:hover{color:var(--heatGlow)}
.crumbs span[aria-current]{color:var(--foreground)}

/* ---- trust row ---- */
.trust-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.trust-row .trust-chip{font-size:.8rem;padding:8px 14px}
.trust-row .stars{color:var(--heatGlow);letter-spacing:1px}

/* ---- service page ---- */
.svc-page__grid{display:grid;grid-template-columns:1.6fr .9fr;gap:clamp(32px,5vw,60px);align-items:start}
@media (max-width:920px){.svc-page__grid{grid-template-columns:1fr}}
.svc-page__main h2{margin-top:48px}
.svc-page__main h2:first-of-type{margin-top:40px}
.quick-answer{background:var(--panel);border:1px solid var(--border);border-left:3px solid var(--heat);border-radius:var(--radius);padding:26px 28px;position:relative}
.page-hero.ph-cool ~ * .quick-answer,.area-page .quick-answer{border-left-color:var(--cool)}
.qa-tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-head);font-weight:700;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--heatGlow);margin-bottom:12px}
.qa-tag svg{width:16px;height:16px}
.area-page .qa-tag{color:var(--coolGlow)}
.quick-answer p{margin:0;font-size:1.06rem;line-height:1.7}
.incl{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px 28px}
@media (max-width:560px){.incl{grid-template-columns:1fr}}
.incl li{display:flex;gap:11px;align-items:flex-start;font-size:.96rem}
.incl li svg{width:19px;height:19px;color:var(--heatGlow);flex:none;margin-top:2px}
.proc-list{counter-reset:pc;list-style:none;margin:18px 0 0;padding:0;display:grid;gap:14px}
.proc-list li{position:relative;padding:18px 20px 18px 64px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);counter-increment:pc}
.proc-list li::before{content:counter(pc);position:absolute;left:18px;top:50%;translate:0 -50%;width:32px;height:32px;display:grid;place-items:center;border-radius:9px;background:color-mix(in srgb,var(--accent) 14%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 35%,var(--border));font-family:var(--font-head);font-weight:700;color:var(--gold)}
.svc-page .faq__grid{margin-top:18px}

/* sidebar */
.svc-page__side{position:sticky;top:96px}
@media (max-width:920px){.svc-page__side{position:static}}
.side-card{background:var(--panel);border:1px solid var(--border);border-radius:calc(var(--radius)+4px);padding:26px}
.side-card h3{font-size:1.2rem;margin-bottom:14px}
.facts-table{width:100%;border-collapse:collapse;margin-bottom:6px}
.facts-table th,.facts-table td{text-align:left;padding:11px 0;border-bottom:1px solid var(--border);font-size:.92rem;vertical-align:top}
.facts-table th{color:var(--steel);font-weight:500;width:42%}
.facts-table td{font-family:var(--font-head);font-weight:600}
.side-card .trust-row{margin-top:18px}

/* related */
.rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px}
@media (max-width:780px){.rel-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.rel-grid{grid-template-columns:1fr}}
.rel-card{display:flex;align-items:center;gap:14px;padding:18px 20px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);transition:border-color .35s,transform .35s;color:var(--foreground)}
.rel-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--tint,var(--accent)) 55%,var(--border));color:var(--foreground)}
.rel-card .rel-ico{width:40px;height:40px;border-radius:11px;flex:none;display:grid;place-items:center;background:color-mix(in srgb,var(--tint,var(--accent)) 14%,var(--surface));border:1px solid color-mix(in srgb,var(--tint,var(--accent)) 30%,var(--border))}
.rel-card .rel-ico svg{width:22px;height:22px;color:var(--tint,var(--accent))}
.rel-card .rel-name{flex:1;font-family:var(--font-head);font-weight:600;font-size:.95rem}
.rel-card svg:last-child{width:16px;height:16px;color:var(--steel);transition:transform .3s}
.rel-card:hover svg:last-child{transform:translateX(4px);color:var(--tint,var(--accent))}
.svc--heat{--tint:var(--heat)}.svc--cool{--tint:var(--cool)}.svc--gold{--tint:var(--gold)}

/* ---- area page ---- */
.area-page h2{margin-top:8px}
.why-mini{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}
@media (max-width:780px){.why-mini{grid-template-columns:1fr}}

/* ---- about ---- */
.about__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,5vw,60px);align-items:center}
@media (max-width:880px){.about__grid{grid-template-columns:1fr}}
.about__img{border-radius:calc(var(--radius)+4px);border:1px solid var(--border);width:100%;object-fit:cover;aspect-ratio:4/3}
.about__values{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:clamp(40px,5vw,64px)}
@media (max-width:780px){.about__values{grid-template-columns:1fr}}
.about__values .svc__ico{margin-bottom:16px}

/* ---- info / gallery ---- */
.info-page .quick-answer{margin-bottom:24px}
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:780px){.gallery-grid{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.gallery-grid{grid-template-columns:1fr}}
.gallery-grid figure{margin:0;position:relative;border-radius:var(--radius);overflow:hidden;border:1px solid var(--border)}
.gallery-grid img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;transition:transform .6s var(--ease-premium)}
.gallery-grid figure:hover img{transform:scale(1.05)}
.gallery-grid figcaption{position:absolute;left:0;right:0;bottom:0;padding:14px 16px;font-family:var(--font-head);font-weight:600;font-size:.9rem;background:linear-gradient(transparent,color-mix(in srgb,var(--background) 92%,transparent))}
