/* Chevy Tile & Stone - form styling. Gravity Forms / HubSpot defaults do not
   match the brand; this brings inputs, labels, focus and submit in line. */

#cts-formwrap .gform_wrapper,
#cts-formwrap-contact .gform_wrapper { margin: 0; }

#cts-formwrap .gform_wrapper .gfield_label,
#cts-formwrap-contact .gform_wrapper .gfield_label {
  font-family: Inter, sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .2em !important;
  text-transform: uppercase !important;
  color: #E1B466 !important;
  margin-bottom: 6px !important;
}

#cts-formwrap .gform_wrapper input[type=text],
#cts-formwrap .gform_wrapper input[type=email],
#cts-formwrap .gform_wrapper input[type=tel],
#cts-formwrap .gform_wrapper select,
#cts-formwrap .gform_wrapper textarea,
#cts-formwrap-contact .gform_wrapper input[type=text],
#cts-formwrap-contact .gform_wrapper input[type=email],
#cts-formwrap-contact .gform_wrapper input[type=tel],
#cts-formwrap-contact .gform_wrapper select,
#cts-formwrap-contact .gform_wrapper textarea {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(209,198,176,.3) !important;
  border-radius: 0 !important;
  color: #EBE3D4 !important;
  font-family: Inter, sans-serif !important;
  font-size: 16px !important;
  padding: 14px 0 10px !important;
  box-shadow: none !important;
  transition: border-color .4s cubic-bezier(.16,1,.3,1) !important;
}

#cts-formwrap .gform_wrapper input:focus,
#cts-formwrap .gform_wrapper select:focus,
#cts-formwrap .gform_wrapper textarea:focus,
#cts-formwrap-contact .gform_wrapper input:focus,
#cts-formwrap-contact .gform_wrapper select:focus,
#cts-formwrap-contact .gform_wrapper textarea:focus {
  outline: none !important;
  border-bottom-color: #E1B466 !important;
}

#cts-formwrap .gform_wrapper ::placeholder,
#cts-formwrap-contact .gform_wrapper ::placeholder { color: rgba(235,227,212,.5) !important; }

#cts-formwrap .gform_wrapper select option,
#cts-formwrap-contact .gform_wrapper select option { background:#06162C !important; color:#EBE3D4 !important; }

#cts-formwrap .gform_wrapper .gfield_description,
#cts-formwrap-contact .gform_wrapper .gfield_description {
  font-family: Inter, sans-serif !important; font-size: 13px !important; color: rgba(235,227,212,.55) !important;
}

#cts-formwrap .gform_wrapper .validation_message,
#cts-formwrap-contact .gform_wrapper .validation_message,
#cts-formwrap .gform_wrapper .gfield_error .gfield_label,
#cts-formwrap-contact .gform_wrapper .gfield_error .gfield_label {
  color: #E1B466 !important; background: transparent !important; border: 0 !important;
}
#cts-formwrap .gform_wrapper .gfield_error,
#cts-formwrap-contact .gform_wrapper .gfield_error { background: transparent !important; border: 0 !important; }

#cts-formwrap .gform_wrapper .gform_button,
#cts-formwrap-contact .gform_wrapper .gform_button {
  background: #E1B466 !important;
  color: #06162C !important;
  border: 0 !important;
  border-radius: 2px !important;
  font-family: Inter, sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  padding: 18px 32px !important;
  cursor: pointer;
  transition: background-color .5s cubic-bezier(.16,1,.3,1), color .5s cubic-bezier(.16,1,.3,1) !important;
}
#cts-formwrap .gform_wrapper .gform_button:hover,
#cts-formwrap-contact .gform_wrapper .gform_button:hover { background: #F6F2EA !important; color: #06162C !important; }

#cts-formwrap .gform_confirmation_message,
#cts-formwrap-contact .gform_confirmation_message {
  font-family: Fraunces, serif !important; font-size: 22px !important; color: #EBE3D4 !important;
  border-top: 1px solid #E1B466; padding-top: 18px;
}

#cts-formwrap-contact { box-shadow: 0 24px 60px -30px rgba(6,22,44,.45); }

/* ---- full-bleed: Astra wraps Elementor content in .ast-container, which
       carries a max-width and side padding. Scoped to Elementor pages only,
       so blog articles keep their readable measure. ---- */
