:root{
    --ink:#14161c;
    --ink-soft:#1d2027;
    --paper:#eff0ed;
    --paper-raise:#f8f8f6;
    --concrete:#b7b4ac;
    --concrete-line:#dcdad2;
    --text-dark:#1b1d22;
    --text-mute:#54565f;
    --teal:#1fbfae;
    --violet:#8b6bff;
    --sheen: linear-gradient(115deg, var(--teal) 0%, var(--violet) 45%, #ff8fd6 65%, var(--teal) 100%);
    --radius: 14px;
    --max: 1180px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{animation-duration:0.001s !important; animation-iteration-count:1 !important; transition-duration:0.001s !important;}
  }
  body{
    margin:0;
    background:var(--paper);
    color:var(--text-dark);
    font-family:'Inter',sans-serif;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,.disp{
    font-family:'Bricolage Grotesque',sans-serif;
    letter-spacing:-0.01em;
    margin:0;
  }
  .mono{font-family:'IBM Plex Mono',monospace;}
  a{color:inherit;}
  img,svg{display:block;max-width:100%;}
  .wrap{max-width:var(--max); margin:0 auto; padding:0 24px;}
  .btn{
    display:inline-flex; align-items:center; gap:8px;
    padding:14px 24px; border-radius:999px; font-weight:600; font-size:15px;
    text-decoration:none; cursor:pointer; border:1.5px solid transparent;
    transition:transform .15s ease, box-shadow .15s ease;
  }
  .btn:hover{transform:translateY(-2px);}
  .btn:focus-visible{outline:3px solid var(--violet); outline-offset:3px;}
  .btn-primary{background:var(--ink); color:var(--paper-raise); box-shadow:0 6px 20px rgba(20,22,28,.18);}
  .btn-primary:hover{box-shadow:0 10px 26px rgba(20,22,28,.28);}
  .btn-ghost{background:transparent; color:var(--ink); border-color:var(--ink);}
  .btn-on-dark{background:var(--paper-raise); color:var(--ink);}
  .btn-ghost-dark{background:transparent; color:var(--paper-raise); border-color:rgba(255,255,255,.4);}
  .btn-whatsapp{background:#25D366; color:#0b3d1f; box-shadow:0 6px 20px rgba(37,211,102,.25);}
  .btn-whatsapp:hover{box-shadow:0 10px 26px rgba(37,211,102,.35);}
  .btn-sm{padding:10px 18px; font-size:13.5px;}

  /* NAV */
  header{
    position:sticky; top:0; z-index:50;
    background:rgba(239,240,237,.86); backdrop-filter:blur(10px);
    border-bottom:1px solid var(--concrete-line);
  }
  nav.wrap{display:flex; align-items:center; justify-content:space-between; height:76px;}
  .logo{display:flex; align-items:center; gap:10px; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:21px; letter-spacing:-0.02em; text-decoration:none; color:inherit;}
  .logo .mark{width:30px;height:30px;border-radius:8px;background:var(--ink);position:relative;overflow:hidden;flex:none;}
  .logo .mark::after{content:"";position:absolute;inset:0;background:var(--sheen);background-size:300% 300%;opacity:.85;animation:sheenmove 6s linear infinite;}
  .navlinks{display:flex; gap:34px; align-items:center;}
  .navlinks a{font-size:14.5px; font-weight:600; text-decoration:none; color:var(--text-mute);}
  .navlinks a:hover{color:var(--ink);}
  .navcta{display:flex; align-items:center; gap:18px;}
  .navcta .btn{padding:11px 20px; font-size:14px;}
  .burger{display:none; background:none; border:none; cursor:pointer; padding:8px; width:38px; height:38px; position:relative; -webkit-tap-highlight-color:transparent;}
  .burger span{position:absolute; left:8px; display:block; width:22px; height:2px; border-radius:2px; background:var(--ink);
    transition:transform .35s cubic-bezier(.4,0,.2,1), opacity .2s ease, top .35s cubic-bezier(.4,0,.2,1);}
  .burger span:nth-child(1){top:13px;}
  .burger span:nth-child(2){top:19px;}
  .burger span:nth-child(3){top:25px;}
  .burger.is-open span:nth-child(1){top:19px; transform:rotate(45deg);}
  .burger.is-open span:nth-child(2){opacity:0; transform:translateX(-6px);}
  .burger.is-open span:nth-child(3){top:19px; transform:rotate(-45deg);}

  #mnav{max-height:0; overflow:hidden; opacity:0; border-top:0 solid var(--concrete-line);
    transition:max-height .45s cubic-bezier(.4,0,.2,1), opacity .35s ease, border-color .35s ease;}
  #mnav.open{max-height:420px; opacity:1; border-top:1px solid var(--concrete-line);}
  #mnav a{opacity:0; transform:translateY(-6px); transition:opacity .3s ease, transform .3s ease;}
  #mnav.open a{opacity:1; transform:translateY(0);}
  #mnav a:nth-child(1){transition-delay:.05s;} #mnav a:nth-child(2){transition-delay:.09s;}
  #mnav a:nth-child(3){transition-delay:.13s;} #mnav a:nth-child(4){transition-delay:.17s;}
  #mnav a:nth-child(5){transition-delay:.21s;} #mnav a:nth-child(6){transition-delay:.25s;}
  @media (prefers-reduced-motion: reduce){
    .burger span, #mnav, #mnav a{transition:none !important;}
  }

  @keyframes sheenmove{
    0%{background-position:0% 50%;}
    100%{background-position:200% 50%;}
  }

  /* HERO */
  .hero{background:linear-gradient(160deg, #14161c 0%, #1c1a30 42%, #14161c 78%, #101820 100%); color:var(--paper-raise); overflow:hidden; position:relative;}
  .hero-watermark{position:absolute; top:50%; right:-8%; width:640px; height:640px; transform:translateY(-50%); opacity:.07; z-index:0; pointer-events:none;}
  @media(max-width:900px){.hero-watermark{width:420px; height:420px; right:-18%;}}
  .hero .wrap{display:block; padding-top:76px; padding-bottom:64px; position:relative; z-index:2;}
  .eyebrow{
    display:inline-flex; align-items:center; gap:8px;
    font-family:'IBM Plex Mono',monospace; font-size:12.5px; letter-spacing:.08em; text-transform:uppercase;
    color:#c9c6ff; margin-bottom:22px;
  }
  .eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--sheen); background-size:300% 300%; animation:sheenmove 4s linear infinite;}
  .hero h1{font-size:clamp(34px,4.6vw,58px); line-height:1.04; font-weight:800; transform-origin:left center; animation:headlineTilt 5.5s ease-in-out infinite;}
  @keyframes headlineTilt{0%,100%{transform:rotate(-1.1deg);} 50%{transform:rotate(1.1deg);}}
  @media (prefers-reduced-motion: reduce){.hero h1{animation:none;}}
  .hero h1 em{font-style:normal; background:var(--sheen); background-size:300% 300%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:sheenmove 5s linear infinite;}
  .hero p.lead{margin-top:22px; font-size:17.5px; line-height:1.6; color:#cfd0d6; max-width:520px;}
  .hero .ctas{display:flex; gap:14px; margin-top:32px; flex-wrap:wrap;}
  .social-row{display:flex; gap:10px; margin-top:16px;}
  .social-btn{width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center;
    background:rgba(255,255,255,.08); color:#e9eaf0; border:1px solid rgba(255,255,255,.14);
    transition:background .18s ease, transform .18s ease;}
  .social-btn:hover{background:rgba(255,255,255,.16); transform:translateY(-2px);}


  /* TRUST STRIP */
  .trust{background:var(--paper-raise); border-bottom:1px solid var(--concrete-line);}
  .trust-slim{display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px; padding:14px 24px; font-size:12.5px; font-weight:600; color:var(--text-mute);}
  .trust-slim .dot{color:var(--concrete);}

  section{padding:64px 0;}
  .kicker{font-family:'IBM Plex Mono',monospace; font-size:12.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--teal); font-weight:500;}
  .h2{font-size:clamp(28px,3.4vw,40px); font-weight:800; margin-top:10px; max-width:640px; line-height:1.08;}
  .section-lead{margin-top:16px; font-size:16.5px; color:var(--text-mute); max-width:600px; line-height:1.6;}

  /* SERVICES */
  .svc-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:46px;}
  .svc-card{
    background:var(--paper-raise); border:1px solid var(--concrete-line); border-radius:var(--radius);
    padding:26px; position:relative; overflow:hidden; transition:border-color .2s ease, transform .2s ease;
  }
  .svc-card:hover{transform:translateY(-4px); border-color:transparent;}
  .svc-card::before{
    content:""; position:absolute; inset:0; padding:1.5px; border-radius:var(--radius);
    background:var(--sheen); background-size:300% 300%;
    -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite:xor; mask-composite:exclude;
    opacity:0; transition:opacity .2s ease; animation:sheenmove 5s linear infinite;
    pointer-events:none;
  }
  .svc-card:hover::before{opacity:1;}
  .svc-card .icon{width:38px;height:38px;border-radius:10px;background:var(--ink);display:flex;align-items:center;justify-content:center;margin-bottom:18px;}
  .svc-card h3{font-size:18px; font-weight:700;}
  .svc-card p{font-size:14.5px; color:var(--text-mute); line-height:1.55; margin-top:10px;}
  .svc-card .price{margin-top:16px; font-family:'IBM Plex Mono',monospace; font-size:18px; color:var(--ink); font-weight:700;}

  /* WHY */
  .why{background:var(--ink); color:var(--paper-raise);}
  .why .kicker{color:#8effe8;}
  .why .section-lead{color:#c6c7ce;}
  .why-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; margin-top:50px; background:rgba(255,255,255,.1); border-radius:var(--radius); overflow:hidden;}

  /* PROCESS */
  .process-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:32px;}
  .step{position:relative; padding-top:14px; border-top:2px solid var(--concrete-line);}
  .step .stepnum{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--violet); font-weight:600;}
  .step p{font-size:13.5px; color:var(--text-mute); line-height:1.5; margin-top:6px;}
  .step p b{color:var(--text-dark);}

  /* SWATCHES / FINISHES */
  .finishes{background:var(--paper-raise); border-top:1px solid var(--concrete-line); border-bottom:1px solid var(--concrete-line);}
  .swatch-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:44px;}
  .swatch{border-radius:var(--radius); overflow:hidden; border:1px solid var(--concrete-line);}
  .swatch .fill{height:150px; position:relative;}
  .swatch .fill.solid{background:linear-gradient(160deg,#20242c,#3a4048);}
  .swatch .fill.flake{background:
      radial-gradient(circle at 20% 30%, #e9e6de 0 3px, transparent 4px),
      radial-gradient(circle at 60% 60%, #cfd3d6 0 3px, transparent 4px),
      radial-gradient(circle at 80% 20%, #a9adb3 0 2px, transparent 3px),
      radial-gradient(circle at 40% 80%, #8a8f96 0 2px, transparent 3px),
      radial-gradient(circle at 10% 70%, #e9e6de 0 2px, transparent 3px),
      radial-gradient(circle at 90% 55%, #cfd3d6 0 2px, transparent 3px),
      #4d525a;
    background-size: 60px 60px;
  }
  .swatch .fill.metallic{background:var(--sheen); background-size:300% 300%; animation:sheenmove 7s ease-in-out infinite alternate;}
  .swatch .fill.concrete{background:linear-gradient(150deg,#c7c4bc,#a6a39b);}
  .swatch .label{padding:14px 16px; font-size:13.5px; font-weight:600;}
  .swatch .label span{display:block; font-family:'IBM Plex Mono',monospace; font-weight:400; font-size:12px; color:var(--text-mute); margin-top:2px;}

  /* PRICING */
  .price-table{margin-top:44px; border:1px solid var(--concrete-line); border-radius:var(--radius); overflow:hidden; background:var(--paper-raise);}
  .price-row{display:grid; grid-template-columns:1.6fr 1fr 1fr; padding:18px 24px; border-bottom:1px solid var(--concrete-line); align-items:center;}
  .price-row:last-child{border-bottom:none;}
  .price-row.headrow{background:var(--ink); color:var(--paper-raise); font-family:'IBM Plex Mono',monospace; font-size:12px; text-transform:uppercase; letter-spacing:.06em;}
  .price-row .sys{font-weight:700; font-size:15px;}
  .price-row .desc{font-size:13px; color:var(--text-mute); margin-top:3px;}
  .price-row .num{font-family:'IBM Plex Mono',monospace; font-size:20px; font-weight:700;}
  .price-note{margin-top:18px; font-size:13.5px; color:var(--text-mute); max-width:640px; line-height:1.6;}

  /* CALCULATOR */
  .calc-box{margin-top:28px; border:1px solid var(--concrete-line); border-radius:var(--radius); background:var(--paper-raise); padding:26px; max-width:560px;}
  .calc-row{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:16px;}
  .calc-field label{display:block; font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--text-mute); margin-bottom:6px;}
  .calc-field input, .calc-field select{width:100%; padding:11px 12px; border-radius:8px; border:1px solid var(--concrete-line); background:var(--paper); font-family:'Inter',sans-serif; font-size:14.5px; color:var(--text-dark);}
  .calc-result{margin-top:6px; padding:18px; border-radius:10px; background:var(--ink); color:var(--paper-raise);}
  .calc-result .amt{font-family:'IBM Plex Mono',monospace; font-size:34px; font-weight:700; background:var(--sheen); background-size:300% 300%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:sheenmove 5s linear infinite;}
  .calc-result .lbl{font-size:12px; color:#9d9fae; margin-top:4px;}

  /* MATERIALS */
  .materials{background:var(--paper-raise); border-top:1px solid var(--concrete-line); border-bottom:1px solid var(--concrete-line);}
  .mat-source{margin-top:24px; font-size:13.5px; color:var(--text-mute); display:flex; flex-wrap:wrap; gap:8px 20px; align-items:center;}
  .mat-source a{color:var(--ink); font-weight:600; text-decoration:underline;}

  .gallery-cat{margin-top:38px;}
  .gallery-cat:first-child{margin-top:8px;}
  .gallery-cat .cat-label{font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:.07em; text-transform:uppercase; color:var(--text-mute); display:flex; align-items:center; gap:10px; margin-bottom:16px;}
  .gallery-cat .cat-label::after{content:""; flex:1; height:1px; background:var(--concrete-line);}
  .swatch2-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
  .swatch2{border-radius:var(--radius); overflow:hidden; border:1px solid var(--concrete-line); background:var(--paper-raise); transition:transform .18s ease, box-shadow .18s ease;}
  .swatch2:hover{transform:translateY(-3px); box-shadow:0 10px 24px rgba(20,22,28,.1);}
  .swatch2 .fill2{height:120px; width:100%; object-fit:cover; display:block;}
  .swatch2 .label2{padding:13px 15px;}
  .swatch2 .label2 .nm{font-size:14px; font-weight:700;}
  .swatch2 .label2 .ds{font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--text-mute); margin-top:3px; display:block;}
  .gallery-note{margin-top:28px; font-size:13.5px; color:var(--text-mute); max-width:640px; line-height:1.6; padding:14px 16px; border-left:3px solid var(--violet); background:var(--paper-raise); border-radius:0 8px 8px 0;}

  /* MAP */
  .map-wrap{margin-top:20px; border-radius:var(--radius); overflow:hidden; border:1px solid rgba(255,255,255,.15); height:280px;}
  .map-wrap iframe{width:100%; height:100%; border:0; filter:grayscale(0.15) contrast(1.05);}

  /* FAQ */
  .faq{max-width:760px; margin-top:44px;}
  details{border-bottom:1px solid var(--concrete-line); padding:20px 0;}
  summary{cursor:pointer; font-weight:700; font-size:16px; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:20px;}
  summary::-webkit-details-marker{display:none;}
  summary .plus{font-family:'IBM Plex Mono',monospace; font-size:20px; color:var(--violet); transition:transform .2s ease; flex:none;}
  details[open] summary .plus{transform:rotate(45deg);}
  details p{font-size:14.5px; color:var(--text-mute); line-height:1.65; margin:12px 0 0;}

  /* CONTACT */
  .contact{background:var(--ink); color:var(--paper-raise);}
  .contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:60px; margin-top:44px;}
  .contact-info p{color:#c6c7ce; font-size:15.5px; line-height:1.7;}
  .info-row{display:flex; align-items:flex-start; gap:14px; margin-top:16px; font-size:14.5px;}
  .info-row .ico{width:34px;height:34px;border-radius:9px;background:var(--ink-soft);display:flex;align-items:center;justify-content:center;flex:none; margin-top:1px;}
  .info-text{flex:1; min-width:0; padding-top:7px; font-family:'IBM Plex Mono',monospace; font-size:13.5px; letter-spacing:.01em; line-height:1.5; word-break:break-word;}
  .info-text a{color:#8effe8; text-decoration:underline; text-underline-offset:2px;}
  form{display:grid; gap:16px; background:var(--ink-soft); border:1px solid rgba(255,255,255,.1); border-radius:20px; padding:28px; position:relative; overflow:hidden;}
  .work-carousel{width:100%; margin-top:36px;}
  .wk-viewport{position:relative; width:100%; aspect-ratio:4/3; background:var(--ink); overflow:hidden;}
  .wk-slide{position:absolute; inset:0; opacity:0; transition:opacity .5s ease; pointer-events:none;}
  .wk-slide.is-active{opacity:1; pointer-events:auto;}
  .wk-slide img{width:100%; height:100%; object-fit:cover; display:block;}
  .wk-slide::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 60%, rgba(0,0,0,.7) 100%); pointer-events:none;}
  .wk-arrow{position:absolute; top:50%; translate:0 -50%; width:44px; height:44px; border-radius:50%; border:none; background:rgba(20,22,28,.55); color:#fff; font-size:24px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .18s ease; z-index:3;}
  .wk-arrow:hover{background:rgba(20,22,28,.82);}
  .wk-prev{left:18px;} .wk-next{right:18px;}
  .wk-count{position:absolute; right:18px; top:18px; z-index:3; font-family:'IBM Plex Mono',monospace; font-size:12px; color:#fff; background:rgba(20,22,28,.55); padding:4px 10px; border-radius:20px;}
  .wk-dots{display:flex; gap:8px; justify-content:center; padding:16px 0 4px;}
  .wk-dot{width:8px; height:8px; border-radius:50%; border:none; background:var(--concrete); cursor:pointer; padding:0; transition:background .18s ease, transform .18s ease;}
  .wk-dot.is-active{background:var(--teal); transform:scale(1.3);}
  @media(min-width:700px){.wk-viewport{aspect-ratio:16/8;}}
  @media(min-width:1100px){.wk-viewport{aspect-ratio:21/9; max-height:640px;}}
  @media(max-width:640px){.wk-arrow{width:36px; height:36px; font-size:19px;}}
  form::before{content:""; position:absolute; top:0; left:0; right:0; height:4px; background:var(--sheen); background-size:300% 300%; animation:sheenmove 7s ease-in-out infinite alternate; pointer-events:none;}
  .form-row{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
  label{font-size:12.5px; font-family:'IBM Plex Mono',monospace; color:#9d9fae; display:block; margin-bottom:6px;}
  input,select,textarea{
    width:100%; padding:13px 15px; border-radius:9px; border:1px solid rgba(255,255,255,.16);
    background:var(--ink); color:var(--paper-raise); font-family:'Inter',sans-serif; font-size:15px;
    transition:border-color .15s ease, background .15s ease;
  }
  input::placeholder, textarea::placeholder{color:#71737f;}
  input:hover,select:hover,textarea:hover{border-color:rgba(255,255,255,.3);}
  input:focus,select:focus,textarea:focus{outline:2px solid var(--teal); outline-offset:1px; border-color:var(--teal);}
  textarea{resize:vertical; min-height:90px;}
  .form-msg{font-size:14px; margin-top:2px; color:#8effe8; display:none; font-weight:600;}
  .form-success{display:none; margin-top:6px; padding:22px 20px; border-radius:var(--radius); background:rgba(142,255,232,.08); border:1.5px solid rgba(142,255,232,.35); text-align:center;}
  .form-success .check{width:52px; height:52px; border-radius:50%; background:#8effe8; color:#0b0b12; display:flex; align-items:center; justify-content:center; margin:0 auto 14px; font-size:26px; font-weight:800;}
  .form-success h3{margin:0 0 8px; font-size:19px; color:#f4f5f2;}
  .form-success p{margin:0; font-size:14px; color:#c9cad2; line-height:1.5;}
  .form-success .alt{margin-top:14px; font-size:13px;}
  .form-success .alt a{color:#8effe8; text-decoration:underline;}
  @keyframes popIn{0%{transform:scale(.85); opacity:0;} 100%{transform:scale(1); opacity:1;}}
  .form-success.is-visible{display:block; animation:popIn .35s ease;}

  .btn-submit{
    width:100%; border:none; cursor:pointer; padding:19px 24px; border-radius:12px;
    font-family:'Poppins',sans-serif; font-weight:700; font-size:17px; color:var(--ink);
    background:var(--sheen); background-size:300% 300%; animation:sheenmove 6s ease-in-out infinite alternate;
    box-shadow:0 10px 28px rgba(139,107,255,.35);
    transition:transform .1s ease, box-shadow .15s ease, filter .15s ease;
    display:flex; align-items:center; justify-content:center; gap:10px;
    -webkit-tap-highlight-color:transparent;
  }
  .btn-submit-lg{padding:24px 24px; font-size:19.5px; letter-spacing:.01em; border-radius:14px; box-shadow:0 14px 36px rgba(139,107,255,.42);}
  .btn-submit-lg:hover{box-shadow:0 18px 44px rgba(139,107,255,.55);}
  .submit-note{text-align:center; margin-top:10px; font-size:12.5px; color:#9a9ba3; font-family:'IBM Plex Mono',monospace; letter-spacing:.01em;}
  .btn-submit:hover{box-shadow:0 14px 34px rgba(139,107,255,.45); filter:brightness(1.05);}
  .btn-submit:active{transform:scale(.97); box-shadow:0 4px 14px rgba(139,107,255,.3); filter:brightness(.95);}
  .btn-submit:disabled{cursor:default; filter:grayscale(.35) brightness(.9);}
  .btn-submit:focus-visible{outline:3px solid var(--teal); outline-offset:3px;}
  .spinner{width:18px; height:18px; border-radius:50%; border:2.5px solid rgba(20,22,28,.25); border-top-color:var(--ink); animation:spin .7s linear infinite; display:none; flex:none;}
  .btn-submit.is-loading .spinner{display:inline-block;}
  @keyframes spin{to{transform:rotate(360deg);}}

  footer{background:var(--ink); border-top:1px solid rgba(255,255,255,.1); color:#9d9fae; padding:36px 0;}

  .float-cta{position:fixed; right:14px; bottom:calc(22px + env(safe-area-inset-bottom)); z-index:80; display:flex; flex-direction:column; gap:10px;
    opacity:0; transform:translateY(16px) scale(.9); pointer-events:none; transition:opacity .25s ease, transform .25s ease;}
  .float-cta.is-visible{opacity:1; transform:translateY(0) scale(1); pointer-events:auto;}
  .float-btn{width:54px; height:54px; border-radius:50%; display:flex; align-items:center; justify-content:center;
    box-shadow:0 8px 22px rgba(20,22,28,.28); -webkit-tap-highlight-color:transparent; transition:transform .12s ease;}
  .float-btn:active{transform:scale(.92);}
  .float-whatsapp{background:#25D366;}
  .float-text{background:var(--paper-raise);}
  .float-quote{width:58px; height:74px; border-radius:20px; padding:0; gap:3px; flex-direction:column;
    background:var(--sheen); background-size:300% 300%;
    animation:sheenmove 6s ease-in-out infinite alternate, floatBounce 4.5s ease-in-out infinite;
    color:var(--ink); font-weight:700; font-size:10.5px; font-family:'Poppins',sans-serif; text-decoration:none; white-space:nowrap; line-height:1.15;}
  @keyframes floatBounce{
    0%, 78%, 100%{transform:translateY(0);}
    84%{transform:translateY(-9px);}
    89%{transform:translateY(0);}
    93%{transform:translateY(-4px);}
    96%{transform:translateY(0);}
  }
  @media (prefers-reduced-motion: reduce){.float-quote{animation:none;}}
  @media(min-width:921px){.float-cta{display:none;}}
  .foot-wrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; font-size:13px;}
  .foot-updated{width:100%; font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--text-mute); opacity:.75; margin-top:-4px;}

  @media(max-width:920px){
    .hero .wrap{grid-template-columns:1fr; padding-top:36px;}
    .navlinks{display:none;}
    .burger{display:block;}
    .trust .wrap{grid-template-columns:1fr 1fr;}
    .svc-grid{grid-template-columns:1fr 1fr;}
    .process-grid{grid-template-columns:1fr 1fr;}
    .swatch-grid{grid-template-columns:1fr 1fr;}
    .swatch2-grid{grid-template-columns:1fr 1fr;}
    .price-row{grid-template-columns:1fr; gap:4px;}
    .contact-grid{grid-template-columns:1fr;}
    .form-row{grid-template-columns:1fr;}
  }
  @media(max-width:560px){
    .svc-grid{grid-template-columns:1fr;}
    .process-grid{grid-template-columns:1fr;}
    .swatch-grid{grid-template-columns:1fr;}
    .swatch2-grid{grid-template-columns:1fr;}
    section{padding:44px 0;}
    .calc-row{grid-template-columns:1fr;}
  }

  /* Flake feature carousel — real install photos */
  .flake-feature{margin-top:26px;}
  .fc-card{border-radius:var(--radius); overflow:hidden; border:1px solid var(--concrete-line); background:var(--paper-raise); box-shadow:0 10px 24px rgba(20,22,28,.06);}
  .fc-viewport{position:relative; aspect-ratio:4/3; background:var(--ink); overflow:hidden;}
  .fc-slide{position:absolute; inset:0; opacity:0; transition:opacity .45s ease; pointer-events:none;}
  .fc-slide.is-active{opacity:1; pointer-events:auto;}
  .fc-slide img{width:100%; height:100%; object-fit:cover; display:block;}
  .fc-arrow{position:absolute; top:50%; translate:0 -50%; width:38px; height:38px; border-radius:50%; border:none; background:rgba(20,22,28,.55); color:#fff; font-size:22px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .18s ease;}
  .fc-arrow:hover{background:rgba(20,22,28,.8);}
  .fc-prev{left:12px;} .fc-next{right:12px;}
  .fc-count{position:absolute; right:12px; bottom:10px; font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:#fff; background:rgba(20,22,28,.55); padding:3px 8px; border-radius:20px; letter-spacing:.02em;}
  .fc-dots{display:flex; gap:7px; justify-content:center; padding:12px 0 4px;}
  .fc-dot{width:7px; height:7px; border-radius:50%; border:none; background:var(--concrete); cursor:pointer; padding:0; transition:background .18s ease, transform .18s ease;}
  .fc-dot.is-active{background:var(--teal); transform:scale(1.3);}
  .fc-label2{padding:2px 16px 16px;}
  .fc-label2 .nm{font-size:15px; font-weight:700;}
  .fc-label2 .ds{font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--text-mute); margin-top:3px; display:block;}
  @media (max-width:640px){ .fc-arrow{width:32px; height:32px; font-size:18px;} }

  .fc-slide-cap{position:absolute; left:12px; bottom:10px; font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:#fff; background:rgba(20,22,28,.55); padding:4px 10px; border-radius:20px; letter-spacing:.02em;}
  .fc-slide-cap strong{font-weight:600;}
  .btn-instagram{background:linear-gradient(135deg,#f58529,#dd2a7b 45%,#8134af 75%,#515bd4); color:#fff;}
  .btn-instagram:hover{box-shadow:0 10px 26px rgba(221,42,123,.35);}

  .promo-bar{background:var(--teal); color:var(--ink); text-align:center; font-family:'IBM Plex Mono',monospace; font-size:13.5px; font-weight:600; letter-spacing:.01em; padding:11px 46px 11px 16px; position:relative;}
  .promo-bar b{font-weight:700;}
  .promo-close{position:absolute; right:12px; top:50%; transform:translateY(-50%); background:none; border:none; font-size:19px; line-height:1; cursor:pointer; color:var(--ink); opacity:.65; padding:4px;}
  .promo-close:hover{opacity:1;}
  @media(max-width:480px){.promo-bar{font-size:12px; padding:10px 40px 10px 12px;}}

  .promise-strip{width:100%; background:var(--ink); overflow:hidden; padding:20px 0;}
  .promise-track{display:flex; width:max-content; animation:promiseMarquee 34s linear infinite;}
  .promise-strip:hover .promise-track{animation-play-state:paused;}
  .promise-item{display:flex; align-items:center; gap:13px; padding:0 42px; white-space:nowrap; font-family:'IBM Plex Mono',monospace; font-size:14.5px; color:#e9eaf0;}
  .promise-item .dot{width:6px; height:6px; border-radius:50%; background:var(--teal); flex:none;}
  @keyframes promiseMarquee{0%{transform:translateX(0);} 100%{transform:translateX(-50%);}}
  @media (prefers-reduced-motion: reduce){.promise-track{animation:none; overflow-x:auto; -webkit-overflow-scrolling:touch;}}
  @media(max-width:640px){.promise-item{font-size:13px; padding:0 30px;}}

  .color-strip{display:flex; gap:22px; overflow-x:auto; padding:8px 2px 16px; margin-top:22px; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch;}
  .color-chip{flex:none; scroll-snap-align:start; display:flex; flex-direction:column; align-items:center; gap:7px; width:104px; text-align:center;}
  .color-chip:hover .swatch-wrap img{transform:scale(1.07);}
  .swatch-wrap img{transition:transform .18s ease;}
  .color-chip .chip-nm{font-family:'IBM Plex Mono',monospace; font-size:12.5px; font-weight:600; color:var(--text-dark);}
  .color-chip .chip-ds{font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:var(--text-mute); line-height:1.35;}
  @media(min-width:760px){.color-strip{flex-wrap:wrap; overflow-x:visible; justify-content:flex-start;}}

  /* QUOTE MODAL */
  .quote-modal{position:fixed; inset:0; z-index:95; display:flex; align-items:flex-end; justify-content:center;
    visibility:hidden; pointer-events:none; transition:visibility 0s linear .45s;}
  .quote-modal.is-open{visibility:visible; pointer-events:auto; transition-delay:0s;}
  .quote-modal-backdrop{position:absolute; inset:0; background:rgba(11,11,15,.6); backdrop-filter:blur(2px); opacity:0; transition:opacity .4s ease;}
  .quote-modal.is-open .quote-modal-backdrop{opacity:1;}
  .quote-modal-panel{position:relative; width:100%; max-width:480px; max-height:88vh; overflow-y:auto;
    background:var(--ink); color:var(--paper-raise); border-radius:22px 22px 0 0; padding:28px 24px 30px;
    transform:translateY(36px) scale(.98); opacity:0;
    transition:transform .45s cubic-bezier(.16,1,.3,1), opacity .4s ease;
    box-shadow:0 -10px 40px rgba(0,0,0,.35);
  }
  .quote-modal.is-open .quote-modal-panel{transform:translateY(0) scale(1); opacity:1;}
  .quote-modal-close{position:absolute; top:16px; right:16px; width:34px; height:34px; border-radius:50%;
    background:rgba(255,255,255,.08); border:none; color:var(--paper-raise); font-size:22px; line-height:1;
    cursor:pointer; display:flex; align-items:center; justify-content:center; -webkit-tap-highlight-color:transparent;}
  .quote-modal-close:hover{background:rgba(255,255,255,.16);}
  .quote-modal-title{font-size:22px; margin:0 34px 6px 0; line-height:1.2;}
  .quote-modal-sub{font-size:13.5px; color:#b9bac2; margin:0 0 26px;}
  .quote-modal .quote-form{background:transparent; border:none; padding:0; gap:16px;}
  .qm-field{display:flex; flex-direction:column; gap:6px;}
  .qm-field:first-of-type{margin-top:4px;}
  .qm-field label{font-size:12.5px; font-family:'IBM Plex Mono',monospace; color:#9a9ba3;}
  .qm-field input{width:100%; padding:12px 13px; border-radius:9px; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.06); color:var(--paper-raise); font-family:'Inter',sans-serif; font-size:16px;}
  .qm-field input::placeholder{color:#7d7e86;}
  @media(min-width:640px){
    .quote-modal{align-items:center;}
    .quote-modal-panel{border-radius:22px; transform:translateY(12px) scale(.97);}
    .quote-modal.is-open .quote-modal-panel{transform:translateY(0) scale(1);}
  }
  body.modal-open{overflow:hidden;}

  .shine{position:relative; overflow:hidden;}
  .shine::after{
    content:""; position:absolute; top:0; left:-150%; width:60%; height:100%;
    background:linear-gradient(115deg, transparent 25%, rgba(255,255,255,.5) 45%, rgba(255,255,255,.85) 50%, rgba(255,255,255,.5) 55%, transparent 75%);
    transform:skewX(-20deg);
    animation:shineSweep 3.4s ease-in-out infinite;
    pointer-events:none;
  }
  @keyframes shineSweep{
    0%{left:-150%;} 45%{left:150%;} 100%{left:150%;}
  }
  @media (prefers-reduced-motion: reduce){ .shine::after{animation:none; display:none;} }
  .swatch-wrap{position:relative; width:92px; height:92px; border-radius:50%; overflow:hidden; box-shadow:0 6px 16px rgba(20,22,28,.14); cursor:pointer;}
  .swatch-wrap img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .3s cubic-bezier(.4,0,.2,1);}
  .swatch-wrap.is-zoomed img{transform:scale(1.4);}
  .swatch-wrap.is-zoomed{box-shadow:0 8px 22px rgba(20,22,28,.28), 0 0 0 3px var(--violet);}

  /* Falling flake particles in hero */
  .flake-particles{position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:1;}
  .flake-p{position:absolute; top:-20px; border-radius:2px; opacity:0; animation:flakeFall linear infinite;}
  @keyframes flakeFall{
    0%{transform:translateY(-10vh) translateX(0) rotate(var(--rot)); opacity:0;}
    8%{opacity:.55;}
    90%{opacity:.35;}
    100%{transform:translateY(115vh) translateX(var(--drift)) rotate(calc(var(--rot) + 180deg)); opacity:0;}
  }
  @media (prefers-reduced-motion: reduce){.flake-particles{display:none;}}

  /* Scroll-reveal */
  .reveal{opacity:0; transform:translateY(24px); transition:opacity .6s ease, transform .6s ease;}
  .reveal.is-visible{opacity:1; transform:translateY(0);}
  .why-item.reveal:nth-child(2){transition-delay:.08s;}
  .why-item.reveal:nth-child(3){transition-delay:.16s;}
  .why-item.reveal:nth-child(4){transition-delay:.24s;}
  .mat-card.reveal:nth-child(2){transition-delay:.08s;}
  .mat-card.reveal:nth-child(3){transition-delay:.16s;}
  .step.reveal:nth-child(2){transition-delay:.08s;}
  .step.reveal:nth-child(3){transition-delay:.16s;}
  .step.reveal:nth-child(4){transition-delay:.24s;}
  @media (prefers-reduced-motion: reduce){.reveal{opacity:1; transform:none; transition:none;}}

  /* Scroll progress bar */
  .scroll-progress{position:fixed; top:0; left:0; height:3px; width:0%; z-index:200;
    background:var(--sheen); background-size:300% 300%; animation:sheenmove 6s ease-in-out infinite alternate;
    pointer-events:none;}

  /* Image hover zoom (flake/colour photography) */
  .fc-slide img, .wk-slide img{transition:transform .5s ease;}
  .fc-viewport:hover .fc-slide.is-active img, .wk-viewport:hover .wk-slide.is-active img{transform:scale(1.045);}


  /* Before / after slider */
  .ba-slider{position:relative; overflow:hidden; border-radius:var(--radius); aspect-ratio:4/3; margin-top:28px;
    cursor:ew-resize; touch-action:pan-y; box-shadow:0 14px 34px rgba(20,22,28,.16); border:1px solid var(--concrete-line);}
  .ba-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;
    -webkit-user-select:none; user-select:none; -webkit-user-drag:none; pointer-events:none;}
  .ba-before{clip-path:inset(0 50% 0 0);}
  .ba-tag{position:absolute; top:14px; font-family:'IBM Plex Mono',monospace; font-size:11.5px; font-weight:600;
    color:#fff; background:rgba(20,22,28,.6); padding:5px 10px; border-radius:20px; letter-spacing:.03em; z-index:2;}
  .ba-tag-before{left:14px;} .ba-tag-after{right:14px;}
  .ba-handle{position:absolute; top:0; bottom:0; left:50%; width:0; z-index:3; pointer-events:none;}
  .ba-handle-line{position:absolute; top:0; bottom:0; left:-1.5px; width:3px; background:#fff; box-shadow:0 0 0 1px rgba(20,22,28,.15);}
  .ba-handle-circle{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:46px; height:46px;
    border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center;
    box-shadow:0 6px 18px rgba(20,22,28,.35);}
  @media(max-width:560px){.ba-handle-circle{width:38px; height:38px;}}

  /* Cursor flake sparkle trail (fine-pointer devices only) */
  .cursor-flake{position:fixed; z-index:250; pointer-events:none; border-radius:2px;
    background:linear-gradient(135deg,#1fbfae,#8b6bff,#ff8fd6);
    animation:cursorFlakeFade .9s ease forwards;}
  @keyframes cursorFlakeFade{
    0%{opacity:.85; transform:translateY(0) rotate(0deg) scale(1);}
    100%{opacity:0; transform:translateY(18px) rotate(50deg) scale(.6);}
  }

  /* 3D tilt on hover (why-item, mat-card) */
  .tilt-card{transform-style:preserve-3d; transition:transform .25s ease-out;}

  @media (prefers-reduced-motion: reduce){.cursor-flake{display:none;} .tilt-card{transition:none !important; transform:none !important;}}

  /* Packages */
  .pkg-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:30px;}
  .pkg-card{border:1px solid var(--concrete-line); border-radius:var(--radius); padding:26px 24px; background:var(--paper-raise);}
  .pkg-card-featured{background:var(--ink); border-color:var(--ink);}
  .pkg-name{font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:20px; margin-bottom:6px;}
  .pkg-card-featured .pkg-name{color:var(--paper-raise);}
  .pkg-mini-carousel{position:relative; border-radius:10px; overflow:hidden; height:150px; margin:12px 0 16px;}
  .pkg-mini-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .35s ease;}
  .pkg-mini-img.is-active{opacity:1;}
  .pkg-mini-dots{position:absolute; bottom:8px; right:10px; display:flex; gap:6px; z-index:1;}
  .pkg-mini-dot{width:7px; height:7px; border-radius:50%; border:none; background:rgba(255,255,255,.5); cursor:pointer; padding:0;}
  .pkg-mini-dot.is-active{background:#fff;}
  .pkg-sub{font-size:13.5px; color:var(--text-mute); margin:0 0 18px;}
  .pkg-card-featured .pkg-sub{color:#b9bac2;}
  .pkg-list{list-style:none; margin:0 0 22px; padding:0; display:flex; flex-direction:column; gap:10px;}
  .pkg-list li{font-size:14.5px; padding-left:24px; position:relative;}
  .pkg-list li::before{content:"+"; position:absolute; left:0; top:0; color:var(--teal); font-weight:700;}
  .pkg-card-featured .pkg-list li{color:#e9eaf0;}
  .pkg-note{font-size:12.5px; color:var(--text-mute); margin-top:18px; font-family:'IBM Plex Mono',monospace;}
  @media(max-width:700px){.pkg-grid{grid-template-columns:1fr;}}

  .ba-tag-after{background:rgba(139,107,255,.85);}

  .info-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:18px;}
  .info-chip{display:flex; align-items:center; gap:9px; padding:10px 12px; border-radius:10px;
    background:var(--ink-soft); font-size:13.5px; font-family:'IBM Plex Mono',monospace; color:#e9eaf0;
    text-decoration:none; transition:background .15s ease;}
  .info-chip:hover{background:#262a34;}
  .info-chip .ico{width:28px; height:28px; border-radius:8px; background:rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; flex:none;}
  .info-chip-static{cursor:default;}
  .info-chip-static:hover{background:var(--ink-soft);}
  .info-phone{margin-top:14px; font-size:13px; color:#9a9ba3; font-family:'IBM Plex Mono',monospace;}
  @media(max-width:420px){.info-grid{grid-template-columns:1fr;}}