/* Open service rows with a restrained light field behind the content. */
.homepage #services .service-deck.service-rows { display: grid; grid-template-columns: minmax(0,1fr); gap: clamp(12px,1.7vw,18px); }
.homepage #services .service-rows .service-panel,
.homepage #services .service-rows .service-panel + .service-panel { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr) 48px; align-items: center; gap: clamp(24px,4vw,60px); min-height: 0; padding: clamp(26px,3.5vw,44px) clamp(24px,3vw,38px); border: 1px solid rgba(232,232,227,.23); border-radius: 18px; background: radial-gradient(circle at 8% 0%,rgba(255,125,55,.09),transparent 38%),linear-gradient(125deg,rgba(30,29,27,.97),rgba(14,17,17,.97)); box-shadow: inset 3px 0 0 rgba(244,119,46,.56),0 18px 42px rgba(0,0,0,.23); text-decoration: none; transition: transform .25s ease,border-color .25s ease,box-shadow .25s ease; }
.homepage #services .service-rows .service-panel:last-child { border-bottom-color: rgba(232,232,227,.23); }
.homepage #services .service-rows .service-panel::before { content: ''; position: absolute; z-index: -1; inset: 0; width: auto; height: auto; background: radial-gradient(ellipse 340px 230px at var(--glow-x,60%) var(--glow-y,50%),rgba(244,119,46,.17),rgba(244,119,46,.035) 60%,transparent 85%); opacity: 0; transform: none; pointer-events: none; transition: opacity .3s ease; }
.homepage #services .service-rows .service-panel::after { display: none; }
.homepage #services .service-rows .service-panel:hover,
.homepage #services .service-rows .service-panel:focus-visible { border-color: rgba(255,157,101,.62); box-shadow: inset 3px 0 0 #f47b36,0 22px 48px rgba(0,0,0,.32),0 0 30px rgba(244,119,46,.10); transform: translateY(-3px); }
.homepage #services .service-rows .service-panel:hover::before,
.homepage #services .service-rows .service-panel:focus-visible::before,
.homepage #services .service-rows .service-panel.is-tapped::before { opacity: 1; transform: none; }
.homepage #services .service-rows .service-panel:focus-visible { outline: 2px solid #f47b36; outline-offset: 5px; }
.homepage #services .service-rows .service-panel-copy { margin: 0; min-width: 0; }
.homepage #services .service-rows .service-row-kicker { display: block; color: #f29a66; font: 600 .78rem/1.5 var(--body); margin-bottom: 14px; }
.homepage #services .service-rows h3 { max-width: none; font: 600 clamp(2rem,3.5vw,3.45rem)/1.08 var(--body); letter-spacing: -.055em; color: #f0f2f0; }
.homepage #services .service-rows .service-panel-copy p { max-width: 44ch; margin-top: 16px; font-size: 1rem; line-height: 1.7; }
.homepage #services .service-rows .service-panel-link { display: block; padding: 0; margin-top: 22px; border: 0; color: #e8ece9; font-size: .85rem; }
.service-row-arrow { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: rgba(244,119,46,.09); color: #f47b36; font-size: 1.6rem; transition: background .25s ease,color .25s ease,transform .25s ease; }
.service-panel:hover .service-row-arrow,.service-panel:focus-visible .service-row-arrow { background: #f47b36; color: #111314; transform: translate(2px,-2px); }
.service-row-visual { position: relative; display: flex; flex-direction: column; gap: 16px; min-width: 0; width: 100%; max-width: 440px; margin: 0; color: #e6eae7; }
.service-visual-caption { font-size: .7rem; color: #a6b1ad; letter-spacing: .03em; }
.service-row-site img { display: block; width: 100%; height: auto; aspect-ratio: 1.8; object-fit: cover; object-position: top; border-radius: 6px; box-shadow: 0 18px 38px #0005; }
.service-row-search,.service-row-messages { padding: 12px 10px; }
.service-search-query { display: flex; align-items: center; gap: 12px; border: 1px solid #ffffff25; border-radius: 28px; padding: 12px 16px; color: #c8d0cb; font-size: .85rem; }
.service-search-query > span { color: #f47b36; font-size: 1.4rem; line-height: 1; }
.service-search-result { display: flex; flex-direction: column; gap: 8px; padding: 4px 14px; border-left: 2px solid #f47b36; }
.service-search-result strong { font-size: 1rem; font-weight: 600; }
.service-search-result > span { color: #9eaba5; font-size: .8rem; }
.service-mini-enquiry { display: flex; justify-content: space-between; padding: 12px 0; color: #f29a66; font-size: .8rem; }
.service-mini-message { align-self: flex-start; padding: 14px 18px; border-radius: 4px 14px 14px; background: #ffffff08; border: 1px solid #ffffff18; font-size: .9rem; }
.service-mini-reply { align-self: flex-end; color: #f29a66; font-size: .8rem; padding: 12px 16px; border-left: 2px solid #f47b36; background: #f47b3608; }
.service-mini-lead { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding-top: 16px; border-top: 1px solid #ffffff20; font-size: .85rem; }
.service-mini-lead small { margin-left: auto; color: #a3b0a9; font-size: .7rem; }
.service-mini-dot { width: 6px; height: 6px; border-radius: 50%; background: #f47b36; box-shadow: 0 0 12px #f47b3655; }
@media(max-width:700px) {
 .homepage #services .service-rows .service-panel,
 .homepage #services .service-rows .service-panel + .service-panel { grid-template-columns: minmax(0,1fr) 44px; gap: 24px 16px; padding: 28px 24px; }
 .service-row-visual { grid-column: 1 / -1; max-width: 520px; }
 .service-row-arrow { width: 44px; height: 44px; align-self: end; }
 .homepage #services .service-rows h3 { font-size: clamp(1.9rem,7.5vw,2.7rem); }
 .homepage #services .service-rows .service-row-kicker { margin-bottom: 10px; }
 .homepage #services .service-rows .service-panel-link { margin-top: 16px; }
}
@media(hover:none) { .homepage #services .service-rows .service-panel:hover { transform: none; } .homepage #services .service-rows .service-panel:active::before { opacity: 1; } }
@media(prefers-reduced-motion:reduce) { .homepage #services .service-rows .service-panel,.homepage #services .service-rows .service-panel::before,.service-row-arrow { transition: none; } .homepage #services .service-rows .service-panel:hover,.service-panel:hover .service-row-arrow { transform: none; } }
html[data-motion-paused="true"] .homepage #services .service-rows .service-panel,
html[data-motion-paused="true"] .homepage #services .service-rows .service-panel::before,
html[data-motion-paused="true"] .service-row-arrow { transition: none; }

/* Keep service guidance available without a separate expanded section. */
.homepage #services details.service-chooser { margin: 0 0 18px; padding: 0; border: 0; }
.homepage #services .chooser-toggle { display: flex; align-items: center; justify-content: flex-end; gap: 10px; min-height: 44px; padding: 8px 0; list-style: none; color: #f29a66; font: 600 .88rem/1.5 var(--body); cursor: pointer; }
.homepage #services .chooser-toggle::-webkit-details-marker { display: none; }
.homepage #services .chooser-toggle svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.homepage #services details.service-chooser[open] > .chooser-toggle svg { transform: rotate(180deg); }
.homepage #services .chooser-toggle:focus-visible { outline: 2px solid #f47b36; outline-offset: 4px; }
.homepage #services .chooser-content { padding: 20px 0 24px; border-top: 1px solid #ffffff20; }
.homepage #services .chooser-prompt { color: #bdc5c4; font-size: .92rem; line-height: 1.7; margin-bottom: 12px; }
@media(max-width:650px) { .homepage #services .chooser-toggle { justify-content: flex-start; } }

/* On phones, lead with the service and one clear action. */
@media(max-width:700px) {
 .homepage #services .service-rows .service-panel,
 .homepage #services .service-rows .service-panel + .service-panel {
  grid-template-columns: minmax(0,1fr) 44px;
  align-items: center; gap: 16px; padding: 24px 22px;
 }
 .homepage #services .service-rows .service-row-visual,
 .homepage #services .service-rows .service-row-kicker { display: none; }
 .homepage #services .service-rows .service-panel-copy { grid-column: 1; grid-row: 1; }
 .homepage #services .service-rows .service-row-arrow { grid-column: 2; grid-row: 1; align-self: center; }
 .homepage #services .service-rows h3 { font-size: clamp(1.65rem,6.3vw,2.2rem); line-height: 1.15; }
 .homepage #services .service-rows .service-panel-copy p { font-size: .94rem; line-height: 1.65; margin-top: 10px; max-width: 36ch; }
 .homepage #services .service-rows .service-panel-link { margin-top: 14px; font-size: .8rem; color: #f29a66; }
 .homepage #services > .container { display: flex; flex-direction: column; }
 .homepage #services .services-intro { order: 0; margin-bottom: 24px; }
 .homepage #services .service-rows { order: 1; }
 .homepage #services details.service-chooser { order: 2; margin-block: 16px 0; }
 .homepage #services .services-note { order: 3; margin-top: 16px; font-size: .85rem; }
 .homepage #services .chooser-toggle { justify-content: flex-start; }
}
