/*
Theme Name: Outboard Pit Crew
Theme URI: https://outboardpitcrew.com/
Author: Outboard Pit Crew
Description: Premium block-first WordPress theme for Outboard Pit Crew mobile outboard maintenance.
Version: 0.2.5
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
Text Domain: outboard-pit-crew
*/

:root {
  --opc-ink: #07344a;
  --opc-deep: #042737;
  --opc-ink-2: #0b4660;
  --opc-teal: #169cbd;
  --opc-seafoam: #47d6e8;
  --opc-seafoam-2: #78e6f1;
  --opc-aqua: #e2f7fb;
  --opc-fog: #f4fafc;
  --opc-white: #ffffff;
  --opc-text: #24424f;
  --opc-muted: #6a7f8a;
  --opc-border: #d7e8ee;
  --opc-shadow-sm: 0 12px 34px rgba(7,52,74,.08);
  --opc-shadow: 0 28px 80px rgba(7,52,74,.16);
  --opc-radius-xs: 10px;
  --opc-radius-sm: 16px;
  --opc-radius: 24px;
  --opc-radius-lg: 34px;
  --opc-container: 1240px;
  --opc-content: 820px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--opc-text);
  background: var(--opc-white);
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.62;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { max-width: 100%; height: auto; }
a { color: inherit; }
::selection { background: var(--opc-seafoam); color: var(--opc-deep); }

.opc-container,
.entry-content > .alignwide,
.entry-content > .wp-block-group.alignwide,
.entry-content > .wp-block-columns.alignwide,
.entry-content > .wp-block-cover.alignwide {
  width: min(calc(100% - 48px), var(--opc-container));
  margin-inline: auto;
}
.entry-content { margin: 0; }
.entry-content > *:first-child { margin-top: 0; }
.entry-content > *:last-child { margin-bottom: 0; }
.entry-content > :where(p,h2,h3,h4,ul,ol,blockquote):not(.alignwide):not(.alignfull) {
  max-width: var(--opc-content);
  margin-left: auto;
  margin-right: auto;
}

/* Header */
.opc-site-header {
  position: sticky;
  top: 0;
  z-index: 999;
  background: rgba(255,255,255,.94);
  backdrop-filter: saturate(135%) blur(18px);
  border-bottom: 1px solid rgba(215,232,238,.88);
}
.admin-bar .opc-site-header { top: 32px; }
.opc-header-inner {
  min-height: 88px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}
.opc-brand { display:inline-flex; align-items:center; min-width:0; text-decoration:none; }
.opc-brand-logo,
.opc-brand .custom-logo {
  display:block;
  width: clamp(220px, 23vw, 320px);
  max-height: 64px;
  object-fit: contain;
  object-position: left center;
}
.opc-brand .custom-logo-link { display:flex; align-items:center; }
.opc-nav { display:flex; align-items:center; margin-left:auto; }
.opc-nav .menu { list-style:none; display:flex; align-items:center; gap:30px; margin:0; padding:0; }
.opc-nav li { margin:0; }
.opc-nav .menu > li { position:relative; }
.opc-nav a { text-decoration:none; color:var(--opc-ink); font-size:14px; font-weight:760; }
.opc-nav .menu > li > a { position:relative; display:inline-flex; align-items:center; min-height:48px; white-space:nowrap; }
.opc-nav .menu > li > a::after { content:""; position:absolute; left:0; right:100%; bottom:5px; height:2px; background:var(--opc-teal); transition:right .18s ease; }
.opc-nav .menu > li > a:hover::after,
.opc-nav .current-menu-item > a::after,
.opc-nav .current-menu-ancestor > a::after { right:0; }

/* Desktop dropdown navigation */
.opc-nav .sub-menu {
  position:absolute;
  z-index:1002;
  top:calc(100% + 8px);
  left:-18px;
  min-width:250px;
  list-style:none;
  margin:0;
  padding:10px;
  background:rgba(255,255,255,.985);
  border:1px solid var(--opc-border);
  border-radius:18px;
  box-shadow:0 24px 60px rgba(7,52,74,.14);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-6px);
  transition:opacity .16s ease, transform .16s ease, visibility .16s ease;
}
.opc-nav .sub-menu::before {
  content:"";
  position:absolute;
  left:0; right:0; top:-14px;
  height:14px;
}
.opc-nav .menu > li:hover > .sub-menu,
.opc-nav .menu > li:focus-within > .sub-menu {
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}
.opc-nav .sub-menu li + li { margin-top:2px; }
.opc-nav .sub-menu a {
  display:block;
  padding:10px 12px;
  border-radius:10px;
  color:var(--opc-ink);
  font-size:13px;
  font-weight:760;
  line-height:1.3;
  white-space:nowrap;
}
.opc-nav .sub-menu a:hover,
.opc-nav .sub-menu .current-menu-item > a {
  background:var(--opc-fog);
  color:var(--opc-teal);
}
.opc-header-actions { display:flex; align-items:center; gap:14px; }
.opc-phone { color:var(--opc-ink); font-weight:850; text-decoration:none; white-space:nowrap; }
.opc-mobile-toggle { display:none; width:44px; height:44px; border:1px solid var(--opc-border); border-radius:50%; background:white; color:var(--opc-ink); font-size:23px; line-height:1; }

