/* ==========================================================
   DBG V30 – final readability + dedicated tablet/phone layouts
   Loaded last. Large desktop / MacBook composition is preserved.
   ========================================================== */

/* ---------- micro typography: one small step larger everywhere ------- */
.section-index{font-size:12px!important;letter-spacing:.15em!important;line-height:1.4!important}
.eyebrow{font-size:11px!important;letter-spacing:.16em!important;line-height:1.4!important}
.service-card-top>span,.portal-card-v6>span,.home-project-meta,.career-portal-card>span,.career-portal-card small,.career-values article>span,.team-working-grid article>span,.partner-process-v6 article>span,.applicant-option>span,.applicant-option b,.team-photo-index,.career-no-jobs small{font-size:10px!important;line-height:1.4!important}
.hero-v6-flow span,.hero-v6-flow strong{font-size:10.5px!important;line-height:1.35!important}
.project-start-tags span,.start-action small,.compare-caption strong,.compare-caption span,.compare-instruction{font-size:9.5px!important;line-height:1.4!important}
.build21-phase,.build21-phase span{font-size:10.5px!important}.build21-phase b{font-size:11.5px!important}
.build21-slider-head{font-size:10.5px!important}.build21-slider-head strong{font-size:13.5px!important}
.build21-ticks{font-size:10.5px!important}.build21-legend,.build21-note,.build21-caption small,.build21-slider-hint{font-size:9.5px!important;line-height:1.45!important}
.build21-slider-hint i{font-size:16px!important}

/* ---------- desktop header: tiny readability bump, no layout change -- */
@media (min-width:1441px){
  .site-header-v6 .menu>li>a{font-size:12.25px!important;letter-spacing:.08em!important}
}
@media (min-width:1181px) and (max-width:1440px) and (hover:hover) and (pointer:fine){
  .site-header-v6 .menu>li>a{font-size:11.15px!important;letter-spacing:.065em!important}
  .site-header-v6 .menu{gap:clamp(8px,.72vw,12px)!important}
}

