/* =========================================================
   SFS MOBILE NAV DESKTOP GUARD
   Mobile Drawer darf außerhalb des Mobile-Breakpoints
   niemals als normales Dokumentelement sichtbar werden.
   ========================================================= */

.sfs-mnav,
.sfs-mnav-overlay {
	display: none;
}

@media (max-width: 900px) {
	.sfs-mnav {
		display: flex;
	}

	.sfs-mnav-overlay {
		display: block;
	}
}

/*
 * Starfruit Studio – Mobile Polish 2026-11-11
 * Nur mobile/tablet overrides. Desktop bleibt unverändert.
 */

/* =========================================================
   TABLET / MOBILE HEADER + DRAWER
   Clean drawer – source navigation remains untouched
   ========================================================= */
@media (max-width: 900px) {
  .site-hd {
    padding: 10px 0 !important;
    background: rgba(255,255,255,.97) !important;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
  }

  .site-hd__wrap {
    gap: 14px !important;
  }

  .brand img {
    max-width: min(210px, 58vw) !important;
  }

  #nav-menu {
    display: none !important;
  }

  .nav-toggle {
    width: 42px !important;
    height: 42px !important;
    display: grid !important;
    place-items: center;
    padding: 10px !important;
    border: 1px solid var(--line) !important;
    background: var(--surface) !important;
    clip-path: var(--clip-path-cut);
    transition: opacity .18s ease, transform .18s ease, border-color .18s ease !important;
  }

  .nav-toggle__bar {
    width: 20px !important;
    left: 10px !important;
  }

  .nav-toggle__bar:nth-child(1) { top: 12px !important; }
  .nav-toggle__bar:nth-child(2) { top: 20px !important; transform: none !important; }
  .nav-toggle__bar:nth-child(3) { bottom: 12px !important; }

  body.is-nav-open .nav-toggle {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body.is-nav-open {
    overflow: hidden !important;
    touch-action: none;
  }

  .sfs-mnav-overlay {
    position: fixed;
    inset: 0;
    z-index: 1180;
    background: rgba(20,23,24,.28);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .24s ease, visibility 0s linear .24s;
  }

  body.is-nav-open .sfs-mnav-overlay {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition-delay: 0s;
  }

  .sfs-mnav {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1200;
    width: min(360px, calc(100vw - 18px));
    height: 100vh;
    height: 100dvh;
    display: flex;
    flex-direction: column;
    background: #fff;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    transform: translate3d(105%,0,0);
    visibility: hidden;
    pointer-events: none;
    box-shadow: none;
    transition: transform .29s cubic-bezier(.22,.61,.36,1), visibility 0s linear .29s;
    -webkit-overflow-scrolling: touch;
  }

  body.is-nav-open .sfs-mnav {
    transform: translate3d(0,0,0);
    visibility: visible;
    pointer-events: auto;
    box-shadow: -26px 0 64px rgba(15,18,19,.16);
    transition-delay: 0s;
  }

  .sfs-mnav-head {
    position: sticky;
    top: 0;
    z-index: 10;
    min-height: 76px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: max(14px, env(safe-area-inset-top, 0px)) 18px 12px 22px;
    background: rgba(255,255,255,.98);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
  }

  .sfs-mnav-brand {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    text-decoration: none !important;
  }

  .sfs-mnav-brand img {
    display: block;
    width: auto;
    height: auto;
    max-width: min(185px, 58vw);
    max-height: 46px;
  }

  .sfs-mnav-close {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    display: grid;
    place-items: center;
    margin: 0 -7px 0 0;
    padding: 0;
    border: 0 !important;
    background: transparent !important;
    color: var(--ink);
    clip-path: none !important;
    cursor: pointer;
  }

  .sfs-mnav-close:hover,
  .sfs-mnav-close:focus-visible {
    color: #6e8d0e;
  }

  .sfs-mnav-close svg {
    width: 24px;
    height: 24px;
  }

  .sfs-mnav > .sfs-mnav-head + a,
  .sfs-mnav > .sfs-mnav-head + .nav-item {
    margin-top: 12px;
  }

  .sfs-mnav > a:not(.btn):not(.sfs-mnav-brand),
  .sfs-mnav > .nav-item > a {
    position: relative;
    width: 100%;
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 0;
    padding: 11px 24px;
    border: 0;
    background: transparent;
    color: #252829;
    font-family: var(--font-sans);
    font-size: 1.16rem;
    font-weight: 650;
    line-height: 1.25;
    letter-spacing: -.018em;
    text-decoration: none;
  }

  .sfs-mnav > a:not(.btn):hover,
  .sfs-mnav > a:not(.btn):focus-visible,
  .sfs-mnav > .nav-item > a:hover,
  .sfs-mnav > .nav-item > a:focus-visible {
    color: #6e8d0e;
  }

  .sfs-mnav .nav-item,
  .sfs-mnav .nav-item--has-dropdown {
    position: static;
    width: 100%;
    margin: 0;
    padding: 0;
  }

  .sfs-mnav .nav-arrow {
    display: none !important;
  }

  .sfs-mnav-plus {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    display: grid;
    place-items: center;
    color: #b51c70;
    font-size: 1.55rem;
    font-weight: 400;
    line-height: 1;
  }

  .sfs-mnav-plus::before { content: "+"; }
  .sfs-mnav .nav-item--has-dropdown.is-open .sfs-mnav-plus::before { content: "−"; }

  .sfs-mnav .dropdown-menu {
    position: static !important;
    inset: auto !important;
    width: auto !important;
    max-width: none !important;
    margin: 1px 22px 10px 24px !important;
    padding: 2px 0 5px 17px !important;
    border: 0 !important;
    border-left: 1px solid #dde1d8 !important;
    background: transparent !important;
    box-shadow: none !important;
    clip-path: none !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  .sfs-mnav .nav-item--has-dropdown:not(.is-open) .dropdown-menu { display: none !important; }
  .sfs-mnav .nav-item--has-dropdown.is-open .dropdown-menu { display: block !important; }

  .sfs-mnav .dropdown-menu a {
    min-height: 38px;
    display: flex !important;
    align-items: center !important;
    padding: 7px 4px 7px 11px !important;
    border: 0 !important;
    background: transparent !important;
    color: #5b6163 !important;
    font-family: var(--font-sans) !important;
    font-size: .93rem !important;
    font-weight: 520 !important;
    line-height: 1.3 !important;
    text-decoration: none !important;
  }

  .sfs-mnav .dropdown-menu a:hover,
  .sfs-mnav .dropdown-menu a:focus-visible,
  .sfs-mnav .dropdown-menu a.sfs-mnav-current {
    color: #242728 !important;
  }

  .sfs-mnav .dropdown-menu a.sfs-mnav-current,
  .sfs-mnav .sfs-mnav-all-services {
    font-weight: 700 !important;
  }

  .sfs-mnav .dropdown-menu a svg { display: none !important; }

  .sfs-mnav > a.sfs-mnav-current:not(.btn)::before,
  .sfs-mnav > .nav-item.sfs-mnav-current-parent > a::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 3px;
    height: 22px;
    background: var(--accent);
    transform: translateY(-50%);
  }

  .sfs-mnav .sfs-mnav-cta {
    width: calc(100% - 48px) !important;
    min-height: 50px;
    margin: auto 24px 12px !important;
    padding: 12px 18px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--accent) !important;
    color: var(--ink) !important;
    font-family: var(--font-mono) !important;
    font-size: .9rem !important;
    font-weight: 750 !important;
    text-align: center;
    clip-path: var(--clip-path-cut);
  }

  .sfs-mnav-foot {
    padding: 0 24px max(18px, env(safe-area-inset-bottom, 0px));
    color: #7a8082;
    font-family: var(--font-mono);
    font-size: .68rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  body.admin-bar .sfs-mnav-overlay { top: 46px; }
  body.admin-bar .sfs-mnav {
    top: 46px;
    height: calc(100dvh - 46px);
  }
}

