/*
Theme Name:  Hercules Child
Template:    hello-elementor
Version:     1.0.0
Description: Hercules Corporation child theme for Hello Elementor.
Author:      SCBW
*/

/* Custom base styles loaded on top of Hello Elementor */
:root {
	--hc-blue:   #003594;
	--hc-red:    #e41e26;
	--hc-gray:   #f5f5f5;
	--hc-dark:   #1a1a1a;
	--hc-white:  #ffffff;
}

/* hc-page-title-hide — hide WP-generated page title on all pages */
.page .entry-header,
.page .page-header,
.entry-header.page-header,
body.page h1.entry-title,
body.page .page-title { display: none !important; }

/* Remove default entry-content top-margin so Elementor sections butt against header */
.entry-content { margin-top: 0 !important; padding: 0 !important; }
/* hc-nav-fix — force single-row navigation, fix colours */
.elementor-nav-menu .elementor-nav-menu { flex-wrap: nowrap !important; white-space: nowrap; }
.elementor-nav-menu--layout-horizontal .elementor-nav-menu > li { flex-shrink: 0 !important; }
/* Override pink nav link colour that Hello Elementor injects */
.elementor-nav-menu .elementor-item { color: #1e3356 !important; }
.elementor-nav-menu .elementor-item:hover,
.elementor-nav-menu .elementor-item.elementor-item-active { color: #107e77 !important; }
/* hc-nav-nowrap — ensure all nav items stay in one row */
.elementor-nav-menu--layout-horizontal .elementor-nav-menu {
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
    align-items: center !important;
}
.elementor-nav-menu--layout-horizontal .elementor-nav-menu > li {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
}
/* Fix Request A Proposal button text wrapping */
.elementor-widget-button .elementor-button {
    white-space: nowrap !important;
}
/* Match nav item styling to Laravel */
.elementor-nav-menu .elementor-item {
    color: #1e3356 !important;
    font-size: 13px !important;
    letter-spacing: 0;
}
.elementor-nav-menu .elementor-item:hover,
.elementor-nav-menu .elementor-item.elementor-item-active {
    color: #107e77 !important;
}

/* hc-nav-fix-v2 — target the actual flex UL that wraps */
ul.elementor-nav-menu {
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
}
ul.elementor-nav-menu > li.menu-item {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
}

/* hc-nav-fix-v3 — precise targeting of nav/logo columns */
/* Pin logo column so it never shrinks away */
.elementor-element-8f6f3ea {
    min-width: 120px !important;
    width: 120px !important;
    flex-shrink: 0 !important;
}
/* Reduce nav link padding to match Laravel's compact spacing */
.elementor-element-b99994f .elementor-nav-menu .elementor-item,
.elementor-element-b99994f .elementor-nav-menu > li > a {
    padding-left: 8px !important;
    padding-right: 8px !important;
    font-size: 13px !important;
    white-space: nowrap !important;
}
/* Ensure nav column's ul doesn't overflow */
.elementor-element-9c6c849 .elementor-widget-wrap {
    overflow: visible !important;
}

/* hc-pixel-fix-v4 — logo 144px, H1 60px/700, hero 700px */

/* Logo column: wider to fit 144px logo (was 120px) */
.elementor-element-8f6f3ea {
    min-width: 155px !important;
    width: 155px !important;
    flex-shrink: 0 !important;
}

/* Logo image: scale up to 144px wide to match Laravel */
.elementor-element-46f3856 img {
    width: 144px !important;
    height: auto !important;
}

/* Nav links: reduce padding to 5px (was 8px) to compensate for wider logo column */
.elementor-element-b99994f .elementor-nav-menu .elementor-item,
.elementor-element-b99994f .elementor-nav-menu > li > a {
    padding-left: 5px !important;
    padding-right: 5px !important;
    font-size: 13px !important;
    white-space: nowrap !important;
}

/* H1 hero heading: 60px bold, line-height 1.15 — matches Laravel exactly */
.elementor-element-2c4a484 .elementor-heading-title {
    font-size: 60px !important;
    font-weight: 700 !important;
    line-height: 1.15em !important;
}

/* Hero section: 828px min-height to match Laravel (nav overlaps hero from top on Laravel) */
.elementor-element-1bd87d9 {
    min-height: 828px !important;
}

/* Header sections: remove Elementor's 40px default section padding */
[data-id="e916c5a"],
[data-id="b233622"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
/* Utility bar container: 33px matches Laravel text x-start */
[data-id="e916c5a"] .elementor-container {
    max-width: none !important;
    width: 100% !important;
    padding-left: 33px !important;
    padding-right: 33px !important;
}
/* Utility bar columns: remove default widget-wrap padding */
[data-id="e916c5a"] .elementor-widget-wrap {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
/* Nav row container: 8px so logo (widget-wrap 0px) starts at x=8 (matches Laravel) */
[data-id="b233622"] .elementor-container {
    max-width: none !important;
    width: 100% !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
}
/* Remove logo column widget-wrap left padding so logo sits flush-left */
.elementor-element-8f6f3ea .elementor-widget-wrap {
    padding-left: 0 !important;
}

/* Hero left column: add top padding to push H1 down ~160px (matches Laravel py-60 = 240px) */
/* WP header is 35px taller than Laravel, so net padding needed = 240 - 35 - current_offset */
.elementor-element-3fd30d0 {
    padding-top: 160px !important;
}
/* Hero right column: match same top offset */
.elementor-element-8ee0a98 {
    padding-top: 120px !important;
}

/* hc-layout-v5 — typography + footer pixel-perfect fixes */

/* Testimonials heading: left-align + 36px/700 to match Laravel */
.elementor-element-e49a7ac .elementor-heading-title {
    text-align: left !important;
    font-size: 36px !important;
    font-weight: 700 !important;
    line-height: 1.2em !important;
}

/* Laundry Made Easy heading: bump to 36px to match Laravel */
.elementor-element-2866696 .elementor-heading-title {
    font-size: 36px !important;
}

/* Footer column headers: remove uppercase transform — Laravel shows "Company"/"Quick Links"
   These are text-editor widgets (not heading widgets), so target the H4 directly */
.elementor-element-ec2580a h4,
.elementor-element-3d03888 h4 {
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* Footer tagline: 48px/600 to match Laravel desktop footer */
.elementor-element-7df63a6 p {
    font-size: 48px !important;
    font-weight: 600 !important;
    line-height: 1.15em !important;
}

/* hc-footer-v2 — fix Quick Links column width so items don't wrap */
.elementor-element-3d03888 .elementor-widget-wrap {
    min-width: 160px !important;
}
.elementor-element-3d03888 a {
    white-space: nowrap !important;
}

/* hc-centered-v7 — center utility bar, nav, and hero text in 1200px container;
   hero/section background images remain full-width at the section level */

/* Utility bar: undo full-width override, center at 1200px */
[data-id="e916c5a"] .elementor-container {
    max-width: 1200px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
}

/* Nav row: undo full-width override, center at 1200px, restore logo column to 18% */
[data-id="b233622"] .elementor-container {
    max-width: 1200px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
}
.elementor-element-8f6f3ea {
    width: 18% !important;
    min-width: 0 !important;
    flex-shrink: 0 !important;
}

/* Hero text: constrain inner container to 1200px centered (bg image stays full-width) */
[data-id="1bd87d9"] .elementor-container {
    max-width: 1200px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
}

/* Nav link padding */
.elementor-element-b99994f .elementor-nav-menu .elementor-item,
.elementor-element-b99994f .elementor-nav-menu > li > a {
    padding-left: 8px !important;
    padding-right: 8px !important;
}

/* ════════════════════════════════════════════════════════════════════
   GLOBAL FORM STYLING (DRY) — applies to EVERY Elementor Pro form site-wide.
   Single source of truth: brand teal #107e77, light rounded inputs, fixed
   dropdown (no dark inner <select> border), aligned checkboxes, full-width
   teal pill submit. Do NOT re-declare form-field CSS per page — extend THIS.
   ════════════════════════════════════════════════════════════════════ */
.elementor-form .elementor-field-group > label.elementor-field-label { color:#374151 !important; font-size:14px !important; font-weight:500 !important; margin-bottom:6px !important; }
.elementor-form .elementor-field-required::after { color:#e24b4a !important; }
/* text / email / tel / number / textarea */
.elementor-form input.elementor-field:not([type=checkbox]):not([type=radio]),
.elementor-form textarea.elementor-field { border:1px solid #d7dce2 !important; border-radius:8px !important; padding:12px 14px !important; background:#fff !important; min-height:50px; color:#1e293b !important; box-shadow:none !important; }
.elementor-form input.elementor-field:focus, .elementor-form textarea.elementor-field:focus { border-color:#107e77 !important; box-shadow:0 0 0 3px rgba(16,126,119,.12) !important; outline:none !important; }
/* dropdown — wrapper carries the light border, <select> has none, native arrow kept */
.elementor-form .elementor-select-wrapper { border:1px solid #d7dce2 !important; border-radius:8px !important; padding:0 !important; position:relative; }
.elementor-form .elementor-select-wrapper:focus-within { border-color:#107e77 !important; box-shadow:0 0 0 3px rgba(16,126,119,.12) !important; }
.elementor-form .elementor-select-wrapper select { border:none !important; background:transparent !important; box-shadow:none !important; padding:12px 42px 12px 14px !important; min-height:48px; width:100%; color:#1e293b !important; font-size:15px; }
/* checkbox / acceptance — box + label inline, brand accent */
.elementor-form .elementor-field-type-acceptance .elementor-field-option,
.elementor-form .elementor-field-type-checkbox .elementor-field-option { display:flex; align-items:center; gap:10px; }
.elementor-form .elementor-field-type-acceptance input[type=checkbox],
.elementor-form .elementor-field-type-checkbox input[type=checkbox] { margin:0 !important; flex-shrink:0; width:18px; height:18px; accent-color:#107e77; }
.elementor-form .elementor-field-type-acceptance label,
.elementor-form .elementor-field-type-checkbox label { margin:0 !important; line-height:1.4; }
/* submit — full-width teal pill */
.elementor-form button[type=submit] { background:#107e77 !important; border:none !important; border-radius:9999px !important; padding:15px 32px !important; font-weight:600 !important; font-size:16px !important; color:#fff !important; width:100% !important; }
.elementor-form button[type=submit]:hover { background:#0c5e57 !important; }

/* ════════════════════════════════════════════════════════════════════
   Equipment single — Request A Quote (native Elementor form, .hc-eqd-form)
   Scoped EXTENSION of the global block above: white card, underline tabs
   (radio styled as tabs), compact inputs, auto-width submit — matches the
   original PHP form design verbatim. Placed AFTER the global block so these
   overrides win in source order.
   ════════════════════════════════════════════════════════════════════ */
.elementor-element-eqsfcss1 { display:none !important; }
.elementor-element-eqsfh1 { margin-bottom:12px !important; }
.elementor-element-eqsfh1 .elementor-heading-title { color:#111827; font-weight:800; letter-spacing:-0.02em; }
.elementor-element-eqsfst1 { margin-bottom:40px !important; }
.hc-eqd-form .elementor-form { background:#fff; border:1px solid #e5e7eb; border-radius:16px; overflow:hidden; padding:0 32px 32px; }
/* interest selector — radio rendered as underline tabs, full-bleed row */
.hc-eqd-form .elementor-field-type-radio { width:calc(100% + 44px); max-width:calc(100% + 44px); flex-basis:calc(100% + 44px); margin:0 -22px 32px !important; padding:0 32px !important; border-bottom:1px solid #e5e7eb; }
.hc-eqd-form .elementor-field-type-radio > label.elementor-field-label { display:none !important; }
.hc-eqd-form .elementor-field-type-radio .elementor-field-subgroup { display:flex !important; flex-direction:row !important; flex-wrap:nowrap !important; gap:0; background:none; padding:0; border-radius:0; width:auto !important; }
.hc-eqd-form .elementor-field-type-radio .elementor-field-option { margin:0 !important; width:auto !important; flex:0 0 auto !important; display:inline-flex !important; }
.hc-eqd-form .elementor-field-type-radio input[type=radio] { position:absolute !important; opacity:0; width:0; height:0; }
.hc-eqd-form .elementor-field-type-radio .elementor-field-option label { padding:18px 20px 16px !important; font-size:14px !important; font-weight:600 !important; color:#9ca3af !important; border-bottom:2px solid transparent; margin:0 0 -1px !important; cursor:pointer; white-space:nowrap; transition:color .15s, border-color .15s; border-radius:0; background:none; }
.hc-eqd-form .elementor-field-type-radio input[type=radio]:checked + label { color:#107e77 !important; border-bottom-color:#107e77; background:none; box-shadow:none; }
/* labels + required mark */
.hc-eqd-form .elementor-field-group > label.elementor-field-label { font-size:13px !important; font-weight:600 !important; color:#374151 !important; margin-bottom:6px !important; }
.hc-eqd-form .elementor-field-required::after,
.hc-eqd-form .elementor-mark-required .elementor-field-label::after { color:#ef4444 !important; }
/* compact inputs (PHP form: 11/14 padding, #e5e7eb border, no min-height) */
.hc-eqd-form input.elementor-field:not([type=checkbox]):not([type=radio]),
.hc-eqd-form textarea.elementor-field { border:1px solid #e5e7eb !important; border-radius:8px !important; padding:11px 14px !important; min-height:auto !important; font-size:14px !important; color:#111827 !important; }
.hc-eqd-form .elementor-select-wrapper { border:1px solid #e5e7eb !important; border-radius:8px !important; }
.hc-eqd-form .elementor-select-wrapper::before { display:none !important; content:none !important; }
.hc-eqd-form .elementor-select-wrapper .select-caret-down-wrapper { display:none !important; }
.hc-eqd-form .elementor-select-wrapper select { appearance:auto !important; -webkit-appearance:auto !important; padding:11px 14px !important; min-height:auto !important; font-size:14px !important; color:#111827 !important; background:#fff !important; }
/* app checkbox */
.hc-eqd-form .elementor-field-type-acceptance { margin-bottom:28px !important; }
.hc-eqd-form .elementor-field-type-acceptance .elementor-field-subgroup .elementor-field-option { display:flex; align-items:center; gap:10px; padding:0; }
.hc-eqd-form .elementor-field-type-acceptance input[type=checkbox] { width:16px !important; height:16px !important; accent-color:#107e77; margin:0; flex-shrink:0; }
.hc-eqd-form .elementor-field-type-acceptance label { font-size:14px !important; color:#374151 !important; margin:0 !important; cursor:pointer; }
/* auto-width left-aligned submit (overrides global full-width pill) */
.hc-eqd-form .elementor-field-type-submit { margin-bottom:0 !important; }
.hc-eqd-form .e-form__buttons { justify-content:flex-start !important; }
.hc-eqd-form .elementor-form button[type=submit] { width:auto !important; flex-grow:0 !important; flex-basis:auto !important; padding:13px 48px !important; font-size:15px !important; font-weight:700 !important; }
.hc-eqd-form .elementor-message.elementor-message-success { text-align:center; padding:48px 24px; font-size:15px; color:#6b7280; }

/* Equipment single form — mobile: fit all 3 interest tabs within the card (labels wrap, equal thirds) */
@media (max-width: 767px) {
    .hc-eqd-form .elementor-form { padding: 0 20px 24px !important; }
    .hc-eqd-form .elementor-field-type-radio { width: calc(100% + 40px) !important; max-width: calc(100% + 40px) !important; flex-basis: calc(100% + 40px) !important; margin: 0 -20px 24px !important; padding: 0 8px !important; }
    .hc-eqd-form .elementor-field-type-radio .elementor-field-subgroup { width: 100% !important; }
    .hc-eqd-form .elementor-field-type-radio .elementor-field-option { flex: 1 1 0 !important; min-width: 0 !important; }
    .hc-eqd-form .elementor-field-type-radio .elementor-field-option label { padding: 14px 6px 12px !important; font-size: 13px !important; white-space: normal !important; text-align: center !important; width: 100% !important; display: flex !important; align-items: center !important; justify-content: center !important; line-height: 1.25 !important; }
}

/* Careers hero — left column stretches full height so the people card reaches the bottom */
.elementor-element-car_c1 > .elementor-widget-wrap {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    height: 100% !important;
}

/* Pricing page (id 16): form styling now comes from the GLOBAL form block above.
   Only the plan-toggle (segmented pill) remains page-specific (inlined on the page). */

/* ════════════════════════════════════════════════════════════════════
   Contact Support page (id 21) — pixel rebuild to match herc.scbw.com
   Tokens: Figtree; teal #14b2a8 / dark teal #107e77; mint rgba(20,178,168,.2)
   ════════════════════════════════════════════════════════════════════ */
/* doodles flanking the centered hero title (anchored to heading widget, which renders its class) */
.elementor-page-21 .hc-cs-hero-title { position:relative; }
.elementor-page-21 .hc-cs-hero-title::before,
.elementor-page-21 .hc-cs-hero-title::after { content:""; position:absolute; width:84px; height:84px; background-repeat:no-repeat; background-size:contain; pointer-events:none; top:50%; z-index:1; }
.elementor-page-21 .hc-cs-hero-title::before { background-image:url('/wp-content/themes/hercules-child/assets/cs/doodle-orange.svg'); left:50%; transform:translate(-250px,-85%); }
.elementor-page-21 .hc-cs-hero-title::after  { background-image:url('/wp-content/themes/hercules-child/assets/cs/doodle-purple.svg'); left:50%; transform:translate(175px,20%); }
.elementor-page-21 .hc-cs-hero-title .elementor-heading-title { font-family:'Roboto',sans-serif !important; font-size:56px !important; font-weight:700 !important; color:#000 !important; line-height:1.15 !important; max-width:430px; margin-left:auto; margin-right:auto; }
.elementor-page-21 .hc-cs-hero-sub { font-family:Figtree,sans-serif; font-size:18px !important; color:#374151 !important; margin-top:12px; }
.elementor-page-21 .hc-cs-hero-sub .elementor-widget-container { text-align:center; }

/* 3 nav cards (image-box) — class on each card widget (widget classes render) */
.elementor-page-21 .hc-cs-card .elementor-image-box-wrapper { background:#fff; border:2px solid transparent; border-radius:16px; padding:24px; box-shadow:0 1px 3px rgba(0,0,0,.06); display:flex; flex-direction:column; align-items:center; gap:14px; transition:.15s; }
.elementor-page-21 .hc-cs-card .elementor-image-box-img { margin:0 !important; }
.elementor-page-21 .hc-cs-card .elementor-image-box-img img { width:40px; height:40px; }
.elementor-page-21 .hc-cs-card .elementor-image-box-title { font-family:Figtree,sans-serif; font-size:18px; font-weight:600; color:#1f2937; margin:0; }
.elementor-page-21 .hc-cs-active .elementor-image-box-wrapper { border-color:#14b2a7; }
.elementor-page-21 .hc-cs-active .elementor-image-box-title { font-weight:600; }
@media(max-width:980px) {
  .elementor-page-21 .hc-cs-card .elementor-image-box-wrapper { flex-direction:row; justify-content:center; }
  .elementor-page-21 .contact-support-tabs .elementor-column:not(:last-child) { margin-bottom:9px; }
}

/* form section heading */
.elementor-page-21 .hc-cs-form-title .elementor-heading-title { font-family:Figtree,sans-serif !important; font-size:36px !important; font-weight:600 !important; color:#111827 !important; }
.elementor-page-21 .hc-cs-form-sub { color:#4b5563 !important; font-size:16px !important; margin-top:6px; }

/* tab bar above the form */
.elementor-page-21 .hc-cs-tabs { display:flex; gap:32px; border-bottom:1px solid #e5e7eb; margin-bottom:28px; }
.elementor-page-21 .hc-cs-tabs span { font-family:Figtree,sans-serif; font-size:16px; font-weight:400; color:#4b5563; padding-bottom:8px; margin-bottom:-1px; cursor:pointer; }
.elementor-page-21 .hc-cs-tabs span.hc-cs-tab-active { color:#107e77; font-weight:500; border-bottom:2px solid #107e77; }

/* form fields now inherit the GLOBAL form block above (consistent teal #107e77). */

/* General Inquiries band */
.elementor-page-21 .hc-cs-inq { max-width:1200px; margin:0 auto; }
.elementor-page-21 .hc-cs-inq-band { background:#107e77; border-radius:8px; padding:32px 40px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px; }
.elementor-page-21 .hc-cs-inq-band h3 { font-family:Figtree,sans-serif; font-size:36px; font-weight:500; color:#f3f4f6; margin:0; display:flex; align-items:center; gap:14px; }
.elementor-page-21 .hc-cs-inq-band .hc-cs-inq-bubble { width:40px; height:40px; }
.elementor-page-21 .hc-cs-inq-info { display:flex; gap:48px; }
.elementor-page-21 .hc-cs-inq-info .hc-cs-inq-item { color:#fff; font-family:Figtree,sans-serif; }
.elementor-page-21 .hc-cs-inq-info .hc-cs-inq-item .lbl { display:flex; align-items:center; gap:8px; font-size:13px; opacity:.85; margin-bottom:2px; }
.elementor-page-21 .hc-cs-inq-info .hc-cs-inq-item .val { font-size:16px; font-weight:500; }
.elementor-page-21 .hc-cs-inq-info .hc-cs-inq-item .lbl img { width:18px; height:18px; }
@media (max-width:767px){
  .elementor-page-21 .hc-cs-hero-title .elementor-heading-title { font-family:'Roboto',sans-serif !important; font-size:30px !important; max-width:300px; }
  .elementor-page-21 .hc-cs-inq-band { flex-direction:column; align-items:flex-start; }
  .elementor-page-21 .hc-cs-inq-info { flex-direction:column; gap:16px; }
  .elementor-page-21 .hc-cs-hero-title::before,
  .elementor-page-21 .hc-cs-hero-title::after { display:none; }
}

/* ════════════════════════════════════════════════════════════════════
   Sustainability page (post id 14) — pixel fixes
   ════════════════════════════════════════════════════════════════════ */

/* Hero: force 550px min-height + bottom-align content (Elementor 4.1.x ignores JSON min_height, center-aligns columns by default) */
.elementor-14 .elementor-element-sh_hero > .elementor-container {
    min-height: 550px !important;
    align-items: flex-end !important;
}

/* Hero: replace solid Elementor overlay with bottom-to-top gradient (JSON "gradient" type not supported in 4.1.x) */
.elementor-14 .elementor-element-sh_hero > .elementor-background-overlay {
    background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(17,24,39,0.88) 100%) !important;
    opacity: 1 !important;
}

/* 3-image grid (commitment section) — equal heights with cover crop */
[data-id="sh_commitment"] .hc-sustain-img img {
    height: 320px !important;
    width: 100%;
    object-fit: cover;
    border-radius: 16px;
    display: block;
}

/* Laundry4 image (policy section right column) — fill column height */
[data-id="sh_policy"] .hc-sustain-img img {
    width: 100%;
    height: 480px;
    object-fit: cover;
    object-position: center 20%;
    border-radius: 16px;
    display: block;
}

/* ════════════════════════════════════════════════════════════════════
   News & Events archive (/news/) — pixel-perfect pass v1.15.0
   Correct class names verified from live DOM inspection.
   ════════════════════════════════════════════════════════════════════ */

/* ── Hero heading: standardized 56px ── */
[data-id="ne_h1"] .elementor-heading-title {
    font-size: 56px !important;
    line-height: 1em !important;
}

/* ── Featured card: hide date (source shows no date on featured card) ── */
[data-id="ne_feat_posts"] .elementor-post__meta-data { display: none !important; }

/* ── Hide author avatar (grey profile circle) on all Posts widgets ── */
[data-id="ne_feat_posts"] .elementor-post__avatar,
[data-id="ne_ev_posts"]   .elementor-post__avatar,
[data-id="ne_news_posts"] .elementor-post__avatar { display: none !important; }

/* ── Hide "No Comments" (elementor-post-avatar span in meta-data) ── */
[data-id="ne_feat_posts"] .elementor-post-avatar,
[data-id="ne_ev_posts"]   .elementor-post-avatar,
[data-id="ne_news_posts"] .elementor-post-avatar { display: none !important; }

/* ── Section headings (Events / Latest News) ── */
[data-id="ne_ev_h"]   .elementor-heading-title,
[data-id="ne_news_h"] .elementor-heading-title {
    font-family: Figtree, sans-serif;
    font-size: 32px;
    font-weight: 700;
    color: #111827;
    margin-bottom: 24px;
}

/* ── FEATURED label (text-editor widget) → teal uppercase ── */
[data-id="ne_feat_label"] p {
    color: #14b2a8;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 16px;
}

/* ── Post title links → dark navy on all Posts widgets ── */
[data-id="ne_feat_posts"] .elementor-post__title a,
[data-id="ne_ev_posts"]   .elementor-post__title a,
[data-id="ne_news_posts"] .elementor-post__title a {
    color: #111827 !important;
    font-family: Figtree, sans-serif;
    font-weight: 700;
    line-height: 1.3;
    text-decoration: none;
}
[data-id="ne_feat_posts"] .elementor-post__title a:hover,
[data-id="ne_ev_posts"]   .elementor-post__title a:hover,
[data-id="ne_news_posts"] .elementor-post__title a:hover { color: #14b2a8 !important; }

/* ── Meta date ── */
[data-id="ne_feat_posts"] .elementor-post__meta-data,
[data-id="ne_ev_posts"]   .elementor-post__meta-data,
[data-id="ne_news_posts"] .elementor-post__meta-data {
    font-size: 13px;
    color: #6b7280;
}

/* ── Remove Elementor cards-skin dark gradient overlay on thumbnails ── */
[data-id="ne_feat_posts"] .elementor-post__thumbnail__link::after,
[data-id="ne_ev_posts"]   .elementor-post__thumbnail__link::after,
[data-id="ne_news_posts"] .elementor-post__thumbnail__link::after { display: none !important; }

/* ── Read More → teal "Read More →" to match source.
   Elementor outputs the text as plain text node inside <a>, so use
   font-size:0 to hide it and ::before to inject the correct label. ── */
[data-id="ne_feat_posts"] .elementor-post__read-more,
[data-id="ne_ev_posts"]   .elementor-post__read-more,
[data-id="ne_news_posts"] .elementor-post__read-more {
    font-size: 0 !important;
    text-decoration: none;
    display: inline-block;
}
[data-id="ne_feat_posts"] .elementor-post__read-more::before,
[data-id="ne_ev_posts"]   .elementor-post__read-more::before,
[data-id="ne_news_posts"] .elementor-post__read-more::before {
    content: "Read More →";
    font-size: 14px !important;
    color: #14b2a8 !important;
    font-weight: 600;
    font-family: inherit;
    text-transform: none !important;
}

/* ── Force Featured + Events posts containers to single column
      (Posts widget defaults to elementor-grid-3 even when columns=1) ── */
[data-id="ne_feat_posts"] .elementor-posts-container,
[data-id="ne_ev_posts"]   .elementor-posts-container { display: block !important; }
[data-id="ne_feat_posts"] .elementor-grid-item,
[data-id="ne_ev_posts"]   .elementor-grid-item { width: 100% !important; margin-bottom: 0 !important; }

/* ════ Featured: CSS-grid horizontal card (text left, image right) ════ */
[data-id="ne_feat_posts"] .elementor-post__card {
    display: grid !important;
    grid-template-columns: 45% 55%;
    grid-template-rows: 1fr auto;
    grid-template-areas:
        "text  image"
        "meta  image";
    min-height: 360px;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    overflow: hidden;
    width: 100%;
}
[data-id="ne_feat_posts"] .elementor-post__thumbnail__link {
    grid-area: image;
    display: block;
}
[data-id="ne_feat_posts"] .elementor-post__thumbnail__link img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    border-radius: 0 !important;
}
[data-id="ne_feat_posts"] .elementor-post__text {
    grid-area: text;
    padding: 40px 36px 16px !important;
    align-self: start;
}
[data-id="ne_feat_posts"] .elementor-post__meta-data {
    grid-area: meta;
    padding: 0 36px 32px !important;
    align-self: start;
}
[data-id="ne_feat_posts"] .elementor-post__title a { font-size: 24px !important; }

/* ════ Events: portrait collage at natural proportions ════
   Explicit static positioning + height:auto so the full portrait
   collage renders at natural proportions (no cropping).
   Card overflow:visible so the tall thumbnail isn't clipped. ════ */
[data-id="ne_ev_posts"] .elementor-post__card {
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    overflow: visible !important;
    display: flex !important;
    flex-direction: column !important;
}
[data-id="ne_ev_posts"] .elementor-post__thumbnail {
    height: auto !important;
    padding-bottom: 0 !important;
    overflow: visible !important;
    position: static !important;
    border-radius: 0 !important;
}
[data-id="ne_ev_posts"] .elementor-post__thumbnail__link {
    position: static !important;
    display: block !important;
    height: auto !important;
    width: 100% !important;
    order: 1 !important;
}
[data-id="ne_ev_posts"] .elementor-post__thumbnail__link img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    position: static !important;
    transform: none !important;
    top: auto !important;
    left: auto !important;
    border-radius: 8px !important;
}
[data-id="ne_ev_posts"] .elementor-post__meta-data {
    order: 2 !important;
    border-top: none !important;
    padding: 12px 0 0 !important;
    margin: 0 !important;
}
[data-id="ne_ev_posts"] .elementor-post__text { order: 3 !important; padding: 8px 0 0 !important; }
[data-id="ne_ev_posts"] .elementor-post__title a { font-size: 22px !important; }

/* ════ Latest News: 3-column grid, images crop to fixed height ════ */
[data-id="ne_news_posts"] .elementor-post__thumbnail {
    height: 265px !important;
    padding-bottom: 0 !important;
    overflow: hidden !important;
    position: relative !important;
}
[data-id="ne_news_posts"] .elementor-post__thumbnail__link img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    transform: none !important;
}
[data-id="ne_news_posts"] .elementor-post__thumbnail__link { margin-bottom: 0 !important; order: 1 !important; }
[data-id="ne_news_posts"] .elementor-post__meta-data {
    order: 2 !important;
    border-top: none !important;
    padding: 14px 20px 0 !important;
    margin: 0 !important;
}
[data-id="ne_news_posts"] .elementor-post__text { order: 3 !important; margin-top: 0 !important; padding: 18px 20px 22px !important; }
[data-id="ne_news_posts"] .elementor-post__title a { font-size: 18px !important; }
[data-id="ne_news_posts"] .elementor-post__card {
    display: flex !important;
    flex-direction: column !important;
    border: none !important;
    box-shadow: rgba(16, 24, 40, 0.08) 0px 1px 3px 0px !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    overflow: hidden !important;
}


/* ════════════════════════════════════════════════════════════════════
   About page (post 11) — Why Hercules Makes Sense cards
   Same spec as Laundry Guide / News cards: radius 12px, subtle shadow
   ════════════════════════════════════════════════════════════════════ */
[data-id="5591210"] .elementor-col-33 > .elementor-widget-wrap {
    background: #ffffff !important;
    border-radius: 12px !important;
    box-shadow: rgba(16,24,40,0.08) 0px 1px 3px 0px !important;
    overflow: hidden !important;
    padding: 24px !important;
}
/* 24px gap between the 3 cards; adjust column width to account for 2×24px = 48px total gap */
[data-id="5591210"] .elementor-container {
    gap: 24px !important;
}
@media (min-width: 768px) {
    [data-id="5591210"] .elementor-col-33 {
        width: calc(33.333% - 16px) !important;
    }
}
@media (max-width: 767px) {
    [data-id="5591210"] .elementor-col-33 {
        width: 100% !important;
    }
}

/* About page (post 11) — rounded images matching herc.scbw.com source */
[data-id="lgimg1"] img,
[data-id="vsimg1x"] img,
[data-id="msnimg1"] img {
    border-radius: 16px !important;
}
[data-id="wyh1h3i"] img,
[data-id="wyh2h3i"] img,
[data-id="wyh3h3i"] img {
    border-radius: 12px !important;
}

/* Sustainability page (post 14) — 3 photos in Commitment to be Green section */
[data-id="sh_img"] .elementor-widget-image img {
    border-radius: 16px !important;
}

/* Elementor legacy section column widths — frontend.min.css col-NN rules are inside
   @media (min-width:768px) but fail to apply due to a cascade conflict. Re-declare
   with !important to guarantee correct widths on all pages using section/column layout. */
@media (min-width: 768px) {
    .elementor-column.elementor-col-10  { width: 10%     !important; }
    .elementor-column.elementor-col-11  { width: 11.111% !important; }
    .elementor-column.elementor-col-12  { width: 12.5%   !important; }
    .elementor-column.elementor-col-14  { width: 14.285% !important; }
    .elementor-column.elementor-col-16  { width: 16.666% !important; }
    .elementor-column.elementor-col-20  { width: 20%     !important; }
    .elementor-column.elementor-col-25  { width: 25%     !important; }
    .elementor-column.elementor-col-30  { width: 30%     !important; }
    .elementor-column.elementor-col-33  { width: 33.333% !important; }
    .elementor-column.elementor-col-34  { width: 33.334% !important; }
    .elementor-column.elementor-col-40  { width: 40%     !important; }
    .elementor-column.elementor-col-45  { width: 45%     !important; }
    .elementor-column.elementor-col-50  { width: 50%     !important; }
    .elementor-column.elementor-col-55  { width: 55%     !important; }
    .elementor-column.elementor-col-60  { width: 60%     !important; }
    .elementor-column.elementor-col-66  { width: 66.666% !important; }
    .elementor-column.elementor-col-70  { width: 70%     !important; }
    .elementor-column.elementor-col-75  { width: 75%     !important; }
    .elementor-column.elementor-col-80  { width: 80%     !important; }
    .elementor-column.elementor-col-83  { width: 83.333% !important; }
    .elementor-column.elementor-col-90  { width: 90%     !important; }
    .elementor-column.elementor-col-100 { width: 100%    !important; }
}

/* ── Equipment archive: hero height +50% (460px → 690px) ────────────────── */
[data-id="eqhero1"] { min-height: 690px !important; }

/* ── Our Timeline (page-id-12): H1 in classic-editor content → 56px Roboto ── */
body.page-id-12 .page-content h1,
body.page-id-12 .entry-content h1 {
    font-family: 'Roboto', sans-serif !important;
    font-size: 56px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
}

/* ── About hero (page-id-11): buttons side by side ─────────────────────── */
.elementor-page-11 .elementor-element-h1btn1,
.elementor-page-11 .elementor-element-h1btn2 {
    width: auto !important;
    margin-right: 12px;
}

/* ── About: "Why Hercules" text-link buttons — force teal color over Elementor default white ── */
.elementor-element-wyh1bt .elementor-button,
.elementor-element-wyh2bt .elementor-button,
.elementor-element-wyh3bt .elementor-button {
    color: #107e77 !important;
    font-size: 14px;
    font-weight: 500;
    padding: 4px 0;
    background: transparent !important;
    border: none !important;
    text-decoration: none;
}
.elementor-element-wyh1bt .elementor-button:hover,
.elementor-element-wyh2bt .elementor-button:hover,
.elementor-element-wyh3bt .elementor-button:hover {
    color: #0d9488 !important;
}

/* ── Pricing hero CTA — normalize to standard pill spec (13px/28px padding, weight 500) ── */
.hc-pr-hero-btn {
    padding: 13px 28px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
}

/* ── Nav hover: ensure teal on all viewports (Elementor widget setting + CSS belt-and-suspenders) ── */
.elementor-nav-menu .elementor-item:hover,
.elementor-nav-menu .elementor-item:focus,
.elementor-nav-menu .elementor-item.elementor-item-active,
.elementor-nav-menu .elementor-item.highlighted {
    color: #107e77 !important;
}

/* ── Nav submenu: white bg + gray text by default; green bg + white text on hover ── */
.elementor-nav-menu .sub-menu,
.elementor-nav-menu .elementor-sub-item {
    background-color: #ffffff !important;
    color: #33373d !important;
}
.elementor-nav-menu .elementor-sub-item:hover,
.elementor-nav-menu .elementor-sub-item:focus,
.elementor-nav-menu .elementor-sub-item.elementor-item-active {
    background-color: #107e77 !important;
    color: #ffffff !important;
}

/* ── Mobile dropdown nav: active + expanded-parent items get a teal bg from the widget —
      text must be white, not the teal from the site-wide active rule above
      (teal-on-teal = invisible label) ── */
.elementor-nav-menu--dropdown .elementor-item.elementor-item-active,
.elementor-nav-menu--dropdown .elementor-item.highlighted {
    color: #ffffff !important;
}

/* ── Pricing plan selector: fit all 3 options within mobile viewport ── */
@media (max-width: 767px) {
    .hc-pr-form .elementor-field-type-radio .elementor-field-subgroup {
        width: 100% !important;
        box-sizing: border-box !important;
    }
    .hc-pr-form .elementor-field-type-radio .elementor-field-subgroup .elementor-field-option {
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 0 !important;
    }
    .hc-pr-form .elementor-field-type-radio .elementor-field-option label {
        padding: 8px 8px !important;
        font-size: 13px !important;
        white-space: normal !important;
        text-align: center !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        line-height: 1.2 !important;
    }
}

/* ── Back-to-top button — mobile only, appears after 400px scroll ── */
#hc-back-top {
    position: fixed;
    right: 16px;
    bottom: 24px;
    z-index: 9990;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #107e77;
    color: #ffffff;
    border: none;
    cursor: pointer;
    padding: 0;
    display: none;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(16, 24, 40, 0.25);
    opacity: 0;
    transform: translateY(8px);
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
}
#hc-back-top svg { width: 20px; height: 20px; display: block; }
#hc-back-top.hc-bt-show {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}
@media (max-width: 767px) {
    #hc-back-top { display: flex; }
}

/* ── Add Funds card picker — mobile: space between the 3 stacked card images ── */
@media (max-width: 767px) {
    [data-id="f3ffb05"] .elementor-column:not(:last-child) {
        margin-bottom: 24px;
    }
}

/* ── Plan Comparison: keep 3-column layout on mobile (col1=42% features, col2-3=29% each) ── */
@media (max-width: 767px) {
    /* Column 1 — feature labels */
    .elementor-element-00001jl, .elementor-element-00001l5,
    .elementor-element-00001lc, .elementor-element-00001lj,
    .elementor-element-00001lq, .elementor-element-00001lx,
    .elementor-element-00001m4, .elementor-element-00001mb,
    .elementor-element-00001mh {
        width: 42% !important; min-width: 0 !important;
    }
    /* Column 2 — Buy Equipment */
    .elementor-element-00001jn, .elementor-element-00001l7,
    .elementor-element-00001le, .elementor-element-00001ll,
    .elementor-element-00001ls, .elementor-element-00001lz,
    .elementor-element-00001m6, .elementor-element-00001md,
    .elementor-element-00001mj {
        width: 29% !important; min-width: 0 !important;
    }
    /* Column 3 — Revenue Share (Customer Recommended) */
    .elementor-element-00001jq, .elementor-element-00001l9,
    .elementor-element-00001lg, .elementor-element-00001ln,
    .elementor-element-00001lu, .elementor-element-00001m1,
    .elementor-element-00001m8, .elementor-element-00001mf,
    .elementor-element-00001ml {
        width: 29% !important; min-width: 0 !important;
    }
    /* Header row: smaller text so plan names fit */
    .elementor-element-00001jl .elementor-heading-title,
    .elementor-element-00001jn .elementor-heading-title {
        font-size: 12px !important;
        line-height: 1.3 !important;
    }
    /* "Zero-Cost Revenue Share" heading + badge in col 3 */
    .elementor-element-00001jq .elementor-heading-title {
        font-size: 12px !important;
        line-height: 1.3 !important;
    }
    .elementor-element-00001jq [style*="font-size:10px"],
    .elementor-element-00001jq span {
        font-size: 9px !important;
        padding: 3px 5px !important;
        letter-spacing: 0 !important;
    }
    /* Feature label rows: compact text */
    .elementor-element-00001l5 .elementor-widget-container,
    .elementor-element-00001lc .elementor-widget-container,
    .elementor-element-00001lj .elementor-widget-container,
    .elementor-element-00001lq .elementor-widget-container,
    .elementor-element-00001lx .elementor-widget-container,
    .elementor-element-00001m4 .elementor-widget-container,
    .elementor-element-00001mb .elementor-widget-container {
        font-size: 12px !important;
        line-height: 1.3 !important;
    }
    /* CTA buttons in bottom row: fit in narrow columns */
    .elementor-element-00001mj .elementor-button,
    .elementor-element-00001ml .elementor-button {
        font-size: 11px !important;
        padding: 10px 6px !important;
        white-space: normal !important;
        text-align: center !important;
        line-height: 1.2 !important;
        border-radius: 50px !important;
    }
}