/* ---------- universal responsive guardrails --------------------------- */
@media (max-width:1180px), (hover:none) and (pointer:coarse){
  html,body{max-width:100%!important;overflow-x:hidden!important;-webkit-text-size-adjust:100%}
  *,*:before,*:after{box-sizing:border-box}
  img,svg,canvas,video,iframe{max-width:100%!important}
  .site-header-v6{z-index:1000000!important;transform:none!important;contain:none!important}
  .site-header-v6.scrolled{transform:none!important}
  .site-header-v6 .menu-toggle{display:block!important;position:relative!important;z-index:1000003!important;touch-action:manipulation!important;-webkit-tap-highlight-color:transparent}
  .site-header-v6 .main-nav:not(.open){display:none!important;pointer-events:none!important}
  .site-header-v6 .main-nav.open{
    display:flex!important;position:fixed!important;inset:0!important;z-index:1000001!important;
    width:100vw!important;height:100dvh!important;min-height:100svh!important;max-height:none!important;
    overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch!important;overscroll-behavior:contain!important;
    pointer-events:auto!important;visibility:visible!important;opacity:1!important;
    background:linear-gradient(145deg,#0b1015 0%,#131b23 100%)!important;color:#fff!important;
  }
  html.menu-open,body.menu-open{overflow:hidden!important;overscroll-behavior:none!important}
  body.menu-open .site-header-v6{background:transparent!important;border-color:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  body.menu-open .site-header-v6 .brand{position:fixed!important;z-index:1000004!important}
  body.menu-open .site-header-v6 .brand img{filter:brightness(0) invert(1)!important}
  body.menu-open .site-header-v6 .menu-toggle{position:fixed!important;z-index:1000005!important;color:#fff!important}
  .site-header-v6 .main-nav.open .menu{display:block!important;width:100%!important;margin:0!important;padding:0!important;list-style:none!important}
  .site-header-v6 .main-nav.open .menu>li{display:block!important;width:100%!important;margin:0!important;border-bottom:1px solid rgba(255,255,255,.11)!important}
  .site-header-v6 .main-nav.open .menu>li>a{display:flex!important;align-items:center!important;width:100%!important;color:#fff!important;white-space:normal!important;pointer-events:auto!important;touch-action:manipulation!important}
  .site-header-v6 .main-nav.open .menu>li>a:after{display:none!important}
  .mobile-nav-actions-v6{display:flex!important;width:100%!important;flex-direction:column!important}
  .mobile-nav-actions-v6 a{pointer-events:auto!important;touch-action:manipulation!important;color:#fff!important}
}

/* ======================================================================
   TABLET / iPad – independent composition, 768 through 1180 CSS pixels
   ====================================================================== */
@media (min-width:768px) and (max-width:1180px){
  :root{--pad:clamp(30px,5vw,54px)!important;--header-h:78px!important}
  body{font-size:16px!important}

  .site-header-v6{height:78px!important;min-height:78px!important;padding:0 clamp(26px,4vw,44px)!important;display:grid!important;grid-template-columns:minmax(0,1fr) 52px!important;align-items:center!important;gap:18px!important}
  .site-header-v6 .brand{width:180px!important;max-width:52vw!important;padding:0!important}
  .site-header-v6 .brand img{width:100%!important;max-height:46px!important;object-fit:contain!important;object-position:left center!important}
  .site-header-v6 .menu-toggle{width:52px!important;height:52px!important;justify-self:end!important}
  .site-header-v6 .menu-toggle span{width:27px!important;left:12px!important}
  .header-actions-v6{display:none!important}
  .site-header-v6 .main-nav.open{padding:calc(78px + max(24px,env(safe-area-inset-top))) clamp(36px,7vw,74px) max(34px,env(safe-area-inset-bottom))!important}
  .site-header-v6 .main-nav.open .menu{border-top:1px solid rgba(255,255,255,.14)!important}
  .site-header-v6 .main-nav.open .menu>li>a{min-height:66px!important;padding:12px 0!important;font-size:clamp(27px,4.4vw,39px)!important;line-height:1.02!important;letter-spacing:-.025em!important}
  .mobile-nav-actions-v6{margin-top:28px!important;gap:0!important}
  .mobile-nav-actions-v6 a{min-height:56px!important;padding:16px 0!important;border-top:1px solid rgba(255,255,255,.14)!important;font-size:12px!important;letter-spacing:.11em!important;text-transform:uppercase!important;display:flex!important;align-items:center!important;justify-content:space-between!important}
  body.menu-open .site-header-v6 .brand{left:clamp(28px,4vw,44px)!important;top:16px!important;width:180px!important}
  body.menu-open .site-header-v6 .menu-toggle{right:clamp(24px,4vw,40px)!important;top:13px!important}

  /* home hero */
  .hero-v6{min-height:100svh!important;height:auto!important;padding:calc(var(--header-h) + 74px) var(--pad) 42px!important;display:flex!important;flex-direction:column!important;justify-content:flex-end!important;overflow:hidden!important}
  .hero-v6-copy{width:100%!important;max-width:78%!important;margin:0 0 38px!important}
  .hero-v6 h1{font-size:clamp(66px,9.2vw,98px)!important;line-height:.92!important;max-width:100%!important}
  .hero-v6 .hero-lead{font-size:16px!important;line-height:1.6!important;max-width:42em!important}
  .hero-blueprint-field{width:88vw!important;height:70vh!important;right:-31vw!important;top:12vh!important;opacity:.30!important;pointer-events:none!important}
  .hero-v6-flow{width:min(760px,100%)!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:0!important}
  .hero-v6-flow>div{min-width:0!important;padding:14px 16px 12px 0!important}

  /* generic content */
  .section,.team-working,.career-process,.applicant-checklist{padding:88px var(--pad)!important}
  .section-head.split{display:grid!important;grid-template-columns:minmax(0,1.15fr) minmax(260px,.7fr)!important;gap:42px!important;align-items:end!important}
  .section-head h2,.section h2{max-width:100%!important}
  .section-note{font-size:15px!important;line-height:1.6!important;max-width:38ch!important}
  .service-grid-v6,.portal-grid-v6,.home-project-grid,.team-grid,.principles,.vision-values-v6,.career-portal-grid,.applicant-options{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px!important}
  .team-working-grid,.partner-process-v6,.vision-system-v6{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .service-card-v6,.portal-card-v6{min-height:340px!important;height:auto!important;padding:30px!important}
  .home-project-grid{row-gap:42px!important}
  .footer-v6-main{grid-template-columns:1fr 1fr!important;gap:44px 30px!important}.footer-v6-brand{grid-column:1/-1!important}

  /* subpage hero: plan above, text below – no half-screen squeeze */
  .page-hero-v6{min-height:auto!important;padding:calc(var(--header-h) + 44px) var(--pad) 68px!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:30px!important;overflow:hidden!important}
  .page-hero-v6 .hero-blueprint-field.subpage-floorplan,.page-hero-v6 .page-hero-blueprint,.vision-page-hero-v8 .vision-hero-model-v8,.services-page-hero-v7 .services-hero-system,.projects-page-hero-v7 .projects-hero-showcase,.team-page-hero-v7 .team-hero-network,.career-page-hero-v7 .career-hero-nodes,.contact-page-hero .contact-hero-line{position:relative!important;inset:auto!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;width:100%!important;height:300px!important;max-width:100%!important;order:1!important;margin:0!important;opacity:.72!important}
  .page-hero-v6 .page-hero-copy{order:2!important;width:100%!important;max-width:760px!important;margin:0!important;padding:0!important}
  .page-hero-v6 .page-hero-copy:before{display:none!important}
  .page-hero-v6 h1,.page-hero-v6 .page-hero-copy h1{font-size:clamp(56px,8.5vw,82px)!important;line-height:.94!important}
  .page-hero-v6 p{font-size:16px!important;line-height:1.6!important;max-width:42em!important}

  /* construction model becomes stacked, never squeezed */
  .build21-sticky{grid-template-columns:1fr!important;grid-template-rows:auto minmax(520px,55vh)!important;min-height:0!important;height:auto!important}
  .build21-copy{min-height:0!important;height:auto!important;padding:72px var(--pad) 42px!important}
  .build21-copy h2{font-size:clamp(58px,8vw,78px)!important}
  .build21-copy>p{font-size:14px!important;max-width:48em!important;min-height:0!important}
  .build21-control{max-width:640px!important;margin-top:28px!important}
  .build21-slider-wrap{height:44px!important}.build21-range{height:44px!important}
  .build21-range::-webkit-slider-thumb{width:28px!important;height:28px!important;margin-top:-13px!important}.build21-range::-moz-range-thumb{width:28px!important;height:28px!important}
  .build21-stage{height:55vh!important;min-height:520px!important}
  .build21-canvas{inset:2% 3% 10%!important;width:94%!important;height:88%!important}
}

/* ======================================================================
   PHONE – independent customer-facing layout, 320 through 767px
   ====================================================================== */
@media (max-width:767px){
  :root{--pad:18px!important;--header-h:70px!important}
  html{font-size:16px!important}
  body{min-width:320px!important;font-size:15px!important}
  #page,.site,main,.site-main,.site-content,section,footer{width:100%!important;max-width:100%!important;overflow-x:hidden!important}

  /* header + reliable full-screen phone menu */
  .site-header-v6{height:70px!important;min-height:70px!important;padding:env(safe-area-inset-top) 14px 0 18px!important;display:grid!important;grid-template-columns:minmax(0,1fr) 48px!important;align-items:center!important;gap:10px!important}
  .site-header-v6 .brand{width:148px!important;max-width:64vw!important;min-width:0!important;padding:0!important}
  .site-header-v6 .brand img{width:100%!important;height:auto!important;max-height:38px!important;object-fit:contain!important;object-position:left center!important}
  .site-header-v6 .menu-toggle{width:48px!important;height:48px!important;justify-self:end!important;margin:0!important}
  .site-header-v6 .menu-toggle span{width:25px!important;left:11px!important;height:1.5px!important}
  .header-actions-v6{display:none!important}
  .site-header-v6 .main-nav.open{padding:calc(82px + env(safe-area-inset-top)) 20px max(24px,env(safe-area-inset-bottom))!important;justify-content:flex-start!important;align-items:stretch!important}
  .site-header-v6 .main-nav.open .menu{border-top:1px solid rgba(255,255,255,.14)!important}
  .site-header-v6 .main-nav.open .menu>li>a{min-height:55px!important;padding:10px 0!important;font-size:clamp(24px,7vw,30px)!important;line-height:1.02!important;letter-spacing:-.025em!important}
  .mobile-nav-actions-v6{margin-top:22px!important;padding:0!important;gap:0!important}
  .mobile-nav-actions-v6 a{min-height:52px!important;padding:14px 0!important;border-top:1px solid rgba(255,255,255,.14)!important;font-size:11px!important;letter-spacing:.1em!important;text-transform:uppercase!important;display:flex!important;align-items:center!important;justify-content:space-between!important}
  body.menu-open .site-header-v6 .brand{left:18px!important;top:calc(14px + env(safe-area-inset-top))!important;width:148px!important}
  body.menu-open .site-header-v6 .menu-toggle{right:13px!important;top:calc(10px + env(safe-area-inset-top))!important}

  /* homepage hero – readable first, drawing becomes backdrop */
  .hero-v6{min-height:100svh!important;height:auto!important;padding:calc(var(--header-h) + 56px) 18px 30px!important;display:flex!important;flex-direction:column!important;justify-content:flex-end!important;overflow:hidden!important}
  .hero-v6-copy{width:100%!important;max-width:100%!important;margin:0 0 30px!important;position:relative!important;z-index:3!important}
  .hero-v6 h1{font-size:clamp(46px,13.4vw,61px)!important;line-height:.92!important;letter-spacing:-.05em!important;max-width:100%!important;margin:0!important}
  .hero-v6 .hero-lead{font-size:15px!important;line-height:1.55!important;max-width:96%!important;margin-top:20px!important}
  .hero-v6 .hero-actions{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:10px!important;margin-top:23px!important;width:100%!important}
  .hero-v6 .hero-actions .dbg-btn-light{width:100%!important;min-height:54px!important;justify-content:space-between!important;font-size:13px!important;padding:15px 18px!important}
  .hero-v6 .hero-actions .text-link{width:fit-content!important;font-size:13px!important;padding:10px 0!important}
  .hero-blueprint-field{position:absolute!important;width:168vw!important;height:62vh!important;right:-76vw!important;top:12vh!important;opacity:.20!important;pointer-events:none!important;z-index:1!important}
  .hero-v6-flow{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important;max-width:100%!important;gap:0!important;position:relative!important;z-index:3!important}
  .hero-v6-flow>div{min-width:0!important;padding:12px 8px 10px 0!important;grid-template-columns:24px minmax(0,1fr)!important;gap:7px!important}
  .hero-v6-flow span,.hero-v6-flow strong{font-size:10px!important;white-space:normal!important;overflow-wrap:break-word!important}
  .scroll-cue{display:none!important}

  /* readable labels */
  .section-index{font-size:12px!important;margin-bottom:25px!important}
  .eyebrow{font-size:11px!important}
  .section{padding:66px 18px!important}
  .section-head,.section-head.split{display:block!important;width:100%!important}
  .section-head h2,.section h2{font-size:clamp(39px,11.2vw,50px)!important;line-height:.96!important;max-width:100%!important}
  .section-head.split .section-note,.section-note{font-size:15px!important;line-height:1.6!important;max-width:100%!important;margin:20px 0 0!important}
  .section p{font-size:15px!important;line-height:1.62!important;max-width:100%!important}

  /* every repeating desktop grid becomes one predictable column */
  .intro-v6,.service-grid-v6,.portal-grid-v6,.home-project-grid,.team-grid,.team-working-grid,.partner-process-v6,.principles,.vision-intro-v6,.vision-values-v6,.vision-system-v6,.service-process-v6,.contact-main-v6,.footer-v6-main,.career-portal-grid,.career-process,.project-grid-v6,.reference-archive-grid,.contact-grid,.applicant-options,.listing-grid,.team-intro,.team-working-title,.career-portal-copy,.applicant-checklist,.project-start-v6,.compare-concept{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:18px!important;width:100%!important}
  .intro-v6>*,.service-grid-v6>*,.portal-grid-v6>*,.home-project-grid>*,.team-grid>*,.team-working-grid>*,.partner-process-v6>*,.principles>*,.vision-intro-v6>*,.vision-values-v6>*,.vision-system-v6>*,.service-process-v6>*,.contact-main-v6>*,.footer-v6-main>*,.career-portal-grid>*,.project-grid-v6>*{min-width:0!important;max-width:100%!important;grid-column:auto!important}
  .service-card-v6,.portal-card-v6,.team-working-grid article,.partner-process-v6 article,.vision-values-v6 article,.career-portal-card,.applicant-option{min-height:0!important;height:auto!important;padding:25px 20px!important}
  .service-card-v6 h3,.portal-card-v6 h3{font-size:28px!important;line-height:1.05!important;margin-top:48px!important}
  .portal-card-v6 p,.service-card-v6 p{font-size:14px!important}
  .home-project-grid{row-gap:38px!important}.home-project-media{width:100%!important;height:auto!important;aspect-ratio:4/3!important;overflow:hidden!important}.home-project-media img{width:100%!important;height:100%!important;object-fit:cover!important}.home-project-meta{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:5px!important;font-size:10px!important}.home-project-card h3{font-size:30px!important}

  /* comparison module */
  .compare-concept{margin-top:42px!important}.reference-compare{width:100%!important;min-width:0!important;aspect-ratio:4/5!important;max-height:620px!important}.compare-caption{left:14px!important;right:14px!important;bottom:13px!important;gap:8px!important;flex-direction:column!important}.compare-caption strong,.compare-caption span{font-size:9px!important}.plan-to-build .compare-instruction{left:14px!important;top:14px!important;font-size:9px!important}.compare-concept-copy{padding:4px 0 0!important}.compare-concept-copy h3{font-size:31px!important;line-height:1.04!important}

  /* subpage heroes: floorplan first, text underneath */
  .page-hero-v6{min-height:auto!important;padding:calc(var(--header-h) + 34px) 18px 48px!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:22px!important;overflow:hidden!important}
  .page-hero-v6 .hero-blueprint-field.subpage-floorplan,.page-hero-v6 .page-hero-blueprint,.vision-page-hero-v8 .vision-hero-model-v8,.services-page-hero-v7 .services-hero-system,.projects-page-hero-v7 .projects-hero-showcase,.team-page-hero-v7 .team-hero-network,.career-page-hero-v7 .career-hero-nodes,.contact-page-hero .contact-hero-line{position:relative!important;inset:auto!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;width:100%!important;height:210px!important;max-width:100%!important;order:1!important;margin:0!important;opacity:.66!important;overflow:hidden!important}
  .page-hero-v6 .page-hero-copy{order:2!important;width:100%!important;max-width:100%!important;margin:0!important;padding:0!important}
  .page-hero-v6 .page-hero-copy:before{display:none!important}
  .page-hero-v6 h1,.page-hero-v6 .page-hero-copy h1{font-size:clamp(42px,11.6vw,54px)!important;line-height:.94!important;max-width:100%!important}
  .page-hero-v6 p,.page-hero-v6 .page-hero-copy p{font-size:14px!important;line-height:1.58!important;max-width:100%!important;margin-top:18px!important}
  .page-hero-v6 .blueprint-stamp,.page-hero-v6 .blueprint-coord,.page-hero-v6 .dim-label,.page-hero-v6 .area{display:none!important}

  /* Schieben.Bauen: no squeeze; full-width control, separate model */
  .build21{width:100%!important;height:auto!important;min-height:0!important;overflow:hidden!important}
  .build21-sticky{display:grid!important;grid-template-columns:1fr!important;grid-template-rows:auto minmax(390px,55vh)!important;height:auto!important;min-height:0!important;overflow:hidden!important}
  .build21-copy{height:auto!important;min-height:0!important;padding:54px 18px 32px!important;justify-content:flex-start!important}
  .build21-copy h2{font-size:clamp(45px,13vw,57px)!important;line-height:.91!important;margin:11px 0 13px!important}
  .build21-copy>p{font-size:13.5px!important;line-height:1.5!important;max-width:100%!important;min-height:0!important}
  .build21-control{width:100%!important;max-width:none!important;margin-top:24px!important;padding-bottom:25px!important}
  .build21-slider-head{font-size:10px!important;gap:10px!important;flex-wrap:wrap!important}.build21-slider-head strong{font-size:13px!important}
  .build21-slider-wrap{height:46px!important}.build21-range{height:46px!important;touch-action:pan-x!important}
  .build21-range::-webkit-slider-thumb{width:30px!important;height:30px!important;margin-top:-14px!important}.build21-range::-moz-range-thumb{width:30px!important;height:30px!important}
  .build21-ticks{font-size:10px!important;margin-top:2px!important}.build21-slider-hint{font-size:9px!important;top:46px!important}.build21-legend{font-size:9px!important;display:block!important;margin-top:22px!important}.build21-legend span{display:block!important;margin-top:5px!important}
  .build21-stage{height:55vh!important;min-height:390px!important;width:100%!important;overflow:hidden!important}
  .build21-canvas{inset:1% -4% 10%!important;width:108%!important;height:89%!important;max-width:none!important;touch-action:pan-y!important}
  .build21-fallback{inset:1% -4% 10%!important}.build21-caption{right:5%!important;bottom:4%!important}.build21-caption span{font-size:30px!important}.build21-caption small,.build21-note{font-size:9px!important}.build21-note{left:5%!important;bottom:4%!important;max-width:58%!important}

  /* forms / footer */
  input,textarea,select,button{max-width:100%!important}.contact-form-wrap,.partner-form-v6,.form-section{width:100%!important;min-width:0!important}.contact-form-wrap input,.contact-form-wrap textarea,.partner-form-v6 input,.partner-form-v6 textarea{width:100%!important;font-size:16px!important}
  .footer-v6-main{gap:34px!important}.footer-v6-bottom{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:12px!important}.team-join-cta{padding:66px 18px!important;display:block!important}.team-join-cta h2{font-size:46px!important;margin-bottom:28px!important}.project-start-v6{padding:66px 18px!important}.project-start-copy h2{font-size:46px!important}.project-start-actions{width:100%!important}
}

/* smaller phones: keep content large but reduce geometry */
@media (max-width:390px){
  :root{--pad:16px!important}
  .site-header-v6{padding-left:16px!important;padding-right:11px!important}.site-header-v6 .brand{width:138px!important}.site-header-v6 .main-nav.open{padding-left:18px!important;padding-right:18px!important}.site-header-v6 .main-nav.open .menu>li>a{font-size:24px!important;min-height:52px!important}
  .hero-v6{padding-left:16px!important;padding-right:16px!important}.hero-v6 h1{font-size:clamp(43px,13.1vw,51px)!important}.hero-v6-flow span,.hero-v6-flow strong{font-size:9.5px!important}
  .section{padding-left:16px!important;padding-right:16px!important}.page-hero-v6{padding-left:16px!important;padding-right:16px!important}.build21-copy{padding-left:16px!important;padding-right:16px!important}
}

@media (prefers-reduced-motion:reduce){
  .build21-slider-hint,.build21-range::-webkit-slider-thumb,.build21-range::-moz-range-thumb{animation:none!important}
}
