/* ===== site header & footer (same as index) — used by privacy-policy and terms ===== */ @keyframes shine{0%{left:-60%}30%,100%{left:170%}} @keyframes menuIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}} /* ===== site header & footer (scoped from index) ===== */ body > header{--red:#88181a;--ink:#0d1024} /* header */ header{position:relative;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:1.5vw 6.2vw 0} .logo{display:flex;flex-direction:column;align-items:flex-end;gap:.35vw} .logo img{height:clamp(30px,2.7vw,52px);width:auto;display:block} .logo small{font-size:clamp(.5rem,.48vw,.62rem);letter-spacing:.32em;color:#444;font-weight:500} body > header nav{display:flex;gap:3.2vw;margin-left:-4vw} body > header nav a{position:relative;padding:.7em 0;font-size:clamp(.85rem,.92vw,1rem);font-weight:500} body > header nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .3s} body > header nav a:hover::after, body > header nav a.on::after{transform:scaleX(1)} body > header nav a.on{color:var(--red)} .hdr-r{display:flex;align-items:center;gap:2.6vw} .hdr-r svg{width:20px;height:20px;stroke:var(--ink);fill:none;stroke-width:2;stroke-linecap:round} /* buttons */ .btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:.8em;padding:1.05em 1.9em;border-radius:12px;font-weight:700;font-size:clamp(.72rem,.88vw,.95rem);letter-spacing:.09em;text-transform:uppercase;transition:transform .25s,box-shadow .25s} .btn svg{width:1.3em;height:1.3em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s} .btn:hover svg{transform:translateX(5px)} .pri{color:#fff;background:linear-gradient(180deg,#88181a,#88181a);box-shadow:0 10px 28px rgba(136,24,26,.38),inset 0 1px 0 rgba(255,255,255,.35)} .pri:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(136,24,26,.5),inset 0 1px 0 rgba(255,255,255,.35)} .pri::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:shine 4.5s 2.2s infinite} .sec{background:rgba(255,255,255,.7);border:1px solid rgba(136,24,26,.14);backdrop-filter:blur(8px)} .sec:hover{transform:translateY(-3px);border-color:rgba(136,24,26,.45);box-shadow:0 12px 28px rgba(136,24,26,.14)} @media(max-width:900px){ body > header nav{display:none} body > header{padding:4vw 6vw 0} .logo img{height:32px} .logo small{font-size:.5rem} .hdr-r{gap:16px} } /* header */ /* ===== MOBILE PATCH: medium text sizes + hamburger menu ===== */ .menu-btn{display:none} @media(max-width:900px){ /* header: hide "Get in touch", show 3-line button */ header{position:relative;z-index:20} .hdr-r .btn{display:none} .menu-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:44px;height:44px;padding:0;border:1px solid rgba(136,24,26,.18);border-radius:12px;background:rgba(255,255,255,.75);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;-webkit-tap-highlight-color:transparent} .menu-btn:focus-visible{outline:2px solid var(--red);outline-offset:3px} .menu-btn span{display:block;width:20px;height:2px;border-radius:2px;background:var(--ink);transition:transform .3s,opacity .25s} .menu-btn.open span:nth-child(1){transform:translateY(7px) rotate(45deg)} .menu-btn.open span:nth-child(2){opacity:0} .menu-btn.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)} /* dropdown menu (reuses the existing