@media (min-width: 783px) and (max-width: 900px) {
  body.admin-bar .sfs-mnav-overlay { top: 32px; }
  body.admin-bar .sfs-mnav {
    top: 32px;
    height: calc(100dvh - 32px);
  }
}

@media (max-width: 380px) {
  .sfs-mnav > a:not(.btn):not(.sfs-mnav-brand),
  .sfs-mnav > .nav-item > a {
    font-size: 1.08rem;
  }

  .sfs-mnav-brand img {
    max-width: 165px;
  }
}

/* =========================================================
   MOBILE CONTENT RAILS
   Custom pages use their own .wrap. Remove the extra GP rail.
   ========================================================= */
@media (max-width: 759px) {
  body.page-id-2 #content.site-content,
  body.page-id-43 #content.site-content,
  body.page-id-46 #content.site-content,
  body.page-id-109 #content.site-content,
  body.page-id-111 #content.site-content,
  body.page-id-121 #content.site-content,
  body.page-id-123 #content.site-content,
  body.page-id-129 #content.site-content,
  body.page-id-136 #content.site-content,
  body.page-id-139 #content.site-content,
  body.page-id-141 #content.site-content,
  body.page-id-147 #content.site-content,
  body.page-id-250 #content.site-content,
  body.page-id-282 #content.site-content,
  body.page-id-317 #content.site-content,
  body.page-id-690 #content.site-content,
  body.page-id-749 #content.site-content,
  body.page-id-766 #content.site-content,
  body.page-id-767 #content.site-content,
  body.page-id-768 #content.site-content,
  body.page-id-775 #content.site-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.page-id-2 #primary,
  body.page-id-43 #primary,
  body.page-id-46 #primary,
  body.page-id-109 #primary,
  body.page-id-111 #primary,
  body.page-id-121 #primary,
  body.page-id-123 #primary,
  body.page-id-129 #primary,
  body.page-id-136 #primary,
  body.page-id-139 #primary,
  body.page-id-141 #primary,
  body.page-id-147 #primary,
  body.page-id-250 #primary,
  body.page-id-282 #primary,
  body.page-id-317 #primary,
  body.page-id-690 #primary,
  body.page-id-749 #primary,
  body.page-id-766 #primary,
  body.page-id-767 #primary,
  body.page-id-768 #primary,
  body.page-id-775 #primary {
    width: 100% !important;
  }

  .wrap {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .sfa-about .wrap,
  .sfs-refs-v3 .wrap,
  .sfs-case-v3 .wrap,
  .sfc-care .wrap,
  .sfs-service-proof .wrap,
  .sfs-service-testimonial-band .wrap {
    width: min(calc(100% - 40px), 1180px) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* =========================================================
   MOBILE TYPE + RHYTHM
   ========================================================= */
@media (max-width: 759px) {
  body {
    font-size: 16px;
    line-height: 1.65;
  }

  h1,
  h2,
  h3,
  .sfsv4-hero h1,
  .sfr3-hero h1,
  .sfc2-hero h1,
  .sfa-hero h1,
  .sfc-care-hero h1,
  .sfs-case-v3 .sfc4-hero-copy h1 {
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
    text-wrap: balance;
  }

  h1,
  .sfsv4-hero h1,
  .sfr3-hero h1,
  .sfc2-hero h1,
  .sfa-hero h1,
  .sfc-care-hero h1,
  .sfs-case-v3 .sfc4-hero-copy h1 {
    max-width: 100% !important;
    font-size: clamp(2.35rem, 10.8vw, 3rem) !important;
    line-height: 1.04 !important;
    letter-spacing: -.038em !important;
  }

  h2,
  .sfsv4-editorial h2,
  .sfsv4-heading-row h2,
  .sfsv4-proof-copy h2,
  .sfsv4-cta-inner h2,
  .sfr3-feature-copy h2,
  .sfr3-section-head h2,
  .sfc2-two-col h2,
  .sfc2-section-head h2,
  .sfc2-cta-inner h2,
  .sfa-section-head h2,
  .sfa-together h2,
  .sfa-history h2,
  .sfa-cta h2,
  .sfc-care-heading h2,
  .sfc-care-section-head h2,
  .sfc-care-support h2,
  .sfc-care-existing h2,
  .sfc-care-proof h2,
  .sfc-care-cta h2,
  .sfs-case-v3 .sfc3-heading h2,
  .sfs-case-v3 .sfc3-section-head h2,
  .sfs-case-v3 .sfc3-cta-inner h2,
  .sfs-proof-copy h2 {
    max-width: 100% !important;
    font-size: clamp(1.8rem, 8vw, 2.25rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -.028em !important;
  }

  h3 {
    font-size: clamp(1.18rem, 5.5vw, 1.4rem) !important;
    line-height: 1.25 !important;
  }

  .lead,
  .sfsv4-hero .lead,
  .sfr3-hero .lead,
  .sfa-hero .lead,
  .sfc-care-hero .lead,
  .sfs-case-v3 .lead {
    font-size: 1rem !important;
    line-height: 1.65 !important;
  }

  .kicker {
    margin-bottom: 14px !important;
    font-size: .74rem !important;
    line-height: 1.35 !important;
    letter-spacing: .09em !important;
  }

  .section {
    padding-top: 56px !important;
    padding-bottom: 56px !important;
  }

  .section-header {
    max-width: none !important;
    margin: 0 0 30px !important;
    text-align: left !important;
  }

  .section-header .lead {
    margin: 14px 0 0 !important;
  }

  .grid {
    gap: 16px !important;
  }

  .card {
    padding: 22px !important;
  }

  .card::after {
    display: none;
  }

  .small {
    font-size: .95rem !important;
    line-height: 1.6 !important;
  }

  .act,
  .act--center {
    width: 100%;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
    margin-top: 26px !important;
    justify-content: stretch !important;
  }

  .act > .btn,
  .act > .btn-x,
  .act > a.btn {
    width: 100% !important;
    min-height: 50px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 11px 18px !important;
    text-align: center;
    font-size: .9rem !important;
    line-height: 1.35 !important;
  }

  .btn--small,
  .act .btn--small {
    min-height: 46px;
    padding: 10px 16px !important;
    font-size: .84rem !important;
  }

  .cta-block {
    padding: 34px 22px !important;
    text-align: left !important;
  }

  .cta-block .lead {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .cta-block .act {
    margin-top: 22px !important;
  }
}

/* =========================================================
   HOME
   ========================================================= */
@media (max-width: 759px) {
  .page-home > .hero {
    padding: 38px 0 46px !important;
    text-align: left !important;
  }

  .page-home > .hero .lead {
    margin: 18px 0 0 !important;
  }

  .page-home > .hero .act {
    margin-top: 24px !important;
  }

  .page-home .mobile-break {
    display: none !important;
  }

  .page-home .home-trust-wrap {
    margin-bottom: 42px !important;
  }

  .page-home .home-trust-item {
    padding: 17px 0 !important;
  }

  .page-home .home-trust-label {
    margin-bottom: 4px;
    font-size: .7rem;
  }

  .page-home .home-trust-item strong {
    font-size: .98rem !important;
  }

  .page-home .home-trust-item > span:not(.home-trust-label) {
    font-size: .9rem !important;
    line-height: 1.55 !important;
  }

  .page-home .section--home-services {
    padding-bottom: 34px !important;
  }

  .page-home .section--handover-teaser {
    padding-bottom: 38px !important;
  }

  body.home .section--handover-teaser .handover-teaser {
    padding: 20px 0 !important;
  }

  .page-home .kompass-grid {
    gap: 26px !important;
  }

  .page-home .kompass-bild {
    order: -1;
  }

  .page-home .kompass-text .lead {
    margin-bottom: 22px !important;
  }

  .page-home .case .media {
    margin-bottom: 12px;
  }

  .page-home .case .body {
    padding: 0 !important;
  }

  .page-home .case .title {
    font-size: 1.08rem !important;
  }

  .page-home .case .meta {
    margin-top: 4px;
    font-size: .9rem !important;
    line-height: 1.5;
  }

  .page-home .prozess-grid {
    gap: 0 !important;
    border-top: 1px solid var(--line);
  }

  .page-home .step-item {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 4px 14px;
    padding: 18px 0 !important;
    border-top: 0 !important;
    border-bottom: 1px solid var(--line);
  }

  .page-home .step-number {
    grid-row: 1 / 3;
    margin: 2px 0 0 !important;
    font-size: .76rem !important;
  }

  .page-home .step-item b {
    margin: 0 !important;
    font-size: 1rem !important;
  }

  .page-home .step-item span {
    font-size: .9rem !important;
    line-height: 1.55;
  }

  .page-home .starfruit-reviews h2 {
    text-align: left !important;
    margin-bottom: 22px !important;
  }
}

/* =========================================================
   SERVICE OVERVIEW
   ========================================================= */
@media (max-width: 759px) {
  .sfsv4-hero {
    padding: 38px 0 50px !important;
  }

  .sfsv4-hero .lead {
    margin-top: 18px !important;
  }

  .sfsv4-actions {
    margin-top: 24px !important;
  }

  .sfsv4-work {
    padding-bottom: 48px !important;
  }

  .sfsv4-work-head {
    margin-bottom: 18px !important;
  }

  .sfsv4-work-grid {
    margin-right: -20px !important;
    padding-right: 20px !important;
  }

  .sfsv4-work-item {
    flex-basis: 76% !important;
  }

  .sfsv4-core,
  .sfsv4-services,
  .sfsv4-proof,
  .sfsv4-process,
  .sfsv4-cta {
    padding-top: 52px !important;
    padding-bottom: 52px !important;
  }

  .sfsv4-editorial {
    gap: 24px !important;
  }

  .sfsv4-editorial + .sfsv4-editorial {
    margin-top: 58px !important;
  }

  .sfsv4-editorial h2 {
    margin: 9px 0 14px !important;
  }

  .sfsv4-inline-list {
    margin: 20px 0 22px !important;
  }

  .sfsv4-service-row {
    grid-template-columns: 34px minmax(0, 1fr) auto !important;
    gap: 8px 12px !important;
    padding: 17px 0 !important;
  }

  .sfsv4-service-row > span:nth-child(3) {
    grid-column: 2 / -1;
    font-size: .88rem !important;
  }

  .sfsv4-process-row {
    padding: 18px 0 !important;
  }
}

/* =========================================================
   GENERIC SERVICE LANDING PAGES
   ========================================================= */
@media (max-width: 759px) {
  .hero-lp,
  .website-hero-header,
  .analytics-hero {
    padding-top: 38px !important;
    padding-bottom: 48px !important;
    text-align: left !important;
  }

  .hero-lp__grid {
    gap: 28px !important;
  }

  .hero-lp__text .lead,
  .website-hero-header .lead,
  .analytics-hero .lead {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .hero-lp__panel,
  .brand-hero-visual,
  .analytics-dashboard,
  .content-hero-anim-card,
  .print-hero-flat-lay {
    margin-top: 4px;
  }

  .feature-pillars-grid,
  .pain-points-grid,
  .choice-block-grid,
  .showcase-grid,
  .content-type-grid,
  .print-item-grid,
  .clarity-process-grid,
  .feature-grid {
    gap: 16px !important;
  }

  .pillar-card,
  .pain-point,
  .choice-card,
  .feature-box,
  .content-type-item,
  .process-step-card,
  .feature-card,
  .problem-card,
  .paket-box {
    padding: 22px !important;
  }

  .prozess-rail {
    gap: 0 !important;
  }

  .prozess-step {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  .paket-box--highlight {
    transform: none !important;
  }

  .tease {
    gap: 24px !important;
    padding: 22px 0 !important;
  }

  .tease .block .card {
    padding: 18px !important;
  }

  .sfbrowser {
    margin-top: 26px !important;
    margin-bottom: 20px !important;
    border-radius: 10px !important;
  }

  .sfbrowser__head {
    min-height: 42px;
  }

  .sfs-service-testimonial-band {
    padding: 28px 0 !important;
  }

  .sfs-service-testimonial-band .sfs-proof-quote {
    font-size: 1.12rem !important;
    line-height: 1.5 !important;
  }

  .sfs-service-proof {
    padding: 48px 0 !important;
  }

  .sfs-proof-grid {
    gap: 24px !important;
  }

  .sfs-proof-media--logo {
    min-height: 160px !important;
    padding: 24px !important;
  }
}

/* =========================================================
   REFERENCES
   ========================================================= */
@media (max-width: 759px) {
  .sfr3-hero {
    padding: 38px 0 48px !important;
  }

  .sfr3-hero .lead {
    margin-top: 18px !important;
  }

  .sfr3-hero-facts {
    margin-top: 26px !important;
  }

  .sfr3-feature,
  .sfr3-projects,
  .sfr3-clients,
  .sfr3-testimonials,
  .sfr3-cta {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }

  .sfr3-feature {
    padding-top: 0 !important;
  }

  .sfr3-feature-grid,
  .sfr3-feature-modern-grid {
    padding: 20px !important;
    gap: 22px !important;
  }

  .sfr3-project-grid {
    gap: 28px !important;
  }

  .sfr3-project figcaption {
    padding-top: 12px !important;
  }

  .sfr3-client-row {
    grid-template-columns: 64px minmax(0,1fr) !important;
    gap: 14px !important;
    padding: 18px 0 !important;
  }

  .sfr3-testimonial {
    padding: 22px 0 !important;
  }
}

/* =========================================================
   ABOUT
   ========================================================= */
@media (max-width: 759px) {
  .sfa-hero {
    padding: 38px 0 48px !important;
  }

  .sfa-hero h1 {
    margin: 9px 0 18px !important;
  }

  .sfa-hero-proof {
    margin-top: 26px !important;
    padding-top: 18px !important;
    gap: 8px 18px !important;
  }

  .sfa-people,
  .sfa-together,
  .sfa-proof,
  .sfa-history,
  .sfa-cta {
    padding-top: 52px !important;
    padding-bottom: 52px !important;
  }

  .sfa-section-head {
    margin-bottom: 30px !important;
  }

  .sfa-person {
    gap: 24px !important;
    padding: 32px 0 !important;
  }

  .sfa-person-image img {
    aspect-ratio: 4 / 4.6 !important;
  }

  .sfa-person h3 {
    margin: 8px 0 14px !important;
    font-size: 1.7rem !important;
  }

  .sfa-person-copy p {
    line-height: 1.65 !important;
  }

  .sfa-person-copy p + p {
    margin-top: 14px !important;
  }

  .sfa-scope {
    margin-top: 18px !important;
    gap: 6px !important;
  }

  .sfa-scope span {
    padding: 6px 9px !important;
    font-size: .7rem !important;
  }

  .sfa-together-grid,
  .sfa-history-grid {
    gap: 24px !important;
  }

  .sfa-proof-list > a {
    gap: 6px !important;
    padding: 20px 0 !important;
  }
}

/* =========================================================
   CARE / CASE STUDIES
   ========================================================= */
@media (max-width: 759px) {
  .sfc-care-hero,
  .sfc3-hero,
  .sfc4-hero {
    padding-top: 38px !important;
    padding-bottom: 48px !important;
  }

  .sfc-care-routine,
  .sfc-care-scope,
  .sfc-care-existing,
  .sfc-care-models,
  .sfc-care-faq,
  .sfc-care-support,
  .sfc-care-proof,
  .sfc-care-cta {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }

  .sfc-care-lines article,
  .sfc-care-model-list > div {
    padding: 19px 0 !important;
  }

  .sfc-care-lines article {
    grid-template-columns: 36px minmax(0,1fr) !important;
    gap: 12px !important;
  }

  .sfc-care-existing-number {
    font-size: 3.8rem !important;
  }

  .sfs-case-v3 .sfc3-story,
  .sfs-case-v3 .sfc3-result,
  .sfs-case-v3 .sfc3-work,
  .sfs-case-v3 .sfc3-services,
  .sfs-case-v3 .sfc3-cta {
    padding: 48px 0 !important;
  }

  .sfs-case-v3 .sfc3-quote-section {
    padding: 30px 0 !important;
  }

  .sfs-case-v3 .sfc3-two-col {
    gap: 20px !important;
  }

  .sfs-case-v3 .sfc3-meta {
    margin-top: 32px !important;
  }

  .sfs-case-v3 .sfc3-meta > div {
    padding: 16px 0 !important;
  }

  .sfs-case-v3 .sfc3-logo {
    min-height: 190px !important;
    padding: 28px !important;
  }
}

/* =========================================================
   CONTACT
   ========================================================= */
@media (max-width: 759px) {
  body.page-id-250 .hero {
    padding: 38px 0 44px !important;
  }

  body.page-id-250 .hero .lead {
    margin-top: 16px !important;
  }

  body.page-id-250 .section {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }

  body.page-id-250 .section:nth-of-type(2) {
    padding-top: 10px !important;
  }

  body.page-id-250 .sfs-contact-grid {
    gap: 32px !important;
  }

  body.page-id-250 .form-container > h2 {
    margin-bottom: 12px !important;
  }

  body.page-id-250 .form-wrapper {
    padding-top: 18px !important;
  }

  body.page-id-250 .wpforms-container .wpforms-field {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }

  body.page-id-250 .wpforms-container .wpforms-field-label {
    margin-bottom: 7px !important;
    font-size: .84rem !important;
    font-weight: 700 !important;
  }

  body.page-id-250 .wpforms-container input[type="text"],
  body.page-id-250 .wpforms-container input[type="email"],
  body.page-id-250 .wpforms-container input[type="url"],
  body.page-id-250 .wpforms-container input[type="tel"],
  body.page-id-250 .wpforms-container select,
  body.page-id-250 .wpforms-container textarea {
    width: 100% !important;
    max-width: none !important;
    min-height: 50px;
    padding: 12px 14px !important;
    border: 1px solid var(--line) !important;
    border-radius: 0 !important;
    background: #fff !important;
    color: var(--ink) !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
  }

  body.page-id-250 .wpforms-container textarea {
    min-height: 150px;
    resize: vertical;
  }

  body.page-id-250 .wpforms-container .wpforms-submit {
    width: 100% !important;
    min-height: 50px !important;
    padding: 12px 18px !important;
    border: 0 !important;
    background: var(--accent) !important;
    color: var(--ink) !important;
    font-family: var(--font-mono) !important;
    font-size: .9rem !important;
    font-weight: 700 !important;
    clip-path: var(--clip-path-cut);
  }

  body.page-id-250 .sfs-contact-grid > .card {
    padding: 22px !important;
  }

  body.page-id-250 .grid.grid-3 > div {
    padding: 20px !important;
  }
}



@media (prefers-reduced-motion: reduce) {
  .sfs-mnav,
  .sfs-mnav-overlay,
  .nav-toggle {
    transition: none !important;
  }
}