:root{
    --bg:#E7F0ED;
    --surface:#27646aeb;
    --gold:#F0B44F;
    --gold-light:#FFF0D2;
    --teal:#153F46;
    --teal-soft:#286A70;
    --line:#F0B44F;
    --line-soft:rgba(240, 180, 79, 0.56);
    --font-head:'Playfair Display', serif;
    --font-body:'Poppins', sans-serif;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth; overflow-x:hidden;}
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{animation-duration:0.001ms !important; transition-duration:0.001ms !important;}
  }
  body{
    font-family:var(--font-body);
    color:var(--gold-light);
    background:var(--teal);
    line-height:1.6;
    font-weight:400;
    overflow-x:hidden;
  }
  img,svg,video,iframe{max-width:100%;}
  a{color:inherit;}
  .mono{font-family:'IBM Plex Mono', monospace;}
  .display{font-family:var(--font-head);}
  :focus-visible{outline:3px solid var(--gold); outline-offset:3px;}

  .loading-screen{
    position:fixed; inset:0; z-index:200; display:grid; place-items:center; overflow:hidden;
    background:var(--teal); opacity:1; visibility:visible;
    transition:opacity 0.45s ease, visibility 0.45s ease;
  }
  .loading-screen.is-hidden{opacity:0; visibility:hidden; pointer-events:none;}
  .magic-rings-container{width:100%; height:100%;}
  .loading-rings{position:absolute; inset:0; pointer-events:none;}
  .loading-rings canvas{display:block; width:100%; height:100%;}
  .loading-screen img{position:relative; z-index:1; width:min(300px, 68vw); height:auto; animation:loading-logo 1.4s ease-in-out infinite;}
  @keyframes loading-logo{
    0%, 100%{transform:scale(0.96); opacity:0.72;}
    50%{transform:scale(1); opacity:1;}
  }
  @media (prefers-reduced-motion: reduce){
    .loading-screen img{animation:none;}
  }

  .wrap{max-width:1180px; margin:0 auto; padding:0 28px;}

  /* SCROLL PROGRESS RULE */
  .scroll-rule{position:fixed; top:0; left:0; height:3px; width:100%; z-index:100; background:var(--line-soft);}
  .scroll-rule-fill{height:100%; width:0%; background:linear-gradient(90deg, var(--gold), var(--gold-light)); transition:width 0.05s linear;}

  /* NAV — solid teal background */
  header{
    position:sticky; top:3px; z-index:50;
    backdrop-filter:blur(30px);
    background:var(--teal);
    border-bottom:5px solid rgba(215, 213, 206, 0.25);
  }
  .navbar{display:flex; align-items:center; justify-content:space-between; padding:12px 28px; max-width:1180px; margin:0 auto;}
  .logo{display:flex; align-items:center; gap:10px; min-width:0; color:var(--gold); text-decoration:none;}
  .logo-img{height:44px; width:auto; display:block; transition:transform 0.35s cubic-bezier(.2,.9,.3,1.3);}
  .logo:hover .logo-img{transform:rotate(-4deg) scale(1.06);}
  .logo-text{font-family:var(--font-head); font-weight:700; font-size:18px; letter-spacing:0.01em; color:var(--gold); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  nav ul{list-style:none; display:flex; gap:28px;}
  nav a{color:rgba(232,178,84,0.85); text-decoration:none; font-size:14.5px; font-weight:500; position:relative;}
  nav a::after{content:""; position:absolute; left:0; bottom:-4px; width:0; height:1.5px; background:var(--gold); transition:width 0.25s ease;}
  nav a:hover,
  nav a.active{color:var(--gold);}
  nav a:hover::after,
  nav a.active::after{width:100%;}
  .nav-right{display:flex; align-items:center; gap:16px;}
  .btn{
    display:inline-block; background:var(--gold); color:#153F46; text-decoration:none;
    padding:10px 18px; font-weight:600; font-size:14.5px; border:none; cursor:pointer;
    transition:background 0.2s ease, transform 0.2s ease; font-family:var(--font-body);
  }
  .btn:hover{background:var(--gold-light); transform:translateY(-2px);}
  .navmenu-toggle{
    all: unset;
    cursor: pointer;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    position: relative;
    border-radius: 999vw;
    display: none;
  }
  
  .navmenu-toggle::after {
    display: none;
  }
  
  .navmenu-toggle .button-outer {
    position: relative;
    z-index: 1;
    border-radius: inherit;
    transition: box-shadow 300ms ease;
    will-change: box-shadow;
    box-shadow: none;
  }
  
  .navmenu-toggle:hover .button-outer {
    box-shadow: none;
  }
  
  .navmenu-toggle .button-inner {
    --inset: 0.035em;
    position: relative;
    z-index: 1;
    border-radius: inherit;
    padding: 1em 1.5em;
    background-image: linear-gradient(135deg, rgba(38, 88, 97, 1), rgba(21, 63, 70, 1));
    transition: box-shadow 300ms ease, clip-path 250ms ease, background-image 250ms ease, transform 250ms ease;
    will-change: box-shadow, clip-path, background-image, transform;
    overflow: clip;
    clip-path: inset(0 0 0 0 round 999vw);
    box-shadow: 0 0 0 0 inset rgba(5, 5, 5, 0.1), -0.05em -0.05em 0.05em 0 inset rgba(5, 5, 5, 0.25), 0 0 0 0 inset rgba(5, 5, 5, 0.1), 0 0 0.05em 0.2em inset rgba(255, 255, 255, 0.25), 0.025em 0.05em 0.1em 0 inset rgba(255, 255, 255, 1), 0.12em 0.12em 0.12em inset rgba(255, 255, 255, 0.25), -0.075em -0.25em 0.25em 0.1em inset rgba(5, 5, 5, 0.25);
    border: none;
  }
  
  .navmenu-toggle:hover .button-inner {
    clip-path: inset(clamp(1px, 0.0625em, 2px) clamp(1px, 0.0625em, 2px) clamp(1px, 0.0625em, 2px) clamp(1px, 0.0625em, 2px) round 999vw);
    box-shadow: 0.1em 0.15em 0.05em 0 inset rgba(5, 5, 5, 0.75), -0.025em -0.03em 0.05em 0.025em inset rgba(5, 5, 5, 0.5), 0.25em 0.25em 0.2em 0 inset rgba(5, 5, 5, 0.5), 0 0 0.05em 0.5em inset rgba(255, 255, 255, 0.15), 0 0 0 0 inset rgba(255, 255, 255, 1), 0.12em 0.12em 0.12em inset rgba(255, 255, 255, 0.25), -0.075em -0.12em 0.2em 0.1em inset rgba(5, 5, 5, 0.25);
  }
  
  .navmenu-toggle .button-inner span {
    position: relative;
    z-index: 4;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 14.5px;
    color: var(--gold-light);
    transition: transform 250ms ease;
    display: block;
    will-change: transform;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }
  
  .navmenu-toggle:hover .button-inner span {
    transform: scale(0.975);
  }
  
  .navmenu-toggle:active .button-inner {
    transform: scale(0.975);
  }
  @media (min-width:641px) and (max-width:900px){
    .navbar{padding-left:16px; padding-right:16px;}
    .logo-text{font-size:15px;}
    nav ul{gap:12px;}
    nav a{font-size:12px;}
    .nav-right{gap:8px;}
  }
  @media (max-width:640px){
    html{-webkit-text-size-adjust:100%;}
    body{overflow-x:hidden;}
    h1,h2,h3,h4,p,span,a,button,input,textarea,select{overflow-wrap:anywhere; word-break:break-word;}
    .navmenu-toggle{display:block;}
    nav ul{display:none; position:absolute; top:calc(100% + 12px); right:16px; width:min(220px, calc(100vw - 32px)); flex-direction:column; gap:0; padding:8px 0; background:var(--teal); border:1px solid var(--line); box-shadow:0 14px 30px rgba(0,0,0,0.25);}
    nav ul.is-open{display:flex;}
    nav li a{display:block; padding:10px 16px;}
    nav li a::after{display:none;}
    .navbar{position:relative; padding:10px 16px; gap:12px;}
    .logo-text{font-size:15px;}
    .nav-right{gap:8px; flex-shrink:0;}
    .hero-inner{padding-left:18px; padding-right:18px;}
    .hero h1{font-size:clamp(2.5rem, 11vw, 4rem); line-height:0.96; letter-spacing:-0.045em; max-width:100%;}
    .hero p.lede{font-size:1rem; line-height:1.6; max-width:100%; margin-top:18px;}
    .hero-ctas{flex-direction:column; align-items:stretch; gap:10px;}
    .hero-ctas a{width:100%; text-align:center; white-space:normal;}
    .btn-outline,.btn{display:flex; justify-content:center; align-items:center; min-height:48px;}
    .section-head h2{font-size:clamp(2rem,8vw,2.8rem); line-height:1.1;}
    .section-head p{font-size:0.97rem; line-height:1.6;}
    .spec-card,.cert-card,.why-card{padding:18px 16px;}
    .spec-card h3,.cert-card h3,.why-card h3{line-height:1.25; font-size:1.05rem;}
    .spec-card .desc,.cert-card .cert-scope,.why-card p{font-size:0.92rem; line-height:1.55;}
    .contact-card .row{display:grid; grid-template-columns:1fr; gap:4px; padding:12px 0;}
    .contact-card .k{display:block; margin-bottom:2px;}
    .page-hero h1{font-size:clamp(2.2rem, 9vw, 3.2rem); line-height:1.04;}
  }
  @media (max-width:380px){
    .logo{gap:0;}
    .logo-img{height:38px;}
    .logo-text{display:none;}
    .navbar{padding-left:12px; padding-right:12px;}
  }

  /* HERO */
  .hero{
    background:var(--teal-soft); color:var(--gold-light); position:relative; overflow:hidden;
    border-bottom:1px solid var(--line);
  }
  .hero-spotlight{
    position:absolute; inset:0; pointer-events:none;
    background:radial-gradient(420px circle at var(--mx,50%) var(--my,20%), rgba(215,172,54,0.18), transparent 70%);
    transition:background 0.15s ease;
  }
  .hero-inner{max-width:1180px; margin:0 auto; padding:72px 28px 64px; position:relative;}
  .titleblock{
    position:absolute; top:40px; right:28px; border:1px solid var(--line);
    font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--gold-light);
    padding:12px 14px; line-height:1.9; display:none; background:#265861; border-radius:4px; text-transform:uppercase;
  }
  @media (min-width:900px){ .titleblock{display:block;} }
  .titleblock .row{display:flex; gap:18px; border-top:1px solid var(--line-soft); padding-top:6px; margin-top:6px;}
  .titleblock .row:first-child{border-top:none; padding-top:0; margin-top:0;}
  .titleblock span.k{color:var(--gold);}
  .eyebrow{
    font-family:'IBM Plex Mono',monospace; color:var(--gold); font-size:13px;
    letter-spacing:0.08em; text-transform:uppercase; margin-bottom:18px; display:block;
  }
  h1{
    font-family:var(--font-head); font-weight:800; font-size:clamp(34px,5.4vw,58px);
    line-height:1.12; max-width:780px; letter-spacing:-0.005em; color:var(--gold-light);
  }
  h1 em{color:var(--gold-light); font-style:italic;}
  .hero p.lede{
    max-width:560px; font-size:17px; color:var(--gold-light); margin-top:22px; font-weight:300;
  }
  .hero-ctas{display:flex; gap:14px; margin-top:32px; flex-wrap:wrap;}
  .btn-outline{
    border:1px solid var(--gold); color:var(--gold); padding:10px 18px; text-decoration:none; font-size:14.5px; font-weight:500;
    transition:border-color 0.2s ease, color 0.2s ease, background 0.2s ease;
  }
  .btn-outline:hover{border-color:var(--gold-light); color:var(--gold-light); background:rgba(215,172,54,0.08);}

  .dimline{margin-top:56px; display:flex; align-items:center; gap:0; flex-wrap:wrap;}
  .dimline .seg{
    font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--gold-light);
    padding:10px 18px; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  }
    .dimline .seg:first-child{border-left:1px solid var(--line);}
    .dimline .seg{border-right:1px solid var(--line);}
    .dimline .seg b{color:var(--gold); font-weight:600;}
  @media (max-width:640px){
    .dimline{display:grid; grid-template-columns:minmax(0, 320px); max-width:100%;}
    .dimline .seg,
    .dimline .seg:first-child{width:100%; border:1px solid var(--line); margin-top:-1px;}
    .dimline .seg:first-child{margin-top:0;}
  }

  /* SECTION shared */
  section{
    padding:76px 0;
    position:relative;
    isolation:isolate;
    transition:transform 0.25s ease, box-shadow 0.25s ease;
  }
  section::before{
    content:"";
    position:absolute;
    inset:0;
    border-radius:20px;
    background:radial-gradient(320px circle at var(--glow-x, 50%) var(--glow-y, 50%), rgba(215,172,54,0.24), transparent 72%);
    opacity:0;
    pointer-events:none;
    transition:opacity 0.25s ease;
    z-index:-1;
  }
  section:hover::before,
  section.is-hovered::before{
    opacity:1;
  }
  section:hover,
  section.is-hovered{
    transform:translateY(-2px);
    box-shadow:inset 0 0 0 1px rgba(215,172,54,0.28), 0 0 42px rgba(215,172,54,0.24);
  }
  .section-head{max-width:640px; margin-bottom:44px;}
  .section-head .eyebrow{color:var(--gold);}
  .section-head h2{font-family:var(--font-head); font-size:clamp(26px,3.4vw,36px); font-weight:700; color:var(--gold); letter-spacing:-0.005em;}
  .section-head p{color:var(--gold-light); margin-top:12px; font-size:15.5px; font-weight:300;}

  /* REVEAL */
  .reveal{opacity:0; transform:translateY(24px); transition:opacity 0.6s ease, transform 0.6s ease;}
  .reveal.is-visible{opacity:1; transform:translateY(0);}

  /* ABOUT / WHY */
  .why-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-soft); border:1px solid var(--line-soft);}
  .why-card{background:var(--teal); padding:28px 24px; transition:background 0.25s ease;}
  .why-card:hover{background:var(--surface);}
  .why-card .tag{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--gold); display:block; margin-bottom:10px;}
  .why-card h3{font-family:var(--font-head); font-weight:700; font-size:19px; margin-bottom:8px; color:var(--gold);}
  .why-card p{font-size:14.5px; color:var(--gold-light); font-weight:300;}
  @media (max-width:760px){ .why-grid{grid-template-columns:1fr;} }

  /* PRODUCTS */
  .products{background:#c3b273;}
  .products .section-head h2{color:var(--gold);}
  .products .section-head p{color:var(--gold-light);}
  .grid-spec{display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:16px;}
  .accordion-gallery{display:flex; flex-direction:row; gap:10px; width:100%; height:460px; max-width:100%; perspective:1400px; perspective-origin:50% 50%;}
  .accordion-gallery .ag-panel{position:relative; flex:1 1 0; min-width:0; min-height:0; overflow:hidden; padding:0; border:1px solid var(--line); border-radius:8px; cursor:pointer; background:#0a0713; transform-style:preserve-3d; transform-origin:center; transition:flex-grow .6s cubic-bezier(.22,1,.36,1), transform .6s cubic-bezier(.22,1,.36,1), box-shadow .3s ease; will-change:flex-grow, transform;}
  .accordion-gallery .ag-panel:focus-visible{box-shadow:0 0 0 2px var(--line), 0 10px 30px -18px rgba(0,0,0,.8); outline:none;}
  .accordion-gallery .ag-panel::before{content:""; position:absolute; inset:0; z-index:0; width:auto; height:auto; border:0; background-size:cover; background-position:center; filter:grayscale(var(--ag-gray,1)); transform:translateX(var(--ag-shift,0px)); transition:filter .6s ease, transform .6s ease;}
  .accordion-gallery .ag-panel::after{content:""; position:absolute; inset:0; z-index:1; width:auto; height:auto; border:0; background:linear-gradient(180deg, transparent 38%, rgba(21,63,70,.94) 100%), rgba(21,63,70,var(--ag-dim,.35)); pointer-events:none;}
  .accordion-gallery .ag-panel .img-slot{display:none;}
  .accordion-gallery .ag-panel .code{position:absolute; top:20px; left:20px; right:20px; z-index:2; display:block; margin:0; color:var(--gold-light); font-size:10px; letter-spacing:.08em; text-align:center; opacity:0; transform:translateY(-8px); transition:opacity .6s ease, transform .6s ease; text-shadow:0 2px 12px rgba(0,0,0,.55);}
  .accordion-gallery .ag-panel .catalogue-hint{position:absolute; left:24px; right:24px; bottom:76px; z-index:2; display:block; color:var(--gold); font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; text-align:center; opacity:0; transform:translateY(12px); transition:opacity .6s ease, transform .6s ease; text-shadow:0 2px 12px rgba(0,0,0,.55);}
  .accordion-gallery .ag-panel .desc{position:absolute; left:24px; right:24px; bottom:20px; z-index:2; display:block; margin:38px 0 0; color:var(--gold-light); font-size:12px; line-height:1.45; text-align:center; opacity:0; transform:translateY(12px); transition:opacity .6s ease, transform .6s ease; text-shadow:0 2px 12px rgba(0,0,0,.55);}
  .accordion-gallery .ag-panel h3{position:absolute; left:20px; right:20px; bottom:106px; z-index:2; margin:0; padding:0 0 10px; border-bottom:3px solid var(--line); color:var(--gold-light); font-size:clamp(1.35rem,2.4vw,2.2rem); line-height:1.15; text-align:center; white-space:normal; overflow:hidden; text-overflow:ellipsis; text-shadow:0 2px 14px rgba(0,0,0,.55); opacity:0; transform:translateY(10px); transition:opacity .6s ease, transform .6s ease;}
  .accordion-gallery .ag-panel.is-active h3{opacity:1; transform:translateX(0);}
  .accordion-gallery .ag-panel.is-active .catalogue-hint,.accordion-gallery .ag-panel.is-active .code,.accordion-gallery .ag-panel.is-active .desc{opacity:1; transform:translate(0);}
  @media (max-width:520px){
    .accordion-gallery{flex-direction:column; height:620px; perspective:none;}
    .accordion-gallery .ag-panel{min-height:48px;}
    .accordion-gallery .ag-panel.is-active{flex-grow:5;}
    .accordion-gallery .ag-panel:not(.is-active){flex-grow:1;}
    .accordion-gallery .ag-panel h3{font-size:1.25rem; bottom:106px;}
    .accordion-gallery .ag-panel .catalogue-hint{bottom:76px; font-size:9.5px;}
  }
  .spec-card{
    border:1px solid var(--line); padding:20px; position:relative; background:var(--teal-soft);
    transform-style:preserve-3d; transition:transform 0.12s ease, box-shadow 0.12s ease;
    will-change:transform;
  }
  .spec-card:hover{box-shadow:0 14px 28px -14px rgba(38,88,97,0.35);}
  .spec-card::before, .spec-card::after{
    content:""; position:absolute; width:10px; height:10px; border:1px solid var(--gold);
  }
  .spec-card::before{top:-1px; left:-1px; border-right:none; border-bottom:none;}
  .spec-card::after{bottom:-1px; right:-1px; border-left:none; border-top:none;}
  .spec-card .code{font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--gold); display:block; margin-bottom:10px;}
  .spec-card h3{font-family:var(--font-head); font-weight:700; font-size:18px; margin-bottom:10px; line-height:1.3; color:var(--gold);}
  .spec-card .meta{font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--gold-light); display:flex; justify-content:space-between; border-top:1px solid var(--line-soft); padding-top:10px; margin-top:12px;}
  .spec-card .desc{color:var(--gold-light);}

  /* CERTIFICATIONS */
  .certs{background:#c3b273;}
  .cert-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:18px;}
  .cert-card{
    border:1px solid var(--line); background:var(--surface); padding:24px;
    position:relative; transition:transform 0.2s ease, box-shadow 0.2s ease;
  }
  .cert-card:hover{transform:translateY(-4px); box-shadow:0 16px 30px -16px rgba(38,88,97,0.4);}
  .cert-seal{
    width:38px; height:38px; border:2px solid var(--gold); border-radius:50%;
    display:flex; align-items:center; justify-content:center; margin-bottom:16px;
    font-family:var(--font-head); font-weight:700; color:var(--gold); font-size:15px;
  }
  .cert-card h3{font-family:var(--font-head); font-weight:700; font-size:17px; color:var(--gold); margin-bottom:6px;}
  .cert-card .cert-scope{font-size:13px; color:var(--gold-light); margin-bottom:14px; font-weight:300;}
  .cert-card .cert-meta{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--gold-light); border-top:1px solid var(--line-soft); padding-top:12px; margin-top:4px;}
  .cert-card .cert-meta div{display:flex; justify-content:space-between; margin-bottom:4px;}
  .cert-card .cert-meta span.v{color:var(--gold);}
  .cert-link{
    display:inline-flex; align-items:center; gap:6px; margin-top:14px; font-size:13px; font-weight:600;
    color:var(--gold); text-decoration:none; border-bottom:1px solid var(--gold); padding-bottom:2px;
  }
  .cert-link:hover{color:var(--gold-light); border-color:var(--gold-light);}

  /* GLOBAL REACH */
  .reach-path{margin-top:40px; position:relative; padding-left:2px;}
  .reach-step{display:flex; gap:20px; position:relative; padding-bottom:34px;}
  .reach-step:last-child{padding-bottom:0;}
  .reach-step .rail{width:1px; background:var(--line); position:absolute; left:9px; top:20px; bottom:-14px; overflow:hidden;}
  .reach-step .rail-fill{width:100%; height:0%; background:var(--gold); transition:height 0.8s ease;}
  .reach-step:last-child .rail{display:none;}
  .dot{width:19px; height:19px; border:2px solid var(--gold); background:var(--bg); flex-shrink:0; position:relative; z-index:1; transition:background 0.4s ease, transform 0.4s ease;}
  .dot.is-visible{background:var(--gold); transform:scale(1.1);}
  .reach-text .loc{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--gold); display:block; margin-bottom:4px;}
  .reach-text h4{font-family:var(--font-head); font-weight:700; font-size:18px; color:var(--gold);}
  .reach-text p{font-size:14px; color:var(--gold-light); margin-top:4px; max-width:520px; font-weight:300;}

  /* CONTACT */
  .contact{background:#c3b273;}
  .contact-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:48px;}
  @media (max-width:800px){ .contact-grid{grid-template-columns:1fr;} }
  .contact h2{font-family:var(--font-head); font-weight:700; font-size:clamp(26px,3.4vw,34px); margin-bottom:16px; color:var(--gold);}
  .contact p{color:var(--gold-light); font-size:15px; margin-bottom:6px; font-weight:300;}
  .contact-card{border:1px solid var(--line); padding:24px; background:var(--surface);}
  .contact-card .row{display:flex; justify-content:space-between; padding:10px 0; border-bottom:1px solid var(--line-soft); font-size:14px; gap:12px;}
  .contact-card .row:last-child{border-bottom:none;}
  .contact-card .k{color:var(--gold); font-family:'IBM Plex Mono',monospace; font-size:12px; flex-shrink:0;}
  .map-link{color:var(--gold-light); text-decoration:underline; text-decoration-color:var(--gold); text-underline-offset:3px;}
  .map-link:hover{color:var(--gold);}

  /* Footer legal bar */
  .site-footer{padding:0; background:var(--gold); border:0;}
  .site-footer .footer-bottom-line{display:flex; align-items:center; justify-content:center; min-height:52px; padding:12px 5vw; color:var(--teal); text-align:center; font-size:13px; line-height:1.5; letter-spacing:.02em;}
  .hero .btn-outline{color:var(--gold-light)}.section-head p,.products .section-head p,.certs .section-head p{color:var(--teal)}.img-slot{color:var(--teal)}.cert-card .cert-scope,.cert-card .cert-meta{color:var(--teal)}

