:root {
      --ink: #0E1A1F;
      --ink-2: #13242A;
      --slate: #1F3B43;
      --limestone: #EFE9DF;
      --limestone-2: #F6F2EA;
      --bronze: #B08D57;
      --bronze-soft: #C9A971;
      --line: rgba(176, 141, 87, 0.28);
      --mute: rgba(239, 233, 223, 0.62)
    }

    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box
    }

    html {
      scroll-behavior: smooth
    }

    body {
      background: var(--ink);
      color: var(--limestone);
      font-family: 'Inter', sans-serif;
      font-weight: 300;
      line-height: 1.6;
      -webkit-font-smoothing: antialiased;
      overflow-x: hidden
    }

    .wrap {
      max-width: 1180px;
      margin: 0 auto;
      padding: 0 28px;
      /* margin-bottom: -200px; */
    }
        .wrap1 {
      max-width: 1180px;
      margin: 0 auto;
      /* padding: 0 28px; */
      /* margin-bottom: -200px; */
    }

    .serif {
      font-family: 'Cormorant Garamond', serif
    }

    .eyebrow {
      font-size: 11px;
      font-weight: 600;
      letter-spacing: .32em;
      text-transform: uppercase;
      color: var(--bronze-soft)
    }

    img {
      display: block;
      max-width: 100%
    }

    #curtain {
      position: fixed;
      inset: 0;
      z-index: 9999;
      background: var(--ink);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-direction: column;
      transition: opacity .9s ease, visibility .9s
    }

    #curtain.gone {
      opacity: 0;
      visibility: hidden
    }

    .cur-mark {
      width: 60px;
      height: 60px;
      border: 1px solid var(--bronze);
      display: grid;
      place-items: center;
      font-family: 'Cormorant Garamond', serif;
      font-size: 34px;
      color: var(--bronze-soft);
      opacity: 0;
      transform: scale(.85);
      animation: curIn 1s .15s forwards
    }
.about-section{
    padding:120px 0;
    font-family: 'Cormorant Garamond', serif;
    background:#f7f8fa;
    overflow:hidden;
}

.container{
    width:90%;
    max-width:1300px;
    margin:auto;
}

.about-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:80px;
    align-items:center;
}

.about-image{
    position:relative;
}

.about-image img{
    width:100%;
    height:600px;
    object-fit:cover;
    /* border-radius:20px; */
    display:block;
}

.about-content h2{
    font-size:45px;
    line-height:1.1;
    color:#111;
    margin:15px 0 25px;
    font-weight:700;
}

.about-tag{
    display:inline-block;
    padding:10px 18px;
    background:#111;
    color:#fff;
    border-radius:50px;
    font-size:13px;
    letter-spacing:2px;
}

.about-content p{
    color:#555;
    font-size:17px;
    line-height:1.9;
    margin-bottom:18px;
}

.about-content .lead{
    font-size: 14px;
    color: rgba(14, 26, 31, 0.7);
    font-weight: 400;
    font-family: 'Inter', sans-serif;


}

.about-btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    text-decoration:none;
    background:#111;
    color:#fff;
    padding:18px 32px;
    border-radius:60px;
    font-weight:600;
    transition:.3s;
}

.about-btn:hover{
    transform:translateY(-3px);
}

@media(max-width:992px){

    .about-grid{
        grid-template-columns:1fr;
        gap:50px;
    }

    .about-image img{
        height:500px;
    }

    .about-content h2{
        font-size:42px;
    }
}

@media(max-width:768px){

    .about-section{
        padding:80px 0;
    }

    .broch-inner {
      position: relative;
      z-index: 2;
      padding: 84px 20px !important
    }
    .about-content h2{
        font-size:34px;
    }

    .stats{
        grid-template-columns:1fr;
    }

    .about-image img{
        height:350px;
    }
}






    .top-section{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:60px;
    margin-bottom:60px;
}

.top-content{
    flex:1;
}

.top-image{
    flex:1;
    text-align:right;
}

.top-image img{
    width:100%;
    max-width:500px;
    border-radius:20px;
    display:block;
    margin-left:auto;
}

