/*
Theme Name: Ravics
Description: Custom theme for Ravics, a VR/immersive gaming arena in Warsaw. Rave-glitch neon palette (magenta/cyan/lime on near-black), RGB-split display text, jagged "glitch slice" section dividers, distinct widget per page.
Version: 1.0
Text Domain: ravics
*/

:root{
  --bg:        #0D0417;
  --surface:   #170A29;
  --surface-2: #21103A;
  --border:    #3A2159;
  --text:      #F4F2FF;
  --text-dim:  #B6A8D9;
  --magenta:   #FF2DAF;
  --cyan:      #00E5FF;
  --lime:      #C6FF3D;
  --font-display:'Bungee', sans-serif;
  --font-body: 'Manrope', sans-serif;
  --font-mono: 'IBM Plex Mono', monospace;
  --radius:    4px;
  --container: 1180px;
}

@media (prefers-reduced-motion: reduce){ *{ animation-duration:0.001ms !important; transition-duration:0.001ms !important; } }

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ background:var(--bg); color:var(--text); font-family:var(--font-body); margin:0; line-height:1.65; }
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ font-family:var(--font-display); line-height:1.15; margin:0 0 .5em; text-transform:uppercase; }
h1{ font-size:clamp(2.2rem,5vw,3.8rem); }
h2{ font-size:clamp(1.6rem,3.2vw,2.4rem); }
h3{ font-size:1.05rem; }
p{ margin:0 0 1em; color:var(--text-dim); }
.container{ max-width:var(--container); margin:0 auto; padding:0 24px; }
.eyebrow{ font-family:var(--font-mono); font-size:.75rem; letter-spacing:.16em; text-transform:uppercase; color:var(--cyan); display:inline-flex; align-items:center; gap:8px; margin-bottom:12px; }
.eyebrow::before{ content:''; width:8px; height:8px; background:var(--magenta); border-radius:50%; }

/* RGB-split glitch text, used on hero H1 */
.glitch{ position:relative; display:inline-block; }
.glitch::before, .glitch::after{ content:attr(data-text); position:absolute; left:0; top:0; width:100%; }
.glitch::before{ color:var(--cyan); transform:translate(3px,0); opacity:.7; z-index:-1; }
.glitch::after{ color:var(--magenta); transform:translate(-3px,0); opacity:.7; z-index:-1; }

.btn{ display:inline-flex; align-items:center; gap:8px; padding:14px 28px; font-family:var(--font-display); font-size:.85rem; text-transform:uppercase; letter-spacing:.04em; cursor:pointer; border:2px solid var(--text); clip-path:polygon(0 0,100% 0,100% 70%,92% 100%,0 100%); }
.btn-primary{ background:var(--magenta); color:var(--bg); border-color:var(--magenta); }
.btn-primary:hover{ background:var(--cyan); border-color:var(--cyan); }
.btn-ghost{ background:transparent; color:var(--text); }
.btn-ghost:hover{ border-color:var(--lime); color:var(--lime); }

/* HEADER */
.site-header{ position:sticky; top:0; z-index:50; background:rgba(13,4,23,.9); backdrop-filter:blur(8px); border-bottom:2px solid var(--border); }
.site-header .container{ display:flex; align-items:center; justify-content:space-between; height:78px; }
.logo svg{ height:38px; width:auto; }
.primary-nav ul{ list-style:none; display:flex; gap:24px; margin:0; padding:0; }
.primary-nav a{ font-family:var(--font-mono); font-size:.85rem; text-transform:uppercase; letter-spacing:.04em; color:var(--text-dim); }
.primary-nav a.current{ color:var(--lime); }
.menu-toggle{ display:none; background:none; border:2px solid var(--text); color:var(--text); cursor:pointer; padding:8px 12px; font-family:var(--font-mono); }
@media (max-width:900px){
  .primary-nav{ position:fixed; inset:78px 0 0 0; background:var(--bg); transform:translateY(-110%); transition:transform .3s ease; overflow-y:auto; }
  .primary-nav.open{ transform:translateY(0); }
  .primary-nav ul{ flex-direction:column; padding:24px; gap:0; }
  .primary-nav a{ display:block; padding:16px 4px; font-size:1.1rem; border-bottom:1px solid var(--border); }
  .menu-toggle{ display:block; }
  .header-cta .btn-primary{ display:none; }
}
.header-cta{ display:flex; align-items:center; gap:14px; }

