/* Phone and tablet refinements only. Approved desktop layout remains untouched. */
@media (max-width: 900px) {
  :root { --mobile-gutter: clamp(20px, 6vw, 34px); }

  html { scroll-behavior: smooth; overflow-x: hidden; }
  body { max-width: 100%; overflow-x: hidden; font-size: 15px; }
  .site-shell,
  .viewport { max-width: 100%; overflow-x: hidden; }

  .nav-rail {
    height: 74px;
    padding: 11px var(--mobile-gutter);
    background: rgba(18, 19, 19, .96);
    border-bottom: 1px solid rgba(255,255,255,.13);
    backdrop-filter: blur(18px);
  }
  .logo-link { display: flex; align-items: center; }
  .logo-link img { width: 126px; display: block; }
  .menu-toggle {
    min-width: 76px;
    padding: 9px 12px;
    border-color: rgba(255,255,255,.28);
    border-radius: 1px;
    font-size: .64rem;
  }
  .nav-rail nav {
    top: 74px;
    gap: 0;
    padding: 12px var(--mobile-gutter) 20px;
    background: rgba(18,19,19,.985);
    box-shadow: 0 18px 35px rgba(0,0,0,.32);
  }
  .nav-rail nav a {
    padding: 16px 0;
    border-bottom: 1px solid rgba(255,255,255,.12);
    font-size: .7rem;
    line-height: 1.35;
  }
  .nav-rail nav a:last-child { border-bottom: 0; }
  .nav-rail nav a small { display: block; margin: 4px 0 0; }

  .viewport { padding-top: 74px; }
  .view { top: 74px; min-height: calc(100vh - 74px); max-width: 100%; overflow-x: hidden; padding-bottom: 0; }
  .view-image {
    height: clamp(310px, 45svh, 430px);
    min-height: 0;
    transform: scale(1.035) translate3d(0,0,0);
    transform-origin: center;
    transition: none;
    will-change: transform;
    backface-visibility: hidden;
  }
  .view.is-active .lobby-image { animation: mobile-pan-lobby 13s cubic-bezier(.22,.61,.36,1) both; }
  .view.is-active .residential-image { animation: mobile-pan-residential 13s cubic-bezier(.22,.61,.36,1) both; }
  .view.is-active .professional-image { animation: mobile-pan-professional 13s cubic-bezier(.22,.61,.36,1) both; }
  .view.is-active .event-image { animation: mobile-pan-event 13s cubic-bezier(.22,.61,.36,1) both; }
  .lobby-image { background-position: 48% center; }
  .residential-image { background-position: 54% center; }
  .professional-image { background-position: 52% center; }
  .event-image { background-position: 51% center; }

  .info-panel {
    padding: 38px var(--mobile-gutter) 42px;
    background: linear-gradient(145deg,#242525 0%,#181919 82%);
    backdrop-filter: none;
  }
  .audience-tabs,
  .language-tabs {
    gap: 22px;
    overflow-x: auto;
    scrollbar-width: none;
    white-space: nowrap;
  }
  .audience-tabs::-webkit-scrollbar,
  .language-tabs::-webkit-scrollbar { display: none; }
  .audience-tabs a,
  .language-tabs button { flex: 0 0 auto; font-size: .62rem; }
  .panel-content { margin: 36px 0 0; }
  .kicker { font-size: .65rem; line-height: 1.55; }
  .home-panel .panel-content h1,
  .service-panel h2,
  .contact-card h2 {
    font-size: clamp(2.18rem, 10.5vw, 3rem);
    line-height: 1.04;
    letter-spacing: -.045em;
    margin: 17px 0 21px;
  }
  .home-panel .panel-content h1 span { margin-top: 11px; }
  .panel-content > p:not(.kicker),
  .service-panel > p,
  .contact-card > p { font-size: .94rem; line-height: 1.58; }
  .philosophy { margin-top: 17px !important; line-height: 1.6 !important; }
  .who { display: block; font-size: .61rem !important; line-height: 1.72 !important; }
  .ai-note { margin-top: 20px; padding-top: 18px; }
  .ai-note p { font-size: .78rem; line-height: 1.58; }
  .lobby-content { margin-top: 0; }
  .lobby-content .lobby-lead { font-size: .94rem !important; }
  .render-thesis { font-size: .94rem !important; line-height: 1.5; }
  .lobby-services { margin-top: 22px; }
  .lobby-services article {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 17px 0;
  }
  .lobby-services strong { font-size: .72rem; }
  .lobby-services small { font-size: .61rem; }
  .lobby-services p { font-size: .82rem; }
  .brochure-section { margin-top: 28px; padding-top: 20px; }
  .brochure-download { min-height: 72px; grid-template-columns: 46px minmax(0,1fr) auto; gap: 14px; padding: 10px; }
  .brochure-thumb { width: 46px; height: 60px; }
  .brochure-download strong { font-size: .72rem; }
  .brochure-download small { font-size: .62rem; }
  .lobby-brochure-grid { grid-template-columns: 1fr; gap: 10px; }
  .lobby-brochures .brochure-download {
    grid-template-columns: 46px minmax(0,1fr) auto;
    min-height: 72px;
    padding: 10px;
  }
  .lobby-brochures .brochure-thumb { width: 46px; height: 60px; }
  .lobby-brochures .download-mark { width: 30px; height: 30px; font-size: 1rem; }

  .path-bar.three {
    display: flex;
    gap: 1px;
    padding: 0;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    scrollbar-width: none;
    background: #111;
  }
  .path-bar.three::-webkit-scrollbar { display: none; }
  .path-bar.three .path-item {
    flex: 0 0 84vw;
    min-height: 142px;
    border: 0;
    scroll-snap-align: start;
  }
  .path-bar.three .path-route { padding: 26px 88px 26px var(--mobile-gutter); }
  .path-bar.three .path-item::before { opacity: .72; }
  .path-bar.three .path-item::after { background: linear-gradient(90deg,rgba(12,13,13,.77),rgba(12,13,13,.34)); }
  .path-bar.three span { font-size: .72rem; line-height: 1.4; }
  .path-bar.three small { max-width: 78%; margin-top: 5px; line-height: 1.45; }
  .path-bar.three .path-route b { align-self: center; }
  .path-bar.three .path-download { right: 20px; bottom: 20px; }
  .path-bar.three .path-download span { font-size: .52rem; }

  .service-panel { padding-top: 34px; }
  .service-panel > p { margin: 0 0 14px; }
  .service-panel .assurance {
    margin: 22px 0 18px;
    font-size: 1.22rem !important;
    line-height: 1.35;
  }
  .construction-focus {
    margin-top: 21px !important;
    color: #fff !important;
    font-size: .75rem !important;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
  }
  .contract-line {
    margin: 20px 0 4px !important;
    padding: 16px 0;
    border-color: rgba(255,255,255,.26);
    font-size: .86rem !important;
    line-height: 1.45;
  }
  .service-list,
  .pro-panel .service-list { margin-top: 24px; }
  .service-list article,
  .pro-panel .service-list article,
  .event-panel .service-list article {
    display: block;
    padding: 18px 0 19px;
  }
  .service-list h3 {
    margin-bottom: 8px;
    font-size: .7rem;
    line-height: 1.4;
  }
  .service-list p {
    max-width: 42rem;
    color: #d3d3cf;
    font-size: .87rem;
    line-height: 1.55;
  }
  .mexico-callout { margin-top: 28px; padding: 23px 0 3px; border-bottom: 0; }
  .mexico-callout h3 { line-height: 1.45; }
  .mexico-callout p { font-size: .84rem; line-height: 1.58; }
  .process-bar {
    justify-content: flex-start;
    padding: 20px var(--mobile-gutter);
    font-size: .58rem;
    line-height: 1.65;
  }

  .contact-view { padding-top: 74px; }
  .contact-image {
    height: clamp(250px, 37svh, 350px);
    background-position: 47% center;
    transform: none;
    animation: contact-pan-mobile 13s cubic-bezier(.22,.61,.36,1) both;
  }
  .contact-card { padding: 42px var(--mobile-gutter) 54px; }
  .contact-card h2 { max-width: 9em; }
  .contact-form { gap: 16px; margin-top: 27px; }
  .form-row { grid-template-columns: 1fr; gap: 16px; }
  .contact-form input,
  .contact-form select,
  .contact-form textarea { min-height: 45px; padding: 11px 9px; font-size: 16px; }
  .contact-form textarea { min-height: 118px; }
  .contact-form button { width: 100%; min-height: 48px; }
  .contact-fallback { display: grid; gap: 11px; margin-top: 24px; }

  .privacy-view { padding: 118px var(--mobile-gutter) 60px; }
  .privacy-card h2 { font-size: clamp(2.35rem, 12vw, 3.25rem); margin-bottom: 28px; }
  .privacy-card p { line-height: 1.62; }

  .legal-note {
    padding: 15px var(--mobile-gutter) 17px;
    font-size: .62rem;
    line-height: 1.5;
    text-align: left;
  }
}

@keyframes mobile-pan-lobby {
  from { transform: scale(1.065) translate3d(-1.4%,0,0); }
  to { transform: scale(1.025) translate3d(1.2%,0,0); }
}

@keyframes mobile-pan-residential {
  from { transform: scale(1.06) translate3d(1.2%,0,0); }
  to { transform: scale(1.025) translate3d(-1.1%,0,0); }
}

@keyframes mobile-pan-professional {
  from { transform: scale(1.055) translate3d(-1%,.5%,0); }
  to { transform: scale(1.025) translate3d(1%,-.4%,0); }
}

@keyframes mobile-pan-event {
  from { transform: scale(1.065) translate3d(1.25%,0,0); }
  to { transform: scale(1.025) translate3d(-1.15%,0,0); }
}

@keyframes contact-pan-mobile {
  from { background-position: 44% center; }
  to { background-position: 50% center; }
}

@media (max-width: 520px) {
  .intro-collage { grid-template-columns: 1fr 1fr; gap: 2px; }
  .intro-logo,
  .intro-logo-image { width: 88vw; }
  .intro-rule { top: calc(50% + 29vw); }
  .home-panel .panel-content h1 { font-size: clamp(2.1rem, 10.3vw, 2.75rem); }
  .path-bar.three .path-item { flex-basis: 87vw; }
}

@media (max-width: 360px) {
  .logo-link img { width: 112px; }
  .home-panel .panel-content h1,
  .service-panel h2,
  .contact-card h2 { font-size: 2rem; }
}

@media (max-width: 900px) and (prefers-reduced-motion: reduce) {
  .view.is-active .view-image,
  .contact-image { animation: none !important; transform: none; }
}

/* Mobile editorial composition — intentionally isolated from desktop. */
@media (max-width: 900px) {
  :root {
    --mobile-gutter: clamp(19px, 5.6vw, 28px);
    --mobile-gold: #c9a36b;
    --mobile-panel: #1b1c1c;
    --mobile-card: rgba(255,255,255,.045);
  }

  body,
  .site-shell,
  .viewport,
  .view,
  .info-panel,
  .panel-content,
  .service-panel,
  .contact-card { min-width: 0; max-width: 100%; }

  .info-panel,
  .contact-card {
    left: auto;
    right: auto;
  }

  h1, h2, h3, p, a, small, span {
    overflow-wrap: break-word;
    word-break: normal;
  }

  .nav-rail {
    height: 70px;
    padding: 10px var(--mobile-gutter);
    background: rgba(17,18,18,.965);
    box-shadow: 0 8px 28px rgba(0,0,0,.2);
  }
  .logo-link img { width: 119px; }
  .menu-toggle {
    display: grid;
    width: 48px;
    min-width: 48px;
    height: 42px;
    padding: 0;
    place-items: center;
    overflow: hidden;
    color: transparent;
    border: 1px solid rgba(255,255,255,.27);
    border-radius: 0;
    position: relative;
  }
  .menu-toggle::before,
  .menu-toggle::after {
    content: "";
    position: absolute;
    left: 13px;
    right: 13px;
    height: 1px;
    background: #f4f2ed;
    transition: transform .25s ease, top .25s ease;
  }
  .menu-toggle::before { top: 15px; }
  .menu-toggle::after { top: 25px; }
  .menu-toggle[aria-expanded="true"]::before { top: 20px; transform: rotate(45deg); }
  .menu-toggle[aria-expanded="true"]::after { top: 20px; transform: rotate(-45deg); }
  .nav-rail nav {
    top: 70px;
    padding: 9px var(--mobile-gutter) 22px;
    border-top: 1px solid rgba(255,255,255,.06);
  }
  .nav-rail nav a { padding: 15px 0; }

  .viewport { padding-top: 70px; }
  .view { top: 70px; min-height: calc(100svh - 70px); }
  .view.is-active { overflow: visible; }
  .view-image {
    height: clamp(300px, 43svh, 390px);
    border-bottom: 1px solid rgba(201,163,107,.55);
  }

  .info-panel {
    position: relative;
    z-index: 3;
    width: calc(100% - 24px);
    margin: -24px 12px 0;
    padding: 36px var(--mobile-gutter) 42px;
    background:
      linear-gradient(135deg,rgba(255,255,255,.035),transparent 34%),
      linear-gradient(155deg,#252626 0%,#181919 78%);
    border-top: 1px solid rgba(201,163,107,.62);
    box-shadow: 0 -13px 32px rgba(0,0,0,.28);
  }
  .info-panel::before {
    content: "";
    display: block;
    width: 38px;
    height: 2px;
    margin-bottom: 25px;
    background: var(--mobile-gold);
  }
  .panel-content { margin: 0; }
  .kicker {
    color: #d9c29c;
    font-size: .62rem;
    line-height: 1.45;
    letter-spacing: .14em;
  }
  .home-panel .panel-content h1,
  .service-panel h2,
  .contact-card h2 {
    max-width: 100%;
    margin: 14px 0 21px;
    font-size: clamp(2.05rem, 9.8vw, 2.75rem);
    line-height: 1.02;
    letter-spacing: -.043em;
  }
  .panel-content > p:not(.kicker),
  .service-panel > p,
  .contact-card > p {
    width: 100%;
    max-width: none;
    font-size: .91rem;
    line-height: 1.62;
  }

  .render-thesis {
    margin: 22px 0 0 !important;
    padding: 16px 0 0;
    border-top: 1px solid rgba(255,255,255,.16);
    color: #fff !important;
    font-size: .88rem !important;
    font-weight: 700;
  }
  .lobby-homeowner-experience {
    margin-top: 23px;
    padding: 20px 18px;
    border: 1px solid rgba(201,163,107,.38);
    background: rgba(0,0,0,.16);
  }
  .lobby-homeowner-experience strong {
    font-size: .94rem;
    line-height: 1.4;
  }
  .lobby-homeowner-experience p {
    margin: 12px 0;
    font-size: .84rem;
    line-height: 1.6;
  }
  .lobby-homeowner-experience b {
    color: #ecd8b8;
    font-size: .78rem;
    line-height: 1.5;
  }
  .lobby-services {
    display: grid;
    gap: 9px;
    margin-top: 25px;
    border: 0;
    counter-reset: mobile-services;
  }
  .lobby-services article {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 9px;
    padding: 17px 16px 17px 48px;
    border: 1px solid rgba(255,255,255,.14);
    background: var(--mobile-card);
    counter-increment: mobile-services;
  }
  .lobby-services article::before {
    content: "0" counter(mobile-services);
    position: absolute;
    top: 18px;
    left: 14px;
    color: var(--mobile-gold);
    font-size: .58rem;
    letter-spacing: .1em;
  }
  .lobby-services strong { color: #fff; }
  .lobby-services small { margin-top: 4px; color: #aaa; line-height: 1.4; }
  .lobby-services p { margin: 0; color: #d1d1cd; line-height: 1.48; }
  .ai-note {
    margin-top: 24px;
    padding: 21px 19px 19px;
    border: 0;
    border-left: 2px solid var(--mobile-gold);
    background: rgba(0,0,0,.18);
  }
  .ai-note strong { margin: 0; padding: 0; border: 0; font-size: .78rem; letter-spacing: 0; text-transform: none; }
  .ai-note p { margin-bottom: 0; }

  .language-tabs {
    width: max-content;
    gap: 4px;
    margin: -7px 0 26px;
    padding: 3px;
    border: 1px solid rgba(255,255,255,.15);
    overflow: visible;
  }
  .language-tabs button {
    padding: 8px 12px;
    border: 0;
  }
  .language-tabs .is-active { border: 0; background: rgba(201,163,107,.2); color: #fff; }

  .service-panel { padding-top: 36px; }
  .service-panel .assurance {
    margin: 22px 0 8px;
    color: #fff !important;
    font-size: 1.15rem !important;
  }
  .construction-focus {
    padding-left: 14px;
    border-left: 2px solid var(--mobile-gold);
    color: #eee2cf !important;
  }
  .contract-line {
    margin: 22px 0 0 !important;
    padding: 15px 16px;
    border: 1px solid rgba(201,163,107,.44);
    background: rgba(201,163,107,.07);
  }
  .service-list,
  .pro-panel .service-list {
    display: grid;
    gap: 9px;
    margin-top: 23px;
    border: 0;
  }
  .service-list article,
  .pro-panel .service-list article,
  .event-panel .service-list article {
    position: relative;
    display: block;
    padding: 17px 17px 18px;
    border: 1px solid rgba(255,255,255,.13);
    background: var(--mobile-card);
  }
  .service-list article::after {
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 30px;
    height: 1px;
    background: var(--mobile-gold);
  }
  .service-list h3 { margin: 0 0 8px; color: #fff; font-size: .68rem; letter-spacing: .1em; }
  .service-list p { margin: 0; color: #d1d1cd; font-size: .84rem; line-height: 1.58; }
  .scope-note { padding: 17px 4px 0; color: #aaa; font-size: .67rem; line-height: 1.55; }
  .mexico-callout {
    margin-top: 25px;
    padding: 22px 19px 19px;
    border: 1px solid rgba(201,163,107,.3);
    background: rgba(0,0,0,.14);
  }
  .mexico-callout h3 { margin-top: 0; }

  .path-bar.three {
    gap: 10px;
    padding: 14px 12px 18px;
    background: #111212;
  }
  .path-bar.three .path-item {
    flex-basis: min(82vw, 330px);
    min-height: 154px;
    border: 1px solid rgba(255,255,255,.16);
  }
  .path-bar.three .path-route { padding: 27px 76px 27px 20px; }
  .path-bar.three .path-download { right: 16px; bottom: 16px; }
  .path-bar.three .path-download b { border-color: rgba(201,163,107,.75); color: #f0d7ad; }

  .process-bar {
    min-height: 62px;
    padding: 20px var(--mobile-gutter);
    border-top: 1px solid rgba(201,163,107,.42);
    color: #ded2bf;
  }

  .contact-view { padding-top: 70px; background: #151616; }
  .contact-image {
    height: clamp(270px, 39svh, 340px);
    border-bottom: 1px solid rgba(201,163,107,.65);
  }
  .contact-card {
    position: relative;
    z-index: 2;
    width: calc(100% - 24px);
    margin: -22px 12px 0;
    padding: 37px var(--mobile-gutter) 48px;
    background: #eeeae3;
    box-shadow: 0 -13px 32px rgba(0,0,0,.2);
  }
  .contact-card::before {
    content: "";
    display: block;
    width: 38px;
    height: 2px;
    margin-bottom: 24px;
    background: #9c7440;
  }
  .contact-card .kicker { color: #725535; }
  .contact-form label { color: #393632; }
  .contact-form input,
  .contact-form select,
  .contact-form textarea { background: rgba(255,255,255,.3); }
  .contact-form button { background: #191a1a; }

  .legal-note {
    border-top: 1px solid rgba(255,255,255,.1);
    background: #111212;
  }
}