@media(max-width:768px){
    .top-section{
        flex-direction:column;
        text-align:center;
    }

    .top-image{
        text-align:center;
    }

    .top-image img{
        margin:auto;
    }
}

    .cur-line {
      margin-top: 22px;
      font-size: 10px;
      letter-spacing: .4em;
      text-transform: uppercase;
      color: var(--mute);
      opacity: 0;
      animation: curIn 1s .5s forwards
    }

    .cur-bar {
      margin-top: 20px;
      width: 120px;
      height: 1px;
      background: var(--line);
      position: relative;
      overflow: hidden;
      opacity: 0;
      animation: curIn .6s .6s forwards
    }

    .cur-bar::after {
      content: "";
      position: absolute;
      inset: 0;
      background: var(--bronze-soft);
      transform: translateX(-100%);
      animation: load 1.4s .6s forwards
    }

    @keyframes curIn {
      to {
        opacity: 1;
        transform: scale(1)
      }
    }

    @keyframes load {
      to {
        transform: translateX(0)
      }
    }

    nav {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 90;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 18px 28px;
      background: rgba(14, 26, 31, 0);
      transition: background .4s, padding .4s, border-color .4s;
      border-bottom: 1px solid transparent
    }

    nav.scrolled {
      background: rgba(14, 26, 31, 0.92);
      backdrop-filter: blur(14px);
      padding: 12px 28px;
      border-bottom: 1px solid var(--line)
    }

    .brand {
      display: flex;
      align-items: center;
      gap: 11px
    }

    .brand-mark {
      width: 34px;
      height: 34px;
      border: 1px solid var(--bronze);
      display: grid;
      place-items: center;
      font-family: 'Cormorant Garamond', serif;
      font-size: 20px;
      color: var(--bronze-soft)
    }

    .brand-name {
      font-size: 13px;
      letter-spacing: .22em;
      font-weight: 500;
      text-transform: uppercase
    }

    .brand-name small {
      display: block;
      font-size: 9px;
      letter-spacing: .3em;
      color: var(--mute);
      margin-top: 2px
    }

    .nav-cta {
      font-size: 12px;
      font-weight: 600;
      letter-spacing: .08em;
      color: var(--ink);
      background: var(--bronze);
      padding: 9px 18px;
      border-radius: 2px;
      text-decoration: none;
      transition: background .3s
    }

    .nav-cta:hover {
      background: var(--bronze-soft)
    }

    @media(max-width:640px) {
      .nav-cta {
        display: none
      }
    }

    .hero {
      position: relative;
      min-height: 100svh;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      padding: 120px 0 70px;
      overflow: hidden
    }

    .hero-img {
      position: absolute;
      inset: 0;
      z-index: 0;
      overflow: hidden
    }

    .hero-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transform: scale(1.12);
      animation: heroZoom 9s ease-out forwards
    }

    @keyframes heroZoom {
      to {
        transform: scale(1)
      }
    }

    .hero-img::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(11, 20, 24, 0.55) 0%, rgba(11, 20, 24, 0.22) 40%, rgba(11, 20, 24, 0.88) 100%)
    }

    .hero-inner {
      position: relative;
      z-index: 2
    }

    .hero .eyebrow {
      margin-bottom: 22px
    }

    .hero h1 {
      font-family: 'Cormorant Garamond', serif;
      font-weight: 400;
      font-size: clamp(44px, 7.5vw, 98px);
      line-height: .98;
      letter-spacing: -.01em;
      max-width: 14ch
    }

    .hero h1 em {
      font-style: italic;
      color: var(--bronze-soft)
    }

    .hero h1 .ln {
      display: block;
      overflow: hidden
    }

    .hero h1 .ln span {
      display: block;
      transform: translateY(110%);
      animation: lineUp .9s cubic-bezier(.2, .8, .2, 1) forwards
    }

    .ld .hero h1 .ln:nth-child(1) span {
      animation-delay: .15s
    }

    .ld .hero h1 .ln:nth-child(2) span {
      animation-delay: .28s
    }

    .ld .hero h1 .ln:nth-child(3) span {
      animation-delay: .41s
    }

    @keyframes lineUp {
      to {
        transform: translateY(0)
      }
    }

    .hero-sub,
    .hero-cta,
    .hero-meta {
      opacity: 0
    }

    .ld .hero-sub {
      animation: fadeUp .8s .7s forwards
    }

    .ld .hero-cta {
      animation: fadeUp .8s .85s forwards
    }

    .ld .hero-meta {
      animation: fadeUp .8s 1s forwards
    }

    @keyframes fadeUp {
      from {
        opacity: 0;
        transform: translateY(20px)
      }

      to {
        opacity: 1;
        transform: none
      }
    }

    .hero-sub {
      margin-top: 26px;
      max-width: 48ch;
      font-size: clamp(15px, 1.5vw, 18px);
      font-weight: 300;
      color: rgba(239, 233, 223, 0.88)
    }

    .hero-cta {
      margin-top: 34px;
      display: flex;
      flex-wrap: wrap;
      gap: 14px
    }

    .btn {
      font-size: 13px;
      font-weight: 600;
      letter-spacing: .08em;
      padding: 15px 26px;
      border-radius: 2px;
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      gap: 9px;
      transition: .3s;
      cursor: pointer;
      border: none
    }

    .btn-gold {
      background: var(--bronze);
      color: var(--ink)
    }

    .btn-gold:hover {
      background: var(--bronze-soft);
      transform: translateY(-2px)
    }

    .btn-wa {
      background: #1faa54;
      color: #fff
    }

    .btn-wa:hover {
      background: #25c264;
      transform: translateY(-2px)
    }

    .btn-ghost {
      background: rgba(239, 233, 223, 0.06);
      color: var(--limestone);
      border: 1px solid var(--line)
    }

    .btn-ghost:hover {
      background: rgba(239, 233, 223, 0.12)
    }

    .hero-meta {
      margin-top: 42px;
      display: flex;
      flex-wrap: wrap;
      gap: 34px;
      padding-top: 26px;
      border-top: 1px solid var(--line);
      max-width: 660px
    }

    .hero-meta .val {
      font-family: 'Cormorant Garamond', serif;
      font-size: 30px;
      color: var(--limestone);
      line-height: 1;
      display: block
    }

    .hero-meta .lbl {
      font-size: 10.5px;
      letter-spacing: .16em;
      text-transform: uppercase;
      color: var(--mute);
      margin-top: 8px;
      display: block
    }

    .thesis {
      background: var(--limestone);
      color: var(--ink);
      padding: 90px 0
    }

    .thesis .eyebrow {
      color: var(--bronze)
    }

    .thesis-q {
      font-family: 'Cormorant Garamond', serif;
      font-weight: 400;
      font-size: clamp(28px, 4vw, 52px);
      line-height: 1.12;
      letter-spacing: -.01em;
      max-width: 18ch;
      margin-top: 22px
    }

    .thesis-q em {
      font-style: italic;
      color: var(--bronze)
    }

    .thesis-row {
      margin-top: 54px;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      border-top: 1px solid rgba(14, 26, 31, 0.12)
    }

    .thesis-cell {
      padding: 30px 26px 30px 0;
      border-right: 1px solid rgba(14, 26, 31, 0.12)
    }

    .thesis-cell:last-child {
      border-right: none;
      padding-right: 0
    }

    .thesis-cell h3 {
      font-family: 'Cormorant Garamond', serif;
      font-weight: 600;
      font-size: 21px;
      margin-bottom: 8px
    }

    .thesis-cell p {
      font-size: 14px;
      color: rgba(14, 26, 31, 0.7);
      font-weight: 400
    }

    @media(max-width:760px) {
      .thesis-row {
        grid-template-columns: 1fr
      }

      .thesis-cell {
        border-right: none;
        border-bottom: 1px solid rgba(14, 26, 31, 0.12);
        padding-right: 0
      }

      .thesis-cell:last-child {
        border-bottom: none
      }
    }

    .feature {
      position: relative
    }

    .feat-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      min-height: 560px
    }

    .feat-grid.rev .feat-text {
      order: 2
    }

    .feat-img {
      position: relative;
      overflow: hidden
    }

    .feat-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 1.2s ease
    }

    .feature:hover .feat-img img {
      transform: scale(1.05)
    }

    .feat-text {
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 72px 64px;
      background: var(--ink-2)
    }

    .feat-text.dark {
      background: var(--ink)
    }

    .feat-text .eyebrow {
      margin-bottom: 16px
    }

    .feat-text h2 {
      font-family: 'Cormorant Garamond', serif;
      font-weight: 400;
      font-size: clamp(28px, 3.6vw, 46px);
      line-height: 1.05;
      margin-bottom: 18px
    }

    .feat-text h2 em {
      font-style: italic;
      color: var(--bronze-soft)
    }

    .feat-text p {
      color: var(--mute);
      font-size: 15px;
      max-width: 42ch;
      margin-bottom: 14px
    }

    .feat-stat {
      margin-top: 18px;
      display: flex;
      gap: 30px
    }

    .feat-stat .n {
      font-family: 'Cormorant Garamond', serif;
      font-size: 38px;
      color: var(--bronze-soft);
      line-height: 1
    }

    .feat-stat .l {
      font-size: 11px;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--mute);
      margin-top: 6px
    }

    @media(max-width:860px) {
      .feat-grid {
        grid-template-columns: 1fr
      }

      .feat-grid.rev .feat-text {
        order: 0
      }

      .feat-img {
        min-height: 340px
      }

      .feat-text {
        padding: 54px 30px
      }
    }

    .stats {
      padding: 90px 0;
      background: var(--slate)
    }

    .stats .eyebrow {
      margin-bottom: 14px
    }

    .stats-head {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(26px, 3.5vw, 40px);
      font-weight: 400;
      max-width: 22ch;
      margin-bottom: 54px
    }

    .stats-head em {
      font-style: italic;
      color: var(--bronze-soft)
    }

    .statblock {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 1px;
      background: var(--line);
      border: 1px solid var(--line)
    }

    .stat {
      background: var(--slate);
      padding: 36px 24px
    }

    .stat .n {
      font-family: 'Cormorant Garamond', serif;
      font-weight: 500;
      font-size: clamp(46px, 5.5vw, 72px);
      line-height: .9;
      color: var(--bronze-soft);
      letter-spacing: -.02em
    }

    .stat .n small {
      font-size: .4em;
      color: var(--limestone);
      font-style: italic
    }

    .stat .c {
      margin-top: 14px;
      font-size: 13px;
      font-weight: 400;
      color: rgba(239, 233, 223, 0.72);
      /* max-width: 22ch */
    }

   small {
    
      color: var(--bronze-soft) !important;
      /* max-width: 22ch */
    }


    @media(max-width:860px) {
      .statblock {
        grid-template-columns: repeat(2, 1fr)
      }
    }

    .gal {
      padding: 90px 0;
      background: var(--ink)
    }

    .gal .eyebrow {
      margin-bottom: 14px
    }

    .gal-head {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(28px, 4vw, 48px);
      font-weight: 400;
      margin-bottom: 8px
    }

    .gal-head em {
      font-style: italic;
      color: var(--bronze-soft)
    }

    .gal-note {
      color: var(--mute);
      font-size: 15px;
      /* max-width: 80ch; */
      margin-bottom: 46px
    }

    .gal-grid {
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      grid-auto-rows: 200px;
      gap: 14px
    }

    .tile {
      position: relative;
      overflow: hidden;
      border: 1px solid var(--line)
    }

    .tile img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 1s ease
    }

    .tile:hover img {
      transform: scale(1.07)
    }

    .tile::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, transparent 50%, rgba(11, 20, 24, 0.82));
      transition: opacity .4s
    }

    .tile .cap {
      position: absolute;
      left: 18px;
      bottom: 16px;
      z-index: 2;
      font-family: 'Cormorant Garamond', serif;
      font-size: 19px;
      color: var(--limestone)
    }

    .tile .cap small {
      display: block;
      font-family: 'Inter', sans-serif;
      font-size: 10px;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: var(--bronze-soft);
      margin-bottom: 4px;
      font-weight: 600
    }

    .t-wide {
      grid-column: span 4;
      grid-row: span 2
    }

    .t-tall {
      grid-column: span 2;
      grid-row: span 2
    }

    .t-sq {
      grid-column: span 2;
      grid-row: span 1
    }

    .t-half {
      grid-column: span 3;
      grid-row: span 1
    }

    @media(max-width:860px) {
      .gal-grid {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 170px
      }

      .t-wide,
      .t-tall,
      .t-sq,
      .t-half {
        grid-column: span 2;
        grid-row: span 1
      }

      .t-wide {
        grid-row: span 2
      }
    }

    .place {
      padding: 90px 0;
      background: linear-gradient(180deg, #122229, #0E1A1F)
    }

    .place-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 60px;
      align-items: center
    }

    .place .eyebrow {
      margin-bottom: 14px
    }

    .place h2 {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(28px, 4vw, 46px);
      font-weight: 400;
      line-height: 1.05;
      margin-bottom: 20px
    }

    .place h2 em {
      font-style: italic;
      color: var(--bronze-soft)
    }

    .place p {
      color: var(--mute);
      font-size: 15px;
      margin-bottom: 22px;
      max-width: 44ch
    }

    .conn {
      border-top: 1px solid var(--line)
    }

    .conn-row {
      display: flex;
      justify-content: space-between;
      padding: 15px 0;
      border-bottom: 1px solid var(--line);
      font-size: 14px
    }

    .conn-row b {
      font-family: 'Cormorant Garamond', serif;
      font-size: 22px;
      font-weight: 500;
      color: var(--bronze-soft)
    }

    .place-visual {
      aspect-ratio: 4/5;
      border: 1px solid var(--line);
      overflow: hidden
    }

    .place-visual img {
      width: 100%;
      height: 100%;
      object-fit: cover
    }

    @media(max-width:760px) {
      .place-grid {
        grid-template-columns: 1fr;
        gap: 36px
      }
    }

    .broch {
      position: relative;
      overflow: hidden
    }

    .broch-img {
      position: absolute;
      inset: 0;
      z-index: 0
    }

    .broch-img img {
      width: 100%;
      height: 100%;
      object-fit: cover
    }

    .broch-img::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(90deg, rgba(11, 20, 24, 0.94) 30%, rgba(11, 20, 24, 0.5))
    }

    .broch-inner {
      position: relative;
      z-index: 2;
      padding: 84px 0
    }

    .broch .eyebrow {
      margin-bottom: 16px
    }

    .broch h2 {
      font-family: 'Cormorant Garamond', serif;
      font-weight: 400;
      font-size: clamp(28px, 4vw, 46px);
      line-height: 1.06;
      max-width: 18ch;
      margin-bottom: 18px
    }

    .broch h2 em {
      font-style: italic;
      color: var(--bronze-soft)
    }

    .broch p {
      color: rgba(239, 233, 223, 0.8);
      font-size: 15px;
      max-width: 44ch;
      margin-bottom: 28px
    }

    .lead {
      padding: 60px 15px;
      background: var(--limestone)
    }

    .lead-card {
      max-width: 940px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1fr 1fr;
      background: var(--ink);
      border: 1px solid var(--bronze)
    }

    .lead-left {
      padding: 48px 44px;
      border-right: 1px solid var(--line)
    }

    .lead-left .eyebrow {
      color: var(--bronze-soft);
      margin-bottom: 18px
    }

    .lead-left h2 {
      font-family: 'Cormorant Garamond', serif;
      font-weight: 400;
      font-size: 34px;
      line-height: 1.08;
      margin-bottom: 16px
    }

    .lead-left h2 em {
      font-style: italic;
      color: var(--bronze-soft)
    }

    .lead-left p {
      color: var(--mute);
      font-size: 14px;
      margin-bottom: 28px
    }

    .assure {
      list-style: none;
      border-top: 1px solid var(--line)
    }

    .assure li {
      padding: 13px 0;
      border-bottom: 1px solid var(--line);
      font-size: 13px;
      color: var(--limestone);
      display: flex;
      gap: 12px;
      align-items: center
    }

    .assure li::before {
      content: "—";
      color: var(--bronze)
    }

    .lead-form {
      padding: 20px;

      background: var(--ink-2)
    }

    .tabs {
      display: flex;
      margin-bottom: 26px;
      border: 1px solid var(--line);
      border-radius: 2px;
      overflow: hidden
    }

    .tab {
      flex: 1;
      padding: 12px;
      text-align: center;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: .06em;
      cursor: pointer;
      background: transparent;
      color: var(--mute);
      border: none;
      transition: .3s;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 7px
    }

    .tab.active {
      background: var(--bronze);
      color: var(--ink)
    }

    .tab.wa.active {
      background: #1faa54;
      color: #fff
    }

    .field {
      margin-bottom: 18px
    }

    .field label {
      display: block;
      font-size: 10px;
      letter-spacing: .16em;
      text-transform: uppercase;
      color: var(--mute);
      margin-bottom: 8px
    }

    .field input,
    .field select {
      width: 100%;
      background: transparent;
      border: none;
      border-bottom: 1px solid var(--line);
      color: var(--limestone);
      font-family: 'Inter', sans-serif;
      font-size: 15px;
      padding: 9px 0;
      outline: none;
      transition: border-color .3s
    }

    .field input::placeholder {
      color: rgba(239, 233, 223, 0.35)
    }

    .field input:focus,
    .field select:focus {
      border-color: var(--bronze-soft)
    }

    .field select option {
      background: var(--ink-2);
      color: var(--limestone)
    }

    .submit {
      width: 100%;
      margin-top: 10px;
      background: var(--bronze);
      color: var(--ink);
      border: none;
      padding: 15px;
      font-family: 'Inter', sans-serif;
      font-weight: 600;
      font-size: 13px;
      letter-spacing: .08em;
      text-transform: uppercase;
      cursor: pointer;
      transition: .3s;
      border-radius: 2px;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 9px
    }

    .submit:hover {
      background: var(--bronze-soft)
    }

    .submit:disabled {
      opacity: .6;
      cursor: not-allowed
    }

    .submit.wa {
      background: #1faa54;
      color: #fff
    }

    .submit.wa:hover {
      background: #25c264
    }

    .form-foot {
      margin-top: 16px;
      font-size: 11px;
      color: var(--mute);
      text-align: center;
      line-height: 1.5
    }

    .err {
      color: #e88;
      font-size: 12px;
      margin-top: 10px;
      display: none
    }

    .err.show {
      display: block
    }

    .wa-pane {
      display: none;
      text-align: center
    }

    .wa-pane.show {
      display: block
    }

    .wa-pane p {
      color: var(--mute);
      font-size: 14px;
      margin-bottom: 24px
    }

    .wa-ic {
      width: 54px;
      height: 54px;
      margin: 0 auto 18px;
      border-radius: 50%;
      background: #1faa54;
      display: grid;
      place-items: center
    }

    .msg {
      display: none;
      text-align: center;
      padding: 50px 20px
    }

    .msg.show {
      display: block
    }

    .msg .serif {
      font-size: 30px;
      color: var(--bronze-soft);
      margin-bottom: 10px
    }

    .msg p {
      color: var(--mute);
      font-size: 14px
    }

    @media(max-width:760px) {
      .lead-card {
        grid-template-columns: 1fr
      }

      .lead-left {
        border-right: none;
        padding: 35px 20px !important;
                border-bottom: 1px solid var(--line)
      }
    }

    footer {
      background: var(--ink);
      padding: 54px 0 120px;
      border-top: 1px solid var(--line)
    }

    .foot-grid {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      flex-wrap: wrap;
      gap: 30px
    }

    .foot-brand {
      display: flex;
      align-items: center;
      gap: 12px
    }

    .foot-disc {
      max-width: 64ch;
      font-size: 11px;
      color: var(--mute);
      line-height: 1.7;
      margin-top: 30px;
      padding-top: 24px;
      border-top: 1px solid var(--line)
    }

    .sticky {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      z-index: 80;
      display: flex;
      border-top: 1px solid var(--bronze);
      transform: translateY(110%);
      transition: transform .5s cubic-bezier(.2, .8, .2, 1)
    }

    .sticky.show {
      transform: translateY(0)
    }

    .sticky a {
      flex: 1;
      text-align: center;
      padding: 16px;
      text-decoration: none;
      font-size: 13px;
      font-weight: 600;
      letter-spacing: .06em;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px
    }

    .sticky .s-call {
      background: var(--ink-2);
      color: var(--limestone)
    }

    .sticky .s-form {
      background: var(--bronze);
      color: var(--ink)
    }

    .sticky .s-wa {
      background: #1faa54;
      color: #fff
    }

    .sticky .s-call:hover {
      background: var(--slate)
    }

    .wa-float {
      position: fixed;
      right: 20px;
      bottom: 78px;
      z-index: 85;
      width: 56px;
      height: 56px;
      border-radius: 50%;
      background: #1faa54;
      display: grid;
      place-items: center;
      box-shadow: 0 8px 24px rgba(0, 0, 0, .35);
      text-decoration: none;
      transform: scale(0);
      transition: transform .4s cubic-bezier(.2, 1.4, .4, 1)
    }

    .wa-float.show {
      transform: scale(1)
    }

    .wa-float::before {
      content: "";
      position: absolute;
      inset: -6px;
      border-radius: 50%;
      border: 2px solid #1faa54;
      opacity: .6;
      animation: pulse 2.2s infinite
    }

    @keyframes pulse {
      0% {
        transform: scale(1);
        opacity: .6
      }

      70% {
        transform: scale(1.5);
        opacity: 0
      }

      100% {
        opacity: 0
      }
    }

    .reveal {
      opacity: 0;
      transform: translateY(30px);
      transition: opacity .9s cubic-bezier(.2, .8, .2, 1), transform .9s cubic-bezier(.2, .8, .2, 1)
    }

    .reveal.in {
      opacity: 1;
      transform: none;
      padding: 15px;
    }

    .tile.reveal {
      transform: translateY(40px) scale(.97)
    }

    .tile.reveal.in {
      transform: none
    }

    @media(prefers-reduced-motion:reduce) {

      .reveal,
      .tile.reveal {
        opacity: 1;
        transform: none;
        transition: none
      }

      *,
      .hero-img img {
        animation: none !important
      }

      .hero-sub,
      .hero-cta,
      .hero-meta {
        opacity: 1
      }

      .hero h1 .ln span {
        transform: none
      }
    }

    :focus-visible {
      outline: 2px solid var(--bronze-soft);
      outline-offset: 3px
    }

    svg {
      display: block
    }

  .featured-projects{
    /* background:#0f1115; */
    padding:30px 0;
}