/* MARQUEE TICKER */
.ticker{ background:var(--magenta); color:var(--bg); overflow:hidden; white-space:nowrap; padding:8px 0; }
.ticker-track{ display:inline-block; animation:ticker-scroll 24s linear infinite; font-family:var(--font-mono); font-weight:700; }
.ticker-track span{ display:inline-block; padding:0 30px; font-size:.82rem; text-transform:uppercase; }
@keyframes ticker-scroll{ 0%{ transform:translateX(0); } 100%{ transform:translateX(-50%); } }

/* HERO */
.hero{ position:relative; padding:80px 0 60px; overflow:hidden; background-image:url('images/hero-bg.png'); background-size:cover; background-position:center; }
.hero::before{ content:''; position:absolute; inset:-10% -10% auto -10%; height:520px; background:radial-gradient(ellipse at 20% 10%, rgba(255,45,175,.25), transparent 55%), radial-gradient(ellipse at 85% 25%, rgba(0,229,255,.2), transparent 50%); pointer-events:none; }
.hero-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:50px; align-items:center; position:relative; }
.hero .lede{ font-size:1.1rem; max-width:46ch; }
.hero-actions{ display:flex; gap:16px; margin-top:28px; flex-wrap:wrap; }
@media (max-width:900px){ .hero-grid{ grid-template-columns:1fr; } }

/* GLITCH SLICE — signature section divider */
.glitch-slice{ clip-path:polygon(0 3%,15% 0,40% 4%,62% 0,85% 3%,100% 0,100% 97%,80% 100%,55% 96%,30% 100%,10% 97%,0 100%); }

/* ATTRACTIONS SCROLLER (Home) — horizontal, not a grid */
.attraction-scroller{ display:flex; gap:20px; overflow-x:auto; padding:8px 4px 24px; scroll-snap-type:x mandatory; }
.attraction-card{ flex:0 0 270px; scroll-snap-align:start; background:var(--surface); border:2px solid var(--border); padding:22px; position:relative; }
.attraction-card::before{ content:''; position:absolute; top:0; left:0; width:100%; height:4px; background:linear-gradient(90deg,var(--magenta),var(--cyan),var(--lime)); }
.attraction-card h3{ margin-bottom:6px; }
.attraction-tag{ font-family:var(--font-mono); font-size:.72rem; color:var(--lime); text-transform:uppercase; }

section{ padding:64px 0; }
.section-head{ max-width:640px; margin-bottom:40px; }
.alt-bg{ background:var(--surface); }

/* VU-METER REVIEW BARS */
.vu-review{ background:var(--surface); border:2px solid var(--border); padding:22px; }
.vu-meter{ display:flex; gap:4px; margin-bottom:12px; }
.vu-meter span{ width:14px; height:22px; background:var(--border); }
.vu-meter span.on:nth-child(-n+3){ background:var(--lime); }
.vu-meter span.on:nth-child(n+4):nth-child(-n+4){ background:var(--cyan); }
.vu-meter span.on:nth-child(5){ background:var(--magenta); }
.vu-review .who{ font-family:var(--font-mono); font-size:.8rem; color:var(--cyan); margin-top:10px; }

/* VENUE ZONE MAP (Features) — pure CSS grid "floor plan", no image/coords needed */
.floorplan{ display:grid; grid-template-columns:1fr 1fr; grid-template-rows:auto auto; gap:14px; border:2px solid var(--border); padding:14px; background:var(--surface); }
.zone{ border:2px solid var(--border); padding:20px; cursor:pointer; transition:border-color .2s, background .2s; position:relative; }
.zone:hover, .zone.active{ border-color:var(--lime); background:var(--surface-2); }
.zone h3{ margin-bottom:4px; font-size:1rem; }
.zone .tag{ font-family:var(--font-mono); font-size:.7rem; color:var(--cyan); text-transform:uppercase; }
.zone-detail{ background:var(--surface-2); border:2px solid var(--lime); padding:24px; margin-top:20px; display:none; }
.zone-detail.active{ display:block; }