/* Buttons + Gutenberg block styles */
.opc-button,
.wp-block-button__link,
.wp-block-button.is-style-opc-primary .wp-block-button__link,
.wp-element-button {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  min-height:50px;
  padding:14px 22px;
  border-radius:999px;
  border:1px solid transparent;
  background:var(--opc-seafoam);
  color:var(--opc-deep) !important;
  text-decoration:none;
  font-weight:850;
  line-height:1.1;
  box-shadow:none;
  transition:transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease;
}
.opc-button:hover,
.wp-block-button__link:hover,
.wp-block-button.is-style-opc-primary .wp-block-button__link:hover {
  transform:translateY(-1px);
  background:var(--opc-seafoam-2);
  box-shadow:0 12px 28px rgba(22,156,189,.22);
}
.wp-block-button.is-style-opc-dark .wp-block-button__link,
.opc-button--dark { background:var(--opc-ink); color:white !important; }
.wp-block-button.is-style-opc-dark .wp-block-button__link:hover,
.opc-button--dark:hover { background:var(--opc-ink-2); }
.wp-block-button.is-style-opc-outline .wp-block-button__link,
.opc-button--outline { background:transparent; color:var(--opc-ink) !important; border-color:rgba(7,52,74,.25); }
.opc-section--ink .wp-block-button.is-style-opc-outline .wp-block-button__link,
.opc-section--ink .opc-button--outline { color:white !important; border-color:rgba(255,255,255,.36); }

