/**
 * Mobile-first — loaded last. Brand: #e51100 / #081420.
 * Desktop (≥992px) left to theme styles.
 */

/* ========== BASE ≤991 ========== */
@media (max-width: 991px) {
  html,
  body {
    overflow-x: clip;
    max-width: 100vw;
  }

  .corsel-wp-page,
  .corsel-wp-page .entry-content,
  .corsel-wp-page .panel-layout,
  .site-main,
  #primary {
    max-width: 100% !important;
    overflow-x: clip;
  }

  .panel-grid,
  .panel-grid-cell,
  .panel-row-style,
  .siteorigin-panels-stretch {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  img,
  video,
  iframe,
  svg {
    max-width: 100%;
    height: auto;
  }

  /* Never unhide Bootstrap / WP hidden rows */
  .d-none,
  .home_banner_sec .hero_btn_row.d-none,
  .hero_btn_row.d-none {
    display: none !important;
  }

  /* Pricing plan toggles reuse hero_btn_row — keep them out of hero CTA styling */
  .plan_row.hero_btn_row {
    display: none !important;
  }

  /* ---- Chrome ---- */
  :root {
    --corsel-upgrade-bar-h: 28px;
  }

  .corsel-top-bar.top_bar {
    padding: 3px 0 !important;
  }

  .corsel-top-bar-row {
    min-height: 20px;
    gap: 8px;
    grid-template-columns: 1fr auto !important;
  }

  .corsel-top-phone a {
    font-size: 12px !important;
    font-weight: 600 !important;
  }

  .corsel-top-ticker {
    display: none !important;
  }

  header.site-header.corsel-header,
  header.site-header.corsel-header.sticky,
  body.home header.site-header.corsel-header,
  body.home header.site-header.corsel-header.sticky {
    padding: 4px 0 !important;
  }

  .corsel-header .custom-logo,
  .corsel-header img.custom-logo {
    height: 30px !important;
    width: auto !important;
  }

  button.menu-toggle.corsel-menu-btn,
  .corsel-chrome-nav .corsel-menu-btn {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 10px !important;
  }

  .corsel-upgrade-track p {
    font-size: 11px !important;
    line-height: var(--corsel-upgrade-bar-h) !important;
  }

  .menu-main-menu-container {
    padding: 8px 0 12px !important;
  }

  .corsel-header #primary-menu li a {
    font-size: 16px !important;
    font-weight: 500 !important;
    padding: 14px 20px !important;
    min-height: 48px !important;
    display: flex !important;
    align-items: center !important;
  }

  .corsel-header #primary-menu li.current-menu-item a {
    color: #e51100 !important;
    font-weight: 600 !important;
  }

  /* ---- Slick containment ---- */
  .slick-list {
    overflow: hidden !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  .slick-slider,
  .testimonial_slider,
  .sample_row,
  .banner_slider,
  .ab_slide_inner,
  .case_slider {
    max-width: 100% !important;
    width: 100% !important;
  }

  .htesti .panel-grid-cell,
  .htesti .testimonial_slider,
  .htesti .slick-list,
  .htesti .testi_box,
  .htesti .testi_box_inner,
  .about_tesimonials .panel-grid-cell,
  .about_tesimonials .testimonial_slider {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
  }

  .htesti .slick-slide {
    max-width: 100vw !important;
  }

  /* ---- FABs: smaller, clear of content ---- */
  .corsel-float-btn {
    width: 48px !important;
    height: 48px !important;
    font-size: 20px !important;
    bottom: 14px !important;
  }

  .corsel-float-call {
    left: 12px !important;
  }

  .corsel-float-wa {
    right: 12px !important;
  }

  body .site-footer,
  body .corsel-footer,
  body .copyrights {
    padding-bottom: 88px !important;
  }

  /* ---- Forms ---- */
  body .wpcf7-form input[type="text"],
  body .wpcf7-form input[type="email"],
  body .wpcf7-form input[type="tel"],
  body .wpcf7-form input[type="url"],
  body .wpcf7-form input[type="number"],
  body .wpcf7-form select,
  body .wpcf7-form textarea,
  body .con_form input,
  body .con_form_2 input,
  body .con_form textarea,
  body .con_form_2 textarea {
    min-height: 48px !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  body .wpcf7-form textarea,
  body .con_form textarea,
  body .con_form_2 textarea {
    min-height: 130px !important;
  }

  body .wpcf7-form input[type="submit"],
  body .wpcf7-form button,
  body .wpcf7-submit,
  body .con_form input[type="submit"],
  body .con_form_2 input[type="submit"] {
    min-height: 50px !important;
    width: 100% !important;
    max-width: 100% !important;
    font-size: 16px !important;
    padding: 12px 20px !important;
  }

  body .con_form .row,
  body .con_form_2 .row,
  body .wpcf7-form .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body .con_form [class*="col-"],
  body .con_form_2 [class*="col-"],
  body .wpcf7-form [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-bottom: 12px;
  }

  .corsel-subscribe-form {
    position: relative !important;
    max-width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
  }

  .corsel-subscribe-form .tnp-email {
    width: 100% !important;
    min-height: 48px !important;
    font-size: 16px !important;
    padding: 12px 16px !important;
    border-radius: 12px !important;
  }

  .corsel-subscribe-form .tnp-submit {
    position: static !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 48px !important;
    font-size: 15px !important;
    border-radius: 12px !important;
  }

  /* Contact cards stack */
  body .map_top_1,
  body .map_top_2,
  body .map_top_3 {
    margin-bottom: 12px !important;
  }
}

/* ========== PHONE ≤575 ========== */
@media (max-width: 575px) {
  .corsel-top-socials {
    display: none !important;
  }

  .corsel-top-bar-row {
    grid-template-columns: 1fr !important;
  }

  /* Hide upgrade ticker on phones (beats home-layout .corsel-chrome-nav rule) */
  .corsel-chrome-nav .corsel-upgrade-bar,
  .corsel-upgrade-bar {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
  }

  :root {
    --corsel-upgrade-bar-h: 0px;
  }

  /* Keep both Call + WhatsApp FABs on phones */
  .corsel-float-call,
  .corsel-float-wa {
    display: inline-flex !important;
    width: 52px !important;
    height: 52px !important;
    bottom: 16px !important;
    font-size: 22px !important;
  }

  .corsel-float-call {
    left: 14px !important;
  }

  .corsel-float-wa {
    right: 14px !important;
  }
}

/* ========== HOME ========== */
@media (max-width: 991px) {
  body.home {
    padding-top: var(--corsel-chrome-h, 110px) !important;
  }

  /* Kill huge SO hero paddings */
  html body.home .home_banner_sec.panel-row-style,
  html body.home #pg-20-0 > .panel-row-style,
  html body.home #pg-3925-0 > .panel-row-style,
  html body.home .corsel-wp-page > .entry-content > .panel-layout > .panel-grid:first-child > .panel-row-style {
    padding-top: 20px !important;
    padding-bottom: 28px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  body.home .hero_text {
    padding: 0 4px !important;
  }

  body.home .hero_text h1.wizards-wrapper,
  body.home .hero_text .wizards-wrapper {
    font-size: clamp(32px, 9vw, 40px) !important;
    line-height: 1.05 !important;
    max-width: 100% !important;
  }

  body.home .hero_text span.trans_txt {
    font-size: clamp(20px, 6.5vw, 28px) !important;
    line-height: 1.15 !important;
    -webkit-text-stroke-width: 0.55px;
  }

  body.home .hero_text p,
  body.home .hero_text .eyebrow,
  body.home .home_banner_sec p {
    font-size: 12px !important;
    letter-spacing: 0.02em;
  }

  /* Only the visible SO button row */
  body.home .home_banner_sec > .panel-grid > .hero_btn_row:not(.d-none),
  body.home .home_banner_sec .panel-layout > .panel-grid > .hero_btn_row:not(.d-none) {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: stretch !important;
    gap: 10px !important;
    max-width: 100% !important;
    width: 100% !important;
    margin: 12px auto 8px !important;
  }

  body.home .home_banner_sec .hero_btn_row:not(.d-none) > .panel-grid-cell {
    flex: 1 1 calc(50% - 8px) !important;
    max-width: calc(50% - 5px) !important;
    width: auto !important;
    min-width: 0 !important;
  }

  body.home .home_banner_sec .hero_btn_row:not(.d-none) .ow-button-base {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
  }

  body.home .home_banner_sec .hero_btn_row:not(.d-none) .sowb-button,
  body.home .home_banner_sec .hero_btn_row:not(.d-none) a.sowb-button {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 46px !important;
    padding: 12px 10px !important;
    font-size: 13px !important;
    justify-content: center !important;
    display: inline-flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    white-space: nowrap !important;
  }

  /* Undo desktop max-width:237px on hero buttons */
  body.home .home_banner_sec .hero_btn_row:not(.d-none) {
    max-width: 100% !important;
  }

  body.home .home_banner_sec .hero_tr_row {
    margin-top: 20px !important;
  }

  body.home .home_banner_sec ul.cards {
    max-width: min(280px, 100%) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  body.home .htab_txt p {
    font-size: clamp(22px, 6vw, 28px) !important;
    line-height: 1.2 !important;
  }

  body.home .panel-row-style {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* Reduce huge section gaps from SO */
  body.home .corsel-wp-page .panel-row-style {
    padding-top: min(var(--pad-top, 40px), 48px);
  }

  body.home .home_tab_list.nav-tabs,
  body.home ul.home_tab_list {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    flex-wrap: nowrap !important;
    gap: 8px;
    padding-bottom: 8px;
  }

  body.home .home_tab_list button,
  body.home .home_tab_list .nav-link {
    min-height: 44px !important;
    white-space: nowrap;
    font-size: 13px !important;
  }

  body.home .flip_card_row {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  body.home .flip_card {
    height: 220px !important;
    margin-top: 0 !important;
  }

  body.home .portfolio_mainsec .isa_slider {
    height: 320px !important;
  }

  body.home .corsel_slide .ring_wrapper {
    width: 220px !important;
    height: 300px !important;
  }

  /* Hide SEO duplicate H1 if it creates a gap */
  body.home .corsel-seo-h1 {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    border: 0 !important;
  }
}

@media (max-width: 575px) {
  body.home .home_banner_sec .hero_btn_row:not(.d-none) > .panel-grid-cell {
    flex: 1 1 100% !important;
    max-width: 100% !important;
  }

  body.home .hero_text h1.wizards-wrapper,
  body.home .hero_text .wizards-wrapper {
    font-size: 32px !important;
  }

  body.home .hero_text span.trans_txt {
    font-size: 20px !important;
  }

  body.home .htab_txt p {
    font-size: 22px !important;
  }

  body.home .portfolio_mainsec .isa_slider {
    height: 280px !important;
  }

  body.home .corsel_slide .ring_wrapper {
    width: 180px !important;
    height: 250px !important;
  }
}

/* ========== INNER PAGES ========== */
@media (max-width: 991px) {
  body:not(.home) .corsel-wp-page .panel-row-style {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* Reduce first-section top padding under fixed chrome */
  /* Pages without .corsel-seo-h1 still need chrome clearance on first row */
  html body:not(.home):not(:has(.corsel-seo-h1))
    .corsel-wp-page
    > .entry-content
    > .panel-layout
    > .panel-grid:first-child
    > .panel-row-style,
  html body.page-id-29:not(:has(.corsel-seo-h1)) #pg-29-0 > .panel-row-style,
  html body.corsel-route-contact-us:not(:has(.corsel-seo-h1)) #pg-29-0 > .panel-row-style {
    padding-top: calc(var(--corsel-chrome-h, 110px) + 16px) !important;
  }

  html body:not(.home)
    .corsel-wp-page
    > .entry-content
    > .panel-layout
    > .panel-grid:first-child
    > .panel-row-style.siteorigin-panels-stretch {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  html body.corsel-route-contact-us #pg-29-0 > .panel-row-style,
  html body.page-id-29 #pg-29-0 > .panel-row-style {
    padding-bottom: 48px !important;
  }

  body:not(.home) h1,
  body:not(.home) .site_head,
  body:not(.home) .f48 {
    font-size: clamp(22px, 6.2vw, 28px) !important;
    line-height: 1.25 !important;
    word-break: break-word;
  }

  body:not(.home) p {
    font-size: 15px !important;
    line-height: 1.55 !important;
  }

  body:not(.home) .ow-button-base a,
  body:not(.home) .sowb-button,
  body:not(.home) .head_btn a {
    min-height: 46px !important;
    padding: 12px 18px !important;
    font-size: 14px !important;
  }

  body:not(.home) .banner_btns:not(.d-none),
  body:not(.home) .serv_ban_buttons,
  body:not(.home) .hero_btn_row:not(.d-none):not(.plan_row) {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  body:not(.home) .banner_btns .panel-grid-cell,
  body:not(.home) .serv_ban_buttons .panel-grid-cell,
  body:not(.home) .hero_btn_row:not(.d-none):not(.plan_row) .panel-grid-cell {
    flex: 1 1 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body:not(.home) .banner_btns a,
  body:not(.home) .serv_ban_buttons a,
  body:not(.home) .serv_ban_buttons .sowb-button,
  body:not(.home) .hero_btn_row:not(.d-none):not(.plan_row) a {
    width: 100% !important;
    max-width: 100% !important;
    display: inline-flex !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    min-height: 48px !important;
  }

  /* SEO H1 sits above the panel tree — must clear fixed chrome */
  body:not(.home) .corsel-seo-h1 {
    display: block !important;
    position: relative !important;
    width: auto !important;
    height: auto !important;
    margin: calc(var(--corsel-chrome-h, 110px) + 12px) 16px 10px !important;
    padding: 0 !important;
    clip: auto !important;
    overflow: visible !important;
    font-size: clamp(22px, 6vw, 28px) !important;
    line-height: 1.2 !important;
    text-align: left !important;
    color: #081420 !important;
  }

  /* First row no longer needs full chrome offset when SEO H1 clears it */
  html body:not(.home)
    .corsel-wp-page
    > .entry-content
    > .panel-layout
    > .panel-grid:first-child
    > .panel-row-style.siteorigin-panels-stretch {
    padding-top: 24px !important;
  }

  .corsel-blog-page {
    padding: 120px 16px 64px !important;
  }
}

@media (max-width: 575px) {
  html body:not(.home):has(.corsel-seo-h1)
    .corsel-wp-page
    > .entry-content
    > .panel-layout
    > .panel-grid:first-child
    > .panel-row-style {
    padding-top: 20px !important;
  }

  html body:not(.home):not(:has(.corsel-seo-h1))
    .corsel-wp-page
    > .entry-content
    > .panel-layout
    > .panel-grid:first-child
    > .panel-row-style,
  html body.page-id-29:not(:has(.corsel-seo-h1)) #pg-29-0 > .panel-row-style,
  html body.corsel-route-contact-us:not(:has(.corsel-seo-h1)) #pg-29-0 > .panel-row-style {
    padding-top: calc(var(--corsel-chrome-h, 100px) + 12px) !important;
  }

  body:not(.home) .banner_btns .panel-grid-cell,
  body:not(.home) .serv_ban_buttons .panel-grid-cell,
  body:not(.home) .hero_btn_row:not(.d-none):not(.plan_row) .panel-grid-cell {
    flex: 1 1 100% !important;
    max-width: 100% !important;
  }
}