/* FLYER WALL (Blog) */
.flyer-wall{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:30px; }
.flyer{ background:var(--surface); border:2px solid var(--border); padding:20px; position:relative; }
.flyer:nth-child(3n){ transform:rotate(-1.2deg); }
.flyer:nth-child(3n+1){ transform:rotate(1deg); }
.flyer img{ width:100% !important; height:auto !important; aspect-ratio:4/3 !important; object-fit:cover !important; margin-bottom:14px; filter:contrast(1.1) saturate(1.3); border:1px solid var(--border); }
.flyer .date{ font-family:var(--font-mono); font-size:.72rem; color:var(--lime); text-transform:uppercase; }

article.single-post img.featured{ width:100% !important; height:auto !important; aspect-ratio:16/9 !important; object-fit:cover !important; border:2px solid var(--border); margin-bottom:26px; filter:contrast(1.08) saturate(1.2); }
.entry-content img{ width:100% !important; height:auto !important; aspect-ratio:16/9 !important; object-fit:cover !important; border:2px solid var(--border); margin:8px 0 22px; filter:contrast(1.08) saturate(1.2); }
.entry-content h2{ margin-top:1.3em; text-transform:none; font-size:1.4rem; font-family:var(--font-display); }
.post-meta{ font-family:var(--font-mono); font-size:.78rem; color:var(--text-dim); margin-bottom:20px; }

/* TICKET-STYLE CONTACT FORM */
.ticket-form{ background:var(--surface); border:2px dashed var(--lime); padding:36px; position:relative; }
.form-grid{ display:grid; gap:16px; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:700px){ .form-row{ grid-template-columns:1fr; } }
label{ font-family:var(--font-mono); font-size:.75rem; text-transform:uppercase; letter-spacing:.05em; display:block; margin-bottom:6px; color:var(--cyan); }
input, textarea, select{ width:100%; background:var(--bg); border:2px solid var(--border); padding:12px 14px; font-family:var(--font-body); font-size:.95rem; color:var(--text); border-radius:var(--radius); }
input:focus, textarea:focus{ outline:2px solid var(--magenta); outline-offset:1px; }
.hp-field{ position:absolute; left:-9999px; opacity:0; }
.form-success{ background:rgba(198,255,61,.12); border:2px solid var(--lime); padding:16px 20px; margin-bottom:18px; }
.form-error{ background:rgba(255,45,175,.12); border:2px solid var(--magenta); padding:16px 20px; margin-bottom:18px; }
.star-input{ display:flex; gap:6px; direction:rtl; justify-content:flex-end; }
.star-input input{ display:none; }
.star-input label{ font-size:1.6rem; color:var(--border); cursor:pointer; margin:0; }
.star-input input:checked ~ label, .star-input label:hover, .star-input label:hover ~ label{ color:var(--lime); }

.cta-band{ background:linear-gradient(120deg, rgba(255,45,175,.18), rgba(0,229,255,.14)); border:2px solid var(--border); padding:56px; text-align:center; }

.legal-content{ max-width:760px; }
.legal-content h2{ text-transform:none; font-family:var(--font-display); font-size:1.4rem; margin-top:1.5em; }

.site-footer{ border-top:2px solid var(--border); padding:50px 0 26px; margin-top:30px; background:var(--surface); }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:36px; margin-bottom:36px; }
@media (max-width:800px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
.footer-grid h4{ font-family:var(--font-display); font-size:.85rem; margin-bottom:14px; color:var(--lime); }
.footer-grid ul{ list-style:none; margin:0; padding:0; }
.footer-grid li{ margin-bottom:9px; }
.footer-grid a:hover{ color:var(--cyan); }
.footer-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; border-top:1px solid var(--border); padding-top:20px; font-size:.8rem; color:var(--text-dim); }

.text-center{ text-align:center; }
.skip-link{ position:absolute; left:-9999px; top:0; background:var(--magenta); color:var(--bg); padding:10px 16px; z-index:100; }
.skip-link:focus{ left:16px; top:16px; }

/* COOKIE CONSENT BANNER */
.cookie-banner{
	position:fixed; left:16px; right:16px; bottom:16px; z-index:200; max-width:640px; margin:0 auto;
	background:var(--surface); border:2px solid var(--lime); padding:22px 24px; display:none;
	box-shadow:0 8px 30px rgba(0,0,0,.5);
}
.cookie-banner.show{ display:block; }
.cookie-banner p{ margin:0 0 14px; font-size:.9rem; }
.cookie-banner a{ color:var(--cyan); text-decoration:underline; }
.cookie-actions{ display:flex; gap:12px; flex-wrap:wrap; }
.cookie-actions .btn{ padding:10px 20px; font-size:.78rem; }