/* ABC Painting — visual and mobile refinements, 10 November 2026 */
/* Purpose: preserve original design/assets while improving reading, spacing and conversion. */
:root { --polish-ink:#183529; --polish-sand:#cda66e; --polish-cream:#fbfaf6; }
html { scroll-padding-top:94px; }
body { overflow-x:clip; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
button, input, select, textarea { font:inherit; }
button, a { -webkit-tap-highlight-color:transparent; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline:3px solid #b68746; outline-offset:3px; }
.site-header { box-shadow:0 1px 0 rgba(15,42,26,.09); }
.header-cta, .button, .form-submit { border-radius:5px; }
.button { transition:background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease; }
.button:hover { transform:translateY(-2px); }
.main-nav a { transition:color .2s ease; }
.hero-grid { grid-template-columns:46% 54%; }
.hero-copy, .hero-visual { min-height:645px; }
.hero-copy-inner { width:min(81%,560px); }
.hero h1 { font-size:clamp(43px,4.2vw,65px); line-height:1.12; letter-spacing:-.045em; }
.hero-copy-inner>p { max-width:470px; line-height:1.8; }
.hero-visual>img { object-position:center 52%; }
.hero-visual-label { letter-spacing:.11em; }
.hero-visual-label span:first-child { font-weight:700; }
.photo-note { border-radius:4px 0 0 4px; }
.trust-inner { padding-top:24px; padding-bottom:24px; }
.trust-item { line-height:1.55; }
.section { padding-top:88px; padding-bottom:88px; }
.section-head { margin-bottom:33px; }
.section-head-flex>p, .work-top-right p { line-height:1.85; }
.section h2 { letter-spacing:-.04em; }
.section-kicker { letter-spacing:.16em; }
.services-grid { gap:18px; }
.service-card { min-height:314px; border-radius:12px; padding:32px; box-shadow:0 9px 34px rgba(18,42,30,.04); transition:box-shadow .2s ease, transform .2s ease; }
.service-card:hover { box-shadow:0 14px 36px rgba(18,42,30,.09); transform:translateY(-3px); }
.service-card p { line-height:1.8; }
.service-card a { margin-top:auto; }
.ba-section { padding-top:85px; padding-bottom:86px; background:#faf9f5; }
.ba-grid { gap:22px; margin-top:32px; }
.ba-card { border-radius:12px; padding:26px; box-shadow:0 8px 28px rgba(18,42,30,.04); }
.ba-card-head h3 { font-size:clamp(23px,2.2vw,29px); margin:14px 0 8px; }
.ba-card-head p { font-size:14px; line-height:1.75; }
.ba-pair { gap:12px; }
.ba-pair figure { border-radius:8px; border-color:#e8e3d9; }
.ba-pair img { aspect-ratio:4/3; object-fit:contain; background:#eeece6; }
.ba-pair figcaption { text-transform:uppercase; letter-spacing:.13em; font-size:11px; padding:12px 15px; }
.ba-tag,.social-badge { border-radius:4px; letter-spacing:.07em; }
.work-section { padding-top:84px; padding-bottom:90px; }
.gallery-grid { gap:13px; }
.gallery-item { border-radius:8px; overflow:hidden; }
.gallery-item img { transition:transform .45s ease; }
.gallery-item:hover img { transform:scale(1.025); }
.gallery-arrow { border-radius:50%; }
.work-footer { padding-top:28px; }
.why-content-inner { padding-top:62px; padding-bottom:62px; }
.why-lead { line-height:1.85; }
.why-features small { line-height:1.65; }
.social-work-section { background:#f8f6ef; }
.social-cards { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.social-card { border-radius:12px; box-shadow:0 8px 24px rgba(18,42,30,.05); }
.social-card-original>img { height:390px; width:100%; object-fit:contain; object-position:center; background:#eae7df; }
.social-card-body { padding:25px 28px 29px; }
.social-card h3 { font-size:24px; }
.social-card p { font-size:14px; }
.social-card:nth-child(3) { grid-column:1/-1; display:grid; grid-template-columns:35% 65%; align-items:stretch; }
.social-card:nth-child(3)>img { width:100%; height:100%; min-height:215px; max-height:240px; object-fit:cover; }
.social-card:nth-child(3) .social-card-body { display:flex; flex-direction:column; justify-content:center; align-items:flex-start; padding:28px 40px; }
.social-card:nth-child(3) .inline-cta { margin-top:4px; }
.reviews-section { padding-top:88px; padding-bottom:88px; }
.review-card { border-radius:10px; }
.review-card blockquote { line-height:1.55; }
.reviews-bottom small { line-height:1.6; }
.contact-section { padding:90px 0; }
.contact-content>p { line-height:1.8; }
.form-card { border-radius:12px; padding:34px; }
.form-card h3 { line-height:1.2; }
.quote-form { gap:16px; }
.quote-form label { font-size:13px; line-height:1.35; gap:9px; }
.quote-form input,.quote-form select,.quote-form textarea { font-size:16px; line-height:1.4; min-height:49px; border-radius:6px; padding:13px 14px; }
.quote-form textarea { min-height:116px; }
.quote-form .form-privacy { font-size:12px; }
.form-submit { min-height:52px; font-size:13px; }
.social-pill { border-radius:6px; }
.whatsapp-link { min-height:46px; padding-inline:12px; }
.location-section { padding:64px 0; }
.map-frame { border-radius:9px; overflow:hidden; }
.footer-bottom { align-items:center; }
.footer-bottom a { text-decoration:underline; text-underline-offset:3px; }
.footer-bottom a:hover { color:#fff; }
.reveal:not(.visible) { /* retain motion, never hide content for print */ }
@media(max-width:1100px) {
  .hero-grid { grid-template-columns:48% 52%; }
  .hero-copy, .hero-visual { min-height:580px; }
  .hero h1 { font-size:clamp(38px,4.5vw,55px); }
  .hero-copy-inner { width:calc(100% - 58px); }
  .service-card { padding:26px 23px; }
}
@media(max-width:900px) {
  .hero-copy, .hero-visual { min-height:545px; }
  .hero-copy-inner { width:calc(100% - 46px); }
  .hero-actions { flex-wrap:wrap; }
  .services-grid { gap:13px; }
  .social-card-original>img { height:340px; }
  .social-card:nth-child(3) .social-card-body { padding:25px; }
}
@media(max-width:650px) {
  html { scroll-padding-top:79px; }
  .shell { width:calc(100% - 38px); }
  .topbar-inner { min-height:28px; }
  .topbar a { font-size:12px; }
  .header-inner { min-height:69px; }
  .hero-grid { display:flex; flex-direction:column; }
  .hero-copy { order:0; min-height:0; }
  .hero-visual { order:1; height:260px; min-height:0; max-height:none; }
  .hero-copy-inner { width:calc(100% - 40px); padding:32px 0 29px; }
  .hero h1 { font-size:clamp(38px,9.25vw,49px); margin:12px 0 14px; line-height:1.09; }
  .hero-copy-inner>p { font-size:14px; line-height:1.7; }
  .hero-actions { margin-top:22px; gap:9px; }
  .hero-actions .button { min-height:46px; padding:11px 12px; font-size:11px; border-radius:5px; }
  .hero-rating { margin-top:19px; gap:7px; }
  .hero-visual>img { object-position:center 50%; }
  .hero-visual-label { font-size:9px; bottom:12px; }
  .hero-bottom-line { display:none; }
  .trust-inner { gap:15px; padding-top:20px; padding-bottom:20px; }
  .trust-primary { padding-bottom:13px; }
  .trust-item { font-size:11px; }
  .trust-item:last-child { grid-column:auto; }
  .section { padding-top:64px; padding-bottom:64px; }
  .section-head { margin-bottom:28px; }
  .section h2, .contact-section h2, .location-section h2 { font-size:clamp(32px,8.4vw,42px); line-height:1.17; }
  .section-head-flex { gap:15px; }
  .section-head-flex>p, .work-top-right p { font-size:14px; line-height:1.72; }
  .services-grid { margin-top:25px; gap:12px; }
  .service-card { min-height:0; border-radius:9px; padding:24px 26px; }
  .service-icon { margin-bottom:10px; }
  .service-card h3 { margin-bottom:7px; }
  .ba-grid { grid-template-columns:1fr; gap:14px; margin-top:27px; }
  .ba-card { border-radius:9px; padding:18px; }
  .ba-card-head h3 { font-size:24px; }
  .ba-card-head p { margin-bottom:17px; }
  .ba-pair { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .ba-pair figure { border-radius:5px; min-width:0; }
  .ba-pair img { width:100%; height:180px; aspect-ratio:auto; object-fit:contain; }
  .ba-pair figcaption { padding:9px 10px; font-size:10px; }
  .work-section { padding-top:62px; padding-bottom:67px; }
  .work-top { margin-bottom:20px; }
  .gallery-grid { gap:9px; }
  .gallery-item-large { height:260px; }
  .gallery-label { padding:12px; }
  .gallery-item { border-radius:6px; }
  .why-image { min-height:305px; }
  .why-content-inner { padding-top:56px; padding-bottom:59px; }
  .why-section h2 { font-size:35px; }
  .social-cards { grid-template-columns:1fr; gap:14px; margin-top:25px; }
  .social-card { border-radius:9px; }
  .social-card-original>img { height:300px; }
  .social-card-body { padding:23px; }
  .social-card:nth-child(3) { grid-column:auto; display:block; }
  .social-card:nth-child(3)>img { height:180px; min-height:0; max-height:none; }
  .social-card:nth-child(3) .social-card-body { padding:23px; }
  .review-card { min-height:0; }
  .reviews-heading { gap:22px; }
  .contact-section { padding-top:68px; padding-bottom:67px; }
  .contact-grid { gap:31px; }
  .form-card { padding:25px 20px; border-radius:9px; }
  .form-fields-two { gap:15px; }
  .quote-form label { font-size:13px; }
  .quote-form input,.quote-form select,.quote-form textarea { font-size:16px; min-height:50px; }
  .location-section { padding-top:58px; padding-bottom:58px; }
  .footer-bottom { padding-bottom:94px; }
  .mobile-call { background:#d2aa73; border:1px solid #bb945f; color:#152d21; bottom:max(14px,env(safe-area-inset-bottom)); right:15px; box-shadow:0 7px 24px #0004; border-radius:8px; min-height:46px; }
}
@media(max-width:390px) {
  .hero-actions { flex-direction:column; }
  .hero-actions .button { width:100%; }
  .hero h1 { font-size:38px; }
  .hero-visual { height:230px; }
  .ba-pair img { height:156px; }
}
@media(prefers-reduced-motion:reduce) {
  .button:hover,.service-card:hover { transform:none; }
}
@media print {
  .reveal { opacity:1 !important; transform:none !important; }
  .mobile-call,.menu-toggle { display:none !important; }
}