/* Tarasy / Elewacje: shared service and hub layout.
 * Load after sample-shell, stage3 and the active form styles.
 * Every rule is limited to the explicit renderer marker. Super Forms owns
 * visibility, validation, uploads and submission; this file changes no state.
 * Visual source: HARDWOOD KANON WYGLADU v2.3, 2026-11-02.
 */
main.hw-service-hubs {
  --hw-paper:#fbfaf7;
  --hw-ink:#272722;
  --hw-muted:#605d57;
  --hw-accent:#705c3e;
  --hw-sand:#f0ede7;
  --hw-white:#ffffff;
  --hw-line:#d8d4cc;
  --hw-dark:#252522;
  --hw-dark-line:#45433d;
  --hw-light:#f2f0ea;
  --hw-button:#d6c2a0;
  --hw-button-ink:#2f2b24;
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
  background:var(--hw-paper);
  color:var(--hw-ink);
  font:400 17px/1.65 Arial,sans-serif;
}
main.hw-service-hubs *,
main.hw-service-hubs *::before,
main.hw-service-hubs *::after { box-sizing:border-box; }
main.hw-service-hubs :is(h1,h2,h3,h4,h5,h6) {
  margin:0 0 16px;
  color:var(--hw-ink);
  font-family:Arial,sans-serif;
  font-weight:700;
  letter-spacing:0;
  text-transform:none;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}