.project-layout{
    display:grid;
    grid-template-columns:58% 42%;
    align-items:center;
    gap:40px;
    max-width:1200px;
    margin:auto;
}

.project-image img{
    width:100%;
    height:400px; /* 600 se kam */
    object-fit:cover;
    border-radius:24px;
}
.project-content{
    color:#fff;
    max-width:500px;
}

.project-content .eyebrow{
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:3px;
    color:#c7a86b;
    margin-bottom:15px;
    font-weight:600;
}

.project-content h2{
    font-size:50px;
    line-height:1.05;
    margin-bottom:25px;
    font-weight:400;
    padding: 0px 30px 0px 0px;
}

.project-content h2 em{
    font-style:italic;
    color:#c7a86b;
}

.project-content p{
    color:rgba(255,255,255,.75);
    line-height:1.8;
    margin-bottom:35px;
    padding: 0px 50px 0px 0px;
    font-size:15px;
}

.feat-stat{
    display:flex;
    gap:50px;
    margin-bottom:35px;
    padding-top:25px;
    border-top:1px solid rgba(255,255,255,.12);
}

.stat-box .n{
    font-size:58px;
    line-height:1;
    color:#fff;
}

.stat-box .n small{
    font-size:.32em;
    font-style:italic;
    opacity:.8;
}