/* Global block-first design */
.opc-section { padding-top:clamp(72px,8vw,112px); padding-bottom:clamp(72px,8vw,112px); }
.opc-section--compact { padding-top:56px; padding-bottom:56px; }
.opc-section--soft { background:var(--opc-fog); }
.opc-section--aqua { background:linear-gradient(180deg,#e8f9fc 0%,#f8fcfd 100%); }
.opc-section--ink { background:var(--opc-deep); color:white; }
.opc-section--ink p { color:rgba(255,255,255,.74); }
.opc-kicker {
  color:var(--opc-teal);
  font-size:12px;
  line-height:1.3;
  font-weight:900;
  letter-spacing:.15em;
  text-transform:uppercase;
  margin-bottom:14px !important;
}
.opc-section--ink .opc-kicker { color:var(--opc-seafoam); }
.opc-display,
.opc-heading,
.opc-card h3,
.opc-page-hero h1 {
  color:var(--opc-ink);
  letter-spacing:-.045em;
  line-height:.98;
  text-wrap:balance;
}
.opc-section--ink .opc-display,
.opc-section--ink .opc-heading,
.opc-section--ink h2,
.opc-section--ink h3 { color:white; }
.opc-display { font-size:clamp(48px,6.4vw,82px); font-weight:850; margin:0 0 22px; }
.opc-heading { font-size:clamp(34px,4.5vw,58px); font-weight:820; margin:0 0 18px; }
.opc-subheading { font-size:clamp(22px,2.2vw,30px); font-weight:800; color:var(--opc-ink); line-height:1.1; letter-spacing:-.025em; }
.opc-lead { font-size:clamp(18px,1.9vw,22px); line-height:1.55; color:var(--opc-muted); max-width:760px; }
.opc-section--ink .opc-lead { color:rgba(255,255,255,.75); }
.opc-copy { color:var(--opc-muted); }
.opc-rule { height:1px; background:var(--opc-border); border:0; }

/* Hero */
.opc-hero-section {
  position:relative;
  overflow:hidden;
  padding-top:clamp(72px,8vw,116px);
  padding-bottom:clamp(74px,8vw,118px);
  background:
    radial-gradient(circle at 82% 22%, rgba(71,214,232,.20), transparent 28%),
    radial-gradient(circle at 8% 82%, rgba(22,156,189,.18), transparent 30%),
    linear-gradient(135deg, var(--opc-deep) 0%, #073a52 58%, #0a4b64 100%);
  color:white;
}
.opc-hero-section::before {
  content:"";
  position:absolute;
  inset:-60px auto auto -60px;
  width:360px;
  height:260px;
  opacity:.12;
  background:
    linear-gradient(90deg,transparent 0 22%,var(--opc-seafoam) 22% 44%,transparent 44% 66%,var(--opc-seafoam) 66% 88%,transparent 88%),
    linear-gradient(0deg,transparent 0 22%,var(--opc-seafoam) 22% 44%,transparent 44% 66%,var(--opc-seafoam) 66% 88%,transparent 88%);
  transform:rotate(-8deg);
}
.opc-hero-section > * { position:relative; z-index:1; }
.opc-hero-section .opc-display { color:white; }
.opc-hero-section .opc-lead { color:rgba(255,255,255,.78); }
.opc-hero-layout { align-items:center !important; gap:clamp(34px,5vw,72px); }
.opc-hero-actions { margin-top:28px; }
.opc-hero-meta { display:flex; flex-wrap:wrap; gap:10px 18px; margin-top:28px; }
.opc-hero-meta p { margin:0 !important; color:rgba(255,255,255,.72); font-size:13px; font-weight:750; }
.opc-hero-meta p::before { content:"✓"; color:var(--opc-seafoam); font-weight:950; margin-right:7px; }
.opc-media-placeholder {
  position:relative;
  min-height:500px;
  overflow:hidden;
  border-radius:var(--opc-radius-lg);
  border:1px solid rgba(255,255,255,.16);
  background:
    linear-gradient(180deg,rgba(4,39,55,.03),rgba(4,39,55,.74)),
    radial-gradient(circle at 75% 30%,rgba(71,214,232,.34),transparent 32%),
    linear-gradient(135deg,#167d9b,#083a50 66%,#042737);
  box-shadow:0 40px 100px rgba(0,0,0,.28);
}
.opc-media-placeholder::after {
  content:"";
  position:absolute;
  inset:18px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:calc(var(--opc-radius-lg) - 10px);
  pointer-events:none;
}
.opc-media-placeholder .wp-block-group__inner-container,
.opc-media-placeholder > .wp-block-group { height:100%; }
.opc-media-placeholder p { color:white !important; }
.opc-media-placeholder .opc-media-label { font-size:12px; letter-spacing:.14em; text-transform:uppercase; font-weight:900; color:var(--opc-seafoam) !important; }
.opc-media-placeholder .opc-media-title { font-size:24px; font-weight:800; max-width:280px; line-height:1.15; }

/* Trust strip */
.opc-trust-strip { background:white; border-bottom:1px solid var(--opc-border); }
.opc-trust-strip .wp-block-columns { margin-bottom:0; }
.opc-trust-item { padding:24px 12px; text-align:center; border-right:1px solid var(--opc-border); }
.opc-trust-item:last-child { border-right:0; }
.opc-trust-item strong { display:block; color:var(--opc-ink); font-size:14px; }
.opc-trust-item span { color:var(--opc-muted); font-size:12px; }

/* Cards */
.opc-card,
.wp-block-group.is-style-opc-card {
  height:100%;
  border:1px solid var(--opc-border);
  border-radius:var(--opc-radius);
  padding:clamp(24px,3vw,34px);
  background:white;
  box-shadow:0 12px 38px rgba(6,40,58,.05);
}
.opc-card--elevated { box-shadow:var(--opc-shadow-sm); }
.opc-card--dark { background:var(--opc-ink-2); border-color:rgba(255,255,255,.12); color:white; }
.opc-card--dark h3 { color:white; }
.opc-card--dark p { color:rgba(255,255,255,.74); }
.opc-card-number { font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--opc-teal); font-weight:900; }
.opc-card h3 { margin-top:8px; margin-bottom:12px; font-size:clamp(23px,2vw,30px); }
.opc-card p:last-child { margin-bottom:0; }
.opc-card-link { display:inline-flex; align-items:center; gap:8px; color:var(--opc-teal); font-weight:850; text-decoration:none; }
.opc-card-link::after { content:"→"; transition:transform .16s ease; }
.opc-card-link:hover::after { transform:translateX(3px); }

/* Checklist / pills */
.opc-check-list { list-style:none; padding-left:0; }
.opc-check-list li { position:relative; padding-left:28px; margin:11px 0; }
.opc-check-list li::before { content:"✓"; position:absolute; left:0; top:0; color:var(--opc-teal); font-weight:950; }
.opc-pills { display:flex; flex-wrap:wrap; gap:10px; }
.opc-pill { padding:9px 13px; border-radius:999px; border:1px solid var(--opc-border); background:white; color:var(--opc-ink); font-size:13px; font-weight:800; }

/* Service report showcase */
.opc-report-shell {
  border-radius:var(--opc-radius-lg);
  padding:clamp(20px,3vw,34px);
  background:linear-gradient(180deg,#fff 0%,#f3fbfd 100%);
  color:var(--opc-text);
  border:1px solid rgba(255,255,255,.50);
  box-shadow:0 40px 95px rgba(0,0,0,.24);
}
.opc-report-head { padding-bottom:18px; border-bottom:1px solid var(--opc-border); }
.opc-report-brand { color:var(--opc-ink) !important; font-weight:900; margin:0 !important; }
.opc-report-meta { color:var(--opc-muted) !important; font-size:13px; margin:.3rem 0 0 !important; }
.opc-report-row { padding:13px 0; border-bottom:1px solid #e5f0f4; margin:0 !important; }
.opc-report-status { display:inline-block; padding:5px 9px; border-radius:999px; background:#ddf7fb; color:#08758a !important; font-size:11px; font-weight:900; }
.opc-report-photo { min-height:100px; border-radius:12px; background:linear-gradient(135deg,#e7f2f5,#fafcfd); display:grid; place-items:center; color:var(--opc-muted); font-size:11px; font-weight:800; }

/* FAQ */
.opc-faq .wp-block-details { border-top:1px solid var(--opc-border); padding:20px 0; }
.opc-faq .wp-block-details:last-child { border-bottom:1px solid var(--opc-border); }
.opc-faq summary { cursor:pointer; color:var(--opc-ink); font-size:18px; font-weight:850; }
.opc-faq .wp-block-details p { color:var(--opc-muted); max-width:780px; }

/* Page template */
.opc-page-hero {
  padding:46px 0 38px;
  background:linear-gradient(180deg,#e8f7fb 0%,#f9fcfd 100%);
  border-bottom:1px solid var(--opc-border);
}
.opc-page-hero h1 { font-size:clamp(40px,4vw,52px); margin:0; line-height:1.02; }
.opc-page-content { padding:54px 0 100px; }
.opc-page-content > * { width:min(calc(100% - 48px), var(--opc-content)); margin-left:auto; margin-right:auto; }
.opc-page-content > .alignwide { width:min(calc(100% - 48px),var(--opc-container)); }
.opc-page-content > .alignfull { width:100%; max-width:none; }

/* Footer */
.opc-site-footer { position:relative; overflow:hidden; background:var(--opc-deep); color:rgba(255,255,255,.72); padding:72px 0 28px; }
.opc-site-footer::before { content:""; position:absolute; width:420px; height:420px; right:-170px; top:-210px; border-radius:50%; background:rgba(71,214,232,.10); }
.opc-footer-grid { position:relative; display:grid; grid-template-columns:1.45fr .9fr .9fr .9fr; gap:46px; }
.opc-footer-brand { display:block; width:min(100%,320px); filter:brightness(0) invert(1); opacity:.96; margin-bottom:22px; }
.opc-footer-title { color:white; font-weight:850; margin-bottom:14px; }
.opc-site-footer a { color:rgba(255,255,255,.82); text-decoration:none; }
.opc-site-footer a:hover { color:var(--opc-seafoam); }
.opc-footer-list { list-style:none; padding:0; margin:0; }
.opc-footer-list li { margin:9px 0; }
.opc-footer-bottom { position:relative; margin-top:48px; padding-top:22px; border-top:1px solid rgba(255,255,255,.12); display:flex; justify-content:space-between; gap:24px; font-size:12px; }

/* Editor helpers */
.block-editor-block-list__layout .opc-section { margin-top:0; margin-bottom:0; }

@media (max-width: 1100px) {
  .opc-header-actions .opc-phone { display:none; }
  .opc-nav .menu { gap:18px; }
}
@media (max-width: 980px) {
  .admin-bar .opc-site-header { top:46px; }
  .opc-header-inner { min-height:78px; }
  .opc-brand-logo,.opc-brand .custom-logo { width:240px; max-height:54px; }
  .opc-nav { display:none; position:absolute; top:78px; left:0; right:0; max-height:calc(100vh - 78px); overflow:auto; background:white; padding:20px 24px 26px; border-bottom:1px solid var(--opc-border); box-shadow:0 18px 40px rgba(7,52,74,.08); }
  .opc-nav.is-open { display:block; }
  .opc-nav .menu { flex-direction:column; align-items:stretch; gap:4px; }
  .opc-nav .menu > li { width:100%; }
  .opc-nav .menu > li > a { width:100%; min-height:auto; padding:10px 0; font-size:16px; }
  .opc-nav .menu > li > a::after { display:none; }
  .opc-nav .sub-menu { position:static; min-width:0; width:100%; margin:0 0 7px; padding:2px 0 4px 14px; border:0; border-left:1px solid var(--opc-border); border-radius:0; background:transparent; box-shadow:none; opacity:1; visibility:visible; pointer-events:auto; transform:none; transition:none; }
  .opc-nav .sub-menu::before { display:none; }
  .opc-nav .sub-menu a { padding:7px 10px; white-space:normal; font-size:14px; color:var(--opc-muted); }
  .opc-nav .sub-menu a:hover, .opc-nav .sub-menu .current-menu-item > a { background:var(--opc-fog); color:var(--opc-teal); }
  .opc-mobile-toggle { display:block; }
  .opc-header-actions .opc-button { display:none; }
  .opc-footer-grid { grid-template-columns:1.25fr 1fr 1fr; }
  .opc-footer-grid > :last-child { grid-column:2 / 4; }
  .opc-media-placeholder { min-height:410px; }
}
@media (max-width: 782px) {
  .admin-bar .opc-site-header { top:46px; }
}
@media (max-width: 700px) {
  .opc-container,.entry-content > .alignwide,.entry-content > .wp-block-group.alignwide,.entry-content > .wp-block-columns.alignwide,.entry-content > .wp-block-cover.alignwide { width:min(calc(100% - 28px),var(--opc-container)); }
  .opc-header-inner { min-height:72px; gap:12px; }
  .opc-nav { top:72px; }
  .opc-brand-logo,.opc-brand .custom-logo { width:205px; max-height:48px; }
  .opc-section { padding-top:68px; padding-bottom:68px; }
  .opc-hero-section { padding-top:62px; padding-bottom:66px; }
  .opc-display { font-size:clamp(42px,13vw,62px); }
  .opc-heading { font-size:clamp(34px,10vw,48px); }
  .opc-page-hero { padding:32px 0 28px; }
  .opc-page-hero h1 { font-size:clamp(32px,9vw,36px); line-height:1.05; }
  .opc-page-content { padding-top:42px; }
  .opc-media-placeholder { min-height:330px; }
  .opc-trust-item { border-right:0; border-bottom:1px solid var(--opc-border); }
  .opc-footer-grid { grid-template-columns:1fr; }
  .opc-footer-grid > :last-child { grid-column:auto; }
  .opc-footer-bottom { flex-direction:column; }
}

/* =========================================================
   v0.2.4 - Mobile optimization pass
   Desktop styles above are intentionally unchanged.
   ========================================================= */

/* Optional utilities for page-level mobile copy tuning. */
.opc-mobile-only { display:none !important; }

@media (max-width: 700px) {
  /* Core mobile rhythm */
  body { line-height:1.55; }

  .opc-container,
  .entry-content > .alignwide,
  .entry-content > .wp-block-group.alignwide,
  .entry-content > .wp-block-columns.alignwide,
  .entry-content > .wp-block-cover.alignwide {
    width:min(calc(100% - 28px),var(--opc-container));
  }

  .entry-content .wp-block-columns {
    row-gap:24px;
    margin-bottom:0;
  }

  .opc-section {
    padding-top:48px;
    padding-bottom:48px;
  }

  .opc-section--compact {
    padding-top:34px;
    padding-bottom:34px;
  }

  .opc-kicker {
    font-size:11px;
    line-height:1.35;
    letter-spacing:.14em;
    margin-bottom:10px !important;
  }

  .opc-display,
  .opc-hero-section .opc-display,
  .opc-home-hero .opc-display {
    font-size:clamp(38px,10.5vw,44px) !important;
    line-height:1.01 !important;
    letter-spacing:-.04em;
    margin-bottom:16px;
  }

  .opc-heading {
    font-size:clamp(30px,8.6vw,36px) !important;
    line-height:1.04 !important;
    letter-spacing:-.04em;
    margin-bottom:14px;
  }

  .opc-subheading { font-size:23px; line-height:1.12; }

  .opc-lead,
  .opc-home-hero .opc-lead {
    font-size:18px !important;
    line-height:1.46 !important;
    margin-top:0;
    margin-bottom:16px;
  }

  .opc-section p:not(.opc-kicker):not(.opc-card-number),
  .opc-hero-section p:not(.opc-kicker):not(.opc-card-number) {
    margin-top:.7em;
    margin-bottom:.7em;
  }

  /* Shorter non-home page title band. */
  .opc-page-hero {
    padding:22px 0 20px !important;
  }

  .opc-page-hero .opc-kicker {
    margin-bottom:7px !important;
    font-size:10px;
  }

  .opc-page-hero h1 {
    font-size:clamp(28px,8vw,32px) !important;
    line-height:1.04 !important;
    letter-spacing:-.035em;
  }

  /* Full-width sections already carry their own vertical space. */
  .opc-page-content {
    padding-top:0 !important;
    padding-bottom:60px;
  }

  .opc-page-content > :not(.alignfull):first-child {
    margin-top:30px;
  }

  /* Homepage hero: get the offer and CTA on screen faster. */
  .opc-hero-section {
    padding-top:40px !important;
    padding-bottom:44px !important;
  }

  .opc-hero-layout { gap:24px !important; }
  .opc-hero-actions { margin-top:20px; }
  .opc-hero-meta { margin-top:20px; }

  .opc-front-page .opc-home-hero .wp-block-column:first-child > p:not(.opc-kicker):not(.opc-lead) {
    display:none;
  }

  .opc-home-speed-promise {
    margin-top:16px !important;
    padding:14px 15px !important;
    border-radius:14px !important;
  }

  .opc-home-speed-promise strong {
    font-size:16px !important;
    line-height:1.35;
  }

  .opc-home-speed-promise p {
    font-size:14px !important;
    line-height:1.45 !important;
  }

  .opc-home-speed-caveat {
    margin-top:6px !important;
    font-size:11px !important;
    line-height:1.45 !important;
  }

  /* Keep photo proof without letting portrait images eat a full screen. */
  figure[class*="-hero-image"] img,
  .opc-home-hero-image img {
    width:100%;
    aspect-ratio:16 / 10 !important;
    max-height:360px;
    object-fit:cover !important;
    object-position:center center;
    border-radius:18px !important;
  }

  .opc-home-hero-image { margin-top:18px !important; }

  /* Buttons are easier to tap and scan on narrow screens. */
  .opc-hero-section .wp-block-buttons,
  .opc-home-final-cta .wp-block-buttons,
  .opc-section--ink .wp-block-buttons {
    gap:10px;
  }

  .opc-hero-section .wp-block-button,
  .opc-home-final-cta .wp-block-button {
    width:100%;
  }

  .opc-hero-section .wp-block-button__link,
  .opc-home-final-cta .wp-block-button__link {
    width:100%;
    min-height:48px;
    padding:13px 18px;
    text-align:center;
  }

  /* 2 x 2 trust strip instead of four tall rows. */
  .opc-trust-strip .wp-block-columns {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:0 !important;
    width:100% !important;
  }

  .opc-trust-strip .wp-block-column {
    min-width:0;
    flex-basis:auto !important;
  }

  .opc-trust-item {
    min-height:108px;
    padding:20px 10px !important;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border-right:0 !important;
    border-bottom:0 !important;
  }

  .opc-trust-strip .wp-block-column:nth-child(odd) .opc-trust-item {
    border-right:1px solid var(--opc-border) !important;
  }

  .opc-trust-strip .wp-block-column:nth-child(-n+2) .opc-trust-item {
    border-bottom:1px solid var(--opc-border) !important;
  }

  .opc-trust-item strong {
    font-size:14px;
    line-height:1.25;
  }

  .opc-trust-item span {
    margin-top:5px;
    font-size:12px;
    line-height:1.35;
  }

  /* Cards: less padding and shorter media on phones. */
  .opc-card,
  .wp-block-group.is-style-opc-card {
    height:auto;
    padding:20px !important;
    border-radius:20px;
  }

  .opc-card h3 {
    margin-top:6px;
    margin-bottom:10px;
    font-size:clamp(22px,6.5vw,26px) !important;
    line-height:1.08;
  }

  .opc-card-number {
    font-size:11px;
    line-height:1.35;
    margin-bottom:7px !important;
  }

  .opc-check-list { margin-top:12px; margin-bottom:14px; }
  .opc-check-list li { padding-left:25px; margin:7px 0; line-height:1.45; }

  .opc-card .wp-block-image { margin-bottom:17px !important; }
  .opc-card .wp-block-image img {
    aspect-ratio:16 / 10 !important;
    object-fit:cover !important;
    border-radius:14px !important;
  }

  /* Compact the page-specific white promise/intro shells already in use. */
  .opc-about-speed-card,
  .opc-area-speed-card,
  .opc-services-speed-card,
  .opc-local-promise,
  .opc-fleet-promise,
  .opc-contact-intro-card,
  .opc-contact-form-wrap,
  .opc-report-hero-card,
  .opc-report-full-preview,
  .opc-maintenance-loop-card,
  .opc-referral-reward {
    padding:18px !important;
    border-radius:20px !important;
  }

  /* Report previews stay useful but stop dominating a full mobile screen. */
  .opc-report-shell {
    padding:14px !important;
    border-radius:20px;
  }

  .opc-report-shell .wp-block-columns { row-gap:12px; }
  .opc-report-shell .opc-card-number { margin-bottom:10px !important; }

  .opc-home-report-page-two { display:none !important; }
  .opc-home-report-shell .wp-block-columns { display:block !important; }
  .opc-home-report-shell .wp-block-column { width:100% !important; flex-basis:100% !important; }

  /* FAQ scanability. */
  .opc-faq .wp-block-details { padding:15px 0; }
  .opc-faq summary { font-size:16px; line-height:1.35; }
  .opc-faq .wp-block-details p { font-size:15px; line-height:1.5; }

  /* Remove the CSS-generated second arrow on mobile when page copy includes one. */
  .opc-card-link::after { content:none !important; }

  /* Lower footer height on phones. */
  .opc-site-footer { padding:50px 0 24px; }
  .opc-footer-grid { gap:30px; }
  .opc-footer-bottom { margin-top:34px; }

  /* Utility classes for selective mobile copy in the final content pass. */
  .opc-desktop-only { display:none !important; }
  .opc-mobile-only { display:block !important; }
}

@media (max-width: 420px) {
  .opc-container,
  .entry-content > .alignwide,
  .entry-content > .wp-block-group.alignwide,
  .entry-content > .wp-block-columns.alignwide,
  .entry-content > .wp-block-cover.alignwide {
    width:min(calc(100% - 22px),var(--opc-container));
  }

  .opc-header-inner { min-height:68px; }
  .opc-nav { top:68px; }
  .opc-brand-logo,
  .opc-brand .custom-logo { width:188px; max-height:44px; }
  .opc-mobile-toggle { width:42px; height:42px; }

  .opc-display,
  .opc-hero-section .opc-display,
  .opc-home-hero .opc-display {
    font-size:clamp(36px,10.2vw,42px) !important;
  }

  .opc-heading { font-size:clamp(29px,8.3vw,34px) !important; }
  .opc-page-hero h1 { font-size:clamp(27px,7.7vw,31px) !important; }

  .opc-section { padding-top:44px; padding-bottom:44px; }
  .opc-section--compact { padding-top:30px; padding-bottom:30px; }
  .opc-hero-section { padding-top:34px !important; padding-bottom:40px !important; }

  .opc-trust-item { min-height:100px; padding:17px 8px !important; }
  .opc-card, .wp-block-group.is-style-opc-card { padding:18px !important; }

  figure[class*="-hero-image"] img,
  .opc-home-hero-image img { max-height:315px; }
}


/* =========================================================
   v0.2.5 - Compact inner-page title + stronger mobile pass
   Desktop page layouts/content remain unchanged except the
   deliberately smaller non-home title band and removed double
   top-spacing before the first full-width content section.
   ========================================================= */

/* Compact inner-page title band on ALL screen sizes. */
body:not(.home) .opc-page-hero,
body:not(.opc-front-page) .opc-page-hero {
  padding: 20px 0 18px !important;
}

body:not(.home) .opc-page-hero .opc-kicker,
body:not(.opc-front-page) .opc-page-hero .opc-kicker {
  margin: 0 0 6px !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
  letter-spacing: .13em !important;
}

body:not(.home) .opc-page-hero h1,
body:not(.opc-front-page) .opc-page-hero h1 {
  margin: 0 !important;
  font-size: clamp(30px, 2.75vw, 38px) !important;
  line-height: 1.02 !important;
  letter-spacing: -.035em !important;
}

/* Full-width page sections already own their vertical spacing.
   Avoid stacking 54px of template padding above them. */
.opc-page-content {
  padding-top: 0 !important;
  padding-bottom: 88px;
}

.opc-page-content > :not(.alignfull):first-child {
  margin-top: 46px;
}

/* Strong cache-independent specificity for phone layouts. */
@media screen and (max-width: 700px) {
  html body .opc-page-hero {
    padding: 12px 0 12px !important;
  }

  html body .opc-page-hero .opc-container {
    width: min(calc(100% - 24px), var(--opc-container)) !important;
  }

  html body .opc-page-hero .opc-kicker {
    margin-bottom: 4px !important;
    font-size: 9px !important;
    line-height: 1.15 !important;
  }

  html body .opc-page-hero h1 {
    font-size: clamp(25px, 7.2vw, 29px) !important;
    line-height: 1.03 !important;
  }

  html body .opc-page-content {
    padding-top: 0 !important;
    padding-bottom: 50px !important;
  }

  html body .opc-page-content > :not(.alignfull):first-child {
    margin-top: 24px !important;
  }

  /* Tighter site rhythm on phones. */
  html body .opc-section {
    padding-top: 36px !important;
    padding-bottom: 36px !important;
  }

  html body .opc-section--compact {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }

  html body .opc-hero-section,
  html body .opc-home-hero {
    padding-top: 28px !important;
    padding-bottom: 32px !important;
  }

  html body .opc-home-hero .opc-display,
  html body .opc-hero-section .opc-display,
  html body .opc-display {
    font-size: clamp(32px, 9vw, 38px) !important;
    line-height: 1.00 !important;
    letter-spacing: -.04em !important;
    margin-bottom: 13px !important;
  }

  html body .opc-heading {
    font-size: clamp(27px, 7.7vw, 32px) !important;
    line-height: 1.03 !important;
    margin-bottom: 11px !important;
  }

  html body .opc-card h3,
  html body .wp-block-group.is-style-opc-card h3 {
    font-size: clamp(21px, 6vw, 24px) !important;
    line-height: 1.08 !important;
  }

  html body .opc-lead,
  html body .opc-home-hero .opc-lead {
    font-size: 17px !important;
    line-height: 1.42 !important;
    margin-bottom: 12px !important;
  }

  html body .opc-kicker {
    font-size: 10px !important;
    line-height: 1.25 !important;
    letter-spacing: .12em !important;
    margin-bottom: 8px !important;
  }

  /* Hide only the extra location paragraph in the homepage hero.
     The core offer, CTA, proof strip and caveat remain visible. */
  html body .opc-home-hero .opc-lead + p {
    display: none !important;
  }

  html body .opc-home-speed-promise {
    margin-top: 13px !important;
    padding: 12px 13px !important;
    border-radius: 14px !important;
  }

  html body .opc-home-speed-promise strong {
    font-size: 15px !important;
    line-height: 1.28 !important;
    margin-bottom: 3px !important;
  }

  html body .opc-home-speed-promise p {
    font-size: 13px !important;
    line-height: 1.35 !important;
    margin: 0 !important;
  }

  html body .opc-home-speed-caveat {
    display: block !important;
    margin-top: 5px !important;
    font-size: 10px !important;
    line-height: 1.35 !important;
  }

  /* Homepage CTAs: one clear action per row. */
  html body .opc-home-hero .wp-block-buttons,
  html body .opc-home-final-cta .wp-block-buttons {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    width: 100% !important;
    margin-top: 16px !important;
  }

  html body .opc-home-hero .wp-block-button,
  html body .opc-home-final-cta .wp-block-button,
  html body .opc-home-hero .wp-block-button__link,
  html body .opc-home-final-cta .wp-block-button__link {
    width: 100% !important;
  }

  html body .opc-home-hero .wp-block-button__link,
  html body .opc-home-final-cta .wp-block-button__link {
    min-height: 44px !important;
    padding: 11px 16px !important;
    font-size: 15px !important;
  }

  /* Compact 2x2 hero proof grid. */
  html body .opc-home-hero .opc-hero-meta {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 8px 12px !important;
    margin-top: 16px !important;
  }

  html body .opc-home-hero .opc-hero-meta p {
    font-size: 12px !important;
    line-height: 1.3 !important;
    white-space: normal !important;
  }

  /* Hero proof image should support the offer, not become a full screen. */
  html body .opc-home-hero-image img,
  html body figure[class*="-hero-image"] img {
    width: 100% !important;
    height: 230px !important;
    min-height: 0 !important;
    max-height: 230px !important;
    aspect-ratio: auto !important;
    object-fit: cover !important;
    object-position: center center !important;
    border-radius: 17px !important;
  }

  html body .opc-home-hero-image,
  html body figure[class*="-hero-image"] {
    margin-top: 14px !important;
  }

  /* Force trust strip to a compact 2x2 grid even when core Columns
     tries to stack each column at tablet/mobile widths. */
  html body .opc-trust-strip > .wp-block-columns,
  html body .opc-trust-strip .wp-block-columns.alignwide,
  .editor-styles-wrapper .opc-trust-strip > .wp-block-columns {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
    width: 100% !important;
  }

  html body .opc-trust-strip .wp-block-column,
  .editor-styles-wrapper .opc-trust-strip .wp-block-column {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    flex-basis: auto !important;
    margin: 0 !important;
  }

  html body .opc-trust-strip .opc-trust-item,
  .editor-styles-wrapper .opc-trust-strip .opc-trust-item {
    min-height: 82px !important;
    padding: 13px 7px !important;
    text-align: center !important;
  }

  html body .opc-trust-strip .wp-block-column:nth-child(odd) .opc-trust-item,
  .editor-styles-wrapper .opc-trust-strip .wp-block-column:nth-child(odd) .opc-trust-item {
    border-right: 1px solid var(--opc-border) !important;
  }

  html body .opc-trust-strip .wp-block-column:nth-child(-n+2) .opc-trust-item,
  .editor-styles-wrapper .opc-trust-strip .wp-block-column:nth-child(-n+2) .opc-trust-item {
    border-bottom: 1px solid var(--opc-border) !important;
  }

  html body .opc-trust-item strong,
  .editor-styles-wrapper .opc-trust-item strong {
    font-size: 13px !important;
    line-height: 1.2 !important;
  }

  html body .opc-trust-item span,
  .editor-styles-wrapper .opc-trust-item span {
    font-size: 11px !important;
    line-height: 1.25 !important;
    margin-top: 3px !important;
  }

  /* Cards must scan quickly. */
  html body .opc-card,
  html body .wp-block-group.is-style-opc-card {
    padding: 16px !important;
    border-radius: 18px !important;
    min-height: 0 !important;
    height: auto !important;
  }

  html body .opc-card-number {
    margin-bottom: 5px !important;
    font-size: 10px !important;
  }

  html body .opc-card p:not(.opc-card-number) {
    font-size: 15px !important;
    line-height: 1.45 !important;
  }

  html body .opc-card .opc-check-list {
    margin: 9px 0 11px !important;
  }

  html body .opc-card .opc-check-list li {
    margin: 5px 0 !important;
    line-height: 1.35 !important;
  }

  html body .opc-card .wp-block-image {
    margin-bottom: 13px !important;
  }

  html body .opc-card .wp-block-image img,
  html body .opc-home-service-image img {
    width: 100% !important;
    height: 190px !important;
    max-height: 190px !important;
    aspect-ratio: auto !important;
    object-fit: cover !important;
    border-radius: 13px !important;
  }

  /* Less empty air inside the 'why we move fast' card grid. */
  html body .opc-home-fast-card {
    padding: 15px !important;
  }

  html body .opc-home-fast-card h3 {
    margin: 0 0 5px !important;
  }

  html body .opc-home-fast-card p {
    margin: 0 !important;
  }

  /* Dedicated report preview remains visible but shorter. */
  html body .opc-home-report-shell,
  html body .opc-report-shell {
    padding: 12px !important;
    border-radius: 18px !important;
  }

  html body .opc-home-report-page-two {
    display: none !important;
  }

  html body .opc-home-report-shell .wp-block-columns {
    display: block !important;
  }

  html body .opc-home-report-image img {
    max-height: 460px !important;
    object-fit: contain !important;
  }

  /* Mobile content links should never show a duplicate arrow. */
  html body .opc-card-link::after,
  .editor-styles-wrapper .opc-card-link::after {
    content: none !important;
  }

  /* Tighten FAQs and footer. */
  html body .opc-faq .wp-block-details {
    padding: 13px 0 !important;
  }

  html body .opc-faq summary {
    font-size: 15px !important;
    line-height: 1.3 !important;
  }

  html body .opc-faq .wp-block-details p {
    font-size: 14px !important;
    line-height: 1.45 !important;
  }

  html body .opc-site-footer {
    padding-top: 42px !important;
  }
}

@media screen and (max-width: 420px) {
  html body .opc-home-hero .opc-display,
  html body .opc-hero-section .opc-display,
  html body .opc-display {
    font-size: 34px !important;
  }

  html body .opc-heading {
    font-size: 28px !important;
  }

  html body .opc-page-hero h1 {
    font-size: 26px !important;
  }

  html body .opc-home-hero-image img,
  html body figure[class*="-hero-image"] img {
    height: 205px !important;
    max-height: 205px !important;
  }

  html body .opc-card .wp-block-image img,
  html body .opc-home-service-image img {
    height: 172px !important;
    max-height: 172px !important;
  }
}