/* Multi-page additions */
.page-hero {
  padding: 60px 0 40px;
  border-bottom: 1px solid var(--line);
  background: #c3b273;
}
.page-hero .wrap {
  max-width: 1180px;
}
.page-hero h1 {
  font-family: var(--font-head);
  font-size: clamp(28px, 4vw, 40px);
  font-weight: 700;
  color: var(--gold);
  margin-top: 8px;
}
.page-hero .eyebrow {
  color: var(--gold);
}

/* Image upload placeholders for products */
.img-slot {
  aspect-ratio: 4/3;
  border: 1.5px dashed var(--line);
  background: rgba(38,88,97,0.06);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-bottom: 14px;
  color: var(--gold-light);
  font-size: 13px;
  font-weight: 500;
  transition: border-color 0.25s ease, background 0.25s ease;
}
.img-slot:hover {
  border-color: var(--gold);
  background: rgba(215,172,54,0.08);
}
.img-slot.is-upload-ready {
  border-color: var(--gold);
  border-style: dashed;
}
.spec-card .desc {
  font-size: 13.5px;
  color: var(--gold-light);
  margin: 8px 0 12px;
  font-weight: 300;
  line-height: 1.5;
}

/* WhatsApp quote dialog */
.whatsapp-fab {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 60;
  width: 56px;
  height: 56px;
  border: 0;
  border-radius: 50%;
  display: grid;
  place-items: center;
  text-decoration: none;
  background: #25D366;
  color: #102f22;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.25);
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.whatsapp-fab:hover { transform: translateY(-3px); box-shadow: 0 14px 28px rgba(0, 0, 0, 0.3); }
.whatsapp-fab svg { width: 29px; height: 29px; fill: currentColor; }
.quote-dialog[hidden] { display: none; }
.quote-dialog {
  position: fixed;
  inset: 0;
  z-index: 70;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(16, 47, 54, 0.72);
}
.quote-dialog-panel {
  width: min(100%, 500px);
  max-height: min(720px, 100%);
  overflow-y: auto;
  position: relative;
  padding: 32px;
  border: 1px solid var(--line);
  background: var(--teal);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.35);
}
.quote-dialog-panel h2 { font-family: var(--font-head); color: var(--gold); font-size: 30px; line-height: 1.2; }
.quote-dialog-intro { color: var(--gold-light); font-size: 14px; margin: 10px 0 22px; }
.quote-dialog-close {
  position: absolute;
  top: 12px;
  right: 14px;
  border: 0;
  background: transparent;
  color: var(--gold-light);
  font-size: 30px;
  line-height: 1;
  cursor: pointer;
}
#whatsappForm,
#gmailForm { display: grid; gap: 8px; }
#whatsappForm label,
#gmailForm label { color: var(--gold); font-size: 12px; font-family: 'IBM Plex Mono', monospace; text-transform: uppercase; }
#whatsappForm input,
#whatsappForm select,
#whatsappForm textarea,
#gmailForm input,
#gmailForm select,
#gmailForm textarea {
  width: 100%;
  border: 1px solid rgba(232, 178, 84, 0.65);
  border-radius: 0;
  padding: 10px 12px;
  color: var(--gold-light);
  background: #1d4c54;
  font: inherit;
  margin-bottom: 8px;
}
#whatsappForm textarea,
#gmailForm textarea { resize: vertical; }
#whatsappForm input::placeholder,
#whatsappForm textarea::placeholder,
#gmailForm input::placeholder,
#gmailForm textarea::placeholder { color: rgba(232, 178, 84, 0.65); }
.quote-submit { margin-top: 8px; }
@media (max-width: 520px) {
  .whatsapp-fab { right: 16px; bottom: 16px; }
  .quote-dialog { padding: 12px; }
  .quote-dialog-panel { padding: 28px 20px 20px; }
}