.stat-box .l{
    margin-top:8px;
    color:rgba(255,255,255,.65);
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:1px;
}

.project-btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    text-decoration:none;
    color:#111;
    background:#fff;
    padding:14px 28px;
    border-radius:50px;
    font-weight:600;
    transition:.3s;
}

.project-btn:hover{
    transform:translateY(-3px);
}
.swiper-button-next,
.swiper-button-prev{
    width:55px;
    height:55px;
    border-radius:50%;
    background:rgba(255,255,255,0.08);
    backdrop-filter:blur(12px);
    border:1px solid rgba(255,255,255,0.15);
    transition:.35s ease;
}

.swiper-button-next::after,
.swiper-button-prev::after{
    font-size:18px;
    font-weight:700;
    color:#fff;
}

.swiper-button-next:hover,
.swiper-button-prev:hover{
    background:#c9a96e;
    transform:translateY(-3px);
}

.swiper-button-next:hover::after,
.swiper-button-prev:hover::after{
    color:#111;
}

@media(max-width:991px){

    .project-layout{
        grid-template-columns:1fr;
        gap:30px;
    }

    .project-image img{
        height:400px;
    }

    .project-content h2{
        font-size:34px;
    }
}


.brochure-popup-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.75);
    backdrop-filter:blur(5px);
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:99999;

    opacity:0;
    visibility:hidden;
    transition:.35s ease;
}

