@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&family=Barlow:wght@400;500;600;700&family=Orbitron:wght@600;700;800;900&display=swap');
:root{--ink:#071e25;--ink2:#0c2b35;--panel:#0c303c;--cyan:#22c1e7;--cyan2:#8cecff;--white:#f5fbfd;--muted:#b5c8ce;--line:rgba(81,197,223,.25);--max:1200px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--white);font:16px/1.6 Barlow,Arial,sans-serif}a{color:inherit}img{display:block;max-width:100%}.site-header{position:sticky;top:0;z-index:10;background:rgba(250,252,253,.98);color:#0c2027;box-shadow:0 4px 20px #00131a25}.nav{max-width:var(--max);margin:auto;padding:0 24px;min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{text-decoration:none;font-weight:800;letter-spacing:.12em;font-size:15px;white-space:nowrap}.brand b{font:800 21px Orbitron,sans-serif;color:#16bde6;letter-spacing:-.04em}.nav-links{display:flex;gap:28px;align-items:center}.nav-links a{text-decoration:none;text-transform:uppercase;font:700 14px 'Barlow Condensed',sans-serif;letter-spacing:.1em;padding:10px 0;border-bottom:2px solid transparent}.nav-links a:hover,.nav-links a[aria-current=page]{border-color:var(--cyan)}.hero{min-height:660px;display:grid;align-items:center;background:linear-gradient(90deg,rgba(3,18,22,.83),rgba(3,18,22,.2)),url('assets/images/hero-rooftop.jpg') center 54%/cover}.hero-inner{width:min(var(--max),100%);padding:100px 24px;margin:auto}.eyebrow{color:var(--cyan2);font:700 14px 'Barlow Condensed',sans-serif;letter-spacing:.19em;text-transform:uppercase}.hero h1,.page-title{font:800 clamp(42px,7vw,82px)/1.05 Orbitron,sans-serif;max-width:820px;margin:14px 0 20px;letter-spacing:-.05em}.hero h1 em,.page-title em{font-style:normal;color:var(--cyan)}.hero p{font-size:21px;max-width:600px;color:#e3f0f3}.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}.button{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:13px 23px;background:var(--cyan);color:#06232c;text-decoration:none;font-weight:700;border:1px solid var(--cyan);transition:.2s}.button:hover{transform:translateY(-2px);background:#66def7}.button.ghost{background:transparent;color:#f5fbfd;border-color:#c5e4eb}.section{padding:88px 24px}.section.alt{background:#0a252e}.container{width:min(var(--max),100%);margin:auto}.section-heading{max-width:760px;margin-bottom:34px}.section-heading h2{font:800 clamp(32px,4.2vw,52px)/1.1 Orbitron,sans-serif;margin:9px 0 14px}.section-heading p{color:var(--muted);font-size:18px}.service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.service-card{overflow:hidden;border-radius:16px;background:var(--panel);border:1px solid var(--line);display:flex;flex-direction:column;transition:transform .2s,border-color .2s}.service-card:hover{transform:translateY(-4px);border-color:var(--cyan)}.service-card img{width:100%;height:200px;object-fit:cover}.service-card .card-body{padding:20px;display:flex;flex-direction:column;flex:1}.service-card h3{font:700 22px 'Barlow Condensed',sans-serif;letter-spacing:.04em;margin:0 0 8px}.service-card p{color:var(--muted);margin:0 0 18px}.text-link{color:var(--cyan2);font-weight:700;text-decoration:none;margin-top:auto}.text-link:hover{text-decoration:underline}.service-detail{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:center;padding:48px 0;border-bottom:1px solid var(--line);scroll-margin-top:90px}.service-detail:nth-child(even) .detail-image{order:2}.detail-image{height:340px;width:100%;object-fit:cover;border-radius:18px;border:1px solid var(--line)}.service-detail h3{font:700 32px 'Barlow Condensed',sans-serif;margin:4px 0 10px}.service-detail p,.service-detail li{color:var(--muted)}.service-detail ul{padding-left:20px}.feature-band{position:relative;isolation:isolate;min-height:390px;display:grid;align-items:center;background:#102a31;overflow:hidden}.feature-band:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,23,28,.94),rgba(4,23,28,.43));z-index:-1}.feature-band .container{padding:76px 24px}.feature-band h2{font:800 clamp(34px,5vw,58px)/1.1 Orbitron,sans-serif;margin:8px 0 12px}.feature-band p{font-size:19px;max-width:580px;color:#e0eef1}.about-hero{height:clamp(260px,42vw,760px);background:linear-gradient(0deg,var(--ink) 0%,rgba(7,30,37,0) 28%),url('assets/images/about-background.jpg') center top/cover}.about-intro .container{padding:8px 24px 8px}.page-title{font-size:clamp(40px,6vw,68px);margin:0 0 12px}.about-cards{display:grid;grid-template-columns:1fr 1fr;gap:20px}.info-card{padding:24px 26px;border:1px solid var(--line);border-radius:15px;background:rgba(12,48,60,.94)}.info-card h2{color:var(--cyan);font:700 22px 'Barlow Condensed',sans-serif;letter-spacing:.06em;margin:0 0 8px}.info-card p{margin:0;color:#d4e4e8}.info-card ul{margin:10px 0 0;padding:0;list-style:none}.info-card li{margin:6px 0;color:#d4e4e8}.info-card li:before{content:'●';color:var(--cyan);margin-right:11px}.about-cta{text-align:center;margin:22px auto 0}.about-cta .button{padding:14px 26px}.address{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px;background:var(--panel);border:1px solid var(--line);border-radius:16px}.address p{margin:4px 0;color:var(--muted)}.entertainment-intro{max-width:760px;color:var(--muted);font-size:19px}.showcase{margin-top:42px}.slide-track{display:grid;grid-template-columns:1fr 1fr;gap:20px}.video-slide{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:14px;overflow:hidden}.video-slide video{width:100%;aspect-ratio:16/9;object-fit:cover;background:#000;border-radius:12px}.video-slide h3{font:700 23px 'Barlow Condensed',sans-serif;margin:12px 6px 3px}.video-slide p{color:var(--muted);margin:0 6px 8px}.slide-controls{display:flex;gap:10px;justify-content:center;margin-top:18px}.slide-controls button{border:1px solid var(--line);background:var(--panel);color:var(--white);border-radius:999px;padding:10px 17px;font:700 14px Barlow;cursor:pointer}.slide-controls button:hover,.slide-controls button.active{background:var(--cyan);color:#06232c}.slide-status{text-align:center;color:var(--muted);font-size:14px;margin-top:10px}.site-footer{background:#04171c;padding:38px 24px;border-top:1px solid var(--line)}.footer-inner{max-width:var(--max);margin:auto;display:flex;justify-content:space-between;gap:24px;align-items:center;flex-wrap:wrap}.footer-inner p{margin:5px 0;color:var(--muted)}.footer-links{display:flex;gap:18px}.footer-links a{color:var(--cyan2);text-decoration:none}.mobile-nav{display:none}
@media(max-width:950px){.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.nav-links{gap:15px}.service-card img{height:180px}}
@media(max-width:650px){.nav{min-height:68px;padding:0 16px;align-items:flex-start;flex-direction:column;gap:0}.brand{padding-top:14px}.nav-links{width:100%;overflow:auto;gap:18px;padding:0 0 11px}.nav-links a{font-size:13px;white-space:nowrap}.hero{min-height:590px}.hero-inner{padding:72px 20px}.hero p{font-size:18px}.section{padding:64px 18px}.service-grid{grid-template-columns:1fr}.service-card img{height:220px}.service-detail{grid-template-columns:1fr;gap:22px;padding:34px 0}.service-detail:nth-child(even) .detail-image{order:initial}.detail-image{height:250px}.about-cards,.slide-track{grid-template-columns:1fr}.about-intro .container{padding:4px 20px 0}.address{align-items:flex-start;flex-direction:column}.feature-band .container{padding:60px 20px}.footer-inner{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* ---------- Home section (copied from okes-hub-fixed-with-seo, scoped to #home) ---------- */
#home{--cyan:#00bedc;--ink:#002025;line-height:1.5;font-family:Barlow,Arial,sans-serif}
#home *,#home :before,#home :after{box-sizing:border-box;margin:0;padding:0}
#home a{color:inherit;text-decoration:inherit}
#home img,#home svg{display:block;vertical-align:middle}
#home h1{font-size:inherit;font-weight:inherit}
#home .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#home.hero{min-height:0;display:block;background:#26acdf;height:clamp(540px,75vw,1080px);position:relative;overflow:hidden}
#home .hero-image{object-fit:cover;object-position:center 68%;width:100%;max-width:none;height:100%;animation:1.65s cubic-bezier(.2,.65,.25,1) both scene-enter;position:absolute;inset:0}
#home .masthead-shape{width:100%;height:clamp(285px,24.3vw,370px);position:absolute;inset:0 0 auto}
#home .site-header{top:auto;z-index:auto;background:none;color:inherit;box-shadow:none;justify-content:space-between;align-items:flex-start;max-width:1536px;margin:auto;padding:31px 5.1% 0 4.4%;display:flex;position:relative}
#home .brand{font-size:inherit;font-weight:inherit;letter-spacing:normal;white-space:normal;flex-shrink:0;width:clamp(330px,31vw,450px);animation:.9s .15s both brand-enter;display:block}
#home .brand-mark{width:100%;height:auto;overflow:visible}
#home .header-right{align-items:flex-start;gap:30px;display:flex}
#home .main-nav{color:#111918;align-items:center;gap:37px;padding-top:16px;display:flex}
#home .main-nav a{letter-spacing:.045em;white-space:nowrap;font-size:clamp(14px,1.19vw,18px);font-weight:600;position:relative}
#home .main-nav a+a:before{content:"";background:var(--cyan);width:2px;height:20px;position:absolute;top:2px;left:-19px}
#home .main-nav a:after{content:"";background:var(--cyan);transform-origin:0;border-radius:50% 40% 35% 30%;height:5px;transition:transform .25s;position:absolute;bottom:-9px;left:-2px;right:-2px;transform:scaleX(0) rotate(-1.5deg)}
#home .main-nav a.is-active:after,#home .main-nav a:hover:after{transform:scaleX(1) rotate(-1.5deg)}
#home .hero-curve{width:100%;height:116px;position:absolute;bottom:-1px;left:0}
@keyframes scene-enter{0%{opacity:.6;transform:scale(1.045)}to{opacity:1;transform:scale(1)}}
@keyframes brand-enter{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1600px){#home .hero-image{object-position:center 63%}#home .hero-curve{height:135px}}
@media(max-width:1150px){#home .site-header{padding-left:3.2%;padding-right:3.5%}#home .brand{width:34vw}#home .main-nav{gap:27px;padding-top:12px}#home .main-nav a+a:before{height:17px;left:-14px}#home.hero{height:75vw}#home .masthead-shape{height:295px}}
@media(max-width:800px){#home.hero{height:max(520px,75vw)}#home .brand{width:clamp(270px,42vw,330px)}#home .site-header{padding:24px 24px 0}#home .main-nav{gap:20px;padding-top:14px}#home .main-nav a{letter-spacing:.02em;font-size:12px}#home .main-nav a+a:before{width:1px;height:14px;left:-10px}#home .masthead-shape{height:285px}}
@media(max-width:620px){#home.hero{height:490px}#home .hero-image{object-position:65% center}#home .masthead-shape{width:150%;max-width:none;height:240px}#home .site-header{padding:14px 20px;display:block}#home .main-nav{background:#fff;justify-content:center;gap:27px;padding:12px 12px 14px;position:absolute;top:0;left:0;right:0}#home .main-nav a{letter-spacing:.04em;font-size:11px}#home .main-nav a+a:before{height:13px;left:-14px}#home .main-nav a:after{height:3px;bottom:-5px}#home .brand{width:265px;margin:38px 0 0;position:relative}#home .hero-curve{width:175%;max-width:none;height:91px;left:-37.5%}}
@media(max-width:370px){#home .brand{width:240px}#home .main-nav{gap:21px}#home .main-nav a{font-size:10px}#home .main-nav a+a:before{left:-11px}}
@media(max-width:1150px){#home .header-right{gap:20px}#home .main-nav{gap:24px}#home .main-nav a{font-size:15px}#home .main-nav a+a:before{left:-12px}}
@media(max-width:620px){#home .main-nav a:last-child{color:var(--cyan)}}
@media(max-width:800px){#home .site-header{flex-direction:column;align-items:center;padding-left:16px;padding-right:16px}#home .header-right{width:100%;display:flex;justify-content:center}#home .main-nav{flex-wrap:wrap;justify-content:center;gap:8px 18px;padding-top:10px;font-size:14px}#home .main-nav a{font-size:14px}}
@media(max-width:420px){#home .main-nav{gap:6px 12px}#home .main-nav a{font-size:13px;letter-spacing:.02em}}
@media(prefers-reduced-motion:reduce){#home *,#home :before,#home :after{animation-duration:.01ms!important;animation-delay:0s!important}}

/* ---------- Contact Us (copied from theokes-site-v2, scoped to #contact) ---------- */
@font-face{font-family:"Manrope";src:url("assets/fonts/Manrope-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"Manrope";src:url("assets/fonts/Manrope-Bold.ttf") format("truetype");font-weight:700 800;font-display:swap}
@font-face{font-family:"Barlow Condensed v2";src:url("assets/fonts/BarlowCondensed-Bold.ttf") format("truetype");font-weight:700;font-display:swap}
#contact{--ink:#071c24;--cyan:#23c4f0;--white:#ffffff;--muted:#a9c8d3;--max:1200px;font-family:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--white);line-height:1.6;font-size:16px}
#contact *{box-sizing:border-box;margin:0;padding:0}
#contact a{color:inherit}
#contact h2{line-height:1.2}
#contact .wrap{max-width:var(--max);margin:0 auto;padding:0 16px}
#contact .pill-title{display:block;width:fit-content;margin:0 auto 34px;background:var(--cyan);color:#0b1d26;padding:12px 36px;border-radius:40px;font-family:"Barlow Condensed v2","Barlow Condensed",Arial,sans-serif;font-weight:700;font-size:1.5rem;letter-spacing:.3em;text-transform:uppercase;text-align:center}
#contact.contact{padding:56px 0;background:linear-gradient(135deg,#0c2f3d,#071c24)}
#contact .contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
#contact .contact-item{display:flex;align-items:center;gap:14px;border:1px solid var(--cyan);border-radius:12px;padding:14px 18px;text-decoration:none;color:var(--white);font-weight:700;word-break:break-word;transition:background .2s}
#contact .contact-item:hover{background:rgba(35,196,240,.14)}
#contact .contact-item small{display:block;color:var(--muted);font-weight:700;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase}
#contact .ico{width:40px;height:40px;flex-shrink:0;border-radius:50%;background:var(--white);color:#0b1d26;padding:10px}
#contact :focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
@media (max-width:980px){#contact .contact-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){#contact .contact-grid{grid-template-columns:1fr}#contact .pill-title{font-size:1.1rem;padding:10px 24px;letter-spacing:.2em}#contact .wrap{padding:0 16px}}
@media (prefers-reduced-motion:reduce){#contact *{transition:none!important}}

/* About page: contact cards under Get in touch, map */
#contact.about-contact{padding:34px 0 56px;background:none}
.visit .address{margin-bottom:20px}
.map-wrap{border-radius:16px;overflow:hidden;border:1px solid var(--line);background:var(--panel);aspect-ratio:16/7;min-height:320px}
.map-wrap iframe{display:block;width:100%;height:100%;border:0}
@media(max-width:650px){.map-wrap{aspect-ratio:4/5}}
/* Entertainment photo galleries + lightbox (shared gallery.js) */
.ent-gallery .gallery{columns:4 220px;column-gap:12px}
.ent-gallery .g-item{display:block;margin:0 0 12px;break-inside:avoid;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:var(--panel)}
.ent-gallery .g-item img{display:block;width:100%;height:auto;transition:transform .35s ease}
.ent-gallery .g-item:hover img{transform:scale(1.03)}
.ent-gallery .g-item:hover{border-color:var(--cyan)}
.lightbox{position:fixed;inset:0;z-index:200;background:rgba(2,12,16,.94);display:flex;align-items:center;justify-content:center;padding:56px 64px}
.lightbox[hidden]{display:none}
.lightbox figure{margin:0;max-width:100%;max-height:100%;display:flex;flex-direction:column;align-items:center;gap:10px}
.lightbox img{max-width:100%;max-height:calc(100vh - 140px);width:auto;height:auto;border-radius:10px;box-shadow:0 18px 50px rgba(0,0,0,.6)}
.lightbox figcaption{color:var(--muted);font-size:.92rem;text-align:center}
.lightbox button{position:absolute;background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.25);border-radius:50%;width:46px;height:46px;font-size:1.8rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.lightbox button:hover{background:var(--cyan);color:#071c24}
.lb-close{top:14px;right:14px}
.lb-prev{left:12px;top:50%;transform:translateY(-50%)}
.lb-next{right:12px;top:50%;transform:translateY(-50%)}
@media(max-width:650px){.ent-gallery .gallery{columns:2 140px;column-gap:8px}.ent-gallery .g-item{margin-bottom:8px}.lightbox{padding:60px 8px 70px}.lb-prev,.lb-next{top:auto;bottom:12px;transform:none}.lb-prev{left:calc(50% - 56px)}.lb-next{right:calc(50% - 56px)}}
/* Make it yours sneaker slideshow */
.band-slides{position:absolute;inset:0;z-index:-2}
.band-slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1s ease}
.band-slides img.active{opacity:1}
.band-dots{position:absolute;right:24px;bottom:20px;display:flex;gap:10px;z-index:2}
.band-dots button{width:12px;height:12px;padding:0;border-radius:50%;border:2px solid #fff;background:transparent;cursor:pointer}
.band-dots button.active{background:var(--cyan);border-color:var(--cyan)}
@media(prefers-reduced-motion:reduce){.band-slides img{transition:none}}