:root{
    --bg:#f5f2ec; --bg-2:#ece7dd; --paper:#fbf9f4;
    --ink:#1a1a18; --ink-2:#2c2a26; --muted:#75706a;
    --line:#d9d2c3; --line-2:#c7bda8;
    --accent:#a78248; --accent-ink:#12100c; --accent-soft:#e8dcc2;
    --serif:'Cormorant Garamond', serif;
    --sans:'Inter', -apple-system, sans-serif;
    --mono:'JetBrains Mono', monospace;
    --display: var(--serif);
    --maxw:1400px; --gut:clamp(20px,4vw,64px);
  }
  *{box-sizing:border-box}
  html,body{margin:0; padding:0}
  body{
    font-family:var(--sans); color:var(--ink); background:var(--bg);
    font-size:16px; line-height:1.5;
  }
  .display{font-family:var(--display); font-weight:300; letter-spacing:-0.01em;}
  .em{font-style:italic; color:var(--accent); font-weight:400;}
  .wrap{max-width:var(--maxw); margin:0 auto; padding:0 var(--gut);}
  .eyebrow{
    font-family:var(--mono); font-size:11px; letter-spacing:0.2em;
    text-transform:uppercase; color:var(--muted);
    display:inline-flex; align-items:center; gap:10px;
  }
  .eyebrow .dot{width:6px; height:6px; background:var(--accent); border-radius:50%;}
  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    padding:14px 24px; font-family:var(--sans); font-weight:500; font-size:14px;
    border:1px solid var(--ink); background:var(--ink); color:var(--paper);
    cursor:pointer; text-decoration:none; letter-spacing:0.02em;
    transition:all .2s ease;
  }
  .btn:hover{background:#000}
  .btn--primary{background:var(--accent); border-color:var(--accent); color:var(--accent-ink);}
  .btn--primary:hover{background:#8f6d3a; border-color:#8f6d3a}
  .btn--ghost{background:transparent; color:var(--ink)}
  .btn--full{width:100%}
  .btn--lg{padding:18px 28px; font-size:15px}
  .btn--sm{padding:10px 18px; font-size:13px}

  html { scroll-behavior: smooth; }
  /* HEADER */
  header.sticky{
    position:sticky; top:0; z-index:50;
    background:rgba(251,249,244,0.92); backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
  }
  .nav{display:flex; align-items:center; justify-content:space-between; padding:18px 0}
  .brand{
    display:flex; align-items:center; gap:12px;
    font-family:var(--display); font-size:18px; letter-spacing:0.08em;
    text-decoration:none; color:var(--ink);
  }
  .brand .mark{
    width:34px; height:34px; border:1px solid var(--ink);
    display:inline-flex; align-items:center; justify-content:center; font-size:16px;
  }
  .nav-links{display:flex; gap:28px}
  .nav-links a{text-decoration:none; color:var(--ink-2); font-size:13px; letter-spacing:0.05em}
  .nav-right{display:flex; align-items:center; gap:20px}
  .nav-phone{font-family:var(--mono); font-size:13px; color:var(--ink); text-decoration:none}

  /* HERO */
  .hero{
    display:grid; grid-template-columns: 1.35fr 1fr;
    min-height: calc(100vh - 72px);
    border-bottom:1px solid var(--line);
  }
  .hero__visual{
    position:relative; overflow:hidden;
    background:#0f0e0c; isolation:isolate;
    border-right:1px solid var(--line);
  }
  .hv-bg{
    position:absolute; inset:0;
    background: radial-gradient(140% 90% at 50% 100%, #3a3226 0%, #1f1c17 45%, #0b0a08 100%);
  }
  .hv-bg::before{
    content:""; position:absolute; inset:0;
    background-image:
      linear-gradient(to right, rgba(255,255,255,0.035) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(255,255,255,0.035) 1px, transparent 1px);
    background-size:80px 80px;
    mask-image: radial-gradient(ellipse at 50% 60%, #000 0%, transparent 80%);
    -webkit-mask-image: radial-gradient(ellipse at 50% 60%, #000 0%, transparent 80%);
  }
  .hv-scene{
    position:absolute; left:50%; bottom:0;
    transform:translateX(-50%);
    width:96%; height:auto;
    aspect-ratio: 2048 / 1038;
    z-index:2;
    filter: drop-shadow(0 30px 50px rgba(0,0,0,0.55));
  }
  .hv-muse{
    position:absolute; left:50%; top:9%;
    transform:translateX(-50%);
    width:48%; max-width:580px;
    z-index:4; pointer-events:none;
    filter: drop-shadow(0 0 14px rgba(246,233,203,0.18));
  }
  .muse-letter{stroke-dasharray:700; stroke-dashoffset:700; animation: drawLine 2.2s cubic-bezier(.6,.1,.2,1) forwards;}
  .muse-l1{animation-delay:.4s} .muse-l2{animation-delay:1.0s}
  .muse-l3{animation-delay:1.6s} .muse-l4{animation-delay:2.2s}
  .muse-underline{stroke-dasharray:1000; stroke-dashoffset:1000; animation: drawLine 1.6s ease-out 3.2s forwards;}
  @keyframes drawLine{to{stroke-dashoffset:0}}
  .trace-line{stroke-dasharray:3500; stroke-dashoffset:3500; animation: drawLine 4s cubic-bezier(.5,.1,.2,1) forwards;}
  .trace-a{animation-delay:3.8s} .trace-b{animation-delay:4.3s}
  .trace-dim{stroke-dasharray:600; stroke-dashoffset:600; animation: drawLine 1.2s ease-out 7.8s forwards;}

  .hv-vignette{
    position:absolute; inset:0;
    background:
      linear-gradient(180deg, rgba(11,10,8,0.6) 0%, transparent 22%, transparent 70%, rgba(11,10,8,0.85) 100%),
      radial-gradient(120% 80% at 50% 50%, transparent 50%, rgba(11,10,8,0.55) 100%);
    pointer-events:none; z-index:3;
  }
  .hv-mark{
    position:absolute; font-family:var(--mono); font-size:10px;
    letter-spacing:0.22em; color:rgba(255,245,220,0.7);
    display:flex; align-items:center; gap:12px; z-index:5;
  }
  .hv-tick{display:inline-block; width:24px; height:1px; background:rgba(255,245,220,0.55)}
  .hv-mark--tl{top:28px; left:28px}
  .hv-mark--tr{top:28px; right:28px}
  .hv-corner{
    position:absolute; bottom:90px; left:28px; z-index:5;
    font-family:var(--mono); font-size:10px; letter-spacing:0.2em;
    color:rgba(255,245,220,0.82);
  }
  .hv-chip{
    position:absolute; top:70px; right:28px; z-index:5;
    display:inline-flex; align-items:center; gap:8px;
    background:rgba(10,9,8,0.55); border:1px solid rgba(255,245,220,0.22);
    padding:8px 14px; font-family:var(--mono); font-size:10px; letter-spacing:0.15em;
    color:rgba(255,245,220,0.92); backdrop-filter: blur(6px);
  }
  .live-dot{width:6px; height:6px; background:#d9a15a; border-radius:50%; animation: pulse 1.6s ease-in-out infinite}
  @keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
  .hv-meta{
    position:absolute; bottom:0; left:0; right:0; z-index:5;
    background:rgba(10,9,8,0.55); backdrop-filter:blur(10px);
    border-top:1px solid rgba(255,245,220,0.14);
    color:rgba(255,245,220,0.95);
    display:grid; grid-template-columns:repeat(3,1fr);
    font-family:var(--mono); font-size:11px;
  }
  .hv-meta>div{padding:16px 20px; border-right:1px solid rgba(255,245,220,0.1); display:flex; flex-direction:column; gap:4px}
  .hv-meta>div:last-child{border-right:none}
  .hv-meta span:first-child{color:rgba(255,245,220,0.55); font-size:9px; letter-spacing:0.15em; text-transform:uppercase}

  .hero__form{
    padding: clamp(40px,6vw,80px) var(--gut);
    display:flex; flex-direction:column; justify-content:center;
    background:var(--paper);
  }
  .hero__title{font-size: clamp(44px,5vw,72px); line-height:1.02; margin:18px 0 20px}
  .hero__sub{font-size:16px; color:var(--muted); margin:0 0 32px; max-width:460px; line-height:1.55}
  .hero-form{display:flex; flex-direction:column; gap:16px; max-width:460px}
  .row2{display:grid; grid-template-columns: 1fr 1fr; gap:12px}
  .field label{
    display:block; font-family:var(--mono); font-size:10px;
    letter-spacing:0.15em; color:var(--muted);
    text-transform:uppercase; margin-bottom:6px;
  }
  .field input, .field select{
    width:100%; padding:14px 14px; font-family:var(--sans); font-size:15px;
    background:var(--bg); border:1px solid var(--line-2); color:var(--ink);
    outline:none; transition: border-color .2s;
  }
  .field input:focus, .field select:focus{border-color:var(--ink)}
  .form-note{font-size:12px; color:var(--muted); line-height:1.5}
  .form-note a{color:var(--ink-2)}

  section{padding: clamp(60px,8vw,120px) 0; border-bottom:1px solid var(--line); position:relative}
  .section-num{
    font-family:var(--mono); font-size:11px; letter-spacing:0.25em;
    color:var(--muted); text-transform:uppercase; margin-bottom:24px;
  }
  .section-head{display:grid; grid-template-columns: 1fr 2fr; gap:60px; margin-bottom:60px}
  .section-head h2{font-size:clamp(38px,4.5vw,64px); line-height:1.05; margin:16px 0 0}

  /* Numbers */
  .numbers{background:var(--ink); color:var(--paper); border-bottom:none}
  .numbers .eyebrow{color:rgba(251,249,244,0.6)}
  .numbers .section-head h2{color:var(--paper)}
  .nums-grid{display:grid; grid-template-columns: repeat(4,1fr); border-top:1px solid #2f2c28}
  .num{padding:40px 30px; border-right:1px solid #2f2c28}
  .num:last-child{border-right:none}
  .num__val{font-family:var(--display); font-size:clamp(52px,5vw,84px); font-weight:300; line-height:1}
  .num__val .unit{font-size:0.4em; color:rgba(251,249,244,0.5); margin-left:4px}
  .num__label{margin-top:16px; font-family:var(--mono); font-size:11px; letter-spacing:0.15em; text-transform:uppercase; color:rgba(251,249,244,0.55)}

  /* Strip form */
  .strip{
    background:var(--ink); color:var(--paper); border-bottom:none;
    padding:32px 0; border-top:1px solid #2f2c28;
  }
  .strip-inner{
    display:grid; grid-template-columns: 1.3fr 1fr 1fr auto; gap:0; align-items:stretch;
    border:1px solid #2f2c28; background:#0f0e0c;
  }
  .strip-label{
    padding:24px 28px; display:flex; flex-direction:column; justify-content:center;
    border-right:1px solid #2f2c28;
  }
  .strip-label .k{font-family:var(--mono); font-size:10px; letter-spacing:0.2em; color:rgba(251,249,244,0.5); text-transform:uppercase; margin-bottom:4px}
  .strip-label .t{font-family:var(--display); font-size:22px}
  .strip-inner input{
    padding:24px 28px; background:transparent; color:var(--paper);
    border:none; border-right:1px solid #2f2c28; font-size:15px;
    outline:none; font-family:var(--sans);
  }
  .strip-inner input::placeholder{color:rgba(251,249,244,0.4)}
  .strip-inner button{
    padding:24px 36px; border:none; background:var(--accent); color:var(--accent-ink);
    font-family:var(--sans); font-weight:500; cursor:pointer; font-size:14px; letter-spacing:0.04em;
  }
  .strip-inner button:hover{background:#8f6d3a}

  /* Concept */
  .concept-grid{display:grid; grid-template-columns: 1fr 1fr; gap:40px}
  .concept-card{padding:40px; background:var(--paper); border:1px solid var(--line)}
  .concept-card h3{font-family:var(--display); font-weight:400; font-size:28px; margin:16px 0 12px}
  .concept-card p{color:var(--muted); margin:0; line-height:1.6}

  /* Location */
  .loc-wrap{display:grid; grid-template-columns: 1.1fr 1fr; border:1px solid var(--line); background:var(--paper)}
  .loc-map{
    position:relative; min-height:460px; background:#e8e2d0;
    border-right:1px solid var(--line);
    background-image:
      linear-gradient(to right, rgba(26,26,24,0.05) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(26,26,24,0.05) 1px, transparent 1px);
    background-size: 40px 40px;
  }
  .loc-pin{
    position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
    width:20px; height:20px; background:var(--accent); border-radius:50%;
    box-shadow:0 0 0 6px rgba(167,130,72,0.2), 0 0 0 14px rgba(167,130,72,0.08);
  }
  .loc-pin::after{
    content:"РЕЗИДЕНЦИЯ"; position:absolute; top:-28px; left:50%; transform:translateX(-50%);
    font-family:var(--mono); font-size:9px; letter-spacing:0.2em; white-space:nowrap;
    color:var(--ink);
  }
  .loc-chip{
    position:absolute; padding:6px 10px; background:var(--paper); border:1px solid var(--line-2);
    font-family:var(--mono); font-size:10px; letter-spacing:0.1em; color:var(--ink-2);
  }
  .loc-info{padding:40px}
  .loc-info h3{font-family:var(--display); font-weight:400; font-size:28px; margin:12px 0 16px}
  .loc-list{list-style:none; padding:0; margin:20px 0 0; display:flex; flex-direction:column; gap:12px}
  .loc-list li{display:grid; grid-template-columns: 1fr auto; gap:12px; padding:14px 0; border-bottom:1px dashed var(--line-2); font-size:14px}
  .loc-list li span:last-child{font-family:var(--mono); color:var(--muted); font-size:12px}

  /* Apartments */
  .apts-grid{display:grid; grid-template-columns: repeat(3,1fr); gap:24px}
  .apt{background:var(--paper); border:1px solid var(--line); display:flex; flex-direction:column}
  .apt__vis{
    aspect-ratio:4/3; position:relative; background:var(--bg-2); overflow:hidden;
    border-bottom:1px solid var(--line);
  }
  .apt__vis svg{position:absolute; inset:0; width:100%; height:100%}
  .apt__vis .tag{
    position:absolute; top:14px; left:14px; padding:4px 10px;
    background:var(--paper); border:1px solid var(--line-2);
    font-family:var(--mono); font-size:10px; letter-spacing:0.15em; color:var(--ink-2);
  }
  .apt__body{padding:24px; display:flex; flex-direction:column; gap:10px; flex:1}
  .apt__title{font-family:var(--display); font-size:26px; font-weight:400; line-height:1.1}
  .apt__specs{display:flex; gap:16px; font-family:var(--mono); font-size:11px; letter-spacing:0.1em; color:var(--muted); text-transform:uppercase; padding:8px 0}
  .apt__price{font-family:var(--display); font-size:20px; color:var(--ink); border-top:1px solid var(--line); padding-top:14px; margin-top:4px}
  .apt__price span{font-family:var(--mono); font-size:11px; letter-spacing:0.15em; color:var(--muted); display:block; margin-bottom:2px; text-transform:uppercase}
  .apt__cta{margin-top:auto; padding:16px 0 0}
  .apt__form{
    display:none; flex-direction:column; gap:10px; padding-top:16px;
    border-top:1px solid var(--line); margin-top:16px;
  }
  .apt.open .apt__form{display:flex}
  .apt.open .apt__cta .btn{display:none}
  .apt__form-tag{
    font-family:var(--mono); font-size:10px; letter-spacing:0.15em;
    text-transform:uppercase; color:var(--accent);
    display:flex; align-items:center; gap:8px;
  }
  .apt__form-tag::before{content:""; width:6px; height:6px; background:var(--accent); border-radius:50%}

  /* Architecture */
  .arch-grid{display:grid; grid-template-columns: 1.4fr 1fr; gap:40px}
  .arch-vis{
    aspect-ratio:4/5; background:#1a1a18; position:relative; overflow:hidden;
    border:1px solid var(--line);
  }
  .arch-vis img{
    position:absolute; inset:0; width:100%; height:100%;
    object-fit:cover; display:block;
  }
  .arch-vis::after{
    content:"Фрагмент — деталь фасада";
    position:absolute; bottom:16px; left:16px;
    font-family:var(--mono); font-size:10px; letter-spacing:0.2em;
    color:rgba(251,249,244,0.9);
    background:rgba(10,9,8,0.6); padding:6px 10px; backdrop-filter:blur(4px);
    z-index:2;
  }
  .arch-side{display:flex; flex-direction:column; gap:24px}
  .arch-item{padding:24px; background:var(--paper); border:1px solid var(--line)}
  .arch-item h4{font-family:var(--display); font-weight:400; font-size:22px; margin:8px 0 10px}
  .arch-item p{color:var(--muted); margin:0; font-size:14px; line-height:1.6}

  /* Infrastructure */
  .infra-grid{display:grid; grid-template-columns: repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line)}
  .infra-cell{background:var(--paper); padding:30px}
  .infra-cell__num{font-family:var(--mono); font-size:11px; letter-spacing:0.2em; color:var(--muted)}
  .infra-cell h4{font-family:var(--display); font-weight:400; font-size:22px; margin:12px 0 8px}
  .infra-cell p{color:var(--muted); margin:0; font-size:14px; line-height:1.55}
  .infra-cell__foot{
    font-family:var(--mono); font-size:10px; letter-spacing:0.12em;
    color:var(--ink-2); text-transform:uppercase;
    margin-top:16px; padding-top:12px; border-top:1px solid var(--line);
  }

  /* CTA banner */
  .cta-banner{
    padding:0; background:var(--ink); color:var(--paper);
    overflow:hidden; position:relative; border-bottom:none;
  }
  .cta-banner__bg{
    position:absolute; inset:0; opacity:0.28;
    background:
      radial-gradient(circle at 30% 60%, rgba(167,130,72,0.3), transparent 50%),
      radial-gradient(circle at 80% 30%, rgba(167,130,72,0.2), transparent 50%);
  }
  .cta-banner__bg::before{
    content:""; position:absolute; inset:0;
    background-image:
      linear-gradient(to right, rgba(251,249,244,0.06) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(251,249,244,0.06) 1px, transparent 1px);
    background-size: 80px 80px;
  }
  .cta-banner__inner{
    position:relative; z-index:2;
    padding: clamp(72px,10vw,140px) var(--gut);
    max-width:var(--maxw); margin:0 auto;
    display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:end;
  }
  .cta-banner__title{
    font-family:var(--display); font-size:clamp(42px,5.5vw,84px);
    line-height:1.02; font-weight:300; margin:16px 0 24px; letter-spacing:-0.01em;
  }
  .cta-banner__title .em{font-style:italic; color:var(--accent)}
  .cta-banner__scarcity{
    display:inline-flex; align-items:center; gap:10px;
    font-family:var(--mono); font-size:11px; letter-spacing:0.15em;
    padding:8px 14px; background:rgba(167,130,72,0.15); color:var(--accent);
    border:1px solid rgba(167,130,72,0.35);
  }
  .cta-banner__form{
    background:rgba(10,9,8,0.7); backdrop-filter: blur(8px);
    border:1px solid rgba(251,249,244,0.14);
    padding:32px; display:flex; flex-direction:column; gap:14px;
  }
  .cta-banner__form label{color:rgba(251,249,244,0.5)}
  .cta-banner__form input, .cta-banner__form select{
    background:rgba(251,249,244,0.05); border-color:rgba(251,249,244,0.18); color:var(--paper);
  }

  /* Developer */
  .dev-grid{display:grid; grid-template-columns: 1fr 1fr; gap:60px; align-items:start}
  .dev-stats{display:grid; grid-template-columns: 1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); margin-top:24px}
  .dev-stat{background:var(--paper); padding:24px}
  .dev-stat__val{font-family:var(--display); font-size:42px; font-weight:300; line-height:1}
  .dev-stat__lbl{font-family:var(--mono); font-size:10px; letter-spacing:0.15em; color:var(--muted); text-transform:uppercase; margin-top:10px}

  /* FAQ */
  .faq-list{display:flex; flex-direction:column; gap:0; border-top:1px solid var(--line)}
  .faq-item{border-bottom:1px solid var(--line); padding:24px 0}
  .faq-q{
    font-family:var(--display); font-size:22px; font-weight:400;
    cursor:pointer; display:flex; justify-content:space-between; gap:20px;
    align-items:baseline;
  }
  .faq-q::after{content:"+"; font-family:var(--mono); font-size:20px; color:var(--accent); font-weight:400}
  .faq-item.open .faq-q::after{content:"—"}
  .faq-a{max-height:0; overflow:hidden; transition:max-height .4s ease; color:var(--muted); line-height:1.6}
  .faq-item.open .faq-a{max-height:400px; padding-top:14px}
  .faq-inline{
    margin-top:16px; padding:20px; background:var(--paper); border:1px dashed var(--line-2);
    display:grid; grid-template-columns: 2fr auto auto; gap:12px; align-items:center;
  }
  .faq-inline .t{font-family:var(--display); font-size:18px}
  .faq-inline input{padding:12px 14px; border:1px solid var(--line-2); background:var(--bg); font-size:14px; outline:none; font-family:var(--sans)}
  .faq-inline button{padding:12px 18px; background:var(--accent); color:var(--accent-ink); border:none; font-family:var(--sans); font-size:13px; cursor:pointer; font-weight:500}

  /* Final */
  .final{background:var(--paper); border-bottom:none}
  .final-grid{display:grid; grid-template-columns: 1fr 1fr; gap:80px; align-items:start}
  .final-form{padding:40px; background:var(--bg); border:1px solid var(--line-2); display:flex; flex-direction:column; gap:16px}
  .final-info{display:flex; flex-direction:column; gap:20px; margin-top:24px}
  .final-info__row{padding:16px 0; border-bottom:1px dashed var(--line-2); display:flex; flex-direction:column; gap:4px}
  .final-info__k{font-family:var(--mono); font-size:10px; letter-spacing:0.15em; color:var(--muted); text-transform:uppercase}
  .final-info__v{font-family:var(--display); font-size:20px}

  /* Footer */
  footer{background:var(--ink); color:var(--paper); padding:60px 0}
  footer .foot-grid{display:grid; grid-template-columns: 2fr 1fr 1fr; gap:40px; color:rgba(251,249,244,0.7)}
  footer h4{font-family:var(--mono); font-size:10px; letter-spacing:0.2em; text-transform:uppercase; color:rgba(251,249,244,0.5); margin:0 0 16px}
  footer a{color:rgba(251,249,244,0.85); text-decoration:none; display:block; margin-bottom:8px; font-size:14px}

  /* Mobile CTA */
  .mobile-cta{
    display:none; position:fixed; left:0; right:0; bottom:0; z-index:60;
    background:var(--paper); border-top:1px solid var(--line);
    padding:10px; grid-template-columns: 1fr 1fr; gap:8px;
  }
  .mobile-cta .btn{padding:12px; font-size:13px}

  /* Popup */
  .popup-bg{
    display:none; position:fixed; inset:0; z-index:100;
    background:rgba(15,14,12,0.65); backdrop-filter:blur(4px);
    align-items:center; justify-content:center; padding:20px;
  }
  .popup-bg.open{display:flex}
  .popup{
    max-width:460px; width:100%; background:var(--paper);
    padding:36px; position:relative; border:1px solid var(--line-2);
  }
  .popup__close{
    position:absolute; top:14px; right:14px; width:32px; height:32px;
    background:transparent; border:1px solid var(--line); cursor:pointer;
    font-size:18px; line-height:1; color:var(--ink);
  }

  /* Responsive */
  @media (max-width: 1024px){
    .hero{grid-template-columns:1fr; min-height:0}
    .hero__visual{min-height:420px; border-right:none; border-bottom:1px solid var(--line)}
    .section-head{grid-template-columns:1fr; gap:16px}
    .concept-grid{grid-template-columns:1fr}
    .nums-grid{grid-template-columns:1fr 1fr}
    .num:nth-child(2n){border-right:none}
    .num:nth-child(-n+2){border-bottom:1px solid #2f2c28}
    .loc-wrap{grid-template-columns:1fr}
    .loc-map{border-right:none; border-bottom:1px solid var(--line)}
    .apts-grid{grid-template-columns:1fr 1fr}
    .arch-grid{grid-template-columns:1fr}
    .infra-grid{grid-template-columns:1fr 1fr}
    .cta-banner__inner{grid-template-columns:1fr; gap:40px}
    .dev-grid{grid-template-columns:1fr; gap:40px}
    .final-grid{grid-template-columns:1fr; gap:40px}
    .nav-links{display:none}
    .strip-inner{grid-template-columns:1fr}
    .strip-label, .strip-inner input, .strip-inner button{border-right:none; border-bottom:1px solid #2f2c28}
    .strip-inner button{border-bottom:none}
    .faq-inline{grid-template-columns:1fr}
  }
  /* Direct edits — #top typography */
  #top :is(h1,h2,h3,h4,h5,h6){ font-weight:400 }
  #top :is(h1,h2,h3,h4,h5,h6) :is(h1,h2,h3,h4,h5,h6,p,li,dt,dd,blockquote,figcaption,label,span,a,em,strong,small,td,th,caption){ font-weight:500 }
  #top b{ font-family: Montserrat; font-weight:600 }
  #top p{ font-family: Montserrat }

  /* ===== GALLERY ===== */
  .gallery{padding:clamp(60px,8vw,110px) 0 clamp(50px,6vw,80px); background:var(--bg); border-top:1px solid var(--line);}
  .gallery__head{display:flex; align-items:flex-end; justify-content:space-between; gap:32px; flex-wrap:wrap;}
  .gallery__nav{display:flex; align-items:center; gap:14px; padding-bottom:6px;}
  .gal-btn{
    width:46px; height:46px; border:1px solid var(--line-2); background:var(--paper);
    display:inline-flex; align-items:center; justify-content:center; cursor:pointer; color:var(--ink);
    transition:all .2s ease;
  }
  .gal-btn:hover{background:var(--ink); color:var(--paper); border-color:var(--ink);}
  .gal-btn:disabled{opacity:.3; cursor:not-allowed;}
  .gal-counter{font-family:var(--mono); font-size:12px; letter-spacing:.15em; color:var(--ink-2); min-width:72px; text-align:center;}
  .gallery__track-wrap{
    overflow:hidden; margin:clamp(28px,4vw,48px) 0 28px;
    padding:0 var(--gut);
    mask-image:linear-gradient(90deg, transparent 0, #000 4%, #000 96%, transparent 100%);
  }
  .gallery__track{
    display:flex; gap:18px; transition:transform .55s cubic-bezier(.22,.61,.36,1);
    will-change:transform;
  }
  .gal-slide{
    margin:0; flex:0 0 clamp(280px, 58vw, 820px);
    position:relative; background:#1a1512;
    aspect-ratio: 4/3;
    overflow:hidden;
    outline:1px solid var(--line);
    outline-offset:-1px;
  }
  .gal-slide img{
    width:100%; height:100%; object-fit:cover; display:block;
    transition: transform .9s cubic-bezier(.22,.61,.36,1), filter .4s ease;
    filter:saturate(.95);
  }
  .gal-slide:hover img{ transform:scale(1.03); filter:saturate(1.05);}
  .gal-slide figcaption{
    position:absolute; left:0; right:0; bottom:0;
    padding:14px 18px;
    background:linear-gradient(0deg, rgba(12,10,8,.88), rgba(12,10,8,0));
    color:var(--paper); font-family:var(--mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase;
    display:flex; align-items:center; gap:12px;
  }
  .gal-slide figcaption span{color:var(--accent); font-weight:500;}
  .gallery__dots{display:flex; gap:8px; justify-content:center; flex-wrap:wrap;}
  .gal-dot{
    width:28px; height:2px; background:var(--line-2); border:0; cursor:pointer; padding:0;
    transition:all .25s ease;
  }
  .gal-dot.active{background:var(--accent); width:48px;}
  .gal-dot:hover{background:var(--ink-2);}

  /* ===== BURGER + MOBILE NAV ===== */
  .burger{
    display:none; width:44px; height:44px; border:1px solid var(--line-2);
    background:var(--paper); cursor:pointer; padding:0;
    align-items:center; justify-content:center; flex-direction:column; gap:4px;
    transition:all .2s ease;
  }
  .burger span{width:18px; height:1.5px; background:var(--ink); transition:all .25s ease;}
  .burger[aria-expanded="true"] span:nth-child(1){transform:translateY(5.5px) rotate(45deg);}
  .burger[aria-expanded="true"] span:nth-child(2){opacity:0;}
  .burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg);}

  .mnav{
    position:fixed; inset:0; z-index:100;
    background:rgba(10,9,8,0); pointer-events:none;
    transition: background .35s ease;
  }
  .mnav.open{background:rgba(10,9,8,0.55); pointer-events:auto;}
  .mnav__panel{
    position:absolute; top:0; right:0; bottom:0;
    width:min(420px, 88vw);
    background:var(--paper);
    transform:translateX(100%);
    transition: transform .4s cubic-bezier(.22,.61,.36,1);
    display:flex; flex-direction:column;
    box-shadow:-30px 0 60px rgba(0,0,0,0.25);
    overflow-y:auto;
  }
  .mnav.open .mnav__panel{transform:translateX(0);}
  .mnav__head{
    display:flex; align-items:center; justify-content:space-between;
    padding:22px 24px; border-bottom:1px solid var(--line); flex-shrink:0;
  }
  .mnav__close{
    width:44px; height:44px; border:1px solid var(--line-2);
    background:var(--paper); font-size:26px; line-height:1; cursor:pointer;
    color:var(--ink); display:inline-flex; align-items:center; justify-content:center;
  }
  .mnav__list{display:flex; flex-direction:column; padding:12px 0; flex:1;}
  .mnav__list a{
    display:flex; align-items:center; gap:18px;
    padding:18px 24px; text-decoration:none; color:var(--ink);
    font-family:var(--display); font-size:26px; font-weight:400;
    border-bottom:1px solid var(--line);
    transition:background .15s ease;
  }
  .mnav__list a:hover{background:var(--bg-2);}
  .mnav__num{
    font-family:var(--mono); font-size:11px; color:var(--accent);
    letter-spacing:0.15em; min-width:28px;
  }
  .mnav__foot{
    padding:24px; border-top:1px solid var(--line);
    display:flex; flex-direction:column; gap:14px;
    background:var(--bg-2); flex-shrink:0;
  }
  .mnav__foot .nav-phone{font-size:18px; font-family:var(--mono); text-align:center; color:var(--ink); text-decoration:none;}

  /* ===== ARCH ANIMATED VISUAL ===== */
  .arch-vis--anim{display:flex; flex-direction:column; gap:16px;}
  .arch-stage{
    position:relative; width:100%; aspect-ratio:8/9;
    overflow:hidden; background:#0b0a08;
    outline:1px solid var(--line); outline-offset:-1px;
  }
  .arch-svg{position:absolute; inset:0; width:100%; height:100%; display:block;}
  .arch-beam{
    position:absolute; inset:0; pointer-events:none;
    background: linear-gradient(115deg, transparent 30%, rgba(246,233,203,0.12) 48%, rgba(246,233,203,0.18) 52%, transparent 72%);
    animation: archBeam 9s ease-in-out infinite;
    mix-blend-mode: screen;
  }
  @keyframes archBeam{
    0%, 100%{transform: translateX(-40%);}
    50%{transform: translateX(40%);}
  }
  .arch-grain{
    position:absolute; inset:0; pointer-events:none; opacity:0.06;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence baseFrequency='0.9' numOctaves='2'/></filter><rect width='120' height='120' filter='url(%23n)'/></svg>");
    mix-blend-mode: overlay;
  }
  .arch-slab{animation: archSlab 1.6s cubic-bezier(.2,.7,.2,1) both;}
  .arch-slab-a{animation-delay:0.15s; transform-origin:left bottom;}
  .arch-slab-b{animation-delay:0.35s; transform-origin:right bottom;}
  @keyframes archSlab{
    from{opacity:0; transform: translateY(40px) scale(0.98);}
    to{opacity:1; transform:none;}
  }
  .arch-brass{animation: archBrass 1.2s ease-out 0.9s both; transform-origin:top;}
  @keyframes archBrass{from{transform: scaleY(0); opacity:0;} to{transform: scaleY(1); opacity:1;}}
  .arch-sun{animation: archSunPulse 6s ease-in-out infinite;}
  .arch-sun2{animation: archSunPulse 6s ease-in-out infinite; animation-delay:.3s;}
  @keyframes archSunPulse{
    0%,100%{opacity:0.35; transform:translateY(0);}
    50%{opacity:0.6; transform:translateY(-6px);}
  }
  .arch-dim{opacity:0; animation: archFade 1s ease-out 1.4s both;}
  .arch-dim-v{animation-delay:1.6s;}
  .arch-label{opacity:0; animation: archFade 1.2s ease-out 1.9s both;}
  @keyframes archFade{from{opacity:0; transform: translateY(8px);} to{opacity:1; transform:none;}}
  .arch-lights .lit{animation: litBlink 4s ease-in-out infinite both;}
  .lit-1{animation-delay:2.2s;} .lit-2{animation-delay:2.6s;} .lit-3{animation-delay:3.0s;}
  .lit-4{animation-delay:3.3s;} .lit-5{animation-delay:3.6s;} .lit-6{animation-delay:3.9s;}
  .lit-7{animation-delay:4.2s;} .lit-8{animation-delay:4.5s;}
  @keyframes litBlink{
    0%{opacity:0;}
    15%{opacity:0.55;}
    50%{opacity:0.78;}
    75%{opacity:0.6;}
    100%{opacity:0.55;}
  }
  .arch-chips{display:flex; flex-wrap:wrap; gap:10px; padding-top:4px;}
  .arch-chip{
    display:inline-flex; align-items:center; gap:8px;
    padding:8px 14px; border:1px solid var(--line-2); background:var(--paper);
    font-family:var(--mono); font-size:11px; letter-spacing:0.15em; color:var(--ink-2);
  }
  .arch-chip__dot{width:8px; height:8px; border-radius:50%; background:#b79a6f;}
  .arch-chip__dot--brass{background:#c9a05a;}
  .arch-chip__dot--glass{background:#3a3226; outline:1px solid #c7bda8;}

  /* ===== RESPONSIVE ===== */
  @media (max-width: 960px){
    .nav-links{display:none;}
    .nav-phone{display:none;}
    .burger{display:inline-flex;}
    .hero{grid-template-columns:1fr;}
    .hero__visual{min-height:min(60vh, 520px); border-right:none; border-bottom:1px solid var(--line);}
    .arch-grid{grid-template-columns:1fr !important;}
    .concept-grid{grid-template-columns:1fr !important;}
    .loc-wrap{grid-template-columns:1fr !important;}
    .dev-grid{grid-template-columns:1fr !important;}
    .final-grid{grid-template-columns:1fr !important;}
    .cta-banner__inner{grid-template-columns:1fr !important;}
  }

  @media (max-width: 640px){
    :root{--gut: 18px;}
    .nav-right .btn--sm{display:none;}
    .row2{grid-template-columns:1fr;}
    .hv-muse{width:68%; top:6%;}
    .apts-grid{grid-template-columns:1fr !important;}
    .infra-grid{grid-template-columns:1fr !important;}
    .dev-stats{grid-template-columns:repeat(2,1fr) !important;}
    .nums-grid{grid-template-columns:repeat(2,1fr) !important;}
    .mobile-cta{display:grid;}
    body{padding-bottom:76px;}
    .gal-slide{flex-basis:86vw;}
    .gallery__head{align-items:flex-start; flex-direction:column;}
    .gallery__nav{order:2;}
    .strip-inner{grid-template-columns:1fr !important; gap:10px;}
    .hv-mark{font-size:9px;}
    .hv-mark--tl{top:14px; left:14px;}
    .hv-mark--tr{top:14px; right:14px;}
    .hv-corner{left:14px; bottom:86px;}
    .hv-chip{top:46px; right:14px;}
    .hv-meta{font-size:10px;}
    .hv-meta > div{padding:10px 12px;}
    .hero__form{padding:32px 18px;}
    h1.hero__title, .hero__title{font-size:clamp(36px, 9vw, 56px) !important; line-height:1.05;}
    .foot-grid{grid-template-columns:1fr !important;}
    .mobile-cta{z-index:40;}
    .mnav__list a{font-size:22px;}
    .popup{width:calc(100vw - 36px); max-width:420px;}
    .final-form, .cta-banner__form, .hero-form{padding:0;}
    .arch-chips{justify-content:center;}
  }

  @media (max-width: 420px){
    .hv-mark--tr span:first-child{display:none;}
    .hv-meta{grid-template-columns:repeat(3,1fr); font-size:9px;}
    .hv-meta > div{padding:8px 8px;}
    .section-num{font-size:11px !important;}
  }

  /* ===== intl-tel-input — match landing design ===== */
  .iti{ width:100%; display:block; font-family:var(--sans); }
  .iti__tel-input, .iti input[type=tel]{ width:100%; }
  .iti__dropdown-content{ z-index:200 !important; }
  .iti__country-list{ font-family:var(--sans); font-size:14px; color:var(--ink); }
  .iti__country{ padding:8px 12px; }
  .iti__search-input{ font-family:var(--sans); padding:10px 12px; }
  /* Light field contexts — the flag button sits flush with the input border */
  .field .iti__country-container,
  .field .iti__selected-country,
  .final-form .iti__country-container,
  .final-form .iti__selected-country,
  .faq-inline .iti__country-container,
  .faq-inline .iti__selected-country,
  .apt__form .iti__country-container,
  .apt__form .iti__selected-country{
    background:var(--bg);
  }
  .field .iti input[type=tel]{ padding-left:12px; }
  /* Dark strip */
  .strip-inner .iti{ border-right:1px solid #2f2c28; }
  .strip-inner .iti input[type=tel]{ border-right:0; background:transparent; color:var(--paper); }
  .strip-inner .iti__country-container,
  .strip-inner .iti__selected-country{ background:transparent; color:var(--paper); }
  .strip-inner .iti__selected-country:hover,
  .strip-inner .iti__selected-country-primary:hover{ background:rgba(251,249,244,0.06); }
  .strip-inner .iti__selected-dial-code,
  .strip-inner .iti__dial-code{ color:rgba(251,249,244,0.85); }
  .strip-inner .iti__arrow{ border-top-color:rgba(251,249,244,0.6); }
  /* Dark CTA banner */
  .cta-banner__form .iti__country-container,
  .cta-banner__form .iti__selected-country{ background:rgba(251,249,244,0.05); color:var(--paper); }
  .cta-banner__form .iti__selected-country:hover,
  .cta-banner__form .iti__selected-country-primary:hover{ background:rgba(251,249,244,0.1); }
  .cta-banner__form .iti__selected-dial-code,
  .cta-banner__form .iti__dial-code{ color:rgba(251,249,244,0.85); }
  .cta-banner__form .iti__arrow{ border-top-color:rgba(251,249,244,0.6); }
  .cta-banner__form .iti input[type=tel]{ background:rgba(251,249,244,0.05); color:var(--paper); }
  /* Faq inline: grid column swap — .iti div replaces the raw input as a grid item */
  .faq-inline .iti{ min-width:0; }
  /* Focus state matches .field input:focus */
  .iti:focus-within input[type=tel]{ border-color:var(--ink); }

  /* ===== Mobile polish — 640 / 380 ===== */
  html, body{ overflow-x:clip; }
  @supports not (overflow-x: clip){ html, body{ overflow-x:hidden; } }

  @media (max-width: 640px){
    /* Header — brand must not shove burger off-screen */
    .nav{ padding:14px 0; gap:10px; }
    .brand{ font-size:15px; letter-spacing:0.05em; gap:10px; min-width:0; overflow:hidden; }
    .brand .mark{ width:30px; height:30px; font-size:14px; flex-shrink:0; }
    .brand > span:last-child{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }

    /* Section rhythm */
    section{ padding:56px 0; }
    .section-head{ margin-bottom:30px; gap:10px; }
    .section-head h2{ font-size:clamp(28px, 7.5vw, 42px) !important; line-height:1.08; margin:8px 0 0 !important; }
    .section-num{ margin-bottom:14px; }

    /* Numbers — cleaner fit at 2 cols */
    .num{ padding:24px 16px; }
    .num__val{ font-size:44px; }
    .num__label{ margin-top:10px; font-size:10px; }

    /* Concept / Location / Architecture / Infrastructure — un-suffocate cards */
    .concept-grid{ gap:14px; }
    .concept-card{ padding:26px 20px; }
    .concept-card h3{ font-size:22px; margin:10px 0 8px; }
    .loc-wrap{ margin-top:0; }
    .loc-map{ min-height:300px; }
    .loc-info{ padding:26px 20px; }
    .loc-info h3{ font-size:22px; margin:10px 0 14px; }
    .loc-list li{ padding:12px 0; font-size:13px; }
    .arch-item{ padding:22px 18px; }
    .arch-item h4{ font-size:20px; }
    .infra-cell{ padding:22px 18px; }
    .infra-cell h4{ font-size:20px; margin:10px 0 6px; }

    /* Apartments */
    .apts-grid{ gap:14px; }
    .apt__body{ padding:22px 20px; gap:8px; }
    .apt__title{ font-size:22px; }
    .apt__specs{ gap:10px; font-size:10px; padding:6px 0; flex-wrap:wrap; row-gap:4px; }
    .apt__price{ font-size:18px; padding-top:10px; }
    .apt__cta{ padding-top:12px; }

    /* CTA banner — restore form padding that the old rule had zeroed */
    .cta-banner__inner{ padding:60px 18px 66px !important; gap:28px; }
    .cta-banner__title{ font-size:clamp(28px, 8.5vw, 46px) !important; margin:12px 0 14px; }
    .cta-banner__form{ padding:22px 18px !important; gap:12px; }

    /* Developer */
    .dev-stats{ margin-top:18px; }
    .dev-stat{ padding:18px 14px; }
    .dev-stat__val{ font-size:30px; }
    .dev-stat__lbl{ margin-top:8px; font-size:9px; }

    /* FAQ */
    .faq-item{ padding:18px 0; }
    .faq-q{ font-size:18px; gap:12px; line-height:1.28; }
    .faq-inline{ grid-template-columns:1fr !important; padding:16px !important; gap:10px; margin-top:14px; }
    .faq-inline .t{ font-size:15px; }

    /* Final form */
    .final-form{ padding:24px 20px !important; gap:12px; }
    .final-info{ gap:12px; margin-top:18px; }
    .final-info__row{ padding:12px 0; }
    .final-info__v{ font-size:18px; }

    /* Footer */
    footer{ padding:40px 0 28px; }
    footer .foot-grid{ gap:26px; }

    /* Mobile CTA — 44px tap target */
    .mobile-cta{ padding:10px 12px; gap:10px; }
    .mobile-cta .btn{ padding:14px 10px; font-size:14px; min-height:44px; }

    /* Popup — less cramped, bigger close */
    .popup{ padding:26px 20px; }
    .popup h3{ font-size:22px !important; margin:10px 0 10px !important; }
    .popup__close{ width:40px; height:40px; }

    /* Hero overlays — tidier */
    .hv-mark{ font-size:9px; letter-spacing:0.14em; max-width:48%; }
    .hv-mark .hv-tick{ width:14px; }
    .hv-chip{ padding:6px 10px; font-size:9px; letter-spacing:0.08em; max-width:46%; }
    .hv-corner{ font-size:9px; letter-spacing:0.12em; max-width:64%; }

    /* Gallery */
    .gallery{ padding:56px 0 40px; }
    .gallery__track-wrap{ margin:22px 0 26px; }
    .gal-slide figcaption{ padding:10px 14px; font-size:11px; }

    /* Field inputs — slightly tighter */
    .field input, .field select{ padding:12px 14px; font-size:15px; }
  }

  @media (max-width: 380px){
    :root{ --gut:14px; }
    .brand{ font-size:13px; letter-spacing:0.03em; }
    .brand .mark{ width:26px; height:26px; font-size:12px; }

    h1.hero__title, .hero__title{ font-size:30px !important; line-height:1.06; }
    .hero__sub{ font-size:14px; margin-bottom:20px; }
    .section-head h2{ font-size:24px !important; }
    .cta-banner__title{ font-size:26px !important; }

    .num__val{ font-size:36px; }
    .num{ padding:20px 12px; }
    .num__label{ font-size:9px; letter-spacing:0.1em; }

    .concept-card, .loc-info, .arch-item, .infra-cell{ padding:20px 16px; }
    .apt__body{ padding:18px 16px; }
    .apt__title, .concept-card h3, .loc-info h3, .arch-item h4, .infra-cell h4{ font-size:19px; }
    .apt__price{ font-size:17px; }

    .dev-stat__val{ font-size:24px; }
    .dev-stat{ padding:14px 10px; }
    .dev-stat__lbl{ font-size:8px; letter-spacing:0.1em; }

    .faq-q{ font-size:16px; line-height:1.25; }
    .faq-q::after{ font-size:18px; }

    /* Hero — drop the least essential overlay to free space for МУЗА */
    .hv-corner{ display:none; }
    .hv-chip{ top:38px; padding:5px 8px; font-size:8.5px; }
    .hv-mark{ font-size:8.5px; letter-spacing:0.1em; }
    .hv-meta{ font-size:8px; }
    .hv-meta > div{ padding:6px 5px; gap:2px; }
    .hv-meta span:first-child{ letter-spacing:0.08em; }

    /* Gallery smaller controls */
    .gal-btn{ width:38px; height:38px; }
    .gal-counter{ min-width:56px; font-size:11px; }

    /* Mobile CTA still readable */
    .mobile-cta .btn{ font-size:13px; padding:12px 8px; }

    /* Forms even tighter */
    .cta-banner__form{ padding:18px 14px !important; }
    .final-form{ padding:20px 16px !important; }
    .popup{ padding:22px 16px; }
    .popup h3{ font-size:20px !important; }

    /* intl-tel-input — shrink flag button so input keeps usable width */
    .iti__selected-country{ padding:0 6px; }
    .iti__selected-dial-code{ font-size:13px; }
  }

  /* ===== Selects — match input look, custom chevron ===== */
  .field select{
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    padding:14px 40px 14px 14px;
    background-color:var(--bg);
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1.5L6 6.5L11 1.5' fill='none' stroke='%2375706a' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
    background-repeat:no-repeat;
    background-position:right 14px center;
    background-size:12px 8px;
    cursor:pointer;
    line-height:1.3;
  }
  .field select::-ms-expand{ display:none; }
  .field select:focus{ border-color:var(--ink); }
  .cta-banner__form .field select{
    background-color:rgba(251,249,244,0.05);
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1.5L6 6.5L11 1.5' fill='none' stroke='%23fbf9f4' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  }
  .field select option{
    background:var(--paper);
    color:var(--ink);
    font-family:var(--sans);
  }

  /* ===== Online dot — soft green pulse for "МЫ В СЕТИ" ===== */
  .online-dot{
    position:relative;
    display:inline-block;
    width:7px; height:7px; border-radius:50%;
    background:#3dc76a;
    box-shadow: 0 0 6px rgba(61,199,106,0.55);
    flex-shrink:0;
  }
  .online-dot::after{
    content:""; position:absolute; inset:0; border-radius:50%;
    background:rgba(61,199,106,0.5);
    animation: onlineRing 2.4s cubic-bezier(.22,.61,.36,1) infinite;
    z-index:-1;
  }
  @keyframes onlineRing{
    0%{ transform:scale(1); opacity:0.55; }
    70%{ transform:scale(2.8); opacity:0; }
    100%{ transform:scale(2.8); opacity:0; }
  }

  /* ===== Hero chip — shift on mobile so it doesn't collide with МУЗА ===== */
  @media (max-width: 640px){
    .hv-chip{
      top:auto !important; bottom:128px; right:14px;
    }
  }
  @media (max-width: 380px){
    .hv-chip{ bottom:118px; }
  }

  /* ===== Architecture block — fix caption/chips overlap ===== */
  .arch-vis.arch-vis--anim{
    aspect-ratio:auto;
    overflow:visible;
    background:transparent;
    border:none;
  }
  .arch-vis.arch-vis--anim::after{ content:none; }
  .arch-stage::after{
    content:"Фрагмент — деталь фасада";
    position:absolute; bottom:14px; left:14px;
    font-family:var(--mono); font-size:10px; letter-spacing:0.18em;
    color:rgba(251,249,244,0.9);
    background:rgba(10,9,8,0.62);
    padding:6px 10px;
    backdrop-filter:blur(4px);
    z-index:3;
    max-width: calc(100% - 28px);
    pointer-events:none;
  }
  .arch-chips{ padding-top:6px; row-gap:10px; }
  @media (max-width: 640px){
    .arch-vis--anim{ gap:14px; }
    .arch-chips{ gap:8px; row-gap:8px; justify-content:flex-start; padding-top:4px; }
    .arch-chip{ padding:7px 12px; font-size:10px; letter-spacing:0.12em; }
    .arch-stage::after{ font-size:9px; letter-spacing:0.15em; bottom:12px; left:12px; padding:5px 9px; }
  }
  @media (max-width: 380px){
    .arch-chips{ justify-content:center; }
    .arch-chip{ padding:6px 10px; font-size:9.5px; }
  }

  /* ===== Strip form — select styled like input, dark theme ===== */
  .strip-inner select{
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    padding:24px 44px 24px 28px;
    background-color:transparent;
    color:var(--paper);
    border:none;
    border-right:1px solid #2f2c28;
    font-size:15px;
    outline:none;
    font-family:var(--sans);
    cursor:pointer;
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1.5L6 6.5L11 1.5' fill='none' stroke='%23fbf9f4' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
    background-repeat:no-repeat;
    background-position:right 18px center;
    background-size:12px 8px;
  }
  .strip-inner select::-ms-expand{ display:none; }
  .strip-inner select option{
    background:var(--ink); color:var(--paper); font-family:var(--sans);
  }

  /* ===== Strip form — phone: flag, dial code, placeholder all on one line ===== */
  .strip-inner .iti{
    display:block;
    height:100%;
    border-right:1px solid #2f2c28;
  }
  .strip-inner .iti__country-container{
    top:0; bottom:0; left:0;
    background:transparent !important;
    border-right:1px solid rgba(251,249,244,0.1);
  }
  .strip-inner .iti__selected-country{
    display:flex;
    align-items:center;
    height:100%;
    padding-left:18px !important;
    padding-right:14px !important;
    background:transparent !important;
    color:var(--paper);
  }
  .strip-inner .iti__selected-country:hover,
  .strip-inner .iti__selected-country-primary:hover{
    background:rgba(251,249,244,0.06) !important;
  }
  .strip-inner .iti__selected-dial-code{
    color:rgba(251,249,244,0.9) !important;
    margin-left:6px;
  }
  .strip-inner .iti input[type=tel]{
    background:transparent;
    color:var(--paper);
    border:none;
    width:100%;
    height:100%;
	padding-left:128px !important;
  }
  .strip-inner .iti input[type=tel]::placeholder{
    color:rgba(251,249,244,0.42);
  }

  /* Strip form — vertical stacked at ≤1024 */
  @media (max-width: 1024px){
    .strip-inner .iti{ border-right:none; border-bottom:1px solid #2f2c28; }
    .strip-inner select{ border-right:none; border-bottom:1px solid #2f2c28; width:100%; }
  }

  /* ===== Lazy backgrounds (IntersectionObserver hydrates [data-bg]) ===== */
  [data-bg]{ background-image: none; }
  [data-bg].bg-loaded{ background-image: var(--bg-image); }

  /* ===== Defer heavy below-fold animations (.arch-stage) ===== */
  /* Paused until IntersectionObserver adds .is-active on the stage */
  .arch-stage:not(.is-active) .arch-slab,
  .arch-stage:not(.is-active) .arch-brass,
  .arch-stage:not(.is-active) .arch-sun,
  .arch-stage:not(.is-active) .arch-sun2,
  .arch-stage:not(.is-active) .arch-dim,
  .arch-stage:not(.is-active) .arch-label,
  .arch-stage:not(.is-active) .arch-lights .lit,
  .arch-stage:not(.is-active) .arch-beam{
    animation-play-state: paused !important;
  }
  /* The grain texture is rendered via data:URL — hold its paint until active too */
  .arch-stage:not(.is-active) .arch-grain{ opacity:0; }
  .arch-stage.is-active .arch-grain{ opacity:0.06; transition: opacity .6s ease; }