.brochure-popup-overlay.active{
    opacity:1;
    visibility:visible;
}


.brochure-popup-box{
    width:100%;
    max-width:420px;   /* 550px se 420px */
    position:relative;
    border:1px solid var(--line);
    background:var(--ink);
    border-radius:12px;
}



.brochure-popup-close{
    position:absolute;
    top:15px;
    right:15px;
    width:40px;
    height:40px;
    border:none;
    background:none;
    color:var(--limestone);
    font-size:32px;
    cursor:pointer;
    z-index:10;
}

.brochure-trigger-btn{
    padding:14px 30px;
    border:none;
    background:var(--bronze);
    color:var(--ink);
    cursor:pointer;
}

@media(max-width:768px){

    .brochure-popup-box{
        width:95%;
    }

}


.modal-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.75);
    backdrop-filter:blur(5px);
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:9999;

    opacity:0;
    visibility:hidden;
    transition:.35s ease;
}

.modal-overlay.active{
    opacity:1;
    visibility:visible;
}

.modal-box{
    width:100%;
    max-width:550px;
    position:relative;
    border:1px solid var(--line);
    background:var(--ink);
}

.close-modal{
    position:absolute;
    top:15px;
    right:15px;
    width:40px;
    height:40px;
    border:none;
    background:none;
    color:var(--limestone);
    font-size:32px;
    cursor:pointer;
    z-index:10;
}

