:root{
    /* -- brand tokens, mapped from the provided design system -- */
    --color-residential:#027b49;   /* the-green  */
    --color-commercial:#f19ec8;    /* the-pink   */
    --color-industrial:#fa4d43;    /* the-red    */
    --color-interiors:#fbb833;     /* the-yellow */
    --color-concrete:#d9d9d9;
    --color-iron:#1f1f1f;
    --color-carbon:#000000;
    --color-whatsapp:#25d366;      /* deliberate exception: universal chat-app convention */

    --font-display:'Barlow Condensed', ui-sans-serif, system-ui, sans-serif; /* KH Teka substitute */
    --font-utility: system-ui, -apple-system, "Segoe UI", sans-serif;

    --text-caption:13px;
    --text-body:17px;
    --text-body-sm:20px;
    --text-subheading:clamp(25px,3.4vw,30px);
    --text-heading:clamp(34px,6vw,60px);
    --text-display:clamp(58px,15vw,215px);

    --space-5:5px;  --space-6:6px;  --space-8:8px;  --space-10:10px;
    --space-14:14px;--space-15:15px;--space-19:19px;--space-20:20px;
    --space-24:24px;--space-30:30px;--space-40:40px;--space-50:50px;
    --space-100:100px;--space-130:130px;--space-170:170px;

    --radius-pill:100px;
    --radius-card:0px;

    --page-max:1440px;
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--color-concrete);
    color:var(--color-iron);
    font-family:var(--font-display);
    font-weight:400;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,p,ul{margin:0;padding:0;}
  ul{list-style:none;}
  a{color:inherit;text-decoration:none;}
  img{max-width:100%;display:block;}
  button{font-family:inherit;border:none;background:none;cursor:pointer;padding:0;color:inherit;}

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

  .scroll-progress{
    position:fixed;top:0;left:0;height:2px;width:0%;
    background:var(--color-industrial);z-index:60;
    transition:width .1s linear;
  }
  @media (prefers-reduced-motion:reduce){.scroll-progress{transition:none;}}

  /* ---------- translucent flowing background, sits behind all content through to the footer ---------- */
  .blueprint-bg{
    position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  }
  .blueprint-bg svg{width:100%;height:100%;}
  .bp-path{
    stroke-dasharray:1400;stroke-dashoffset:1400;
    animation-name:bp-flow;animation-timing-function:linear;animation-iteration-count:infinite;
  }
  @keyframes bp-flow{
    0%{stroke-dashoffset:1400;}
    50%{stroke-dashoffset:0;}
    100%{stroke-dashoffset:-1400;}
  }
  @media (prefers-reduced-motion:reduce){.bp-path{animation:none;stroke-dashoffset:0;}}
  .topbar,.menu-panel,main,footer{position:relative;z-index:1;}

  .wrap{max-width:var(--page-max);margin:0 auto;padding-left:var(--space-24);padding-right:var(--space-24);}

  /* ---------- reveal-on-scroll ---------- */
  .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.16,.8,.3,1), transform .7s cubic-bezier(.16,.8,.3,1);}
  .reveal.in-view{opacity:1;transform:translateY(0);}
  .property-grid .reveal:nth-child(1){transition-delay:0s;}
  .property-grid .reveal:nth-child(2){transition-delay:.1s;}
  .property-grid .reveal:nth-child(3){transition-delay:.2s;}
  .property-grid .reveal:nth-child(4){transition-delay:.3s;}
  .why-grid .reveal:nth-child(1){transition-delay:0s;}
  .why-grid .reveal:nth-child(2){transition-delay:.1s;}
  .why-grid .reveal:nth-child(3){transition-delay:.2s;}
  .why-grid .reveal:nth-child(4){transition-delay:.3s;}
  @media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto;}
    .reveal{opacity:1;transform:none;transition:none;}
  }

  /* ---------- topbar ---------- */
  .topbar{
    position:sticky;top:0;z-index:60;
    display:flex;align-items:center;justify-content:space-between;
    padding:var(--space-20) var(--space-24);
    background:var(--color-concrete);
  }
  .wordmark{
    font-size:26px;font-weight:400;letter-spacing:-0.03em;line-height:1;
  }
  .wordmark small{font-size:15px;letter-spacing:0;font-family:var(--font-utility);opacity:.6;display:block;margin-top:2px;}

  .menu-trigger{
    width:48px;height:48px;border-radius:var(--radius-pill);
    background:var(--color-iron);
    display:flex;align-items:center;justify-content:center;
    flex-shrink:0;position:relative;z-index:61;
  }
  .menu-trigger svg{width:18px;height:14px;}
  .menu-trigger line{stroke:var(--color-concrete);stroke-width:2;transform-box:fill-box;transform-origin:center;transition:transform .35s cubic-bezier(.16,.8,.3,1),opacity .2s ease;}
  .menu-trigger[aria-expanded="true"] line:first-child{transform:translateY(6px) rotate(45deg);}
  .menu-trigger[aria-expanded="true"] line:nth-child(2){opacity:0;}
  .menu-trigger[aria-expanded="true"] line:last-child{transform:translateY(-6px) rotate(-45deg);}

  /* ---------- staggered side menu ---------- */
  body.menu-is-open{overflow:hidden;}
  .menu-shell{position:relative;z-index:50;}
  .menu-scrim{position:fixed;inset:0;z-index:49;border:0;padding:0;background:rgba(31,31,31,.18);opacity:0;pointer-events:none;transition:opacity .35s ease;}
  .menu-shell.open .menu-scrim{opacity:1;pointer-events:auto;}
  .menu-prelayers{position:fixed;top:0;right:0;bottom:0;width:clamp(280px,38vw,520px);z-index:50;pointer-events:none;}
  .menu-prelayer{position:absolute;inset:0;transform:translateX(100%);transition:transform .55s cubic-bezier(.16,.8,.3,1);}
  .menu-prelayer:first-child{background:var(--color-commercial);transition-delay:.06s;}
  .menu-prelayer:last-child{background:var(--color-industrial);transition-delay:0s;}
  .menu-shell.open .menu-prelayer{transform:translateX(0);}
  .menu-shell.open .menu-prelayer:first-child{transition-delay:0s;}
  .menu-shell.open .menu-prelayer:last-child{transition-delay:.06s;}
  .menu-panel{
    position:fixed;top:0;right:0;bottom:0;width:clamp(280px,38vw,520px);z-index:51;
    background:var(--color-concrete);display:flex;flex-direction:column;
    transform:translateX(100%);transition:transform .65s cubic-bezier(.16,.8,.3,1);overflow-y:auto;
  }
  .menu-shell.open .menu-panel{transform:translateX(0);}
  .menu-panel-inner{
    flex:1;min-height:100%;position:relative;display:flex;align-items:center;overflow:hidden;
    padding:calc(var(--space-100) + var(--space-20)) var(--space-24) var(--space-40);
  }
  .menu-crop-letter{
    position:absolute;right:-.14em;bottom:-.16em;font-size:min(62vw,460px);line-height:.7;
    color:var(--color-industrial);opacity:.25;
    user-select:none;pointer-events:none;
  }
  .menu-links{position:relative;z-index:1;padding:0;}
  .menu-links li{margin-bottom:var(--space-10);overflow:hidden;line-height:1;}
  .menu-link-num{
    font-family:var(--font-utility);font-size:14px;opacity:.5;
    display:inline-block;width:2ch;vertical-align:middle;
  }
  .menu-links a{
    font-size:clamp(34px,8vw,64px);
    letter-spacing:-0.03em;line-height:1.05;
    color:var(--color-iron);display:inline-block;
    transform:translateY(110%);
    transition:transform .7s cubic-bezier(.16,.8,.3,1),color .2s ease;
  }
  .menu-shell.open .menu-links a{transform:translateY(0);}
  .menu-links li:nth-child(1) a{transition-delay:.05s;}
  .menu-links li:nth-child(2) a{transition-delay:.1s;}
  .menu-links li:nth-child(3) a{transition-delay:.15s;}
  .menu-links li:nth-child(4) a{transition-delay:.2s;}
  .menu-links li:nth-child(5) a{transition-delay:.25s;}
  .menu-links li:nth-child(6) a{transition-delay:.3s;}
  .menu-links li:nth-child(7) a{transition-delay:.35s;}
  .menu-links a:hover,.menu-links a:focus-visible{color:var(--color-industrial);}
  @media (max-width:700px){.menu-prelayers,.menu-panel{width:100%;}.menu-panel-inner{padding-top:var(--space-100);}.menu-crop-letter{font-size:min(110vw,560px);}}
  @media (prefers-reduced-motion:reduce){
    .menu-scrim,.menu-prelayer,.menu-panel,.menu-links a,.menu-trigger line{transition:none;}
    .menu-links a{transform:none;}
  }

  /* ---------- hero ---------- */
  .hero{padding:var(--space-100) var(--space-24) var(--space-50);position:relative;overflow:hidden;}
  .hero-motif{position:absolute;left:0;right:0;bottom:0;width:100%;height:auto;z-index:0;pointer-events:none;}
  .hero h1{position:relative;z-index:1;
    font-size:var(--text-display);
    line-height:.82;
    letter-spacing:-0.045em;
    font-weight:400;
    opacity:0;transform:translateY(28px);
    animation:hero-in .8s cubic-bezier(.16,.8,.3,1) .1s forwards;
  }
  @keyframes hero-in{to{opacity:1;transform:translateY(0);}}
  @media (prefers-reduced-motion:reduce){
    .hero h1, .hero-sub, .cta-pair{animation:none !important;opacity:1 !important;transform:none !important;}
  }
  @media (min-width:900px){
    .hero h1{letter-spacing:-0.06em;line-height:.74;}
  }
  .rotate-word{display:inline-block;transition:opacity .3s ease, transform .3s ease;}
  .hero-sub{
    position:relative;z-index:1;
    margin-top:var(--space-20);max-width:360px;
    font-size:var(--text-body-sm);opacity:0;line-height:1.4;
    transform:translateY(20px);
    animation:hero-in .8s cubic-bezier(.16,.8,.3,1) .35s forwards;
  }
  .cta-pair{
    position:relative;z-index:1;
    margin-top:var(--space-40);
    opacity:0;transform:translateY(20px);
    animation:hero-in .8s cubic-bezier(.16,.8,.3,1) .55s forwards;
    display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-15);
  }
  .cta-pair p{font-size:var(--text-body-sm);max-width:320px;}
  @media (max-width:700px){
    .topbar{padding:10px var(--space-15);}
    .topbar .wordmark{font-size:16px;}
    .menu-trigger{width:32px;height:32px;}
    .menu-trigger svg{width:14px;height:11px;}
    .menu-trigger[aria-expanded="true"] line:first-child{transform:translateY(5px) rotate(45deg);}
    .menu-trigger[aria-expanded="true"] line:last-child{transform:translateY(-5px) rotate(-45deg);}
    .hero{padding:6px var(--space-15) var(--space-20);}
    .hero h1{font-size:clamp(86px,27vw,108px);line-height:.93;letter-spacing:-.075em;font-weight:500;}
    .hero-sub{margin-top:var(--space-10);max-width:250px;font-size:clamp(15px,4vw,17px);line-height:1.3;}
    .cta-pair{margin-top:var(--space-14);gap:var(--space-8);flex-direction:column;align-items:flex-start;}
    .cta-pair p{font-size:clamp(14px,3.6vw,16px);max-width:none;line-height:1.25;white-space:nowrap;}
    .hero .pill{padding:8px var(--space-15);font-size:clamp(15px,4vw,17px);}
  }
  .pill{
    display:inline-block;
    background:var(--color-iron);color:var(--color-concrete);
    border-radius:var(--radius-pill);
    padding:var(--space-10) var(--space-20);
    font-size:var(--text-body);
    white-space:nowrap;
    transition:opacity .2s ease;
  }
  .pill:hover{opacity:.82;}

  /* ---------- marquee ---------- */
  .marquee{
    overflow:hidden;white-space:nowrap;
    border-top:1px solid var(--color-carbon);
    border-bottom:1px solid var(--color-carbon);
    padding:var(--space-14) 0;
  }
  .marquee-track{display:inline-flex;animation:scroll-left 26s linear infinite;}
  .marquee-track span{
    font-size:clamp(20px,4vw,32px);letter-spacing:-0.02em;padding-right:2ch;
  }
  @keyframes scroll-left{from{transform:translateX(0);}to{transform:translateX(-50%);}}
  @media (prefers-reduced-motion:reduce){.marquee-track{animation:none;}}

  /* ---------- section heading ---------- */
  .section{padding:var(--space-50) var(--space-24);border-top:1px solid var(--color-carbon);position:relative;}
  .section-num{
    position:absolute;top:var(--space-15);right:var(--space-24);
    font-family:var(--font-utility);font-size:13px;letter-spacing:.04em;opacity:.4;
  }
  .section-head{margin-bottom:var(--space-40);}
  .subheading{font-size:var(--text-subheading);letter-spacing:-0.03em;}

  /* ---------- property / service-line cards ---------- */
  .property-grid{
    display:grid;grid-template-columns:1fr;gap:1px;
    background:var(--color-carbon);
    border:1px solid var(--color-carbon);
  }
  @media (min-width:800px){
    .property-grid{grid-template-columns:repeat(4,1fr);}
  }
  .property-card{background:var(--color-concrete);display:flex;flex-direction:column;}
  .photo-placeholder{
    aspect-ratio:4/3;width:100%;
    background-image:repeating-linear-gradient(135deg, rgba(0,0,0,.14) 0 2px, transparent 2px 14px);
  }
  .card-residential .photo-placeholder{background-color:var(--color-residential);}
  .card-commercial  .photo-placeholder{background-color:var(--color-commercial);}
  .card-industrial  .photo-placeholder{background-color:var(--color-industrial);}
  .card-interiors   .photo-placeholder{background-color:var(--color-interiors);}
  .photo-placeholder.card-residential{background-color:var(--color-residential);}
  .photo-placeholder.card-commercial{background-color:var(--color-commercial);}
  .photo-placeholder.card-industrial{background-color:var(--color-industrial);}
  .photo-placeholder.card-interiors{background-color:var(--color-interiors);}
  .icon-block{background-image:none !important;display:flex;align-items:center;justify-content:center;}
  .icon-block svg{width:42%;height:42%;transition:transform .4s cubic-bezier(.16,.8,.3,1);}
  .photo-placeholder{transition:filter .4s ease;}

  /* hover-only card animation — gated to real pointer devices so touchscreens never get a stuck hover state */
  @media (hover:hover) and (pointer:fine){
    .property-card{transition:transform .3s cubic-bezier(.16,.8,.3,1);}
    .property-card:hover{transform:translateY(-6px);}
    .property-card:hover .icon-block svg{transform:scale(1.14) rotate(-2deg);}
    .property-card:hover .photo-placeholder{filter:brightness(1.08);}
    .project-card{transition:transform .3s cubic-bezier(.16,.8,.3,1);}
    .project-card:hover{transform:translateY(-6px);}
    .project-card:hover img{transform:scale(1.04);filter:brightness(1.08);}
  }

  .property-meta{padding:var(--space-20);flex:1;display:flex;flex-direction:column;gap:var(--space-10);}
  .property-meta h3{font-size:var(--text-subheading);letter-spacing:-0.03em;display:flex;align-items:center;gap:var(--space-8);}
  .dot{width:9px;height:9px;border-radius:var(--radius-pill);display:inline-block;flex-shrink:0;}
  .dot-residential{background:var(--color-residential);}
  .dot-commercial{background:var(--color-commercial);}
  .dot-industrial{background:var(--color-industrial);}
  .dot-interiors{background:var(--color-interiors);}
  .property-meta p{font-size:var(--text-body);opacity:.85;line-height:1.35;}
  .soon-tag{
    font-family:var(--font-utility);font-size:var(--text-caption);
    letter-spacing:.04em;text-transform:uppercase;
    display:inline-block;padding:var(--space-5) var(--space-10);
    border:1px solid var(--color-carbon);border-radius:var(--radius-pill);
    width:fit-content;
  }

  /* ---------- why-build-with-us grid ---------- */
  .why-grid{display:grid;grid-template-columns:1fr;gap:0;border-top:1px solid var(--color-carbon);}
  @media (min-width:700px){.why-grid{grid-template-columns:1fr 1fr;}}
  .why-item{
    position:relative;padding:var(--space-30) var(--space-20) var(--space-30) 0;
    border-bottom:1px solid var(--color-carbon);
  }
  @media (min-width:700px){
    .why-item:nth-child(odd){border-right:1px solid var(--color-carbon);padding-left:0;padding-right:var(--space-30);}
    .why-item:nth-child(even){padding-left:var(--space-30);}
  }
  .why-num{
    display:block;font-size:14px;font-family:var(--font-utility);letter-spacing:.04em;
    opacity:.45;margin-bottom:var(--space-10);
  }
  .why-item h3{
    font-size:clamp(20px,3vw,26px);letter-spacing:-0.03em;
    display:flex;align-items:center;gap:var(--space-8);
  }
  .why-item p{margin-top:var(--space-8);font-size:var(--text-body);opacity:.85;max-width:360px;line-height:1.4;}

  /* ---------- portfolio filmstrip ---------- */
  .filmstrip{
    display:flex;gap:var(--space-20);
    overflow-x:auto;scroll-snap-type:x mandatory;
    padding-bottom:var(--space-20);
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
  }
  .project-card{flex:0 0 280px;scroll-snap-align:start;overflow:hidden;}
  .project-card img{aspect-ratio:3/4;width:100%;object-fit:cover;display:block;transition:transform .4s cubic-bezier(.16,.8,.3,1),filter .4s ease;}
  .project-card p{
    margin-top:var(--space-10);font-size:var(--text-body);letter-spacing:-0.01em;
  }
  .project-card span{
    display:block;font-family:var(--font-utility);font-size:var(--text-caption);opacity:.6;margin-top:2px;
  }

  /* ---------- services list ---------- */
  .service-row{
    display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-10);
    padding:var(--space-24) 0;border-bottom:1px solid var(--color-carbon);
  }
  .service-row:first-of-type{border-top:1px solid var(--color-carbon);}
  .service-row h3{font-size:clamp(26px,4vw,40px);letter-spacing:-0.03em;}
  .service-row p{font-size:var(--text-body-sm);max-width:380px;opacity:.85;}

  /* ---------- about ---------- */
  .about h2{font-size:var(--text-heading);letter-spacing:-0.03em;line-height:.95;}
  .years-counter{font-variant-numeric:tabular-nums;display:inline-block;min-width:1.2ch;}
  .about p{margin-top:var(--space-24);max-width:560px;font-size:var(--text-body-sm);line-height:1.5;opacity:.9;}
  .about-grid{display:grid;grid-template-columns:1fr;gap:var(--space-40);align-items:center;}
  @media (min-width:800px){.about-grid{grid-template-columns:1.3fr 1fr;}}
  .about-marks{
    display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;
    gap:var(--space-10);aspect-ratio:1/1;max-width:320px;
  }
  .mark{
    width:100%;height:100%;display:flex;align-items:flex-end;padding:var(--space-10);
    font-family:var(--font-utility);font-size:13px;letter-spacing:.02em;
  }
  .mark-residential{background:var(--color-residential);color:#d9d9d9;}
  .mark-commercial{background:var(--color-commercial);color:#1f1f1f;}
  .mark-industrial{background:var(--color-industrial);color:#1f1f1f;}
  .mark-interiors{background:var(--color-interiors);color:#1f1f1f;}

  .testimonial-grid{display:grid;grid-template-columns:1fr;gap:var(--space-30);}
  @media (min-width:800px){.testimonial-grid{grid-template-columns:repeat(3,1fr);}}
  .testimonial{
    margin:0;padding:var(--space-24) 0 0;border-top:1px solid var(--color-carbon);
  }
  .testimonial p{font-size:var(--text-body-sm);line-height:1.45;font-style:italic;}
  .testimonial cite{
    display:block;margin-top:var(--space-15);font-style:normal;
    font-family:var(--font-utility);font-size:var(--text-caption);opacity:.65;
  }
  .testimonial-grid .reveal:nth-child(1){transition-delay:0s;}
  .testimonial-grid .reveal:nth-child(2){transition-delay:.1s;}
  .testimonial-grid .reveal:nth-child(3){transition-delay:.2s;}
  .filmstrip .reveal:nth-child(1){transition-delay:0s;}
  .filmstrip .reveal:nth-child(2){transition-delay:.08s;}
  .filmstrip .reveal:nth-child(3){transition-delay:.16s;}
  .filmstrip .reveal:nth-child(4){transition-delay:.24s;}
  .filmstrip .reveal:nth-child(5){transition-delay:.32s;}
  .filmstrip .reveal:nth-child(6){transition-delay:.4s;}
  .filmstrip .reveal:nth-child(7){transition-delay:.48s;}
  .filmstrip .reveal:nth-child(8){transition-delay:.56s;}

  /* ---------- contact / footer ---------- */
  .contact{border-top:1px solid var(--color-carbon);}
  .contact h2{font-size:var(--text-heading);letter-spacing:-0.03em;line-height:.95;margin-bottom:var(--space-30);}

  /* ---------- contact experience ---------- */
  .contact-experience{padding:var(--space-50) var(--space-24);border-top:1px solid var(--color-carbon);}
  .contact-shell{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border:1px solid var(--color-carbon);overflow:hidden;}
  .contact-slider{position:relative;min-height:650px;background:var(--color-iron);overflow:hidden;}
  .contact-slide{position:absolute;inset:0;opacity:0;transform:translateX(12%);transition:opacity .7s ease,transform .8s cubic-bezier(.16,.8,.3,1);}
  .contact-slide.is-active{opacity:1;transform:translateX(0);z-index:1;}
  .contact-slide.is-leaving{opacity:0;transform:translateX(-12%);z-index:2;}
  .contact-slide img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);}
  .contact-slider-caption{position:absolute;left:var(--space-20);right:var(--space-20);bottom:var(--space-20);z-index:3;display:flex;justify-content:space-between;gap:var(--space-15);color:var(--color-concrete);font-family:var(--font-utility);font-size:var(--text-caption);letter-spacing:.06em;text-transform:uppercase;}
  .contact-slider-nav{position:absolute;z-index:3;display:flex;gap:var(--space-8);left:var(--space-20);bottom:calc(var(--space-20) + var(--space-24));}
  .contact-slider-nav button{width:26px;height:3px;background:var(--color-concrete);opacity:.42;transition:opacity .2s ease,transform .25s cubic-bezier(.16,.8,.3,1);}
  .contact-slider-nav button.is-active{opacity:1;transform:scaleX(1.35);transform-origin:left;}
  .contact-form-panel{padding:clamp(30px,6vw,72px);align-self:center;animation:contact-panel-in .8s cubic-bezier(.16,.8,.3,1) .16s both;}
  @keyframes contact-panel-in{from{opacity:0;transform:translateY(26px);}to{opacity:1;transform:translateY(0);}}
  .contact-eyebrow{display:block;font-family:var(--font-utility);font-size:var(--text-caption);letter-spacing:.08em;text-transform:uppercase;margin-bottom:var(--space-15);}
  .contact-form-panel h1{font-size:var(--text-heading);line-height:.93;letter-spacing:-.04em;}
  .contact-intro{margin-top:var(--space-20);max-width:420px;font-size:clamp(21px,2.2vw,25px);line-height:1.4;opacity:.82;}
  .contact-form{display:grid;gap:var(--space-20);margin-top:var(--space-40);}
  .contact-form-field{position:relative;display:grid;gap:var(--space-6);}
  .contact-form-field label{font-family:var(--font-utility);font-size:clamp(15px,1.4vw,17px);letter-spacing:.03em;opacity:.76;transition:color .2s ease,opacity .2s ease,transform .25s cubic-bezier(.16,.8,.3,1);}
  .contact-form-field input,.contact-form-field select,.contact-form-field textarea{width:100%;border:0;border-bottom:1px solid var(--color-carbon);border-radius:0;background:transparent;padding:var(--space-10) 0;font:inherit;font-size:clamp(20px,2vw,23px);line-height:1.2;color:var(--color-iron);outline:none;transition:border-color .25s ease,transform .25s cubic-bezier(.16,.8,.3,1);}
  .contact-form-field textarea{border:1px solid var(--color-carbon);padding:var(--space-10);resize:vertical;min-height:96px;}
  .contact-form-field select{appearance:auto;}
  .contact-form-field:focus-within label{color:var(--color-residential);opacity:1;transform:translateX(4px);}
  .contact-form-field:focus-within input,.contact-form-field:focus-within select,.contact-form-field:focus-within textarea{border-color:var(--color-residential);}
  .contact-submit{justify-self:start;margin-top:var(--space-5);}
  .contact-submit span{display:inline-block;margin-left:var(--space-8);transition:transform .25s cubic-bezier(.16,.8,.3,1);}
  .contact-submit:hover span{transform:translate(3px,-3px);}
  .contact-form-status{font-family:var(--font-utility);font-size:clamp(14px,1.35vw,16px);line-height:1.45;opacity:.75;}
  .contact-form-status.is-ready{color:var(--color-residential);opacity:1;}
  .contact-direct{display:flex;flex-wrap:wrap;gap:var(--space-15);margin-top:var(--space-30);padding-top:var(--space-20);border-top:1px solid var(--color-carbon);font-family:var(--font-utility);font-size:clamp(16px,1.6vw,19px);}
  .contact-direct a:hover{text-decoration:underline;text-underline-offset:3px;}
  .contact-form-panel.contact-motion .contact-eyebrow,.contact-form-panel.contact-motion h1,.contact-form-panel.contact-motion .contact-intro,.contact-form-panel.contact-motion .contact-form > *,.contact-form-panel.contact-motion .contact-direct{opacity:0;transform:translateY(18px);}
  .contact-form-panel.contact-motion.is-visible .contact-eyebrow,.contact-form-panel.contact-motion.is-visible h1,.contact-form-panel.contact-motion.is-visible .contact-intro,.contact-form-panel.contact-motion.is-visible .contact-form > *,.contact-form-panel.contact-motion.is-visible .contact-direct{animation:contact-item-in .62s cubic-bezier(.16,.8,.3,1) forwards;}
  .contact-form-panel.contact-motion.is-visible h1{animation-delay:.06s;}.contact-form-panel.contact-motion.is-visible .contact-intro{animation-delay:.12s;}
  .contact-form-panel.contact-motion.is-visible .contact-form > :nth-child(1){animation-delay:.18s;}.contact-form-panel.contact-motion.is-visible .contact-form > :nth-child(2){animation-delay:.24s;}.contact-form-panel.contact-motion.is-visible .contact-form > :nth-child(3){animation-delay:.30s;}.contact-form-panel.contact-motion.is-visible .contact-form > :nth-child(4){animation-delay:.36s;}.contact-form-panel.contact-motion.is-visible .contact-form > :nth-child(5){animation-delay:.42s;}.contact-form-panel.contact-motion.is-visible .contact-form > :nth-child(6){animation-delay:.48s;}.contact-form-panel.contact-motion.is-visible .contact-direct{animation-delay:.54s;}
  @keyframes contact-item-in{to{opacity:1;transform:translateY(0);}}
  @media (max-width:800px){.contact-shell{grid-template-columns:1fr;}.contact-slider{min-height:390px;}.contact-form-panel{padding:var(--space-30) var(--space-20) var(--space-40);}}
  @media (prefers-reduced-motion:reduce){.contact-slide,.contact-slider-nav button{transition:none;}.contact-form-panel,.contact-form-panel.contact-motion.is-visible *{animation:none;}.contact-form-panel.contact-motion .contact-eyebrow,.contact-form-panel.contact-motion h1,.contact-form-panel.contact-motion .contact-intro,.contact-form-panel.contact-motion .contact-form > *,.contact-form-panel.contact-motion .contact-direct{opacity:1;transform:none;}.contact-slide.is-leaving{transform:none;}}

  footer{
    display:block;padding:0 0 var(--space-40);border-top:1px solid var(--color-carbon);
    position:relative;overflow:hidden;
  }
  .footer-marquee{border-top:none;}
  .footer-giant-word{
    position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
    font-size:clamp(92px,16vw,300px);line-height:.75;letter-spacing:-0.055em;
    color:var(--color-iron);opacity:.05;white-space:nowrap;pointer-events:none;z-index:0;
  }
  .foot-cols{
    position:relative;z-index:1;padding:var(--space-40) var(--space-24) 0;
    display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-30);
    border-top:1px solid var(--color-carbon);
  }
  footer .foot-col p, footer .foot-col a{
    display:block;font-family:var(--font-utility);font-size:var(--text-body);margin-bottom:var(--space-6);opacity:.85;
  }
  footer .foot-col a:hover{opacity:1;text-decoration:underline;}
  .foot-bottom{
    position:relative;z-index:1;margin-top:var(--space-40);padding:var(--space-20) var(--space-24) 0;
    display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-15);
    border-top:1px solid var(--color-carbon);
    font-family:var(--font-utility);font-size:var(--text-caption);opacity:.6;
  }
  .back-to-top{opacity:1;font-family:var(--font-display);}
  @media (hover:hover) and (pointer:fine){
    .back-to-top{transition:transform .25s cubic-bezier(.16,.8,.3,1);}
    .back-to-top:hover{transform:translateY(-3px);}
  }

  /* ---------- whatsapp opener ---------- */
  .wa-button{
    position:fixed;right:var(--space-20);bottom:var(--space-20);z-index:45;
    width:56px;height:56px;border-radius:var(--radius-pill);
    background:var(--color-whatsapp);
    display:flex;align-items:center;justify-content:center;
  }
  .wa-button svg{width:28px;height:28px;transition:transform .35s cubic-bezier(.16,.8,.3,1);}
  .wa-button[aria-expanded="true"] svg{transform:rotate(12deg) scale(.9);}
  .wa-ring{
    position:fixed;right:var(--space-20);bottom:var(--space-20);z-index:44;
    width:56px;height:56px;border-radius:var(--radius-pill);
    border:2px solid var(--color-whatsapp);
    animation:wa-pulse 2.4s ease-out infinite;pointer-events:none;
  }
  @keyframes wa-pulse{0%{transform:scale(1);opacity:.6;}100%{transform:scale(1.6);opacity:0;}}
  @media (prefers-reduced-motion:reduce){.wa-ring{animation:none;display:none;}}
  .wa-popup{
    position:fixed;right:var(--space-20);bottom:calc(var(--space-20) + 68px);z-index:45;
    width:min(340px, calc(100vw - 40px));background:var(--color-concrete);color:var(--color-iron);
    overflow:hidden;border:1px solid var(--color-carbon);
    transform:translateY(16px) scale(.97);opacity:0;pointer-events:none;
    transition:transform .35s cubic-bezier(.16,.8,.3,1), opacity .25s ease;
  }
  .wa-popup.open{transform:translateY(0) scale(1);opacity:1;pointer-events:auto;}
  .wa-chat-layer{position:absolute;inset:0;transform:translateX(105%);pointer-events:none;}
  .wa-chat-layer-one{background:var(--color-commercial);transition:transform .42s cubic-bezier(.16,.8,.3,1);}
  .wa-chat-layer-two{background:var(--color-industrial);transition:transform .42s cubic-bezier(.16,.8,.3,1) .06s;}
  .wa-popup.open .wa-chat-layer{transform:translateX(0);}
  .wa-popup.open .wa-chat-layer-one{transition-delay:.06s;}
  .wa-popup.open .wa-chat-layer-two{transition-delay:0s;}
  .wa-chat-content{position:relative;z-index:1;background:var(--color-concrete);opacity:0;transform:translateY(18px);transition:opacity .35s ease .17s,transform .45s cubic-bezier(.16,.8,.3,1) .17s;}
  .wa-popup.open .wa-chat-content{opacity:1;transform:translateY(0);}
  .wa-chat-head{display:flex;align-items:center;gap:var(--space-10);padding:var(--space-15);background:var(--color-iron);color:var(--color-concrete);}
  .wa-avatar{width:42px;height:42px;display:grid;place-items:center;border-radius:var(--radius-pill);background:var(--color-residential);font-size:23px;line-height:1;}
  .wa-chat-title{font-size:var(--text-body-sm);line-height:1;}
  .wa-status{display:block;font-family:var(--font-utility);font-size:var(--text-caption);margin-top:var(--space-5);color:var(--color-concrete);opacity:.75;}
  .wa-status::before{content:'';display:inline-block;width:7px;height:7px;margin-right:5px;border-radius:50%;background:var(--color-residential);}
  .wa-close{margin-left:auto;width:32px;height:32px;position:relative;color:var(--color-concrete);}
  .wa-close::before,.wa-close::after{content:'';position:absolute;left:8px;top:15px;width:16px;height:2px;background:currentColor;transition:transform .3s cubic-bezier(.16,.8,.3,1);}
  .wa-close::before{transform:rotate(45deg);}.wa-close::after{transform:rotate(-45deg);}
  .wa-close:hover::before{transform:rotate(135deg);}.wa-close:hover::after{transform:rotate(45deg);}
  .wa-chat-body{padding:var(--space-20);min-height:190px;display:flex;flex-direction:column;align-items:flex-start;}
  .wa-time{align-self:center;font-family:var(--font-utility);font-size:var(--text-caption);opacity:.55;}
  .wa-typing,.wa-message{margin-top:var(--space-15);background:var(--color-concrete);border:1px solid var(--color-carbon);padding:var(--space-10) var(--space-14);font-size:var(--text-body-sm);line-height:1.25;}
  .wa-typing{display:flex;gap:5px;align-items:center;min-width:72px;}
  .wa-typing span{width:5px;height:5px;border-radius:50%;background:var(--color-iron);animation:wa-dot 1s ease-in-out infinite;}
  .wa-typing span:nth-child(2){animation-delay:.12s;}.wa-typing span:nth-child(3){animation-delay:.24s;}
  @keyframes wa-dot{50%{transform:translateY(-4px);opacity:.35;}}
  .wa-message{opacity:0;transform:translateY(10px);transition:opacity .3s ease .72s,transform .35s cubic-bezier(.16,.8,.3,1) .72s;}
  .wa-popup.open .wa-message{opacity:1;transform:translateY(0);}
  .wa-popup.open .wa-typing{animation:wa-typing-out .2s ease .66s forwards;}
  @keyframes wa-typing-out{to{opacity:0;transform:translateY(-6px);}}
  .wa-chat-action{align-self:center;margin-top:auto;background:var(--color-whatsapp);color:var(--color-iron);}
  @media (prefers-reduced-motion:reduce){.wa-button svg,.wa-popup,.wa-chat-layer,.wa-chat-content,.wa-message{transition:none;}.wa-typing span,.wa-popup.open .wa-typing{animation:none;}.wa-message{opacity:1;transform:none;}}
  /* ---------- native cross-page transitions (progressive enhancement, no JS, no-op in unsupported browsers) ---------- */
  @view-transition{navigation:auto;}

  /* ---------- dark mode ---------- */
  [data-theme="dark"]{
    --color-concrete:#1f1f1f;
    --color-iron:#d9d9d9;
  }
  [data-theme="dark"] .menu-panel,[data-theme="dark"] .wa-popup{background:var(--color-concrete);}
  .hero-motif path{fill:var(--color-iron);}
  .bp-path{stroke:var(--color-iron);}
  [data-theme="dark"] .blueprint-bg{opacity:.6;}

  .theme-toggle{
    width:40px;height:40px;border-radius:var(--radius-pill);
    border:1px solid var(--color-iron);
    display:flex;align-items:center;justify-content:center;
    flex-shrink:0;margin-right:var(--space-10);
    transition:background .2s ease;
  }
  .theme-toggle svg{width:17px;height:17px;stroke:var(--color-iron);}
  .theme-toggle .icon-moon{display:none;}
  [data-theme="dark"] .theme-toggle .icon-sun{display:none;}
  [data-theme="dark"] .theme-toggle .icon-moon{display:block;}
  @media (max-width:700px){.theme-toggle{width:32px;height:32px;margin-right:var(--space-8);}.theme-toggle svg{width:14px;height:14px;}}

  /* ---------- responsive subpages ---------- */
  .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
  .subpage .section{padding-top:clamp(72px,10vw,130px);padding-bottom:clamp(72px,10vw,130px);}
  .subpage .section:first-child{padding-top:clamp(86px,12vw,160px);}
  .subpage .section-num{display:block;margin-bottom:var(--space-20);font-family:var(--font-utility);font-size:var(--text-caption);letter-spacing:.06em;opacity:.58;}
  .subpage main > .section:first-child .section-num{animation:subpage-intro-in .45s cubic-bezier(.16,.8,.3,1) both;}
  .subpage main > .section:first-child h1{animation:subpage-intro-in .7s cubic-bezier(.16,.8,.3,1) .08s both;}
  .subpage main > .section:first-child p{animation:subpage-intro-in .65s cubic-bezier(.16,.8,.3,1) .18s both;}
  @keyframes subpage-intro-in{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:translateY(0);}}
  .subpage .why-item,.subpage .service-row,.subpage .property-card{transition:transform .45s cubic-bezier(.16,.8,.3,1),background-color .3s ease;}
  @media (hover:hover) and (pointer:fine){
    .subpage .why-item:hover,.subpage .service-row:hover{transform:translateX(8px);}
    .subpage .property-card:hover{transform:translateY(-7px);}
  }

  /* Portfolio: a grid that deliberately reflows from an editorial desktop layout to a clear one-column mobile gallery. */
  .portfolio-hero h1{font-size:clamp(52px,10vw,144px);letter-spacing:-.055em;line-height:.82;max-width:920px;}
  .portfolio-kicker{font-family:var(--font-utility);font-size:var(--text-caption);letter-spacing:.08em;text-transform:uppercase;margin-bottom:var(--space-10);}
  .portfolio-hero-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-30);margin-top:clamp(34px,6vw,74px);}
  .portfolio-hero-bottom > p{max-width:420px;font-size:var(--text-body-sm);line-height:1.25;}
  .portfolio-filters{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--space-8);}
  .portfolio-filters button{min-height:42px;border:1px solid var(--color-carbon);border-radius:var(--radius-pill);padding:0 var(--space-15);font-size:var(--text-body);line-height:1;transition:background-color .25s ease,color .25s ease,transform .25s cubic-bezier(.16,.8,.3,1);}
  .portfolio-filters button:hover,.portfolio-filters button:focus-visible,.portfolio-filters button.is-active{background:var(--color-iron);color:var(--color-concrete);}
  .portfolio-filters button:active{transform:scale(.96);}
  .portfolio-gallery-section{padding-top:0!important;}
  .portfolio-gallery-heading{display:flex;align-items:baseline;justify-content:space-between;border-bottom:1px solid var(--color-carbon);padding-bottom:var(--space-15);margin-bottom:var(--space-20);}
  .portfolio-gallery-heading .section-num{margin:0;}
  .portfolio-gallery-heading h2{font-size:var(--text-subheading);line-height:1;}
  .portfolio-gallery{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--space-20);}
  .portfolio-project{grid-column:span 4;min-width:0;overflow:hidden;}
  .portfolio-project:nth-child(2),.portfolio-project:nth-child(6){grid-column:span 5;}
  .portfolio-project:nth-child(3),.portfolio-project:nth-child(7){grid-column:span 3;}
  .portfolio-project:nth-child(4){grid-column:span 6;}
  .portfolio-project:nth-child(5){grid-column:span 6;}
  .portfolio-project[hidden]{display:none;}
  .portfolio-project img{width:100%;height:clamp(330px,37vw,560px);object-fit:cover;transition:transform .7s cubic-bezier(.16,.8,.3,1),filter .45s ease;}
  .portfolio-project:nth-child(2) img,.portfolio-project:nth-child(5) img{height:clamp(390px,46vw,680px);}
  .portfolio-project > div{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-10);border-bottom:1px solid var(--color-carbon);padding:var(--space-10) 0 var(--space-14);}
  .portfolio-project p{font-size:var(--text-body-sm);line-height:1;}
  .portfolio-project span{font-family:var(--font-utility);font-size:var(--text-caption);opacity:.7;}
  @media (hover:hover) and (pointer:fine){.portfolio-project:hover img{transform:scale(1.045);filter:contrast(1.05);}}

  /* Make informational pages feel considered without turning them into distracting interfaces. */
  .about-page .about-marks{margin-top:0;}
  .about-page .about-mark{transition:transform .45s cubic-bezier(.16,.8,.3,1);}
  @media (hover:hover) and (pointer:fine){.about-page .about-mark:hover{transform:translateY(-9px);}}
  .blog-page .why-grid{max-width:820px;}
  .blog-page .why-item{min-height:180px;display:flex;flex-direction:column;justify-content:center;}
  .legal-page .why-grid{max-width:900px;}
  .legal-page .why-item{padding-right:clamp(0px,8vw,100px);}
  .service-page .property-card{overflow:hidden;}
  .service-page .property-card .property-icon{transition:transform .5s cubic-bezier(.16,.8,.3,1);}
  @media (hover:hover) and (pointer:fine){.service-page .property-card:hover .property-icon{transform:scale(1.08) rotate(-3deg);}}
  .service-page .service-row{padding-top:var(--space-24);padding-bottom:var(--space-24);}
  .service-page .service-row h3{font-size:clamp(30px,4vw,48px);line-height:.95;}
  .service-page .service-row p{font-size:var(--text-body);line-height:1.3;}

  @media (max-width:700px){
    .subpage .section{padding:64px var(--space-15);}
    .subpage .section:first-child{padding-top:78px;}
    .subpage .section-num{margin-bottom:var(--space-15);}
    .portfolio-hero h1{font-size:clamp(51px,17vw,76px);line-height:.84;}
    .portfolio-hero-bottom{display:block;margin-top:var(--space-30);}
    .portfolio-hero-bottom > p{font-size:clamp(19px,5.5vw,23px);line-height:1.22;}
    .portfolio-filters{justify-content:flex-start;margin-top:var(--space-24);gap:var(--space-6);}
    .portfolio-filters button{min-height:44px;padding:0 13px;font-size:18px;}
    .portfolio-gallery-heading{align-items:center;margin-bottom:var(--space-15);}
    .portfolio-gallery-heading h2{font-size:30px;}
    .portfolio-gallery{grid-template-columns:1fr;gap:var(--space-24);}
    .portfolio-project,.portfolio-project:nth-child(n){grid-column:1;}
    .portfolio-project img,.portfolio-project:nth-child(n) img{height:auto;aspect-ratio:4/5;}
    .portfolio-project > div{padding-top:var(--space-10);}
    .portfolio-project p{font-size:24px;}
    .portfolio-project span{font-size:14px;}
    .blog-page .why-item{min-height:150px;}
    .legal-page .why-item{padding-right:0;}
    .service-page .service-row{padding-top:var(--space-20);padding-bottom:var(--space-20);}
    .service-page .service-row h3{font-size:34px;}
    .service-page .service-row p{font-size:20px;margin-top:var(--space-10);line-height:1.25;}
  }
  @media (prefers-reduced-motion:reduce){
    .subpage .why-item,.subpage .service-row,.subpage .property-card,.about-page .about-mark,.portfolio-project img,.portfolio-filters button{transition:none;}
    .subpage main > .section:first-child .section-num,.subpage main > .section:first-child h1,.subpage main > .section:first-child p{animation:none;}
  }