/* Copied verbatim from the Claude Design export (index.html). Only asset paths changed. */
body{margin:0;background:#0b0b0b}
*{box-sizing:border-box}
:root{--accent:#FF6A13}
a{color:inherit}a:hover{color:var(--accent)}
.hex-dark{background-color:#0a0a0a;background-image:url("../img/pattern-dark.svg");background-size:17.32px 30px}
.hex-light{background-color:#e2e2e2;background-image:url("../img/pattern-light.svg");background-size:17.32px 30px}
.hero-bg{background-color:#0a0a0a;background-image:linear-gradient(90deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.55) 50%,rgba(0,0,0,.3) 100%),url("../img/hero.jpg");background-size:cover;background-position:center}
.curtain-bg{background-color:#2a0507;background-image:linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.25) 40%,rgba(0,0,0,.45) 100%),url("../img/services.jpg");background-size:cover;background-position:center}
.alu{background:linear-gradient(180deg,#fbfbfb 0%,#d6d6d6 35%,#a1a1a1 52%,#cdcdcd 72%,#f0f0f0 100%)}
.ball{position:absolute;width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 36% 30%,#ffffff 0%,#e6e6e6 16%,#a8a8a8 54%,#676767 86%,#474747 100%);box-shadow:0 3px 6px rgba(0,0,0,.55)}
.nav{text-decoration:none}
.btn-accent{text-decoration:none;transition:filter .15s}
.btn-accent:hover{filter:brightness(1.1);color:#0b0b0b}
.btn-dark:hover{color:#fff;background:#222 !important}
.case{position:relative;padding:20px;background:linear-gradient(180deg,#f7f7f7 0%,#d3d3d3 30%,#a9a9a9 50%,#c9c9c9 68%,#ececec 100%);box-shadow:0 28px 48px rgba(0,0,0,.32),0 4px 10px rgba(0,0,0,.25),inset 0 0 0 1px #8c8c8c,inset 0 2px 0 #ffffff}
.case::before{content:"";position:absolute;inset:7px;border:1px solid rgba(0,0,0,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 1px 0 rgba(255,255,255,.6);pointer-events:none}
.lid{position:relative;box-shadow:inset 0 0 0 1px #000,inset 0 6px 14px rgba(0,0,0,.85),inset 0 -2px 6px rgba(0,0,0,.6),0 1px 0 rgba(255,255,255,.7)}
.corner{position:absolute;width:76px;height:76px;z-index:2;background:radial-gradient(circle at 22% 22%,#6e6e6e 0 2px,#e9e9e9 2.5px,transparent 3.5px),radial-gradient(circle at 78% 78%,#6e6e6e 0 2px,#e9e9e9 2.5px,transparent 3.5px),radial-gradient(circle at 78% 22%,#6e6e6e 0 2px,#e9e9e9 2.5px,transparent 3.5px),radial-gradient(circle at 22% 78%,#6e6e6e 0 2px,#e9e9e9 2.5px,transparent 3.5px),linear-gradient(135deg,#fafafa 0%,#c4c4c4 45%,#9c9c9c 60%,#dedede 100%);box-shadow:0 3px 6px rgba(0,0,0,.45),inset 0 1px 0 #ffffff,inset 0 -1px 0 rgba(0,0,0,.25)}
.corner::after{content:"";position:absolute;left:50%;top:50%;width:42px;height:42px;margin:-21px 0 0 -21px;border-radius:50%;background:radial-gradient(circle at 34% 28%,#ffffff 0%,#ededed 14%,#b0b0b0 48%,#6c6c6c 82%,#4c4c4c 100%);box-shadow:0 4px 7px rgba(0,0,0,.55),inset 0 -2px 3px rgba(0,0,0,.25)}
.c-tl{top:-8px;left:-8px;border-radius:20px 4px 4px 4px}
.c-tr{top:-8px;right:-8px;border-radius:4px 20px 4px 4px}
.c-bl{bottom:-8px;left:-8px;border-radius:4px 4px 4px 20px}
.c-br{bottom:-8px;right:-8px;border-radius:4px 4px 20px 4px}
.latch{position:absolute;bottom:-12px;width:96px;height:48px;z-index:2;border-radius:6px;background:linear-gradient(180deg,#f2f2f2 0%,#c2c2c2 45%,#9e9e9e 60%,#dadada 100%);box-shadow:0 3px 6px rgba(0,0,0,.45),inset 0 1px 0 #ffffff}
.latch::before{content:"";position:absolute;inset:9px 16px;border-radius:5px;background:#0e0e0e;box-shadow:inset 0 3px 5px rgba(0,0,0,.95),0 1px 0 rgba(255,255,255,.7)}
.latch::after{content:"";position:absolute;left:50%;top:50%;width:40px;height:16px;margin:-8px 0 0 -20px;border-radius:8px 8px 3px 3px;background:linear-gradient(180deg,#ffffff 0%,#cfcfcf 45%,#8e8e8e 100%);box-shadow:0 2px 3px rgba(0,0,0,.7)}
.dish{align-self:center;width:200px;height:68px;border-radius:12px;background:#050505;box-shadow:inset 0 8px 16px rgba(0,0,0,.95),inset 0 -1px 0 rgba(255,255,255,.08),0 1px 0 rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.grip{width:150px;height:18px;border-radius:9px;box-shadow:0 4px 6px rgba(0,0,0,.8),inset 0 -1px 0 rgba(0,0,0,.3)}
.map{background-color:#101010;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:8.333% 8.333%}
.town{position:absolute;display:flex;align-items:center;gap:6px;transform:translate(-4px,-50%);white-space:nowrap;font-size:13px;color:#8a8a8a}
.town i{display:block;width:8px;height:8px;border-radius:50%;background:#6a6a6a;flex-shrink:0}
.town.in{color:#ffffff;font-weight:700}
.town.in i{background:#ffffff}
.town.l{flex-direction:row-reverse;transform:translate(calc(-100% + 4px),-50%)}
.tile{text-decoration:none;transition:transform .15s}
.dd{position:relative;display:flex;align-items:center;min-height:44px}
.dd-menu{position:absolute;top:100%;left:-22px;padding-top:14px;display:none;z-index:30}
.dd:hover .dd-menu,.dd:focus-within .dd-menu{display:block}
.dd-panel{min-width:240px;display:flex;flex-direction:column;padding:8px;background:#ffffff;border-top:4px solid var(--accent);box-shadow:0 24px 48px rgba(0,0,0,.45)}
.dd-panel a,.dd-panel button{display:flex;align-items:center;min-height:44px;padding:0 14px;color:#0b0b0b;text-decoration:none;font-size:15px;font-family:inherit;background:none;border:0;text-align:left;cursor:pointer}
.dd-panel a:hover,.dd-panel button:hover,.dd-panel a:focus-visible,.dd-panel button:focus-visible{background:#0b0b0b;color:#ffffff}
.dd-panel .dd-all{font-weight:700;border-bottom:1px solid #d6d6d6;margin-bottom:4px}
.tile:hover{transform:translateY(-3px);color:#fff}