.open-modal{
    padding:14px 30px;
    border:none;
    background:var(--bronze);
    color:var(--ink);
    cursor:pointer;
}

@media(max-width:768px){

    .modal-box{
        width:95%;
    }

}



.lux-popup-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.75);
    backdrop-filter:blur(12px);
    display:flex;
    justify-content:center;
    align-items:center;
    z-index:99999;

    opacity:0;
    visibility:hidden;
    transition:.4s ease;
}

.lux-popup-overlay.active{
    opacity:1;
    visibility:visible;
}

.lux-popup-box{
    width:90%;
    max-width:480px;
    background:linear-gradient(
        135deg,
        #171717,
        #222222
    );
    border:1px solid rgba(201,169,110,.2);
    border-radius:28px;
    padding:40px;
    position:relative;
    overflow:hidden;

    transform:translateY(30px);
    transition:.4s ease;
}

.lux-popup-overlay.active .lux-popup-box{
    transform:translateY(0);
}

.lux-popup-box::before{
    content:"";
    position:absolute;
    width:220px;
    height:220px;
    background:rgba(201,169,110,.08);
    border-radius:50%;
    top:-120px;
    right:-120px;
}

.lux-popup-box::after{
    content:"";
    position:absolute;
    width:180px;
    height:180px;
    background:rgba(201,169,110,.05);
    border-radius:50%;
    bottom:-80px;
    left:-80px;
}