/* Refined site system */
:root{--bg:#E0F0F1;--surface:#D0E6E8;--gold:#D7AC36;--gold-light:#E8B254;--teal:#265861;--teal-soft:#D0E6E8;--line:rgba(38,88,97,.2);--line-soft:rgba(38,88,97,.1)}
body{background:var(--bg);color:var(--teal)}
header{top:3px;background:rgba(224,240,241,.84);border-bottom:1px solid transparent;transition:background .3s ease,box-shadow .3s ease}
header.is-scrolled{background:rgba(38,88,97,.97);box-shadow:0 10px 28px rgba(38,88,97,.18)}
.navbar{padding:15px 32px}.logo{color:var(--teal)}.logo-text{letter-spacing:.04em}nav a{color:var(--teal);font-size:13px}.navmenu-toggle{border-radius:8px;color:var(--teal)}
.btn,.btn-outline{border-radius:9px;min-height:44px}.btn{background:var(--gold);border-color:var(--gold);color:var(--teal)}.btn-outline{color:var(--teal);border-color:var(--gold)}
/* Mobile */
.hero{background:var(--teal) url('../assets/homepage_photo_phone.jpeg') center/cover no-repeat;min-height:650px}
/* Tablet */
@media (min-width:768px){
  .hero{background:var(--teal) url('../assets/homepage_photo_tablet.jpeg') center/cover no-repeat}
}
/* Desktop */
@media (min-width:1024px){
  .hero{background:var(--teal) url('../assets/homepage_photo.jpeg') center/cover no-repeat}
}
.hero:after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(90deg,rgba(10,25,28,.9) 0%,rgba(10,25,28,.68) 48%,rgba(10,25,28,.42) 100%);pointer-events:none}.hero-inner{padding:112px 32px 82px;z-index:1}.hero h1{color:var(--gold-light);font-size:clamp(42px,6vw,76px)}.hero h1 em{color:var(--gold)}.hero p.lede{color:var(--gold-light)}
.scroll-float{overflow:hidden}.scroll-float .scroll-float-char{display:inline-block;opacity:0;transform:translateY(120%) scaleY(2.3) scaleX(.7);transform-origin:50% 0;will-change:opacity,transform}.scroll-float.is-visible .scroll-float-char{animation:scroll-float-in .8s cubic-bezier(.34,1.56,.64,1) forwards;animation-delay:calc(var(--char-index) * .03s)}@keyframes scroll-float-in{to{opacity:1;transform:translateY(0) scaleY(1) scaleX(1)}}
.hero-banner{width:100%;margin-top:56px;overflow:hidden;border-top:1px solid rgba(232,178,84,.45);border-bottom:1px solid rgba(232,178,84,.45);padding:14px 0;color:var(--gold-light)}
.hero-banner-track{display:flex;width:max-content;gap:3rem;animation:hero-banner-scroll 32s linear infinite}
.hero-banner-track span{padding:0 1rem;white-space:nowrap;font-family:'IBM Plex Mono',monospace;font-size:12px;line-height:1.6}
.hero-banner:hover .hero-banner-track{animation-play-state:paused}
@keyframes hero-banner-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.hero-banner-track{animation:none;transform:none}.hero-banner-track span[aria-hidden="true"]{display:none}}
section{padding:96px 0;transition:none}section:hover,section.is-hovered{transform:none;box-shadow:none}section:before{display:none}.section-head h2{color:var(--gold);font-size:clamp(30px,4vw,47px)}.section-head p{color:var(--gold-light)}
.why-grid,.cert-grid{gap:16px;background:none;border:0}.why-card,.cert-card{border:0;border-radius:10px;background:var(--surface);padding:30px}.why-card h3,.cert-card h3{color:var(--teal)}.why-card p,.cert-card .cert-scope{color:var(--teal)}
.products,.certs,.contact,.reviews{background:var(--surface)}.page-hero{padding:82px 0 72px;background:var(--teal);border:0}.page-hero h1{color:var(--gold-light);font-size:clamp(39px,5vw,64px)}