main.hw-service-hubs h1 { font-size:54px; line-height:1.15; }
main.hw-service-hubs h2 { font-size:32px; line-height:1.25; }
main.hw-service-hubs h3 { font-size:24px; line-height:1.3; }
main.hw-service-hubs :is(h4,h5,h6) { font-size:20px; line-height:1.4; }
main.hw-service-hubs p { margin:0 0 16px; color:inherit; font:400 17px/1.65 Arial,sans-serif; }
main.hw-service-hubs :is(strong,b) { font-weight:700; color:inherit; }
main.hw-service-hubs :is(p,ul,ol,figure,blockquote):last-child { margin-bottom:0; }
main.hw-service-hubs a { color:var(--hw-accent); text-underline-offset:4px; }
main.hw-service-hubs :is(a,button,summary):focus-visible { outline:2px solid var(--hw-accent); outline-offset:4px; }
main.hw-service-hubs :is(.hw-sh-section,.hw-sh-trust,.hw-sh-cta) { scroll-margin-top:24px; }
main.hw-service-hubs .hw-sh-container { width:min(1240px,calc(100% - 64px)); margin-inline:auto; padding:0; }
main.hw-service-hubs .hw-sh-section { margin:0; padding:48px 0; background:var(--hw-paper); }
main.hw-service-hubs .hw-sh-section:nth-of-type(even),
main.hw-service-hubs .hw-sh-section--sand { background:var(--hw-sand); }
main.hw-service-hubs .hw-sh-section--paper { background:var(--hw-paper); }
main.hw-service-hubs .hw-sh-section-head { margin-bottom:32px; }
main.hw-service-hubs :is(.hw-sh-eyebrow,.hw-sh-section .eyebrow,.hw-sh-hero .eyebrow,.hw-sh-cta .eyebrow) {
  display:block;
  margin:0 0 12px;
  color:var(--hw-accent);
  font:700 13px/1.5 Arial,sans-serif;
  letter-spacing:.08em;
  text-transform:uppercase;
}
main.hw-service-hubs .hw-sh-hero,
main.hw-service-hubs .hw-sh-hero.hw-sh-section { padding:48px 0; background:var(--hw-dark); color:var(--hw-light); }
main.hw-service-hubs .hw-sh-hero-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:48px; align-items:center; }
main.hw-service-hubs .hw-sh-hero-copy { min-width:0; }
main.hw-service-hubs .hw-sh-hero :is(h1,h2,h3,p,li,strong,b) { color:var(--hw-light); }
main.hw-service-hubs .hw-sh-hero :is(.hw-sh-eyebrow,.eyebrow,a) { color:var(--hw-button); }
main.hw-service-hubs .hw-sh-lead,
main.hw-service-hubs .hw-sh-lead p { font:400 19px/1.6 Arial,sans-serif; }
main.hw-service-hubs .hw-sh-hero-media { min-width:0; margin:0; }
main.hw-service-hubs .hw-sh-hero-media img { display:block; width:100%; max-width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; border-radius:0; }
main.hw-service-hubs .hw-sh-hero-media figcaption { margin-top:8px; color:var(--hw-light); font:400 15px/1.5 Arial,sans-serif; }
main.hw-service-hubs .hw-sh-actions { display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-top:24px; }
main.hw-service-hubs .hw-sh-button {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  min-height:44px;
  max-width:100%;
  padding:10px 18px;
  border:1px solid var(--hw-button);
  border-radius:3px;
  background:var(--hw-button);
  color:var(--hw-button-ink);
  box-shadow:none;
  font:700 16px/1.4 Arial,sans-serif;
  text-align:center;
  text-decoration:none;
  text-transform:none;
  letter-spacing:0;
  white-space:normal;
  overflow-wrap:normal;
  cursor:pointer;
}
main.hw-service-hubs .hw-sh-button:hover { color:var(--hw-button-ink); background:var(--hw-button); text-decoration:underline; text-underline-offset:4px; }
main.hw-service-hubs .hw-sh-button--secondary { border-color:var(--hw-button-ink); background:transparent; color:var(--hw-button-ink); }
main.hw-service-hubs .hw-sh-button--secondary:hover { background:transparent; color:var(--hw-button-ink); }
main.hw-service-hubs :is(.hw-sh-hero,.hw-sh-cta) .hw-sh-button { color:var(--hw-button-ink); }
main.hw-service-hubs :is(.hw-sh-hero,.hw-sh-cta) .hw-sh-button--secondary { color:var(--hw-light); border-color:var(--hw-light); background:transparent; }
main.hw-service-hubs :is(.hw-sh-hero,.hw-sh-cta) :is(a,button,summary):focus-visible { outline-color:var(--hw-button); }
main.hw-service-hubs .hw-sh-text-link { display:inline-flex; align-items:center; gap:8px; min-height:44px; font-weight:700; text-decoration:underline; }
/* The renderer supplies one visible arrow per CTA; CSS never duplicates it. */
main.hw-service-hubs .hw-sh-trust { padding:24px 0; background:var(--hw-sand); }
main.hw-service-hubs .hw-sh-trust ul { display:flex; flex-wrap:wrap; gap:16px 32px; align-items:center; margin:0; padding:0; list-style:none; }
main.hw-service-hubs .hw-sh-trust li { display:flex; align-items:center; gap:12px; min-width:0; margin:0; padding:0; color:var(--hw-ink); font:700 17px/1.65 Arial,sans-serif; list-style:none; }
main.hw-service-hubs .hw-sh-trust li::before,
main.hw-service-hubs .hw-sh-trust li::marker { content:none; }
main.hw-service-hubs .hw-sh-trust svg { flex:0 0 24px; width:24px; height:24px; color:var(--hw-accent); }
main.hw-service-hubs :is(.hw-sh-grid,.hw-sh-materials,.hw-sh-offers,.hw-sh-guide-groups,.hw-sh-reviews,.hw-sh-gallery) { display:grid; gap:24px; align-items:stretch; }
main.hw-service-hubs :is(.hw-sh-grid,.hw-sh-materials,.hw-sh-offers,.hw-sh-guide-groups,.hw-sh-reviews,.hw-sh-gallery)>* { min-width:0; }
main.hw-service-hubs :is(.hw-sh-grid--two,.hw-sh-offers,.hw-sh-guide-groups,.hw-sh-reviews) { grid-template-columns:repeat(2,minmax(0,1fr)); }
main.hw-service-hubs :is(.hw-sh-grid--three,.hw-sh-materials,.hw-sh-gallery) { grid-template-columns:repeat(3,minmax(0,1fr)); }
main.hw-service-hubs .hw-sh-grid--five { grid-template-columns:repeat(5,minmax(0,1fr)); }
/* Renderer wraps the reusable card grid once for the material section. */
main.hw-service-hubs .hw-sh-materials>.hw-sh-grid { grid-column:1 / -1; grid-template-columns:repeat(3,minmax(0,1fr)); }
main.hw-service-hubs :is(.hw-sh-card,.hw-sh-offer) { min-width:0; margin:0; border:1px solid var(--hw-line); border-radius:6px; background:var(--hw-white); box-shadow:none; }
main.hw-service-hubs .hw-sh-card { display:flex; flex-direction:column; }
main.hw-service-hubs .hw-sh-card>img,
main.hw-service-hubs .hw-sh-card>a>img { display:block; width:100%; max-width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; border-radius:0; }
main.hw-service-hubs .hw-sh-card-body { display:flex; flex:1 1 auto; flex-direction:column; align-items:flex-start; padding:24px; min-width:0; }
main.hw-service-hubs :is(.hw-sh-card,.hw-sh-offer) :is(h2,h3,h4) { font-size:20px; line-height:1.4; }
main.hw-service-hubs .hw-sh-card-body>p { width:100%; }
main.hw-service-hubs .hw-sh-card-body>:is(a,.hw-sh-actions):last-child { margin-top:auto; }
main.hw-service-hubs .hw-sh-card-body>p+:is(a,.hw-sh-actions):last-child { padding-top:8px; }
main.hw-service-hubs .hw-sh-card-body h3 a { color:var(--hw-ink); }
main.hw-service-hubs .hw-sh-offer { padding:24px; }
main.hw-service-hubs .hw-sh-process ol { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:24px; margin:0; padding:0; list-style:none; }
main.hw-service-hubs .hw-sh-process li { min-width:0; margin:0; padding:24px; border:1px solid var(--hw-line); border-radius:6px; background:var(--hw-white); color:var(--hw-ink); list-style:none; }
main.hw-service-hubs .hw-sh-process li::before,
main.hw-service-hubs .hw-sh-process li::marker { content:none; }
main.hw-service-hubs .hw-sh-process li>svg { display:inline-block; width:24px; height:24px; color:var(--hw-accent); vertical-align:middle; }
main.hw-service-hubs .hw-sh-step-number { display:inline-block; margin:0 0 16px 12px; color:var(--hw-accent); font:700 17px/1.65 Arial,sans-serif; vertical-align:middle; }
main.hw-service-hubs .hw-sh-process h3 { margin:0; font:700 20px/1.4 Arial,sans-serif; }
main.hw-service-hubs .hw-sh-process h3+p { margin-top:16px; }
main.hw-service-hubs .hw-sh-prose { min-width:0; }
main.hw-service-hubs .hw-sh-prose :is(h2,h3,h4):not(:first-child) { margin-top:24px; }
main.hw-service-hubs .hw-sh-prose :is(ul,ol) { margin:0 0 16px; padding-left:22px; }
main.hw-service-hubs .hw-sh-prose ul { list-style:none; }
main.hw-service-hubs .hw-sh-prose li { position:relative; margin:0 0 8px; padding:0; color:var(--hw-ink); font:400 17px/1.65 Arial,sans-serif; }
main.hw-service-hubs .hw-sh-prose ul>li::before { content:""; position:absolute; left:-22px; top:.65em; width:6px; height:6px; border-radius:50%; background:var(--hw-accent); }
main.hw-service-hubs .hw-sh-prose ol>li::marker { color:var(--hw-accent); font-weight:700; }
main.hw-service-hubs .hw-sh-prose :is(a,u) { text-underline-offset:4px; }
main.hw-service-hubs .hw-sh-prose u:not(a u) { text-decoration:none; }
main.hw-service-hubs .hw-sh-prose a { text-decoration:underline; }
main.hw-service-hubs .hw-sh-form { min-width:0; max-width:100%; }
main.hw-service-hubs .hw-sh-form>.elementor { max-width:100%; }
main.hw-service-hubs .hw-sh-form .quote-layout { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
/* Existing form classes retain their own display and conditional behaviour. */
main.hw-service-hubs .hw-sh-gallery { margin-top:24px; }
main.hw-service-hubs .hw-sh-gallery figure { min-width:0; margin:0; }
main.hw-service-hubs .hw-sh-gallery figure>a { display:block; min-height:44px; }
main.hw-service-hubs .hw-sh-gallery img { display:block; width:100%; max-width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; border-radius:2px; }
main.hw-service-hubs .hw-sh-gallery figcaption { margin-top:8px; color:var(--hw-muted); font:400 15px/1.5 Arial,sans-serif; }
main.hw-service-hubs .hw-sh-faq { border-top:1px solid var(--hw-line); }
main.hw-service-hubs .hw-sh-faq>details { margin:0; padding:0; border:0; border-bottom:1px solid var(--hw-line); border-radius:0; background:transparent; box-shadow:none; }
main.hw-service-hubs .hw-sh-faq summary { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:44px; margin:0; padding:20px 0; color:var(--hw-ink); font:700 18px/1.4 Arial,sans-serif; list-style:none; cursor:pointer; }
main.hw-service-hubs .hw-sh-faq summary::-webkit-details-marker { display:none; }
main.hw-service-hubs .hw-sh-faq summary::marker { content:none; }
main.hw-service-hubs .hw-sh-faq summary :is(h2,h3,h4) { margin:0; color:inherit; font:inherit; }
main.hw-service-hubs .hw-sh-faq summary svg { flex:0 0 20px; width:20px; height:20px; color:var(--hw-accent); }
main.hw-service-hubs .hw-sh-faq details[open] summary svg { transform:rotate(180deg); }
main.hw-service-hubs .hw-sh-faq details>.hw-sh-prose { padding:0 0 24px; }
main.hw-service-hubs .hw-sh-guide-group { min-width:0; }
main.hw-service-hubs .hw-sh-guide-group h3 { margin-bottom:16px; }
main.hw-service-hubs .hw-sh-guide-group ul { margin:0; padding:0; list-style:none; }
main.hw-service-hubs .hw-sh-guide-group li { margin:0; padding:0; border-bottom:1px solid var(--hw-line); list-style:none; }
main.hw-service-hubs .hw-sh-guide-group li:last-child { border-bottom:0; }
main.hw-service-hubs .hw-sh-guide-group li::before,
main.hw-service-hubs .hw-sh-guide-group li::marker { content:none; }
main.hw-service-hubs .hw-sh-guide-group li>a { display:flex; align-items:center; gap:12px; min-height:44px; padding:10px 0; color:var(--hw-accent); font:400 17px/1.65 Arial,sans-serif; text-decoration:underline; }
main.hw-service-hubs .hw-sh-review { min-width:0; margin:0; padding:24px; border:0; border-top:3px solid var(--hw-line); border-radius:0; background:#f2efe8; color:var(--hw-ink); box-shadow:none; }
main.hw-service-hubs .hw-sh-stars { display:flex; align-items:center; gap:4px; margin-bottom:16px; color:#9b722f; }
main.hw-service-hubs .hw-sh-stars svg { flex:0 0 20px; width:20px; height:20px; color:#9b722f; fill:#9b722f; stroke:none; }
main.hw-service-hubs .hw-sh-review blockquote { margin:0; padding:0; border:0; background:transparent; color:var(--hw-ink); font:400 17px/1.65 Arial,sans-serif; }
main.hw-service-hubs .hw-sh-review blockquote::before,
main.hw-service-hubs .hw-sh-review blockquote::after { content:none; }
main.hw-service-hubs .hw-sh-review footer { margin-top:16px; padding:0; color:var(--hw-muted); font:400 15px/1.5 Arial,sans-serif; background:transparent; }
main.hw-service-hubs .hw-sh-cta,
main.hw-service-hubs .hw-sh-cta.hw-sh-section { padding:72px 0; background:var(--hw-dark); color:var(--hw-light); }
main.hw-service-hubs .hw-sh-cta :is(h2,h3,p,strong,b) { color:var(--hw-light); }
main.hw-service-hubs .hw-sh-cta :is(.hw-sh-eyebrow,.eyebrow,a) { color:var(--hw-button); }
main.hw-service-hubs .hw-sh-cta .hw-sh-button { color:var(--hw-button-ink); }
main.hw-service-hubs .hw-sh-cta .hw-sh-button--secondary { color:var(--hw-light); }
@media (max-width:1100px) {
  main.hw-service-hubs .hw-sh-hero-grid { gap:32px; }
  main.hw-service-hubs :is(.hw-sh-grid--five,.hw-sh-process ol) { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:768px) {
  main.hw-service-hubs .hw-sh-container { width:calc(100% - 32px); }
  main.hw-service-hubs h1 { font-size:34px; }
  main.hw-service-hubs h2 { font-size:26px; }
  main.hw-service-hubs h3 { font-size:22px; }
  main.hw-service-hubs :is(.hw-sh-section,.hw-sh-hero,.hw-sh-hero.hw-sh-section) { padding-block:32px; }
  main.hw-service-hubs .hw-sh-section-head { margin-bottom:24px; }
  main.hw-service-hubs :is(.hw-sh-hero-grid,.hw-sh-grid--two,.hw-sh-grid--three,.hw-sh-grid--five,.hw-sh-materials,.hw-sh-offers,.hw-sh-process ol,.hw-sh-gallery,.hw-sh-guide-groups,.hw-sh-reviews) { grid-template-columns:minmax(0,1fr); }
  main.hw-service-hubs .hw-sh-materials>.hw-sh-grid { grid-template-columns:minmax(0,1fr); }
  main.hw-service-hubs .hw-sh-hero-grid { gap:24px; }
  main.hw-service-hubs .hw-sh-trust ul { flex-direction:column; align-items:flex-start; }
  main.hw-service-hubs :is(.hw-sh-card-body,.hw-sh-offer,.hw-sh-process li,.hw-sh-review) { padding:20px; }
  main.hw-service-hubs :is(.hw-sh-card,.hw-sh-offer) :is(h2,h3,h4),
  main.hw-service-hubs .hw-sh-process h3 { font-size:20px; line-height:1.4; }
  main.hw-service-hubs .hw-sh-actions { align-items:stretch; }
  main.hw-service-hubs .hw-sh-actions>.hw-sh-button { flex:1 1 100%; }
  main.hw-service-hubs .hw-sh-form .quote-layout { grid-template-columns:minmax(0,1fr); }
  main.hw-service-hubs :is(.hw-sh-cta,.hw-sh-cta.hw-sh-section) { padding-block:48px; }
}

/* Approved source crops and the service without an approved facade photograph. */
main.hw-service-hubs .hw-sh-hero--text .hw-sh-hero-grid{grid-template-columns:minmax(0,1fr);max-width:1240px}
main.hw-service-hubs .hw-sh-hero--text .hw-sh-hero-copy{max-width:880px}
main.hw-service-hubs img[data-hw-sh-position="50% 50%"]{object-position:50% 50%}
main.hw-service-hubs img[data-hw-sh-position="50% 60%"]{object-position:50% 60%}
main.hw-service-hubs img[data-hw-sh-position="50% 65%"]{object-position:50% 65%}
main.hw-service-hubs img[data-hw-sh-position="50% 75%"]{object-position:50% 75%}
main.hw-service-hubs img[data-hw-sh-position="50% 100%"]{object-position:50% 100%}

/* The shared pattern header is relative, while legacy shell CSS keeps the
 * sticky-header admin-bar top offset. WordPress already reserves the toolbar
 * height on html; applying that offset again shifts the header over the hero.
 * Only these rebuilt pages and the logged-in toolbar case are corrected. */
body.admin-bar:has(main.hw-service-hubs) .site-header.hw-ui{top:0}