.lux-popup-close{
    position:absolute;
    top:18px;
    right:18px;
    width:42px;
    height:42px;
    border:none;
    border-radius:50%;
    background:rgba(255,255,255,.08);
    color:#fff;
    font-size:24px;
    cursor:pointer;
    transition:.3s;
    z-index:2;
}

.lux-popup-close:hover{
    background:#c9a96e;
    color:#111;
}

.lux-popup-header{
    text-align:center;
    margin-bottom:30px;
}

.lux-popup-tag{
    color:#c9a96e;
    font-size:12px;
    letter-spacing:2px;
    text-transform:uppercase;
    font-weight:600;
}

.lux-popup-header h2{
    color:#fff;
    font-size:36px;
    margin:12px 0;
    line-height:1.1;
}

.lux-popup-header p{
    color:#9d9d9d;
    line-height:1.7;
    font-size:14px;
}

.lux-popup-form input{
    width:100%;
    height:58px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
    border-radius:14px;
    padding:0 18px;
    color:#fff;
    margin-bottom:15px;
    outline:none;
    transition:.3s;
}

.lux-popup-form input:focus{
    border-color:#c9a96e;
}

.lux-popup-form input::placeholder{
    color:#777;
}

.lux-popup-form button{
    width:100%;
    height:58px;
    border:none;
    border-radius:14px;
    background:#c9a96e;
    color:#111;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.08em;
    cursor:pointer;
    transition:.3s;
}

.lux-popup-form button:hover{
    transform:translateY(-2px);
}

.lux-popup-trust{
    display:flex;
    justify-content:center;
    gap:15px;
    flex-wrap:wrap;
    margin-top:20px;
}

.lux-popup-trust span{
    color:#9d9d9d;
    font-size:12px;
}

@media(max-width:576px){

    .lux-popup-box{
        padding:30px 20px;
    }

    .lux-popup-header h2{
        font-size:28px;
    }

}

.open-lux-popup{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;

    padding:16px 32px;

    background:#c9a96e;
    color:#fff;

    font-size:13px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
    text-decoration:none;

    /* border-radius:50px; */
    border:1px solid #c9a96e;

    cursor:pointer;
    transition:.35s ease;

    box-shadow:0 10px 30px rgba(201,169,110,.25);
}

.open-lux-popup:hover{
    background:transparent;
    color:#c9a96e;
    transform:translateY(-3px);
}

.open-lux-popup:active{
    transform:translateY(0);
}