/* ------------------------------------------------------------------
   Custom overrides / additions on top of the original theme's main.css
   ------------------------------------------------------------------ */

/* Fix: the footer's two widget columns default to flex "stretch", so the
   shorter nav column gets pulled down to match the taller contact-info
   column, leaving a dead gap under the nav links. Align both to the top
   instead so each column only takes the height its own content needs. */
.footer-section .footer-widgets-wrapper.style1 .widget {
  align-items: flex-start;
}

/* ------------------------------------------------------------------
   Offcanvas mobile nav styling
   The original theme renders this menu via the jQuery meanmenu plugin,
   which injects its own markup/classes (.mean-container, .mean-nav, ...)
   and is styled by meanmenu.css. This template's offcanvas nav is built
   with plain React state instead (see NavMenu.jsx "mobile" variant), so
   we restyle it here to match the same look without needing jQuery.
   ------------------------------------------------------------------ */
.mobile-nav__list {
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%;
}

.mobile-nav__list > li {
  border-bottom: 1px solid var(--border, rgba(255, 255, 255, 0.12));
}

.mobile-nav__list > li:last-child {
  border-bottom: none;
}

.mobile-nav__list a {
  display: inline-block;
  width: 100%;
  padding: 10px 0;
  color: var(--white, #fff) !important;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 600;
  text-transform: capitalize;
  transition: color 0.3s ease-in-out;
}

.mobile-nav__list a:hover {
  color: var(--theme, #ffb26e) !important;
}

.mobile-nav__toggle {
  background: none;
  border: none;
  color: var(--white, #fff);
  font-size: 18px;
  padding: 10px 4px;
  cursor: pointer;
  line-height: 1;
}

.mobile-nav__toggle:hover {
  color: var(--theme, #ffb26e);
}

.mobile-nav__list .submenu {
  list-style: none;
  margin: 0 0 8px 0;
  padding: 0 0 0 16px;
}

.mobile-nav__list .submenu li a {
  font-size: 15px;
  font-weight: 400;
  padding: 8px 0;
  opacity: 0.85;
}

.mobile-nav__list .submenu li a:hover {
  opacity: 1;
}
@media (max-width:1024px) {
   .mouse-cursor {display: none;}
   nav#mobile-menu {
    display: none;
   }
}
/* ------------------------------------------------------------------
   Palmetto Machine & Fabrication preview additions
   ------------------------------------------------------------------ */

/* Text logo (TODO: replace with real logo file) */
.pm-text-logo { display: inline-flex; flex-direction: column; line-height: 1; text-decoration: none; }
.pm-text-logo__main { font-family: "Space Grotesk", sans-serif; font-weight: 700; font-size: 22px; letter-spacing: -0.5px; text-transform: uppercase; color: var(--white); }
.pm-text-logo__sub { font-family: "Space Grotesk", sans-serif; font-weight: 500; font-size: 12px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--theme); margin-top: 5px; }
.pm-text-logo--light .pm-text-logo__main { color: var(--white); }
.header-1.sticky .pm-text-logo__main { color: var(--white); }
@media (max-width: 400px) {
  .pm-text-logo__main { font-size: 17px; }
  .pm-text-logo__sub { font-size: 10px; letter-spacing: 1px; }
}

/* Header call button */
.pm-header-call { display: inline-flex; align-items: center; gap: 10px; background: var(--theme); color: var(--black); font-weight: 600; border-radius: 999px; padding: 10px 20px; margin-right: 15px; white-space: nowrap; transition: background .3s; }
.pm-header-call:hover { background: var(--white); color: var(--black); }
.pm-header-call__short { display: none; }
@media (max-width: 575px) {
  .pm-header-call { padding: 9px 14px; margin-right: 10px; }
  .pm-header-call__num { display: none; }
  .pm-header-call__short { display: inline; }
}
.header-1 .header-main .main-menu ul li a.active { color: var(--theme); }

/* Hero fact panel (replaces template placeholder image) */
.pm-intro-right { position: relative !important; right: auto !important; bottom: auto !important; margin-top: 88px; }
@media (max-width: 1199px) { .pm-intro-right { margin-top: 40px; } }
.pm-fact-panel { border: 2px solid var(--theme); border-radius: 24px; padding: 40px; background: rgba(255, 255, 255, 0.04); }
.pm-fact-panel .pm-fact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.pm-fact-panel .pm-fact { background: #1a1a1a; border-radius: 16px; padding: 24px; }
.pm-fact-panel .pm-fact strong { display: block; font-family: "Space Grotesk", sans-serif; font-size: 44px; line-height: 1.1; color: var(--theme); font-weight: 700; }
.pm-fact-panel .pm-fact span { color: var(--white); font-size: 15px; line-height: 1.4; display: block; margin-top: 8px; }
.pm-fact-panel .pm-fact-foot { margin-top: 24px; color: #bdbdbd; font-size: 14px; line-height: 1.5; }
.pm-fact-panel .pm-fact-foot a { color: var(--theme); text-decoration: underline; }
@media (max-width: 575px) {
  .pm-fact-panel { padding: 20px; border-radius: 18px; }
  .pm-fact-panel .pm-fact-grid { gap: 12px; }
  .pm-fact-panel .pm-fact { padding: 16px; }
  .pm-fact-panel .pm-fact strong { font-size: 32px; }
  .pm-fact-panel .pm-fact span { font-size: 13px; }
}

/* Hero call button next to "Request a Quote" */
.pm-call-btn { display: inline-flex; align-items: center; gap: 12px; color: var(--white); font-weight: 600; font-size: 18px; }
.pm-call-btn span.icon { width: 48px; height: 48px; border-radius: 50%; background: var(--theme); color: var(--black); display: inline-flex; align-items: center; justify-content: center; }
.pm-call-btn:hover { color: var(--theme); }

/* Service card font-awesome icon (replaces image icon) */
.service-card .icon-box .pm-fa-icon { font-size: 52px; color: var(--black); line-height: 1; }

/* Parts panel (replaces placeholder video thumbnail) */
.pm-parts-panel { background: var(--black); border-radius: 24px; padding: 48px; height: 100%; position: relative; overflow: hidden; }
.pm-parts-panel h3 { color: var(--white); font-family: "Space Grotesk", sans-serif; font-size: 40px; line-height: 1.1; text-transform: uppercase; margin-bottom: 14px; }
.pm-parts-panel p { color: #cfcfcf; margin-bottom: 26px; }
.pm-parts-panel ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.pm-parts-panel li { border: 1px solid var(--theme); color: var(--white); border-radius: 999px; padding: 8px 18px; font-size: 15px; }
@media (max-width: 575px) {
  .pm-parts-panel { padding: 26px; border-radius: 18px; }
  .pm-parts-panel h3 { font-size: 28px; }
  .pm-parts-panel li { font-size: 13px; padding: 6px 14px; }
}

/* Plain fact values in counters (no animated invented numbers) */
.pm-counter-value { font-family: "Space Grotesk", sans-serif; }

/* Breadcrumb without placeholder thumb */
.breadcumb .pm-breadcrumb-note { color: var(--white); max-width: 620px; margin-top: 18px; }

/* Forms */
.pm-form-extra { margin-top: 30px; }
.pm-preview-note { margin-top: 18px; padding: 14px 18px; border-radius: 14px; background: var(--theme); color: var(--black) !important; font-weight: 500; }
.pm-preview-note a { color: var(--black); text-decoration: underline; font-weight: 700; }
.pm-footer-text { color: var(--white); }

/* Map iframe responsive */
.message-wrapper .map iframe, .contact-wrapper .map iframe { max-width: 100%; }
.sticky.header-1 .header-main .main-menu ul li a.active,
.sticky.header-1 .header-main .main-menu ul li a:hover { color: var(--theme) !important; }
.pm-fact-panel--dark { background: var(--black); }
.pm-check-list { list-style: none; padding: 0; margin: 0 0 30px; }
.pm-check-list li { display: flex; gap: 12px; align-items: baseline; margin-bottom: 10px; color: var(--title); }
.pm-check-list li i { color: var(--black); background: var(--theme); border-radius: 50%; width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; flex-shrink: 0; }
.title-section .title-content p a { color: inherit; text-decoration: underline; font-weight: 600; }
.pm-text-logo--dark .pm-text-logo__main { color: var(--black); }
.pm-text-logo--dark .pm-text-logo__sub { color: #b4651f; }
.pm-footer-text { color: var(--title); font-weight: 600; }
/* Intro: more breathing room below the buttons */
.intro-section .intro-wrapper.style1 { padding-bottom: 110px; }
@media (max-width: 767px) { .intro-section .intro-wrapper.style1 { padding-bottom: 50px; } }
/* Prevent decorative shapes and row gutters from causing horizontal scroll on phones */
.breadcumb { overflow: hidden; }
main, footer { overflow-x: clip; }
.pm-text-logo span { white-space: nowrap; }
@media (max-width: 575px) {
  .header-1 .header-main { gap: 8px; }
  .pm-text-logo__main { font-size: 16px; }
  .pm-text-logo__sub { font-size: 9.5px; letter-spacing: 0.8px; }
  .pm-header-call { padding: 8px 12px; margin-right: 8px; font-size: 14px; gap: 6px; }
  .header__hamburger { margin-left: 0 !important; }
}
.header-1 .header-right .pm-header-call { margin-right: 0; }
@media (max-width: 575px) { .header-1 .header-right .sidebar__toggle { margin-left: 14px; font-size: 22px; } }
@media (max-width: 1199px) { .header-1 .header-middle { display: none; } .header-1 .header-main { justify-content: space-between; } }
/* Template sets the quote box background to transparent on small phones: keep the heading readable */
@media (max-width: 450px) {
  .message-wrapper.style1 .message-inner .message-left-part .title-section.style2 .title-content h2 { color: var(--black); }
  .message-wrapper.style1 .message-inner .message-left-part .title-section.style2 .title-content P { display: block; color: var(--text); margin-bottom: 20px; }
}
.pm-parts-panel { height: auto; }
.breadcumb .page-heading { padding-bottom: 40px; }
.title-section .title-content p + p { margin-top: 12px; }