.elementor-page #content .ast-container,
.elementor-page .site-content > .ast-container {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.elementor-page #primary,
.elementor-page #main.site-main,
.elementor-page .ast-article-single,
.elementor-page .entry-content {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
.elementor-page .entry-header.ast-no-title { display: none; }
.elementor-page .site-content { padding: 0 !important; }

/* NOTE: do NOT force width on .e-con-full here. Every column container is an
   .e-con-full, so a blanket width:100% makes header/footer columns stack.
   Only TOP-LEVEL sections should be stretched, and Astra's container fix
   above already achieves that. */
.elementor-page > .elementor,
.elementor-page .entry-content > .elementor { width: 100%; max-width: 100%; }

/* ---- header: one row, compact, vertically centred ---- */
#cts-header { position: relative; z-index: 50; }
#cts-header-inner > .e-con { align-items: center; }
#cts-header .elementor-widget-image img { display: block; }
#cts-header .elementor-widget-text-editor p,
#cts-header .elementor-widget-text-editor { margin: 0; }
#cts-header .elementor-button { white-space: nowrap; }
/* the Xpro menu should not add its own vertical padding */
#cts-header .xpro-elementor-navigation,
#cts-header .xpro-nav-menu { margin: 0; }

@media (max-width: 1024px) {
  /* nav collapses to the Xpro toggle; keep brand left, actions right */
  #cts-header-inner > .e-con { flex-wrap: nowrap; }
}
@media (max-width: 767px) {
  #cts-header-inner > .e-con { flex-wrap: wrap; row-gap: 10px; }
  #cts-header .elementor-widget-button { width: auto; }
}

/* ---- footer: wordmark + columns ---- */
#cts-footer .cts-mark { margin-bottom: 0; }
#cts-footer .elementor-widget-text-editor p { margin: 0; }
#cts-footer a { text-decoration: none; }
@media (max-width: 1024px) {
  #cts-footer-inner > .e-con > .e-con { width: 50% !important; }
}
@media (max-width: 767px) {
  #cts-footer-inner > .e-con > .e-con { width: 100% !important; margin-bottom: 26px; }
  #cts-footer .cts-mark { font-size: 15vw; }
}

/* ---- stats strip: centre each cell, keep dividers full height ---- */
#cts-stats .elementor-counter { text-align: center; }
#cts-stats .elementor-counter-number-wrapper,
#cts-stats .elementor-counter-title {
  text-align: center !important;
  justify-content: center !important;
  width: 100%;
  display: block;
}
#cts-stats .elementor-counter-title { margin-top: 14px; max-width: 24ch; margin-inline: auto; }
/* neither the counters nor the licence heading may push into the next cell */
#cts-stats .elementor-counter-number-wrapper,
#cts-stats .elementor-heading-title { white-space: nowrap; }
#cts-stats .elementor-widget-text-editor p { text-align: center; margin: 0; }

@media (max-width: 1024px) {
  #cts-stats .elementor-counter-number-wrapper { font-size: 46px !important; }
}
@media (max-width: 767px) {
  #cts-stats .elementor-counter-title { max-width: none; }
}


/* ===== CTS overflow + header nowrap guards ===== */
/* A nowrap flex row cannot shrink while its children keep min-width:auto,
   so without this the header overflows instead of wrapping. */
.elementor-element-d4d9b8d > .e-con-inner > .e-con,
.elementor-element-d4d9b8d > .e-con,
.elementor-element-0381eeb > .e-con-inner > .e-con,
.elementor-element-0381eeb > .e-con { min-width: 0; }

/* phone number and CTA must never break mid-string */
.elementor-element-d4d9b8d .elementor-button-text,
.elementor-element-d4d9b8d .elementor-button { white-space: nowrap; }

/* long display headings should hyphenate rather than punch out of the box */
.elementor-page h1, .elementor-page h2 { overflow-wrap: break-word; }

/* Astra's leftover h1 line-height:1.4px from the previous site */
h1, .entry-content :where(h1) { line-height: 1.06; }


/* ===== CTS service-area ticker ===== */
/* the plugin paints its own #eaf1f9 on this widget */
.elementor-widget-xpro-news-ticker { background-color: transparent; }

/* keep the band on one line - it is a marquee, not a list */
.xpro-news-ticker-wrapper .xpro-news-ticker-item {
  white-space: nowrap;
  padding-right: 18px;
}

/* gold dot between neighbourhoods */
.xpro-news-ticker-wrapper .xpro-news-ticker-item::after {
  content: "";
  width: 5px; height: 5px;
  border-radius: 50%;
  background: #E1B466;
  margin-left: 18px;
  flex: 0 0 auto;
}


/* ===== CTS mobile ===== */
/* 790px is this site Elementor mobile breakpoint, not the 767 default */
@media (max-width: 790px) {
  html, body { overflow-x: hidden; max-width: 100%; }

  /* header: logo + hamburger only. The phone/estimate pair sat in a 28%
     column that could not shrink, so it ran off the right edge. */
  .elementor-element-6d94ca8 { display: none !important; }
  .elementor-element-d4d9b8d { flex-wrap: wrap !important; }
  .elementor-element-4866718 { width: 70% !important; min-width: 0; }
  .elementor-element-9429062 { width: 30% !important; min-width: 0; justify-content: flex-end !important; }
  .elementor-element-4866718 .elementor-widget-text-editor { min-width: 0; }

  /* hero CTAs: stack, full width, label on one line */
  .elementor-element-589694a { flex-direction: column !important; }
  .elementor-element-589694a > .e-con { width: 100% !important; max-width: 100%; padding: 0 0 10px 0 !important; }
  .elementor-element-589694a .elementor-button { display: flex; width: 100%; justify-content: center; text-align: center; white-space: nowrap; letter-spacing: .08em; }

  /* footer: one column */
  .elementor-element-0381eeb { flex-wrap: wrap !important; }
  .elementor-element-0381eeb > .e-con { width: 100% !important; max-width: 100%; padding-right: 0 !important; margin-bottom: 34px; }

  /* service-area band */
  .xpro-news-ticker-wrapper .xpro-news-ticker-item { padding-right: 12px; }
  .xpro-news-ticker-wrapper .xpro-news-ticker-item::after { margin-left: 12px; }

  /* every stacked column needs breathing room, not a hard edge */
  .elementor-page .e-con > .e-con { min-width: 0; }
}


/* ===== CTS mobile-bleed photos ===== */
@media (max-width: 790px) {
  .cts-bleed {
    width: calc(100% + 48px) !important;
    max-width: calc(100% + 48px) !important;
    margin-left: -24px !important;
    margin-right: -24px !important;
  }
}


/* ===== CTS mobile fixes 2 (unreliable _mobile keys, done in CSS instead) ===== */
@media (max-width: 790px) {
  /* logo mark shrinks so the wordmark has room next to the toggle */
  .elementor-element-4a10ffb img { width: 40px !important; }

  /* closing CTA button pairs (About/Services/GPT) stack instead of
     squeezing side by side - container flex_direction_mobile is not a
     control this Elementor build resolves correctly */
  .elementor-element-51de337, .elementor-element-ad3cefe, .elementor-element-1808461 {
    flex-direction: column !important;
    align-items: stretch !important;
    row-gap: 12px !important;
  }

  /* buttons fill the stacked column - align_mobile on the widget also
     did not render, so this is the reliable path */
  .cts-btn-mobile-full,
  .cts-btn-mobile-full .elementor-button {
    width: 100% !important;
  }
  .cts-btn-mobile-full .elementor-button {
    display: flex !important; justify-content: center !important; text-align: center !important;
  }
}


/* ===== CTS mobile logo-only header ===== */
@media (max-width: 790px) {
  /* just the round mark on phones - the wordmark + tagline never had
     room next to the toggle at any column split */
  .elementor-element-4866718 { width: auto !important; flex-grow: 0 !important; }
  .elementor-element-4866718 .elementor-widget-container > a,
  .elementor-element-4a10ffb { margin-right: 0 !important; }
  .elementor-element-4a10ffb img { width: 44px !important; }
  .elementor-element-d4d9b8d { padding-left: 0 !important; }
  .elementor-element-9429062 { width: auto !important; flex-grow: 1 !important; }
}


/* ===== CTS mobile wordmark (name over tagline, beside logo) ===== */
@media (max-width: 790px) {
  .elementor-element-4866718 {
    width: auto !important; flex-grow: 0 !important; flex-shrink: 1 !important;
    align-items: center !important; min-width: 0;
  }
  .elementor-element-4a10ffb img { width: 36px !important; }
  .elementor-element-4a10ffb { margin-right: 9px !important; flex: 0 0 auto !important; }

  .elementor-element-c1de223 {
    display: block !important; min-width: 0; flex: 1 1 auto !important;
  }
  .elementor-element-c1de223 a { line-height: 1.15 !important; }
  .elementor-element-c1de223 span:first-child {
    font-size: 14px !important; letter-spacing: -.01em !important;
  }
  .elementor-element-c1de223 span:last-child {
    font-size: 7.5px !important; letter-spacing: .08em !important;
  }

  .elementor-element-9429062 { width: auto !important; flex-grow: 1 !important; min-width: 0; }
  .elementor-element-d4d9b8d { flex-wrap: nowrap !important; }
}


/* ===== CTS contact page: license line as a wide badge ===== */
.elementor-element-32e131e .elementor-icon-list-items li:last-child {
  width: 100%;
  margin-top: 18px !important;
  padding: 14px 18px;
  background: rgba(225, 180, 102, .12);
  border: 1px solid rgba(225, 180, 102, .35);
  border-radius: 8px;
}
.elementor-element-32e131e .elementor-icon-list-items li:last-child .elementor-icon-list-text {
  font-weight: 600;
}


/* ===== CTS Gravity Forms section titles (Page 1/2 labels) ===== */
/* GF Orbital theme default section-title color is a jarring red (rgb(255,34,45)),
   unstyled against our navy form panel. These are real multi-step page labels */
#cts-formwrap-contact .gsection_title,
#cts-formwrap .gsection_title {
  color: #F6F2EA !important;
  border-bottom-color: rgba(225, 180, 102, .25) !important;
}