.products{background:var(--bg); color:var(--teal);}
.products-page .page-hero h1{margin-inline:auto;}
.products-page .page-hero h1,
.products-page .products h2,
.products-page .products h3{text-align:center;}
.products .section-head{max-width:760px; margin:0 auto 38px; text-align:center;}
.products .section-head .eyebrow{color:var(--teal);}
.products .section-head h2{margin-top:8px; color:var(--teal); font:700 clamp(30px,4vw,48px) var(--font-head); line-height:1.08;}
.products .section-head p{margin-top:10px; color:var(--teal); font-size:15px; line-height:1.7;}
.home-centered > .wrap > .section-head{margin-left:auto; margin-right:auto;}
.home-centered > .wrap > .section-head h2,
.home-centered > .wrap > .section-head p{text-align:center;}
.home-centered > .wrap > .section-head .eyebrow{display:block; text-align:left;}
#why .why-card{text-align:center;}
#why .why-card .tag{display:block; text-align:center;}
.category-directory{display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:22px; margin-top:36px;}
.category-card{position:relative; display:flex; flex-direction:column; min-height:420px; padding:0; border-radius:18px; overflow:hidden; border:1px solid rgba(21,63,70,.12); background:linear-gradient(180deg, rgba(21,63,70,.18), rgba(21,63,70,.78)); box-shadow:0 25px 45px -28px rgba(14,32,38,.52); transition:box-shadow .25s ease, transform .25s ease;}
.category-card:hover,.category-card:focus-within{box-shadow:0 28px 48px -24px rgba(14,32,38,.62); transform:translateY(-2px);}
.category-card::before{content:""; position:absolute; inset:0; background-size:cover; background-position:center; background-repeat:no-repeat; opacity:1;}
.category-card--fitness::before{background-image:linear-gradient(180deg, rgba(21,63,70,.06), rgba(21,63,70,.28)), url('../assets/Outdoor GYm.png'); background-size:cover,contain;}
.category-card--playground::before{background-image:linear-gradient(180deg, rgba(21,63,70,.06), rgba(21,63,70,.28)), url('../assets/multiplay.png'); background-size:cover,contain;}
.category-card--science::before{display:none;}
.category-card--multiplay::before{background-image:linear-gradient(180deg, rgba(21,63,70,.06), rgba(21,63,70,.28)), url('../assets/multiplay.png'); background-size:cover,contain;}
.category-card--powder-coating::before{display:none;}
.category-card--boats::before{display:none;}
.category-card--furniture::before{background-image:linear-gradient(180deg, rgba(21,63,70,.06), rgba(21,63,70,.28)), url('../assets/bench_flat.png'); background-size:cover,contain;}
.category-card--civic::before{background-image:linear-gradient(180deg, rgba(21,63,70,.06), rgba(21,63,70,.28)), url('../assets/toilet.jpg'); background-size:cover,contain;}
.category-card--cabins::before{background-image:linear-gradient(180deg, rgba(21,63,70,.06), rgba(21,63,70,.28)), url('../assets/portable%20cabin.png'); background-size:cover,contain;}
.category-card__visual{position:absolute; inset:0; z-index:0; overflow:hidden;}
.category-card__visual--split{display:grid; grid-template-rows:1fr 1fr; background:#fff;}
.category-card__visual--split img{display:block; width:100%; height:100%; min-height:0; object-fit:contain; background:#fff;}
.category-card__visual--split::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(21,63,70,.03),rgba(21,63,70,.18)); pointer-events:none;}
.category-card--featured{grid-column:1 / -1; min-height:500px;}
.category-card--featured::before{opacity:.55;}
.category-card--featured .category-card__body{padding:30px 28px 18px; justify-content:flex-end; max-width:62%;}
.category-card--featured h3{font-size:clamp(2rem,4vw,3.4rem);}
.category-card--featured p{font-size:1.05rem; max-width:54ch;}
.category-card--featured{background:var(--teal);}
.category-card--featured .category-card__body{text-align:center; align-items:center;}
.category-card--featured .category-card__body:first-child{padding:18px 16px 12px; max-width:none;}
.category-card--featured .video-shell{position:relative; z-index:1; width:100%; height:auto; aspect-ratio:16 / 9; margin:0; border:0; border-radius:0; background:transparent; overflow:hidden;}
.category-card--featured .video-shell video{display:block; width:100%; height:100%; border:0; object-fit:cover;}
.category-card--featured .category-card__body:not(:first-child){padding:16px 16px 12px; max-width:none;}
.category-card--featured .category-card__body p{max-width:64ch;}
.category-card--layout-wide{grid-column:span 7;}
.category-card--layout-narrow{grid-column:span 5;}
.category-card--layout-half{grid-column:span 6;}
.category-card--boats.category-card--layout-narrow{grid-column:span 4;}
.category-card--wide{grid-column:span 8; min-height:520px;}
.category-card--wide::before{opacity:.45;}
.category-card--wide{background:var(--teal);}
.category-card--wide .category-card__body{text-align:center; align-items:center;}
.category-card--wide .category-card__body:first-child{padding:18px 16px 12px;}
.category-card--wide .video-shell{position:relative; z-index:1; width:100%; height:auto; aspect-ratio:16 / 9; margin:0; border:0; border-radius:0; background:transparent; overflow:hidden;}
.category-card--wide .video-shell iframe,.category-card--wide .video-shell video{display:block; width:100%; height:100%; border:0; object-fit:cover;}
.category-card--wide .category-card__body:not(:first-child){padding:22px 28px 18px;}
.category-card--wide .category-card__body p{max-width:64ch;}
.category-card--fitness::before{opacity:1;}
.category-card__body,.category-card__footer{position:relative; z-index:1;}
.category-card__body{padding:24px 22px 14px; display:flex; flex-direction:column; flex:1;}
.category-pill{display:inline-flex; align-self:flex-start; padding:6px 10px; border-radius:999px; background:rgba(240,180,79,.18); border:1px solid rgba(240,180,79,.6); color:var(--gold-light); font-size:11px; letter-spacing:.08em; text-transform:uppercase; font-weight:600;}
.category-card h3{width:fit-content; max-width:100%; margin:14px auto 0; padding:8px 12px; border-radius:8px; background:rgba(21,63,70,.96); color:#fff0d2; font:700 clamp(1.45rem,2vw,2rem) var(--font-head); line-height:1.1;}
.category-card p,.category-card ul{max-height:0; margin-top:0; opacity:0; overflow:hidden; transform:translateY(8px); transition:max-height .3s ease, margin-top .3s ease, opacity .2s ease, transform .3s ease;}
.category-card p{padding:10px 12px; border-radius:8px; background:#153f46; color:#fff; font-size:0.95rem; line-height:1.6;}
.category-card ul{display:flex; flex-wrap:wrap; gap:8px; list-style:none;}
.category-card:hover p,.category-card:hover ul,.category-card:focus-within p,.category-card:focus-within ul{max-height:300px; margin-top:10px; opacity:1; transform:translateY(0);}
.category-card li{padding:5px 9px; border-radius:999px; background:#153f46; border:1px solid rgba(255,255,255,.35); color:#fff0d2; font-size:12px; line-height:1.3;}
.category-card__footer{padding:0 22px 22px; background:rgba(21,63,70,.96);}
.category-card__footer a{display:inline-flex; align-items:center; justify-content:center; min-height:42px; padding:0 18px; border-radius:999px; border:1px solid rgba(240,180,79,.8); background:rgba(240,180,79,.12); color:#fff0d2; text-decoration:none; font-weight:600; transition:background .2s ease, transform .2s ease;}
.category-card__footer a:hover,.category-card__footer a:focus-visible{background:rgba(240,180,79,.2); transform:translateY(-1px);}
.category-cta{display:flex; align-items:center; justify-content:space-between; gap:22px; margin-top:32px; padding:26px 30px; border-radius:18px; background:linear-gradient(135deg, rgba(21,63,70,.94), rgba(39,100,106,.96)); border:1px solid rgba(240,180,79,.28); box-shadow:0 18px 40px -28px rgba(21,63,70,.8);}
.category-cta .eyebrow{color:var(--gold);}
.category-cta h3{margin-top:8px; color:var(--gold-light); font:700 clamp(1.6rem,2.3vw,2.2rem) var(--font-head); line-height:1.1;}
.category-cta .btn{display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding-inline:26px;}

.reviews{background:var(--bg);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.reviews .section-head{max-width:640px;margin-bottom:44px}.reviews .section-head .eyebrow{color:var(--gold)}.reviews .section-head h2{margin-top:7px;color:var(--teal);font:700 clamp(25px,3.4vw,38px) var(--font-head);line-height:1.12}.reviews .section-head p{margin-top:8px;color:var(--teal);font-size:14px}
.accordion-gallery{height:480px;gap:8px}.accordion-gallery .ag-panel{border-color:rgba(215,172,54,.5);border-radius:10px;background:var(--teal)}.accordion-gallery .ag-panel:before{inset:-14px;background-size:cover;filter:grayscale(var(--ag-gray,1)) blur(var(--ag-blur,4px));transform:translateX(var(--ag-shift,0px)) scale(1.12);transition:filter .6s ease,transform .6s ease}.accordion-gallery .ag-panel.is-active:before{--ag-blur:0px}.accordion-gallery .ag-letter{color:var(--gold);font-size:12px;letter-spacing:.18em;writing-mode:vertical-rl}.accordion-gallery .is-active .ag-letter{opacity:0}
.contact-grid{gap:30px}
.careers{padding-top:0; background:var(--bg); color:var(--teal);}
.careers-card{max-width:860px; margin:0 auto; padding:36px 32px; border:1px solid rgba(240,180,79,.35); border-radius:18px; background:linear-gradient(135deg, rgba(21,63,70,.97), rgba(39,100,106,.98)); box-shadow:0 18px 40px -28px rgba(21,63,70,.8); text-align:center;}
.careers-card .eyebrow{margin-bottom:8px; color:var(--gold);}
.careers-card h2{color:var(--gold-light); font:700 clamp(1.8rem,3vw,2.5rem) var(--font-head); line-height:1.12;}
.careers-card h3{margin-top:14px; color:#fff0d2; font:700 clamp(1.35rem,2.2vw,1.8rem) var(--font-head);}
.careers-card p{max-width:620px; margin:12px auto 0; color:#fff; line-height:1.7;}
.careers-card .careers-work-mode{color:#fff0d2; font-weight:600;}
.careers-card .btn{display:inline-flex; align-items:center; justify-content:center; margin-top:22px; padding:10px 24px; text-decoration:none;}

@media (max-width: 980px){
  .category-directory{grid-template-columns:repeat(6,minmax(0,1fr));}
  .category-card--layout-wide{grid-column:span 4;}
  .category-card--layout-narrow{grid-column:span 2;}
  .category-card--layout-half{grid-column:span 3;}
  .category-card--boats.category-card--layout-narrow{grid-column:span 2;}
  .category-card--wide{grid-column:span 4;}
  .category-card--featured{grid-column:1 / -1;}
  .category-cta{flex-direction:column; align-items:flex-start;}
}

@media (max-width: 640px){
  .category-directory{grid-template-columns:1fr;}
  .category-card{min-height:360px;}
  .category-card--featured,.category-card--layout-wide,.category-card--layout-narrow,.category-card--layout-half,.category-card--wide{grid-column:1 / -1;}
  .category-card--boats.category-card--layout-narrow{grid-column:1 / -1;}

  .category-card--wide{min-height:420px;}
  .category-card--wide .video-shell,.category-card--featured .video-shell{width:100%; height:auto; aspect-ratio:16 / 9;}
  .category-card__body{padding:20px 18px 12px;}
  .category-card__footer{padding:0 18px 18px;}
  .category-cta{padding:22px 18px;}
  .category-cta h3{font-size:1.6rem;}
  .careers-card{padding:28px 20px;}
}
@media (hover:none){
  .category-card p,.category-card ul{max-height:300px; margin-top:10px; opacity:1; overflow:visible; transform:none;}
  .category-card:hover,.category-card:focus-within{transform:none;}
}
.contact-grid>div:first-child>p:first-child{color:var(--teal);font-size:18px}.contact p{color:var(--teal)}.contact-card{border:0;border-radius:10px;background:var(--bg)}.contact-card .row{border-color:var(--line)}.contact-card .k{color:var(--gold)}.map-tile{position:relative;isolation:isolate;min-height:260px;margin-top:26px;overflow:hidden;border:1px solid var(--line);border-radius:10px;background:var(--teal);box-shadow:0 14px 30px -20px rgba(38,88,97,.6)}.map-tile iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:saturate(.88)}.map-tile:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(38,88,97,.05) 35%,rgba(38,88,97,.82) 100%)}.map-tile-link{position:relative;z-index:2;display:flex;min-height:260px;flex-direction:column;justify-content:flex-end;padding:24px;color:var(--gold-light);text-decoration:none;transition:background .25s ease}.map-tile-link:hover{background:rgba(38,88,97,.12)}.map-tile-link strong{display:block;color:var(--gold);font:700 25px var(--font-head)}.map-tile-link span{font-size:13px}
footer{padding:55px 0;background:var(--teal);border-top:1px solid rgba(215,172,54,.28)}
.quote-dialog-panel{border-radius:10px;background:var(--bg)}.quote-dialog-panel h2{color:var(--teal)}.quote-dialog-intro{color:var(--teal)}#whatsappForm input,#whatsappForm select,#whatsappForm textarea,#gmailForm input,#gmailForm select,#gmailForm textarea{border:1px solid var(--line);border-radius:7px;color:var(--teal);background:white}
@media(max-width:1080px) and (min-width:641px){.navbar{padding-left:22px;padding-right:22px}.navmenu-toggle{display:block}nav ul{display:none;position:absolute;top:100%;right:0;padding:22px 24px 28px;flex-direction:column;gap:0;background:var(--teal);box-shadow:0 20px 30px rgba(38,88,97,.2)}nav ul.is-open{display:flex}nav a{display:block;padding:12px 0;color:var(--gold-light)!important;font-size:16px}}
@media(max-width:640px){.navbar{padding:12px 20px}.navmenu-toggle{display:block}nav ul{display:none;position:absolute;top:100%;left:0;right:0;padding:22px 24px 28px;flex-direction:column;gap:0;background:var(--teal);box-shadow:0 20px 30px rgba(38,88,97,.2)}nav ul.is-open{display:flex}nav a{display:block;padding:13px 0;color:var(--gold-light)!important;font-size:17px}.hero-inner{padding:78px 20px 58px}.hero{min-height:0}.hero h1{font-size:45px}.dimline{display:grid;margin-top:48px}.dimline .seg,.dimline .seg:first-child{border:1px solid rgba(215,172,54,.45);border-radius:6px;margin-top:-1px}.page-hero{padding:60px 0 52px}section{padding:70px 0}.accordion-gallery{height:650px;flex-direction:column;perspective:none}.accordion-gallery .ag-panel{min-height:47px; display:flex; align-items:center; justify-content:center; text-align:center; padding:16px 12px;}.accordion-gallery .ag-panel.is-active{flex-grow:5}.accordion-gallery .ag-panel:not(.is-active){flex-grow:1}.accordion-gallery .ag-panel > .ag-letter{writing-mode:horizontal-tb;top:50%;left:0;right:0;transform:translateY(-50%);font-size:clamp(1rem,4vw,1.4rem);letter-spacing:.04em;line-height:1.2;white-space:normal;word-break:break-word}.accordion-gallery .ag-panel h3{font-size:clamp(0.95rem,3.6vw,1.3rem);line-height:1.2;max-width:100%;padding:0 8px;bottom:40px}.accordion-gallery .ag-panel .desc{font-size:11px;line-height:1.45;left:10px;right:10px;bottom:16px;max-width:100%}.footer-grid{grid-template-columns:1fr}.whatsapp-fab{right:16px;bottom:16px}}
@media(max-width:640px){nav ul{position:fixed;top:62px;bottom:0;min-height:calc(100vh - 62px);overflow:auto}}

/* Final contrast pass */
.hero .btn-outline{color:var(--gold-light)!important}.section-head p,.products .section-head p,.certs .section-head p{color:var(--teal)!important}.img-slot{color:var(--teal)!important}.cert-card .cert-scope,.cert-card .cert-meta{color:var(--teal)!important}
header.is-scrolled nav a,header.is-scrolled nav a.active{color:var(--gold-light)!important}
header{transition:background .3s ease,box-shadow .3s ease,transform .35s ease!important}header.is-hidden{transform:translateY(calc(-100% - 4px))}
header{background:rgba(224,240,241,.38)!important;backdrop-filter:blur(22px)!important;border-bottom-color:rgba(38,88,97,.1)!important}header.is-scrolled{background:rgba(38,88,97,.97)!important}.navbar{width:100%!important;max-width:none!important;padding-left:5vw!important;padding-right:5vw!important}
@media(min-width:1081px){.navbar nav{flex:1}.navbar nav ul{justify-content:center}.navbar .nav-right{margin-left:auto}}
@media(min-width:1081px){.navbar nav ul{justify-content:space-evenly;width:100%;gap:20px}.navbar nav a{display:block;text-align:center}}
header.is-scrolled .navmenu-toggle{color:var(--gold-light)!important}

/* Fallback loader rings for offline previews */
.loading-rings:before,.loading-rings:after{content:"";position:absolute;left:50%;top:50%;width:min(240px,42vw);height:min(240px,42vw);border:1px solid rgba(215,172,54,.65);border-radius:50%;transform:translate(-50%,-50%);animation:loader-ring 3.4s ease-out infinite}.loading-rings:after{width:min(390px,68vw);height:min(390px,68vw);animation-delay:1.1s;border-color:rgba(232,178,84,.4)}@keyframes loader-ring{0%{opacity:0;transform:translate(-50%,-50%) scale(.55)}25%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) scale(1.35)}}
.loading-screen.has-webgl .loading-rings:before,.loading-screen.has-webgl .loading-rings:after{display:none}
.accordion-gallery .ag-panel{background:transparent!important}.accordion-gallery .ag-panel:after{display:none}.accordion-gallery .ag-panel .ag-letter{top:50%;left:0;right:0;transform:translateY(-50%);writing-mode:horizontal-tb;color:var(--gold-light);font-size:clamp(28px,3.2vw,48px);font-weight:800;letter-spacing:.08em;text-shadow:0 2px 16px rgba(38,88,97,.7);opacity:1;transition:opacity .3s ease}.accordion-gallery .ag-panel.is-active .ag-letter{opacity:0}
.accordion-gallery .ag-panel > .ag-letter{position:absolute!important;display:block!important;top:50%!important;left:4px!important;right:4px!important;width:auto!important;transform:translateY(-50%)!important;text-align:center!important}.accordion-gallery .ag-panel.is-active > .ag-letter{opacity:0!important}
.accordion-gallery .ag-panel > .ag-letter{font-family:var(--font-head)!important;font-weight:700!important;writing-mode:vertical-rl!important;text-orientation:mixed!important;white-space:normal!important;word-break:normal!important;font-size:clamp(16px,2vw,26px)!important;letter-spacing:0!important;line-height:1.1!important;top:50%!important;left:50%!important;right:auto!important;max-height:90%!important;transform:translate(-50%,-50%) rotate(180deg)!important}.accordion-gallery .ag-panel.is-active > .ag-letter{opacity:0!important}
.accordion-gallery{height:500px}.accordion-gallery .ag-panel,.accordion-gallery .ag-panel.is-active{background:none!important;background-color:transparent!important}.accordion-gallery .ag-panel:before{background-color:transparent!important;inset:-50px!important}.accordion-gallery .ag-panel:after{content:none!important}
@media(max-width:640px){.accordion-gallery{height:520px}}

@media(max-width:640px){
  .accordion-gallery .ag-panel > .ag-letter{display:none!important}
  .accordion-gallery .ag-panel:not(.is-active) h3{
    top:50%;
    bottom:auto;
    opacity:1;
    transform:translateY(-50%);
    margin:0;
    padding:0 8px 10px;
    border-bottom:3px solid rgba(232,178,84,.45);
    font-size:clamp(.95rem,3.6vw,1.3rem);
    line-height:1.2;
    text-align:center;
    white-space:normal;
    overflow-wrap:anywhere;
  }
  .accordion-gallery .ag-panel .desc,
  .accordion-gallery .ag-panel.is-active .desc{
    display:none!important;
    opacity:0!important;
    transform:none!important;
  }
  .accordion-gallery .ag-panel::after{
    content:"Click to View Catalogue"!important;
    left:8px;
    right:8px;
    bottom:8px;
    z-index:4;
    font-size:10px;
    line-height:1.2;
    text-shadow:none;
    white-space:normal;
  }
  .accordion-gallery .ag-panel.is-active .catalogue-hint{
    position:absolute;
    left:8px;
    right:8px;
    bottom:8px;
    z-index:4;
    display:block;
    opacity:1!important;
    transform:none!important;
    color:var(--gold-light);
    font-size:10px;
    line-height:1.2;
    text-shadow:none;
  }
}

.accordion-gallery .ag-panel::after{content:"Click To View The Catalogue"!important;display:block!important;position:absolute;left:16px;right:16px;bottom:18px;z-index:3;width:auto;height:auto;border:0;background:none;color:var(--gold);font-size:11px;font-weight:600;letter-spacing:.04em;line-height:1.3;text-align:center;white-space:nowrap;pointer-events:none}

/* Product tiles use a solid brand colour instead of image backgrounds. */
.accordion-gallery .ag-panel,
.accordion-gallery .ag-panel.is-active{background:var(--teal)!important;background-color:var(--teal)!important}
.accordion-gallery .ag-panel::before,
.accordion-gallery .ag-panel::after{display:none!important;background-image:none!important}
.accordion-gallery .ag-panel .code{top:50%;bottom:auto;transform:translateY(-62px);text-shadow:none}
.accordion-gallery .ag-panel h3{top:50%;bottom:auto;padding-bottom:10px;border-bottom-color:rgba(232,178,84,.45);text-shadow:none}
.accordion-gallery .ag-panel .desc{top:50%;bottom:auto;margin:38px 0 0;transform:translateY(18px);text-shadow:none}
.accordion-gallery .ag-panel.is-active h3{transform:translateY(-50%)}
.accordion-gallery .ag-panel.is-active .desc{transform:translateY(18px)}

/* Full-screen tablet and phone navigation */
@media(max-width:1080px){
  header{backdrop-filter:none!important}
  .navmenu-toggle{
    all:unset;
    display:flex;
    width:44px;
    height:44px;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    color:var(--teal);
    -webkit-tap-highlight-color:transparent;
  }
  .menu-lines{display:flex;flex-direction:column;gap:5px;width:25px}
  .menu-lines span{display:block;width:100%;height:2px;background:currentColor;border-radius:2px}
  nav ul{display:none;position:fixed;top:76px;right:0;bottom:0;left:0;width:auto;min-height:0;overflow:auto;flex-direction:column;gap:0;padding:28px 5vw 40px;background:var(--teal);border:0;box-shadow:0 20px 30px rgba(38,88,97,.2)}
  nav ul.is-open{display:flex}
  nav li a{display:block;padding:14px 0;color:var(--gold-light)!important;font-size:18px}
  nav li a::after{display:none}
  body:has(#navMenu.is-open){overflow:hidden}
}
@media(max-width:640px){
  nav ul{top:69px;padding:28px 20px 40px}
  nav li a{font-size:18px}
}

body:has(.loading-screen:not(.is-hidden)) .instagram-fab,
body:has(.loading-screen:not(.is-hidden)) .whatsapp-fab{visibility:hidden!important;opacity:0!important;pointer-events:none!important}


/* =========================================================
   GMAIL CONTACT BUTTON
   Self-contained: no icon/font/library dependencies.
   ========================================================= */
.gmail-contact-button{
  --gmail-red:#EA4335;
  --gmail-red-dark:#DC2743;
  --gmail-text:#ffffff;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:max-content;
  max-width:100%;
  min-height:46px;
  padding:11px 18px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:12px;
  background:linear-gradient(135deg,var(--gmail-red) 0%,var(--gmail-red-dark) 100%);
  color:var(--gmail-text) !important;
  font-family:var(--font-body);
  font-size:14px;
  font-weight:600;
  line-height:1.2;
  letter-spacing:.01em;
  text-decoration:none !important;
  box-shadow:0 8px 18px rgba(220,39,67,.20);
  transform:translateY(0);
  transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease,filter .25s ease;
  -webkit-tap-highlight-color:transparent;
}

.gmail-contact-button:hover{
  color:#fff !important;
  transform:translateY(-3px);
  filter:saturate(1.05);
  box-shadow:0 14px 28px rgba(220,39,67,.30);
}

.gmail-contact-button:active{
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(220,39,67,.24);
}

.gmail-contact-button:focus-visible{
  outline:3px solid rgba(234,67,53,.35);
  outline-offset:4px;
}

.gmail-contact-button__icon{
  width:20px;
  height:20px;
  flex:0 0 20px;
  display:block;
  fill:currentColor;
}

.gmail-contact-button span{
  display:inline-block;
  white-space:nowrap;
}

@media (max-width:640px){
  .gmail-contact-button{
    width:100%;
    min-height:48px;
    padding:12px 16px;
  }
}

@media (prefers-reduced-motion:reduce){
  .gmail-contact-button{transition:none;}
  .gmail-contact-button:hover,.gmail-contact-button:active{transform:none;}
}




/* Enhanced floating WhatsApp widget */
.whatsapp-fab{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:9999;
  width:60px;
  height:60px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.24);
  border-radius:16px;
  background:linear-gradient(135deg,#25D366 0%,#20bd5a 100%);
  color:#fff !important;
  text-decoration:none !important;
  box-shadow:0 12px 30px rgba(37,211,102,.30);
  opacity:0;
  transform:translateY(12px) scale(.94);
  animation:whatsappFadeIn .55s ease-out .15s forwards;
  transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease,filter .25s ease;
}
.whatsapp-fab:hover{color:#fff !important;transform:translateY(-5px) scale(1.04);filter:saturate(1.08);box-shadow:0 18px 38px rgba(37,211,102,.42);}
.whatsapp-fab:active{transform:translateY(-2px) scale(1);box-shadow:0 12px 26px rgba(37,211,102,.34);}
.whatsapp-fab:focus-visible{outline:3px solid rgba(37,211,102,.35);outline-offset:4px;}
.whatsapp-fab__icon{width:31px;height:31px;display:block;fill:currentColor;}
.whatsapp-fab__tooltip{position:absolute;right:calc(100% + 12px);top:50%;transform:translateY(-50%) translateX(6px);width:max-content;max-width:240px;padding:9px 12px;border-radius:8px;background:#17201b;color:#fff;font-family:var(--font-body);font-size:13px;font-weight:600;line-height:1.3;white-space:nowrap;pointer-events:none;opacity:0;box-shadow:0 8px 20px rgba(0,0,0,.18);transition:opacity .2s ease,transform .2s ease;}
.whatsapp-fab__tooltip::after{content:"";position:absolute;right:-5px;top:50%;width:10px;height:10px;background:#17201b;transform:translateY(-50%) rotate(45deg);}
.whatsapp-fab:hover .whatsapp-fab__tooltip,.whatsapp-fab:focus-visible .whatsapp-fab__tooltip{opacity:1;transform:translateY(-50%) translateX(0);}
.whatsapp-fab__status{position:absolute;right:2px;bottom:2px;width:13px;height:13px;border:2px solid #fff;border-radius:50%;background:#34c759;box-shadow:0 2px 6px rgba(0,0,0,.18);}
@keyframes whatsappFadeIn{from{opacity:0;transform:translateY(12px) scale(.94);}to{opacity:1;transform:translateY(0) scale(1);}}
@media (max-width:640px){.whatsapp-fab{right:16px;bottom:16px;width:56px;height:56px}.whatsapp-fab__icon{width:29px;height:29px}.whatsapp-fab__tooltip{right:0;bottom:calc(100% + 10px);top:auto;transform:translateY(6px);font-size:12px}.whatsapp-fab__tooltip::after{right:18px;top:auto;bottom:-5px;transform:rotate(45deg)}.whatsapp-fab:hover .whatsapp-fab__tooltip,.whatsapp-fab:focus-visible .whatsapp-fab__tooltip{transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){.whatsapp-fab{animation:none;opacity:1;transform:none;transition:none}.whatsapp-fab:hover,.whatsapp-fab:active{transform:none}.whatsapp-fab__tooltip{transition:none}}

/* =========================================================
   IN-PAGE WHATSAPP CLICK-TO-CHAT BUTTON
   Reusable: place .whatsapp-cta anywhere in the page.
   ========================================================= */
.whatsapp-cta{
  --wa-green:#25D366;
  --wa-green-dark:#128C7E;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:50px;
  max-width:100%;
  padding:13px 20px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:12px;
  background:linear-gradient(135deg,var(--wa-green) 0%,var(--wa-green-dark) 100%);
  color:#fff !important;
  font-family:var(--font-body);
  font-size:14px;
  font-weight:700;
  line-height:1.2;
  letter-spacing:.01em;
  text-decoration:none !important;
  box-shadow:0 9px 22px rgba(18,140,126,.22);
  transform:translateY(0);
  transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease,filter .25s ease;
  -webkit-tap-highlight-color:transparent;
}
.whatsapp-cta:hover{
  color:#fff !important;
  transform:translateY(-3px);
  filter:saturate(1.06);
  box-shadow:0 16px 32px rgba(18,140,126,.32);
}
.whatsapp-cta:active{
  transform:translateY(-1px);
  box-shadow:0 9px 22px rgba(18,140,126,.25);
}
.whatsapp-cta:focus-visible{
  outline:3px solid rgba(37,211,102,.35);
  outline-offset:4px;
}
.whatsapp-cta__icon,
.whatsapp-cta__mail{
  display:block;
  flex:0 0 auto;
  fill:currentColor;
}
.whatsapp-cta__icon{width:22px;height:22px;}
.whatsapp-cta__mail{width:16px;height:16px;opacity:.9;}
.whatsapp-cta span{white-space:nowrap;}

/* Footer link keeps the same WhatsApp brand treatment without adding a large button. */
.footer-whatsapp-link{
  color:var(--gold-light) !important;
  text-decoration:none;
  transition:color .2s ease,transform .2s ease;
}
.footer-whatsapp-link:hover{color:#25D366 !important;}

@media (max-width:640px){
  .whatsapp-cta{
    width:100%;
    min-height:50px;
    padding:13px 16px;
  }
  .hero-ctas{width:100%;}
}

@media (prefers-reduced-motion:reduce){
  .whatsapp-cta{transition:none;}
  .whatsapp-cta:hover,.whatsapp-cta:active{transform:none;}
}

/* =========================================================
   IN-PAGE WHATSAPP CLICK-TO-CHAT BUTTON
   Reusable: place .whatsapp-cta anywhere in the page.
   ========================================================= */
.whatsapp-cta{
  --wa-green:#25D366;
  --wa-green-dark:#128C7E;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:50px;
  max-width:100%;
  padding:13px 20px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:12px;
  background:linear-gradient(135deg,var(--wa-green) 0%,var(--wa-green-dark) 100%);
  color:#fff !important;
  font-family:var(--font-body);
  font-size:14px;
  font-weight:700;
  line-height:1.2;
  letter-spacing:.01em;
  text-decoration:none !important;
  box-shadow:0 9px 22px rgba(18,140,126,.22);
  transform:translateY(0);
  transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease,filter .25s ease;
  -webkit-tap-highlight-color:transparent;
}
.whatsapp-cta:hover{color:#fff !important;transform:translateY(-3px);filter:saturate(1.06);box-shadow:0 16px 32px rgba(18,140,126,.32);}
.whatsapp-cta:active{transform:translateY(-1px);box-shadow:0 9px 22px rgba(18,140,126,.25);}
.whatsapp-cta:focus-visible{outline:3px solid rgba(37,211,102,.35);outline-offset:4px;}
.whatsapp-cta__icon,.whatsapp-cta__mail{display:block;flex:0 0 auto;fill:currentColor;}
.whatsapp-cta__icon{width:22px;height:22px;}.whatsapp-cta__mail{width:16px;height:16px;opacity:.9;}.whatsapp-cta span{white-space:nowrap;}
.footer-whatsapp-link{color:var(--gold-light) !important;text-decoration:none;transition:color .2s ease,transform .2s ease;}.footer-whatsapp-link:hover{color:#25D366 !important;}
@media(max-width:640px){.whatsapp-cta{width:100%;min-height:50px;padding:13px 16px;}.hero-ctas{width:100%;}}
@media(prefers-reduced-motion:reduce){.whatsapp-cta{transition:none;}.whatsapp-cta:hover,.whatsapp-cta:active{transform:none;}}


/* =========================================================
   FINAL CONTACT COMPONENT SYSTEM
   Gmail + WhatsApp share the same interaction language.
   No external icon or component dependency.
   ========================================================= */
:root{
  --contact-radius:12px;
  --contact-transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease,filter .25s ease;
}

/* Gmail: mailto contact button */
.gmail-contact-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:max-content;
  max-width:100%;
  min-height:46px;
  padding:11px 18px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:var(--contact-radius);
  background:linear-gradient(135deg,#EA4335 0%,#DC2743 100%);
  color:#fff !important;
  font-family:var(--font-body);
  font-size:14px;
  font-weight:600;
  line-height:1.2;
  text-decoration:none !important;
  box-shadow:0 8px 18px rgba(220,39,67,.20);
  transform:translateY(0);
  transition:var(--contact-transition);
  -webkit-tap-highlight-color:transparent;
}
.gmail-contact-button:hover{
  color:#fff !important;
  transform:translateY(-3px);
  filter:saturate(1.05);
  box-shadow:0 14px 28px rgba(220,39,67,.30);
}
.gmail-contact-button:active{transform:translateY(-1px);box-shadow:0 8px 18px rgba(220,39,67,.24)}
.gmail-contact-button:focus-visible{outline:3px solid rgba(234,67,53,.35);outline-offset:4px}
.gmail-contact-button__icon{width:20px;height:20px;display:block;flex:0 0 20px;fill:currentColor}
.gmail-contact-button span{display:inline-block;white-space:nowrap}

/* Reusable in-page WhatsApp CTA */
.whatsapp-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  width:max-content;
  max-width:100%;
  min-height:50px;
  padding:13px 20px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:var(--contact-radius);
  background:linear-gradient(135deg,#25D366 0%,#128C7E 100%);
  color:#fff !important;
  font-family:var(--font-body);
  font-size:14px;
  font-weight:700;
  line-height:1.2;
  letter-spacing:.01em;
  text-decoration:none !important;
  box-shadow:0 9px 22px rgba(18,140,126,.22);
  transform:translateY(0);
  transition:var(--contact-transition);
  -webkit-tap-highlight-color:transparent;
}
.whatsapp-cta:hover{color:#fff !important;transform:translateY(-3px);filter:saturate(1.06);box-shadow:0 16px 32px rgba(18,140,126,.32)}
.whatsapp-cta:active{transform:translateY(-1px);box-shadow:0 9px 22px rgba(18,140,126,.25)}
.whatsapp-cta:focus-visible{outline:3px solid rgba(37,211,102,.35);outline-offset:4px}
.whatsapp-cta__icon,.whatsapp-cta__mail{display:block;flex:0 0 auto;fill:currentColor}
.whatsapp-cta__icon{width:22px;height:22px}.whatsapp-cta__mail{width:16px;height:16px;opacity:.9}.whatsapp-cta span{white-space:nowrap}

/* Floating WhatsApp widget */
.instagram-fab{
  position:fixed;
  right:24px;
  bottom:96px;
  z-index:9999;
  width:60px;
  height:60px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.24);
  border-radius:16px;
  background:linear-gradient(135deg,#833AB4 0%,#E1306C 52%,#F77737 100%);
  color:#fff !important;
  text-decoration:none !important;
  box-shadow:0 12px 30px rgba(225,48,108,.28);
  opacity:0;
  transform:translateY(12px) scale(.94);
  animation:instagramFadeIn .55s ease-out .1s forwards;
  transition:var(--contact-transition);
  -webkit-tap-highlight-color:transparent;
}
.instagram-fab:hover{color:#fff !important;transform:translateY(-5px) scale(1.04);filter:saturate(1.08);box-shadow:0 18px 38px rgba(225,48,108,.42)}
.instagram-fab:active{transform:translateY(-2px) scale(1);box-shadow:0 12px 26px rgba(225,48,108,.34)}
.instagram-fab:focus-visible{outline:3px solid rgba(225,48,108,.35);outline-offset:4px}
.instagram-fab svg{display:none}
.instagram-fab::before{content:"";width:31px;height:31px;display:block;background:url("../assets/instagram-social-media-app-colorful-logo_34480-1604.png") center/contain no-repeat}

@keyframes instagramFadeIn{
  from{opacity:0;transform:translateY(12px) scale(.94)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

.whatsapp-fab{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:9999;
  width:60px;
  height:60px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.24);
  border-radius:50%;
  background:linear-gradient(135deg,#25D366 0%,#128C7E 100%);
  color:#fff !important;
  text-decoration:none !important;
  box-shadow:0 12px 30px rgba(37,211,102,.30);
  opacity:0;
  transform:translateY(12px) scale(.94);
  animation:whatsappFadeIn .55s ease-out .15s forwards;
  transition:var(--contact-transition);
  -webkit-tap-highlight-color:transparent;
}
.whatsapp-fab:hover{color:#fff !important;transform:translateY(-5px) scale(1.04);filter:saturate(1.08);box-shadow:0 18px 38px rgba(37,211,102,.42)}
.whatsapp-fab:active{transform:translateY(-2px) scale(1);box-shadow:0 12px 26px rgba(37,211,102,.34)}
.whatsapp-fab:focus-visible{outline:3px solid rgba(37,211,102,.35);outline-offset:4px}
.whatsapp-fab__icon{width:31px;height:31px;display:block;fill:currentColor}
.whatsapp-fab__tooltip{position:absolute;right:calc(100% + 12px);top:50%;transform:translateY(-50%) translateX(6px);width:max-content;max-width:240px;padding:9px 12px;border-radius:8px;background:#17201b;color:#fff;font-family:var(--font-body);font-size:13px;font-weight:600;line-height:1.3;white-space:nowrap;pointer-events:none;opacity:0;box-shadow:0 8px 20px rgba(0,0,0,.18);transition:opacity .2s ease,transform .2s ease}
.whatsapp-fab__tooltip::after{content:"";position:absolute;right:-5px;top:50%;width:10px;height:10px;background:#17201b;transform:translateY(-50%) rotate(45deg)}
.whatsapp-fab:hover .whatsapp-fab__tooltip,.whatsapp-fab:focus-visible .whatsapp-fab__tooltip{opacity:1;transform:translateY(-50%) translateX(0)}
.whatsapp-fab__status{position:absolute;right:2px;bottom:2px;width:13px;height:13px;border:2px solid #fff;border-radius:50%;background:#34c759;box-shadow:0 2px 6px rgba(0,0,0,.18)}

@keyframes whatsappFadeIn{
  from{opacity:0;transform:translateY(12px) scale(.94)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

@media(max-width:640px){
  .gmail-contact-button,.whatsapp-cta{width:100%;min-height:48px;padding:12px 16px}
  .instagram-fab{right:16px;bottom:88px;width:56px;height:56px;border-radius:14px}
  .instagram-fab::before{width:29px;height:29px}
  .whatsapp-fab{right:16px;bottom:16px;width:56px;height:56px}
  .whatsapp-fab__icon{width:29px;height:29px}
  .whatsapp-fab__tooltip{right:0;bottom:calc(100% + 10px);top:auto;transform:translateY(6px);font-size:12px}
  .whatsapp-fab__tooltip::after{right:18px;top:auto;bottom:-5px;transform:rotate(45deg)}
  .whatsapp-fab:hover .whatsapp-fab__tooltip,.whatsapp-fab:focus-visible .whatsapp-fab__tooltip{transform:translateY(0)}
}

@media(prefers-reduced-motion:reduce){
  .gmail-contact-button,.whatsapp-cta,.instagram-fab,.whatsapp-fab,.whatsapp-fab__tooltip{transition:none}
  .instagram-fab{animation:none;opacity:1;transform:none}
  .whatsapp-fab{animation:none;opacity:1;transform:none}
  .gmail-contact-button:hover,.gmail-contact-button:active,.whatsapp-cta:hover,.whatsapp-cta:active,.instagram-fab:hover,.instagram-fab:active,.whatsapp-fab:hover,.whatsapp-fab:active{transform:none}
}