/**
 * The OC Menu — front-end styles.
 */

/* keyframes */
@keyframes ocPing { 0% { transform: translate(-50%,-50%) scale(.6); opacity:.7; } 100% { transform: translate(-50%,-50%) scale(2.4); opacity:0; } }
@keyframes ocRise { from { transform: translateY(40px); opacity:0; } to { transform: translateY(0); opacity:1; } }
@keyframes ocFade { from { opacity:0; } to { opacity:1; } }
@keyframes ocFloat { 0%,100% { transform: translate(-50%,-100%) translateY(0); } 50% { transform: translate(-50%,-100%) translateY(-6px); } }

* { box-sizing: border-box; }
.is-hidden { display: none !important; }
.oc-scroll::-webkit-scrollbar { width: 0; height: 0; }
.oc-scroll { -ms-overflow-style: none; scrollbar-width: none; }

.oc-site { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; }

/* uploaded (Customizer) logo — scale by height, keep aspect in every context */
img.oc-logo { width: auto !important; height: 38px; object-fit: contain; display: block; }
/* clickable logo wrapper — inline, no layout shift */
.oc-logo-link { display: inline-flex; align-items: center; line-height: 0; flex: none; text-decoration: none; }

/* ---- site-wide header ---- */
.oc-header { flex: none; position: sticky; top: 0; z-index: 60;
	padding: 13px 0; background: #0f3d2c; border-bottom: 3px solid #edab2e; }
/* Content centered in the same 1080 container as the footer so the logos align */
.oc-header__inner { max-width: 1080px; margin: 0 auto; padding: 0 28px; box-sizing: border-box;
	display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.oc-header__brand { display: flex; align-items: center; gap: 11px; text-decoration: none; flex: none; }
.oc-header .oc-logo { width: 32px; height: 37px; flex: none; }
.oc-header__brand-text { display: flex; flex-direction: column; gap: 2px; }
.oc-header__name { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 18px; letter-spacing: .02em; color: #f3efe2; }
.oc-header__sub { font-size: 9px; letter-spacing: .28em; color: #edc97a; text-transform: uppercase; }
.oc-header__nav, .oc-header__menu { display: flex; align-items: center; gap: 24px; margin: 0; padding: 0; list-style: none; }
.oc-header__nav a, .oc-header__menu a { text-decoration: none; font-size: 13px; font-weight: 600; color: #cfe6d8; transition: color .15s; }
.oc-header__nav a:hover, .oc-header__menu a:hover { color: #edab2e; }
.oc-header__actions { display: flex; align-items: center; gap: 12px; flex: none; }
.oc-header__vip { display: inline-flex; align-items: center; gap: 5px; text-decoration: none; padding: 8px 14px; border-radius: 999px;
	font-size: 12.5px; font-weight: 700; color: #231a06; background: linear-gradient(135deg,#edab2e,#e8821e); }
.oc-header__cart { display: inline-flex; align-items: center; gap: 5px; text-decoration: none; color: #f3efe2; font-size: 15px;
	padding: 7px 12px; border-radius: 999px; border: 1px solid rgba(237,171,46,.4); }
.oc-header__cart-count { font-size: 11px; font-weight: 700; background: #edab2e; color: #231a06; border-radius: 999px; padding: 0 7px; min-width: 18px; text-align: center; }
/* state-aware account / login controls */
.oc-header__login, .oc-header__account { display: inline-flex; align-items: center; gap: 5px; text-decoration: none; padding: 8px 14px; border-radius: 999px; font-size: 12.5px; font-weight: 600; color: #f3efe2; border: 1px solid rgba(237,171,46,.4); }
.oc-header__login:hover, .oc-header__account:hover { border-color: #edab2e; color: #edc97a; }
.oc-header__account--vip { color: #231a06; font-weight: 700; background: linear-gradient(135deg,#edab2e,#e8821e); border: none; }

/* ── Burger button (hidden on desktop) ─────────────────────────── */
.oc-header__burger {
	display: none;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	background: rgba(255,255,255,.06);
	border: 1.5px solid rgba(237,171,46,.3);
	border-radius: 11px;
	color: #f3efe2;
	cursor: pointer;
	transition: background .15s, border-color .15s;
	flex: none;
	margin-left: auto;
	padding: 0;
}
.oc-header__burger:hover  { background: rgba(237,171,46,.12); border-color: rgba(237,171,46,.6); }
.oc-header__burger.is-open { background: rgba(237,171,46,.14); border-color: #edab2e; }
.oc-burger__icon          { display: flex; align-items: center; justify-content: center; }
.oc-burger__icon--close   { display: none; }
.oc-header__burger.is-open .oc-burger__icon--bars  { display: none; }
.oc-header__burger.is-open .oc-burger__icon--close { display: flex; }

/* ── Mobile nav drawer ──────────────────────────────────────────── */
.oc-mobile-nav {
	display: none;
	padding: 18px 20px 24px;
	background: linear-gradient(180deg, #122c1e 0%, #0d1e14 100%);
	border-top: 1px solid rgba(237,171,46,.18);
	border-bottom: 3px solid rgba(237,171,46,.15);
}
.oc-mobile-nav.is-open { display: block; }

/* nav links list (from wp_nav_menu) */
.oc-mobile-nav__links { margin-bottom: 4px; }
.oc-mobile-nav__menu  { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.oc-mobile-nav__menu li a {
	display: block;
	padding: 11px 14px;
	border-radius: 10px;
	text-decoration: none;
	font-family: 'Space Grotesk', sans-serif;
	font-size: 15px;
	font-weight: 600;
	color: #cfe6d8;
	transition: background .15s, color .15s;
}
.oc-mobile-nav__menu li a:hover,
.oc-mobile-nav__menu li.current-menu-item > a { background: rgba(255,255,255,.06); color: #edab2e; }

.oc-mobile-nav__divider { height: 1px; background: rgba(255,255,255,.08); margin: 14px 0; }

/* action buttons */
.oc-mobile-nav__actions { display: flex; flex-direction: column; gap: 10px; }
.oc-mobile-nav__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 13px 20px;
	border-radius: 999px;
	text-decoration: none;
	font-family: 'Space Grotesk', sans-serif;
	font-size: 14px;
	font-weight: 700;
	transition: background .15s, transform .1s;
	text-align: center;
}
.oc-mobile-nav__btn--vip     { background: linear-gradient(135deg,#edab2e,#e8821e); color: #231a06; }
.oc-mobile-nav__btn--vip:hover { transform: translateY(-1px); }
.oc-mobile-nav__btn--login   { color: #f3efe2; background: rgba(255,255,255,.05); border: 1.5px solid rgba(237,171,46,.35); }
.oc-mobile-nav__btn--login:hover { border-color: #edab2e; }
.oc-mobile-nav__btn--account { color: #f3efe2; background: rgba(255,255,255,.05); border: 1.5px solid rgba(255,255,255,.15); }
.oc-mobile-nav__btn--account-vip { background: linear-gradient(135deg,#edab2e,#e8821e); color: #231a06; border: none; }
.oc-mobile-nav__btn--cart    { color: #f3efe2; background: rgba(255,255,255,.05); border: 1.5px solid rgba(255,255,255,.12); }
.oc-mobile-nav__cart-count   {
	font-size: 11px; font-weight: 700; background: #edab2e; color: #231a06;
	border-radius: 999px; padding: 0 7px; min-width: 18px; text-align: center;
}

/* ── Mobile breakpoint ──────────────────────────────────────────── */
@media (max-width: 720px) {
	.oc-header { padding: 11px 0; }
	.oc-header__inner { padding: 0 16px; gap: 0; flex-wrap: nowrap; justify-content: space-between; }
	/* hide everything between logo and burger */
	.oc-header__brand-text { display: none; }
	.oc-header__nav, .oc-header__menu { display: none; }
	.oc-header__actions { display: none; }
	/* show burger */
	.oc-header__burger { display: flex; }
}
.oc-main--app { flex: 1; display: flex; padding: 0; min-height: 0; }

/* ---- app frame (full-bleed, fills the viewport) ---- */
.oc-app {
	flex: 1; display: flex; flex-direction: column;
	width: 100%; min-height: 0;
	overflow: hidden;
	background: radial-gradient(120% 90% at 70% -10%, #173527 0%, #0e2017 46%, #081109 100%);
	color: #f3efe2; position: relative;
	--oc-content: 1080px;
}

/* header — full-bleed band, content capped to the design width and centered */
.oc-app__header { display: flex; align-items: center; justify-content: space-between; gap: 16px;
	width: 100%; max-width: var(--oc-content); margin-inline: auto; padding: 18px 22px 10px; flex: none; z-index: 30; }
.oc-brand { display: flex; align-items: center; gap: 11px; }
.oc-brand__text { display: flex; flex-direction: column; gap: 2px; }

/* ── App burger button (mobile only) ────────────────────────────── */
.oc-app__burger {
	display: none;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background: rgba(255,255,255,.07);
	border: 1.5px solid rgba(237,171,46,.3);
	border-radius: 10px;
	color: #f3efe2;
	cursor: pointer;
	transition: background .15s, border-color .15s;
	flex: none;
	padding: 0;
}
.oc-app__burger:hover   { background: rgba(237,171,46,.12); border-color: rgba(237,171,46,.6); }
.oc-app__burger.is-open { background: rgba(237,171,46,.16); border-color: #edab2e; }
.oc-app-burger__icon       { display: flex; align-items: center; justify-content: center; }
.oc-app-burger__icon--close { display: none; }
.oc-app__burger.is-open .oc-app-burger__icon--bars  { display: none; }
.oc-app__burger.is-open .oc-app-burger__icon--close { display: flex; }

/* ── App mobile nav drawer ──────────────────────────────────────── */
.oc-app__mobile-nav {
	display: none;
	width: 100%;
	background: rgba(8, 18, 10, 0.97);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border-bottom: 2px solid rgba(237,171,46,.2);
	z-index: 28;
	flex: none;
}
.oc-app__mobile-nav.is-open { display: flex; }
.oc-app__mobile-nav__inner {
	display: flex;
	flex-direction: column;
	gap: 10px;
	width: 100%;
	max-width: var(--oc-content);
	margin-inline: auto;
	padding: 16px 20px 20px;
}
.oc-app__mnav-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 13px 20px;
	border-radius: 999px;
	text-decoration: none;
	font-family: 'Space Grotesk', sans-serif;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
	border: none;
	transition: background .15s, transform .1s;
	text-align: center;
	width: 100%;
	box-sizing: border-box;
}
.oc-app__mnav-btn--vip     { background: linear-gradient(135deg,#edab2e,#e8821e); color: #231a06; }
.oc-app__mnav-btn--vip:hover { transform: translateY(-1px); }
.oc-app__mnav-btn--login   { background: rgba(255,255,255,.06); color: #f3efe2; border: 1.5px solid rgba(237,171,46,.35); }
.oc-app__mnav-btn--account { background: rgba(255,255,255,.06); color: #f3efe2; border: 1.5px solid rgba(255,255,255,.18); }
.oc-app__mnav-btn--logout  { background: transparent; color: #8a89a0; font-size: 13px; font-weight: 600; border: 1px solid rgba(255,255,255,.1); }
.oc-brand__name { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 19px; letter-spacing: .02em; }
.oc-brand__sub { font-size: 9.5px; letter-spacing: .3em; color: #c79a3f; text-transform: uppercase; }
.oc-app__controls { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.oc-app__auth-link { display: inline-flex; align-items: center; text-decoration: none; padding: 7px 13px; border-radius: 999px;
	font-family: 'Space Grotesk', sans-serif; font-size: 12px; font-weight: 600; transition: .15s;
	color: #cfe6d8; border: 1px solid rgba(255,255,255,.18); }
.oc-app__auth-link:hover { border-color: #edab2e; color: #edab2e; }
.oc-app__auth-link--out { color: #8a89a0; border-color: rgba(255,255,255,.08); font-size: 11px; }
.oc-app__auth-link--out:hover { color: #cf6679; border-color: rgba(207,102,121,.4); }

.oc-vip-btn { display: flex; align-items: center; gap: 6px; padding: 8px 13px; border-radius: 999px; cursor: pointer;
	font-family: 'Space Grotesk', sans-serif; font-size: 12.5px; font-weight: 700; transition: .18s; flex: none;
	background: transparent; color: #edab2e; border: 1px solid rgba(237,171,46,.5); }
.oc-vip-btn.is-member { background: linear-gradient(135deg,#edab2e,#e8821e); color: #1a1206; border-color: transparent; box-shadow: 0 0 16px rgba(237,171,46,.4); }

/* chips — same centered content width as the header */
.oc-chips { display: flex; gap: 8px; width: 100%; max-width: var(--oc-content); margin-inline: auto; padding: 4px 22px 14px; overflow-x: auto; flex: none; z-index: 30; }
.oc-chip { display: flex; align-items: center; gap: 7px; flex: none; cursor: pointer; padding: 9px 14px; border-radius: 999px;
	font-family: 'Space Grotesk', sans-serif; font-size: 13px; font-weight: 600; transition: .18s;
	background: rgba(255,255,255,.05); color: #cfcedd; border: 1px solid rgba(255,255,255,.1); }
.oc-chip__emoji { font-size: 13px; }
.oc-chip__count { font-size: 10px; font-weight: 700; padding: 1px 6px; border-radius: 999px; background: rgba(255,255,255,.09); color: #8a89a0; }
.oc-chip.is-on .oc-chip__count { background: rgba(0,0,0,.18); color: rgba(0,0,0,.6); }

/* body */
/* body */
.oc-body { position: relative; flex: 1; min-height: 0; }

/* map */
.oc-map { position: absolute; inset: 0; }
/* ---- Image Map mode -------------------------------------------------- */
/* Replaces the viewport/plane layer when Map Display Mode = Image Map.
   Pins are positioned by JS as plain x%/y% percentages over .oc-imap__cont.
   All popup, list-sync, and chip-filter logic is reused unchanged.         */
.oc-map--image-mode { background: #e3d4b2; }
.oc-map--image-mode [data-oc-pins] { display: none; }

.oc-imap {
	position: absolute;
	inset: 0;
	overflow-y: auto;
	overflow-x: hidden;
	background: #e3d4b2;
}
/* Thin scrollbar to match the rest of the map */
.oc-imap::-webkit-scrollbar { width: 8px; }
.oc-imap::-webkit-scrollbar-thumb { background: #cdb98e; border-radius: 8px; border: 2px solid #e3d4b2; }
.oc-imap::-webkit-scrollbar-track { background: transparent; }

/* Inner container expands to the image's natural proportions — pins sit here */
.oc-imap__cont {
	position: relative;
	width: 100%;
}
.oc-imap__img {
	display: block;
	width: 100%;
	height: auto;
	pointer-events: none;
	user-select: none;
}
/* Vignette overlay (reuses the same visual as the interactive map) */
.oc-imap .oc-vign {
	position: absolute;
	inset: 0;
	z-index: 6;
	pointer-events: none;
	box-shadow: inset 0 0 110px 26px rgba(85,58,24,.28);
}
/* Pin layer over the image — pins inherit .oc-pin styles unchanged */
.oc-imap [data-oc-pins] {
	position: absolute;
	inset: 0;
	z-index: 10;
	pointer-events: none;
}

.oc-gmap { position: absolute; inset: 0; z-index: 1; }
.oc-gmap[hidden] { display: none; }
/* Waiting for Maps auth — container has dimensions so Maps can init, but stays invisible. */
.oc-gmap.is-loading { visibility: hidden; pointer-events: none; }
.oc-gmap .gm-style, .oc-gmap .gm-style * { font-family: 'Space Grotesk', sans-serif; }
.oc-map__viewport { position: absolute; inset: 0; overflow: hidden; cursor: grab; touch-action: none; }
.oc-map__plane { position: absolute; inset: 0; transform-origin: 0 0; will-change: transform; }
.oc-map__svg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.oc-pins { position: absolute; inset: 0; pointer-events: none; }

.oc-pin { position: absolute; transform: translate(-50%,-100%); background: none; border: none; cursor: pointer; padding: 0;
	display: flex; flex-direction: column; align-items: center; pointer-events: auto; transition: opacity .3s, filter .3s; }
.oc-pin.is-vis { animation: ocFloat 4s ease-in-out infinite; }
.oc-pin.is-dim { opacity: .18; filter: grayscale(1); z-index: 3; }
.oc-pin__ping { position: absolute; top: 10px; left: 50%; width: 26px; height: 26px; border-radius: 50%; border: 2px solid; transform: translate(-50%,-50%); pointer-events: none; }
.oc-pin.is-vis .oc-pin__ping { animation: ocPing 2.4s ease-out infinite; }
.oc-pin__dot { width: 26px; height: 26px; border-radius: 50% 50% 50% 2px; transform: rotate(45deg); display: flex; align-items: center; justify-content: center; border: 2px solid rgba(255,255,255,.55); }
.oc-pin__glyph { transform: rotate(-45deg); font-size: 12px; color: #0a0a14; }
.oc-pin__num { display: none; transform: rotate(-45deg); font-size: 9px; font-weight: 800; line-height: 1; font-family: 'Space Grotesk', sans-serif; color: #0a0a14; }
.oc-pin.is-sel .oc-pin__dot { outline: 3px solid #edab2e; outline-offset: 3px; box-shadow: 0 0 0 6px rgba(237,171,46,.25), 0 0 14px currentColor, 0 4px 10px rgba(0,0,0,.5); }
.oc-pin__label { margin-top: 5px; font-size: 10px; font-weight: 600; white-space: nowrap; padding: 2px 7px; border-radius: 999px; color: #e8e7f2; background: rgba(8,8,14,.7); border: 1px solid rgba(255,255,255,.1); }
.oc-pin.is-dim .oc-pin__label { display: none; }

.oc-map__hint { position: absolute; left: 50%; top: 12px; transform: translateX(-50%); display: flex; align-items: center; gap: 7px;
	padding: 6px 12px; border-radius: 999px; background: rgba(14,30,21,.7); backdrop-filter: blur(8px);
	border: 1px solid rgba(237,171,46,.22); z-index: 8; pointer-events: none; font-size: 10.5px; letter-spacing: .04em; color: #d7cfb8; }

.oc-map__zoom { position: absolute; right: 14px; bottom: 14px; display: flex; flex-direction: column; gap: 6px; z-index: 8; }
.oc-map__zoom button { width: 38px; height: 38px; border-radius: 11px; border: 1px solid rgba(237,171,46,.3);
	background: rgba(14,30,21,.82); backdrop-filter: blur(8px); color: #edd9a8; font-size: 20px; font-weight: 600; cursor: pointer;
	display: flex; align-items: center; justify-content: center; transition: .15s; }
.oc-map__zoom button:hover { background: rgba(28,107,79,.7); }

.oc-legend { position: absolute; left: 14px; bottom: 14px; display: flex; flex-direction: column; gap: 6px; padding: 10px 12px;
	background: rgba(10,10,20,.66); backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,.08); border-radius: 14px; z-index: 5; }
.oc-legend__count { font-size: 9px; letter-spacing: .22em; color: #6f6e85; text-transform: uppercase; }
.oc-legend__row { display: flex; align-items: center; gap: 7px; font-size: 10.5px; color: #b9b8c9; }
.oc-legend__dot { width: 9px; height: 9px; border-radius: 50%; flex: none; }

/* list — centered reading column on wide screens (mobile); side panel (desktop) */
.oc-list { position: absolute; inset: 0; overflow-y: auto; padding: 4px max(16px, calc((100% - var(--oc-content)) / 2)) 24px; }
.oc-row { width: 100%; display: flex; align-items: center; gap: 12px; padding: 12px 14px; margin-bottom: 8px;
	background: rgba(255,255,255,.035); border: 1px solid rgba(255,255,255,.07); border-radius: 16px; cursor: pointer; text-align: left; transition: .18s; }
.oc-row:hover { background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.16); }
.oc-row.is-on { background: rgba(237,171,46,.1); border-color: rgba(237,171,46,.35); }
.oc-row__num { display: none; width: 24px; height: 24px; flex: none; border-radius: 50%; font-size: 11px; font-weight: 800; align-items: center; justify-content: center; font-family: 'Space Grotesk', sans-serif; flex-shrink: 0; }
.oc-row__thumb { width: 40px; height: 40px; flex: none; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 17px; color: #0a0a14; }
.oc-row__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.oc-row__name { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 14px; color: #f4f3fa; }
.oc-row__meta { font-size: 10px; color: #8a89a0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.oc-row__tag { flex: none; font-size: 10px; font-weight: 600; padding: 4px 9px; border-radius: 999px; border: 1px solid; white-space: nowrap; }

/* ---- modals ---- */
.oc-overlay { position: absolute; inset: 0; z-index: 50; display: flex; align-items: center; justify-content: flex-end; padding: 0 28px;
	background: rgba(4,4,8,.55); backdrop-filter: blur(3px); animation: ocFade .2s ease; }
.oc-overlay--dir { z-index: 60; }
.oc-overlay--vip { position: fixed; inset: 0; z-index: 9000; align-items: center; justify-content: center; padding: 0; background: rgba(4,4,8,.72); backdrop-filter: blur(4px); }

.oc-card { width: 380px; max-height: 92%; overflow-y: auto; background: #0e1e15; border: 1px solid rgba(237,171,46,.14);
	border-radius: 24px; animation: ocRise .28s cubic-bezier(.2,.8,.2,1); }
.oc-card::-webkit-scrollbar { width: 0; }

.oc-card__media { position: relative; height: 160px; flex: none; overflow: hidden; }
.oc-card__media-glow { position: absolute; inset: 0; background: radial-gradient(140% 120% at 80% 0%, rgba(255,255,255,.16), transparent 55%); }
.oc-card__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .5; }
.oc-card__close { position: absolute; top: 12px; left: 12px; width: 32px; height: 32px; border-radius: 50%; background: rgba(8,8,14,.5); backdrop-filter: blur(6px); border: 1px solid rgba(255,255,255,.18); color: #fff; font-size: 15px; cursor: pointer; z-index: 4; }
.oc-card__badge { position: absolute; top: 12px; right: 12px; font-size: 11px; font-weight: 600; padding: 6px 11px; border-radius: 999px; color: #0a0a14; background: rgba(255,255,255,.92); z-index: 3; }
.oc-card__lock { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; backdrop-filter: blur(2px); z-index: 2; }
.oc-card__lock span:last-child { font-size: 11px; letter-spacing: .24em; color: rgba(255,255,255,.85); text-transform: uppercase; }
.oc-card__clip { position: absolute; left: 14px; bottom: 14px; display: flex; align-items: center; gap: 8px; padding: 7px 12px; background: rgba(8,8,14,.5); backdrop-filter: blur(6px); border: 1px solid rgba(255,255,255,.18); border-radius: 999px; font-size: 11px; font-weight: 600; color: #fff; z-index: 3; }
.oc-card__clip-dot { width: 18px; height: 18px; border-radius: 50%; background: #fff; color: #111; display: flex; align-items: center; justify-content: center; font-size: 9px; }
.oc-card__watermark { position: absolute; right: 16px; bottom: 14px; font-family: 'Syne', sans-serif; font-weight: 800; font-size: 54px; color: rgba(255,255,255,.16); line-height: .8; }

.oc-card__body { padding: 18px 20px 22px; display: flex; flex-direction: column; gap: 14px; }
.oc-card__head { display: flex; flex-direction: column; gap: 3px; }
.oc-card__name { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 24px; line-height: 1.05; }
.oc-card__area { font-size: 12px; letter-spacing: .06em; color: #8a89a0; }
.oc-card__blurb { margin: 0; font-size: 14px; line-height: 1.5; color: #cfcedd; font-style: italic; }

.oc-rows { display: flex; flex-direction: column; gap: 9px; }

/* player */
.oc-player { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px;
	background: linear-gradient(135deg, rgba(255,255,255,.05), rgba(255,255,255,.02)); border: 1px solid rgba(255,255,255,.09); }
.oc-player__btn { width: 42px; height: 42px; flex: none; border-radius: 50%; border: none; cursor: pointer; color: #0a0a14; font-size: 16px; display: flex; align-items: center; justify-content: center; }
.oc-player__main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.oc-player__top { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.oc-player__track { font-size: 13px; font-weight: 600; color: #f2f1f7; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.oc-player__time { font-size: 10.5px; color: #8a89a0; font-variant-numeric: tabular-nums; }
.oc-player__bar { height: 4px; border-radius: 3px; background: rgba(255,255,255,.12); overflow: hidden; cursor: pointer; }
.oc-player__fill { height: 100%; border-radius: 3px; transition: width .12s linear; }

/* streaming embed (Spotify / YouTube / SoundCloud / Apple Music) */
.oc-embed { border-radius: 14px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); background: #0a0a14; }
.oc-embed iframe { display: block; width: 100%; border: 0; }

/* merch */
.oc-merch { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.07); }
.oc-merch__icon { width: 38px; height: 38px; border-radius: 10px; background: linear-gradient(135deg,#1c4a37,#123024); display: flex; align-items: center; justify-content: center; font-size: 16px; flex: none; }
.oc-merch__info { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.oc-merch__label { font-size: 10px; letter-spacing: .16em; color: #6f6e85; text-transform: uppercase; }
.oc-merch__name { font-size: 14px; font-weight: 600; color: #f2f1f7; }
.oc-merch__socks { font-size: 10px; color: #3e9b63; }
.oc-merch__price { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; background: none; border: none; cursor: pointer; padding: 0; }
.oc-merch__now { font-size: 14px; font-weight: 700; color: #fff; }
.oc-merch__vip-hint { font-size: 10px; font-weight: 600; color: #edab2e; }
.oc-merch__price--vip { cursor: default; }
.oc-merch__was { font-size: 10px; color: #6f6e85; text-decoration: line-through; }
.oc-merch__price--vip .oc-merch__now { font-size: 15px; color: #edab2e; }
.oc-merch__vip-tag { font-size: 8.5px; font-weight: 700; color: #edab2e; letter-spacing: .1em; }

/* action (directions) */
.oc-action { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.07); cursor: pointer; text-align: left; transition: .15s; width: 100%; }
.oc-action:hover { background: rgba(255,255,255,.08); }
.oc-action__icon { width: 38px; height: 38px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 16px; flex: none; }
.oc-action__label { flex: 1; font-size: 14px; font-weight: 600; color: #f2f1f7; }
.oc-action__arrow { color: #8a89a0; }

/* event */
.oc-event { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; background: linear-gradient(135deg, rgba(62,155,99,.16), rgba(237,171,46,.08)); border: 1px solid rgba(62,155,99,.32); }
.oc-event__icon { width: 38px; height: 38px; border-radius: 10px; background: rgba(62,155,99,.24); display: flex; align-items: center; justify-content: center; font-size: 16px; flex: none; }
.oc-event__info { flex: 1; display: flex; flex-direction: column; }
.oc-event__label { font-size: 10px; letter-spacing: .16em; color: #7fcf9a; text-transform: uppercase; }
.oc-event__name { font-size: 14px; font-weight: 600; color: #f3efe2; }
.oc-event__date { font-size: 12px; font-weight: 600; color: #7fcf9a; }
.oc-event--link { text-decoration: none; color: inherit; transition: border-color .15s; }
.oc-event--link:hover { border-color: rgba(62,155,99,.6); }

/* community */
.oc-community { display: flex; align-items: center; gap: 13px; padding: 13px 14px; border-radius: 14px; background: #1c6b4f; border: 1px solid rgba(237,171,46,.4); }
.oc-community__qr { width: 112px; height: 112px; flex: none; object-fit: contain; }
.oc-community__info { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.oc-community__title { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 14px; color: #edab2e; }
.oc-community__text { font-size: 11px; color: #cfe6d8; line-height: 1.4; }

/* treasure / locked */
.oc-treasure__btn { display: flex; align-items: center; justify-content: center; gap: 11px; padding: 14px; border-radius: 14px; border: 1px dashed rgba(237,171,46,.55); background: rgba(237,171,46,.1); color: #f2c45e; font-family: 'Space Grotesk', sans-serif; font-weight: 600; font-size: 14px; cursor: pointer; width: 100%; transition: .15s; }
.oc-treasure__btn:hover { background: rgba(237,171,46,.18); }
.oc-treasure__qr { width: 30px; height: 30px; border-radius: 5px; background: #fff; padding: 2px; box-sizing: border-box; }
.oc-treasure__note { font-size: 11px; color: #6f6e85; text-align: center; display: block; margin-top: 8px; }
.oc-treasure__err { display: block; margin-top: 8px; text-align: center; font-size: 12px; color: #ff9e8a; }
.oc-treasure { display: flex; flex-direction: column; gap: 8px; padding: 16px; border-radius: 16px; background: linear-gradient(135deg, rgba(237,171,46,.16), rgba(62,155,99,.12)); border: 1px solid rgba(237,171,46,.4); }
.oc-treasure__title { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 16px; color: #f2c45e; }
.oc-treasure__text { font-size: 12.5px; color: #e8dcc0; }

/* directions */
.oc-dir { width: 380px; }
.oc-dir__head { padding: 16px 18px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid rgba(255,255,255,.07); }
.oc-dir__back { width: 32px; height: 32px; flex: none; border-radius: 50%; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); color: #fff; cursor: pointer; font-size: 15px; }
.oc-dir__title-wrap { flex: 1; display: flex; flex-direction: column; }
.oc-dir__label { font-size: 10px; letter-spacing: .18em; color: #6f6e85; text-transform: uppercase; }
.oc-dir__title { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 17px; color: #f2f1f7; }
.oc-dir__map { position: relative; height: 150px; background: linear-gradient(150deg,#16414a,#0d2018); overflow: hidden; }
.oc-dir__map svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.oc-dir__body { padding: 16px 18px 20px; display: flex; flex-direction: column; gap: 14px; }
.oc-dir__eta { display: flex; align-items: baseline; gap: 10px; }
.oc-dir__eta-big { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 26px; color: #edab2e; }
.oc-dir__dist { font-size: 12px; color: #8a89a0; }
.oc-dir__steps { display: flex; flex-direction: column; }
.oc-dir__step { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.05); }
.oc-dir__n { width: 24px; height: 24px; flex: none; border-radius: 50%; background: rgba(237,171,46,.14); border: 1px solid rgba(237,171,46,.35); color: #edc97a; font-size: 11px; font-weight: 600; display: flex; align-items: center; justify-content: center; }
.oc-dir__step span:last-child { font-size: 13px; color: #cfcedd; }
.oc-dir__cta { text-decoration: none; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 15px; border-radius: 14px; background: #edab2e; color: #231a06; font-family: 'Syne', sans-serif; font-weight: 700; font-size: 14px; }

/* VIP card */
.oc-vip-card { width: 400px; border: 1px solid rgba(237,171,46,.3); border-radius: 22px; box-shadow: 0 30px 90px rgba(0,0,0,.6), 0 0 50px rgba(237,171,46,.12); animation: ocRise .3s cubic-bezier(.2,.8,.2,1); }
.oc-vip__header { position: relative; padding: 22px 22px 18px; background: linear-gradient(135deg,#edab2e,#e8821e); color: #1a1206; overflow: hidden; }
.oc-vip__close { position: absolute; top: 14px; right: 14px; width: 30px; height: 30px; border-radius: 50%; background: rgba(0,0,0,.14); border: none; color: #1a1206; cursor: pointer; font-size: 14px; }
.oc-vip__brand { font-size: 10px; letter-spacing: .3em; text-transform: uppercase; font-weight: 700; opacity: .65; }
.oc-vip__title { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 34px; line-height: 1; margin-top: 4px; }
.oc-vip__content { padding: 20px 22px 24px; }
.oc-vip__offer { display: flex; flex-direction: column; gap: 16px; }
.oc-vip__price { display: flex; align-items: baseline; gap: 8px; }
.oc-vip__price-big { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 30px; color: #f3efe2; }
.oc-vip__price-note { font-size: 13px; color: #a9c4b4; }
.oc-vip__benefits { display: flex; flex-direction: column; gap: 10px; }
.oc-vip-card .oc-vip__benefit { display: flex; align-items: center; gap: 10px; }
.oc-vip__check { width: 20px; height: 20px; flex: none; border-radius: 50%; background: rgba(237,171,46,.18); color: #edc97a; font-size: 11px; display: flex; align-items: center; justify-content: center; }
.oc-vip-card .oc-vip__benefit span:last-child { font-size: 13.5px; color: #dbe9df; }
.oc-vip__cta { padding: 15px; border: none; border-radius: 14px; background: linear-gradient(135deg,#edab2e,#e8821e); color: #1a1206; font-family: 'Syne', sans-serif; font-weight: 800; font-size: 15px; cursor: pointer; box-shadow: 0 8px 30px rgba(232,130,30,.4); width: 100%; }
.oc-vip__fine { font-size: 11px; color: #7fae93; text-align: center; display: block; }

/* member pass */
.oc-pass { display: flex; flex-direction: column; gap: 16px; }
.oc-pass__card { position: relative; border-radius: 18px; overflow: hidden; padding: 16px; background: linear-gradient(135deg,#1c6b4f,#0f3d2c); border: 1px solid rgba(237,171,46,.45); }
.oc-pass__glow { position: absolute; inset: 0; background: radial-gradient(120% 100% at 85% 0%, rgba(237,171,46,.22), transparent 55%); }
.oc-pass__top { position: relative; display: flex; align-items: center; gap: 12px; }
.oc-pass__id { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.oc-pass__label { font-size: 9.5px; letter-spacing: .28em; color: #edc97a; text-transform: uppercase; }
.oc-pass__name { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 19px; color: #f3efe2; }
.oc-pass__no { font-size: 11px; color: #bfe0cd; }
.oc-pass__qr { width: 46px; height: 46px; flex: none; border-radius: 7px; background: #fff; padding: 3px; box-sizing: border-box; }
.oc-pass__stats { position: relative; margin-top: 14px; display: flex; gap: 8px; }
.oc-pass__stat { flex: 1; display: flex; flex-direction: column; gap: 1px; padding: 9px 11px; border-radius: 11px; background: rgba(0,0,0,.22); }
.oc-pass__stat-label { font-size: 9px; letter-spacing: .14em; color: #9ec7af; text-transform: uppercase; }
.oc-pass__stat-val { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 16px; color: #f3efe2; }
.oc-perks { display: flex; flex-direction: column; gap: 8px; }
.oc-perk { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.07); }
.oc-perk.is-soon { opacity: .55; }
.oc-perk__icon { width: 34px; height: 34px; flex: none; border-radius: 9px; background: rgba(237,171,46,.12); display: flex; align-items: center; justify-content: center; font-size: 15px; }
.oc-perk__info { flex: 1; display: flex; flex-direction: column; }
.oc-perk__label { font-size: 13px; font-weight: 600; color: #f2f1f7; }
.oc-perk__note { font-size: 11px; color: #8a89a0; }
.oc-perk__status { font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #7fcf9a; }
.oc-perk.is-soon .oc-perk__status { color: #6f6e85; }

/* footer */
.oc-footer { flex: none; background: #0f3d2c; border-top: 3px solid #edab2e; padding: 26px 0 22px; }
.oc-footer__inner { max-width: 1080px; margin: 0 auto; padding: 0 28px; box-sizing: border-box; display: flex; align-items: flex-start; justify-content: space-between; gap: 28px; flex-wrap: wrap; }
.oc-footer__brand { display: flex; align-items: center; gap: 12px; min-width: 200px; }
.oc-footer__brand .oc-logo { width: 34px; height: 39px; flex: none; }
.oc-footer__brand-text { display: flex; flex-direction: column; gap: 3px; }
.oc-footer__name { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 17px; color: #f3efe2; }
.oc-footer__tag { font-size: 11px; color: #7fae93; }
.oc-footer__cols { display: flex; gap: 46px; flex-wrap: wrap; }
.oc-footer__col { display: flex; flex-direction: column; gap: 9px; }
.oc-footer__head { font-size: 10px; letter-spacing: .22em; color: #edc97a; text-transform: uppercase; }
.oc-footer__col a { text-decoration: none; font-size: 12.5px; color: #cfe6d8; transition: color .15s; }
.oc-footer__col a:hover { color: #edab2e; }
.oc-footer__bottom { max-width: 1080px; margin: 18px auto 0; padding: 16px 28px 0; box-sizing: border-box; border-top: 1px solid rgba(237,171,46,.2);
	display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.oc-footer__bottom span { font-size: 11px; color: #7fae93; }

/* fallback article */
.oc-content { max-width: 760px; margin: 0 auto; padding: 24px; }
.oc-article__title { font-family: 'Syne', sans-serif; }

/* 404 */
.oc-main--404 { flex: 1; display: flex; align-items: center; justify-content: center; padding: 60px 24px; }
.oc-404 { max-width: 560px; width: 100%; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.oc-404 .oc-logo { width: 46px; height: 52px; }
.oc-404__code { font-family: 'Syne', sans-serif; font-weight: 800; font-size: clamp(70px, 16vw, 130px); line-height: .9;
	background: linear-gradient(135deg, #edab2e, #e8821e); -webkit-background-clip: text; background-clip: text; color: transparent;
	filter: drop-shadow(0 8px 30px rgba(232,130,30,.25)); margin-top: 4px; }
.oc-404__title { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 26px; color: #f3efe2; margin: 0; }
.oc-404__text { font-size: 14px; line-height: 1.6; color: #b6b09c; margin: 0; max-width: 440px; }
.oc-404__actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 6px; }
.oc-404__btn { text-decoration: none; padding: 13px 22px; border-radius: 14px; font-family: 'Syne', sans-serif; font-weight: 700; font-size: 14px;
	color: #231a06; background: linear-gradient(135deg, #edab2e, #e8821e); box-shadow: 0 8px 26px rgba(232,130,30,.3); }
.oc-404__btn--ghost { color: #edd9a8; background: transparent; border: 1px solid rgba(237,171,46,.4); box-shadow: none; }
.oc-404__btn--ghost:hover { background: rgba(28,107,79,.4); color: #f3efe2; }
.oc-404__search { display: flex; gap: 8px; width: 100%; max-width: 380px; margin-top: 8px; }
.oc-404__search input { flex: 1; min-width: 0; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.16);
	color: #f3efe2; border-radius: 11px; padding: 11px 14px; font-size: 14px; }
.oc-404__search input:focus { border-color: #edab2e; box-shadow: 0 0 0 2px rgba(237,171,46,.25); outline: none; }
.oc-404__search input::placeholder { color: #7d8a82; }
.oc-404__search button { flex: none; border: none; cursor: pointer; padding: 0 18px; border-radius: 11px; font-weight: 700;
	color: #231a06; background: linear-gradient(135deg, #edab2e, #e8821e); }
.oc-404__links { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; align-items: center; margin-top: 8px; font-size: 13px; }
.oc-404__links a { color: #b6b09c; text-decoration: none; }
.oc-404__links a:hover { color: #edab2e; }
.oc-404__links span { color: #4a4636; }

/* legal / info "paper" pages */
.oc-main--legal { display: block; padding: 40px 24px 64px; }
.oc-legal-wrap { max-width: 820px; margin: 0 auto; }
.oc-paper { background: linear-gradient(160deg, #1c5e46 0%, #0f3d2c 100%); border: 1px solid rgba(237,171,46,.3);
	border-radius: 20px; overflow: hidden; box-shadow: 0 30px 90px rgba(0,0,0,.5); }
.oc-paper__head { position: relative; padding: 28px 32px 22px; border-bottom: 1px solid rgba(237,171,46,.22);
	background: radial-gradient(120% 120% at 85% -20%, rgba(237,171,46,.18), transparent 55%); }
.oc-paper__back { display: inline-block; margin-bottom: 14px; text-decoration: none; font-size: 12px; font-weight: 600;
	color: #edd9a8; background: rgba(0,0,0,.18); border: 1px solid rgba(237,171,46,.3); padding: 6px 12px; border-radius: 999px; }
.oc-paper__eyebrow { display: block; font-size: 10px; letter-spacing: .3em; text-transform: uppercase; color: #edc97a; }
.oc-paper__title { margin: 6px 0 0; font-family: 'Syne', sans-serif; font-weight: 800; font-size: 34px; color: #f3efe2; line-height: 1.05; }
.oc-paper__body { padding: 28px 32px; color: #e8e3d2; line-height: 1.7; font-size: 15px; }
.oc-paper__body h2, .oc-paper__body h3 { font-family: 'Syne', sans-serif; color: #edab2e; margin-top: 1.6em; }
.oc-paper__body a { color: #edd9a8; }
.oc-paper__body ul, .oc-paper__body ol { padding-left: 1.3em; }
.oc-paper__placeholder { font-style: italic; color: #bcd6c6; }
.oc-paper__foot { padding: 18px 32px 26px; border-top: 1px solid rgba(255,255,255,.08); font-size: 11px; color: #9ec7af; }

/* contact page (OCnians - Contact.dc.html) */
.oc-main--contact { display: block; padding: 0; background: #e9e0cb; }
.oc-cthero { background: #103a2b; border-bottom: 1px solid rgba(237,171,46,.22); padding: 34px 0 30px; }
.oc-cthero__inner { max-width: 1080px; margin: 0 auto; padding: 0 28px; box-sizing: border-box; }
.oc-cthero__eyebrow { font-size: 10px; letter-spacing: .28em; color: #edc97a; text-transform: uppercase; }
.oc-cthero__title { margin: 8px 0 0; font-family: 'Syne', sans-serif; font-weight: 800; font-size: clamp(30px, 5vw, 40px); color: #f3efe2; line-height: 1.04; }
.oc-cthero__text { margin: 10px 0 0; font-size: 14.5px; color: #a9c4b4; max-width: 520px; line-height: 1.55; }
.oc-ctbody { background: #e9e0cb; }
.oc-ctbody__inner { max-width: 1080px; margin: 0 auto; padding: 34px 28px 60px; box-sizing: border-box;
	display: grid; grid-template-columns: 1fr 360px; gap: 30px; align-items: start; }
.oc-ctform { background: #f3ecda; border: 1px solid #d8c79b; border-radius: 18px; padding: 26px 28px; min-width: 0; }
.oc-ctform__title { margin: 0 0 16px; font-family: 'Syne', sans-serif; font-weight: 700; font-size: 20px; color: #23463a; }
.oc-ctform__placeholder { color: #6f6753; font-size: 14px; }
.oc-ctform__cta { display: inline-block; margin-top: 12px; padding: 13px 22px; border-radius: 12px;
	background: linear-gradient(135deg,#edab2e,#e8821e); color: #231a06; font-family: 'Syne', sans-serif; font-weight: 700; text-decoration: none; }
.oc-ctform label { display: block; font-size: 11.5px; font-weight: 600; letter-spacing: .04em; color: #5a5240; text-transform: uppercase; margin: 12px 0 6px; }
.oc-ctform input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="button"]),
.oc-ctform textarea, .oc-ctform select {
	width: 100%; box-sizing: border-box; background: #fbf6e9; border: 1px solid #d3c49a; color: #2c281d;
	border-radius: 11px; padding: 13px 14px; font-family: 'Space Grotesk', sans-serif; font-size: 14px; }
.oc-ctform textarea { resize: vertical; min-height: 130px; line-height: 1.5; }
.oc-ctform input:focus, .oc-ctform textarea:focus, .oc-ctform select:focus {
	border-color: #1c6b4f; box-shadow: 0 0 0 3px rgba(28,107,79,.14); outline: none; }
.oc-ctform input::placeholder, .oc-ctform textarea::placeholder { color: #a99e7e; }
.oc-ctform input[type="submit"], .oc-ctform button[type="submit"], .oc-ctform .wpcf7-submit {
	width: auto; background: linear-gradient(135deg,#edab2e,#e8821e) !important; color: #231a06 !important; border: none !important;
	border-radius: 14px !important; padding: 15px 28px !important; font-family: 'Syne', sans-serif; font-weight: 800; font-size: 15px;
	cursor: pointer; margin-top: 16px; box-shadow: 0 8px 26px rgba(232,130,30,.32); }
.oc-ctside { display: flex; flex-direction: column; gap: 14px; }
.oc-ctcard { display: flex; align-items: center; gap: 14px; padding: 16px 18px; background: #f3ecda; border: 1px solid #d8c79b; border-radius: 15px; text-decoration: none; transition: border-color .15s; }
.oc-ctcard:hover { border-color: #1c6b4f; }
.oc-ctcard__icon { width: 44px; height: 44px; flex: none; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 20px; border: 1px solid; }
.oc-ctcard__body { display: flex; flex-direction: column; min-width: 0; }
.oc-ctcard__label { font-size: 10px; letter-spacing: .16em; color: #8a7e5e; text-transform: uppercase; }
.oc-ctcard__value { font-size: 14.5px; font-weight: 600; color: #23463a; margin-top: 2px; word-break: break-word; }
.oc-cthours { padding: 16px 18px; background: #0f3d2c; border: 1px solid #1c6b4f; border-radius: 15px; }
.oc-cthours__label { display: block; font-size: 10px; letter-spacing: .16em; color: #edc97a; text-transform: uppercase; margin-bottom: 10px; }
.oc-cthours__val { font-size: 13px; color: #cfe6d8; line-height: 1.7; }
.oc-ctmap { position: relative; height: 150px; border-radius: 15px; overflow: hidden; border: 1px solid #d8c79b; }
.oc-ctmap__svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.oc-ctmap iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.oc-ctmap__pin { position: absolute; left: 46%; top: 48%; width: 18px; height: 18px; border-radius: 50% 50% 50% 2px;
	transform: translate(-50%,-100%) rotate(45deg); background: #edab2e; box-shadow: 0 0 12px #edab2e; border: 2px solid rgba(255,255,255,.6); }
.oc-ctmap__label { position: absolute; left: 14px; bottom: 12px; font-size: 11px; font-weight: 600; color: #f3efe2;
	padding: 5px 10px; border-radius: 999px; background: rgba(15,61,44,.7); backdrop-filter: blur(6px); border: 1px solid rgba(237,171,46,.3); }
@media (max-width: 820px) { .oc-ctbody__inner { grid-template-columns: 1fr; } }

/* intro splash */
.oc-intro { position: absolute; inset: 0; z-index: 80; display: flex; flex-direction: column;
	background: radial-gradient(120% 90% at 50% 0%, #173527 0%, #081109 60%); animation: ocFade .3s ease; }
.oc-intro.is-leaving { animation: ocFade .3s ease reverse; opacity: 0; }
.oc-intro__hero { position: relative; flex: 1; min-height: 0; margin: 18px; border-radius: 22px; overflow: hidden;
	background: linear-gradient(150deg,#1c5e46,#0d2018); display: flex; align-items: center; justify-content: center; }
/* album map as hero background */
.oc-intro__map-bg {
	position: absolute; inset: 0; width: 100%; height: 100%;
	object-fit: cover; object-position: center 28%;
	z-index: 0;
}
/* dark scrim so hero text stays legible over the parchment map */
.oc-intro__map-dim {
	position: absolute; inset: 0;
	background: linear-gradient(to bottom, rgba(8,14,10,.52) 0%, rgba(8,14,10,.28) 45%, rgba(8,14,10,.72) 100%);
	z-index: 1;
}
.oc-intro__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.oc-intro__hero-glow { position: absolute; inset: 0; background: radial-gradient(120% 100% at 70% 20%, rgba(237,171,46,.28), transparent 55%); z-index: 2; }
.oc-intro__present { position: absolute; top: 16px; left: 18px; font-size: 10px; letter-spacing: .28em; color: #edc97a; text-transform: uppercase; z-index: 3; }
.oc-intro__hero-center { position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; z-index: 3; }
.oc-intro__hero-title { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 30px; letter-spacing: .04em; color: #f3efe2; line-height: 1; }
.oc-intro__hero-sub { font-size: 11.5px; letter-spacing: .18em; color: #cfe6d8; text-transform: uppercase; }
.oc-intro__watch { position: absolute; bottom: 14px; right: 16px; display: flex; align-items: center; gap: 8px; z-index: 3;
	padding: 8px 13px 8px 9px; border-radius: 999px; border: 1px solid rgba(237,171,46,.5); background: rgba(13,32,24,.55);
	backdrop-filter: blur(8px); color: #f3efe2; font-family: 'Space Grotesk', sans-serif; font-size: 12px; font-weight: 600; cursor: pointer; transition: .15s; }
.oc-intro__watch:hover { background: rgba(28,107,79,.7); }
.oc-intro__watch-dot { width: 26px; height: 26px; border-radius: 50%; background: #edab2e; color: #231a06; display: flex; align-items: center; justify-content: center; font-size: 11px; flex: none; }
.oc-intro__clip { position: absolute; bottom: 16px; left: 18px; font-size: 11px; color: #d7cfb8; display: flex; align-items: center; gap: 8px; z-index: 3; }
.oc-intro__clip-dot { width: 6px; height: 6px; border-radius: 50%; background: #edab2e; }
.oc-intro__body { padding: 6px 24px 26px; display: flex; flex-direction: column; gap: 13px; }
.oc-intro__headline { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 30px; line-height: 1.04; color: #f3efe2; }
.oc-intro__copy { font-size: 13px; color: #b6b09c; line-height: 1.5; max-width: 520px; }
.oc-intro__cta { margin-top: 4px; align-self: flex-start; padding: 15px 26px; border: none; border-radius: 14px;
	background: linear-gradient(135deg,#edab2e,#e8821e); color: #231a06; font-family: 'Syne', sans-serif; font-weight: 700; font-size: 15px; cursor: pointer; box-shadow: 0 8px 30px rgba(232,130,30,.35); }

/* ---- intro: spinning logo loading screen ---- */
/* Override the rounded hero card — full bleed green screen */
.oc-intro__hero {
	margin: 0;
	border-radius: 0;
	background: radial-gradient(120% 90% at 50% 20%, #2BB857 0%, #1E9E47 45%, #157A36 100%);
	flex-direction: column;
	gap: 0;
}
/* Video sits behind everything */
.oc-intro__video { opacity: 0.22; mix-blend-mode: luminosity; }
/* Semi-transparent dark curtain over the video */
.oc-intro__curtain { position: absolute; inset: 0; z-index: 1; background: rgba(6,24,12,.48); }
/* Logo button */
.oc-intro__logo-btn {
	position: relative; z-index: 3;
	display: flex; flex-direction: column; align-items: center; gap: 18px;
	background: none; border: none; cursor: pointer; padding: 28px 32px;
	transition: transform .2s ease;
}
.oc-intro__logo-btn:hover { transform: scale(1.06); }
.oc-intro__logo-btn:active { transform: scale(0.94); }
/* Spinning ring around the logo */
.oc-intro__logo-ring {
	position: absolute;
	inset: -4px;
	border-radius: 50%;
	border: 2px solid transparent;
	border-top-color: #edab2e;
	border-right-color: rgba(237,171,46,.4);
	animation: ocLogoRing 2s linear infinite;
}
@keyframes ocLogoRing {
	from { transform: rotate(0deg); }
	to   { transform: rotate(360deg); }
}
/* Logo itself: gentle float/pulse */
.oc-intro__logo-wrap {
	width: 100px; height: 100px;
	display: flex; align-items: center; justify-content: center;
	animation: ocLogoFloat 3.2s ease-in-out infinite;
	filter: drop-shadow(0 0 32px rgba(237,171,46,.6));
}
.oc-intro__logo-wrap .oc-logo,
.oc-intro__logo-wrap svg,
.oc-intro__logo-wrap img { width: 100%; height: 100%; display: block; object-fit: contain; }
@keyframes ocLogoFloat {
	0%   { transform: scale(1)    translateY(0); }
	50%  { transform: scale(1.07) translateY(-6px); }
	100% { transform: scale(1)    translateY(0); }
}
.oc-intro__logo-tap {
	font-family: 'Space Grotesk', sans-serif;
	font-size: 10px; letter-spacing: .24em; text-transform: uppercase;
	color: rgba(207,230,216,.75);
}
/* Brand name below the logo */
.oc-intro__wordmark {
	position: relative; z-index: 3; margin-top: 24px;
	font-family: 'Syne', sans-serif; font-weight: 800; font-size: 20px;
	letter-spacing: .1em; text-transform: uppercase; color: #f3efe2;
}
/* Skip button bottom-right */
.oc-intro__skip {
	position: absolute; bottom: 14px; right: 16px; z-index: 4;
	background: none; border: none; cursor: pointer;
	font-family: 'Space Grotesk', sans-serif; font-size: 11px;
	color: rgba(243,239,226,.4); letter-spacing: .1em; padding: 8px 12px;
	border-radius: 8px; transition: color .15s;
}
.oc-intro__skip:hover { color: rgba(243,239,226,.85); }

/* ---- Album Map sidebar ---- */
.oc-asb {
	position: absolute; inset: 0; overflow-y: auto; overflow-x: hidden;
	display: flex; flex-direction: column;
	background: #0e2017;
	font-family: 'Space Grotesk', sans-serif;
}
.oc-asb::-webkit-scrollbar { width: 4px; }
.oc-asb::-webkit-scrollbar-thumb { background: rgba(237,171,46,.3); border-radius: 4px; }
/* Now playing bar */
.oc-asb__now {
	display: flex; align-items: center; gap: 10px; flex: none;
	padding: 10px 16px; background: rgba(237,171,46,.08);
	border-bottom: 1px solid rgba(237,171,46,.12);
}
.oc-asb__now-dot { font-size: 14px; color: #edab2e; flex: none; }
.oc-asb__now-name { flex: 1; min-width: 0; font-size: 12px; font-weight: 600; color: #f3efe2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.oc-asb__now-play { flex: none; width: 28px; height: 28px; border-radius: 50%; background: #edab2e; border: none; cursor: pointer; color: #231a06; font-size: 10px; display: flex; align-items: center; justify-content: center; }
/* Section header */
.oc-asb__head { display: flex; align-items: baseline; justify-content: space-between; padding: 14px 16px 8px; flex: none; }
.oc-asb__head-title { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: #edab2e; }
.oc-asb__head-count { font-size: 11px; color: rgba(243,239,226,.4); }
/* Track list */
.oc-asb__tracks { flex: 1; }
.oc-asb__track {
	display: flex; align-items: center; gap: 10px;
	padding: 10px 16px; cursor: pointer;
	border-bottom: 1px solid rgba(255,255,255,.04);
	transition: background .12s;
}
.oc-asb__track:hover { background: rgba(255,255,255,.04); }
.oc-asb__track.is-active { background: rgba(237,171,46,.07); }
.oc-asb__track-n { flex: none; font-size: 11px; color: rgba(243,239,226,.3); width: 20px; text-align: right; font-variant-numeric: tabular-nums; }
.oc-asb__track.is-active .oc-asb__track-n { color: #edab2e; }
.oc-asb__track-info { flex: 1; min-width: 0; }
.oc-asb__track-name { display: block; font-size: 13px; font-weight: 600; color: #f3efe2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.oc-asb__track.is-active .oc-asb__track-name { color: #edab2e; }
.oc-asb__track-area { display: block; font-size: 11px; color: rgba(243,239,226,.45); margin-top: 1px; }
.oc-asb__track-dur { flex: none; font-size: 11px; color: rgba(243,239,226,.35); font-variant-numeric: tabular-nums; }
.oc-asb__track-play {
	flex: none; width: 26px; height: 26px; border-radius: 50%;
	border: 1px solid rgba(243,239,226,.2); background: transparent;
	color: rgba(243,239,226,.6); font-size: 9px; cursor: pointer;
	display: flex; align-items: center; justify-content: center; transition: .12s;
}
.oc-asb__track-play:hover,
.oc-asb__track-play.is-playing { background: #edab2e; border-color: #edab2e; color: #231a06; }
/* Nav buttons */
.oc-asb__nav { flex: none; padding: 12px 16px 20px; display: flex; flex-direction: column; gap: 8px; border-top: 1px solid rgba(255,255,255,.06); margin-top: 8px; }
.oc-asb__nav-btn {
	display: flex; align-items: center; justify-content: space-between;
	padding: 12px 16px; border-radius: 10px;
	background: rgba(255,255,255,.04); color: #f3efe2;
	font-family: 'Space Grotesk', sans-serif; font-size: 13px; font-weight: 500;
	text-decoration: none; transition: background .12s;
	border: 1px solid rgba(255,255,255,.07);
}
.oc-asb__nav-btn:hover { background: rgba(237,171,46,.1); color: #edab2e; }
.oc-asb__nav-btn span { color: rgba(243,239,226,.4); font-size: 14px; }

/* ---- desktop split layout: map left, list right ---- */
@media (min-width: 768px) {
	/* Break out of the full-viewport-height chain so the map has a
	   standard defined height instead of stretching to fill the screen. */
	.oc-main--app { flex: none; }
	.oc-app { flex: none; overflow: visible; }

	/* Split row: map 58% left | scrollable list 42% right, capped at 650px tall */
	.oc-body { display: flex; flex-direction: row; height: 650px; max-height: 650px; min-height: 0; }
	.oc-map  { position: relative; flex: 0 0 58%; inset: unset; overflow: hidden; min-width: 0; }

	/* List panel — fixed height matches the body, scrolls when spots overflow */
	.oc-list { position: relative; flex: 1; inset: unset;
		height: 650px; max-height: 650px; min-height: 0; overflow-y: scroll;
		padding: 10px 10px 24px;
		border-left: 1px solid rgba(255,255,255,.08);
		background: rgba(6,6,12,.3);
		scrollbar-width: thin;
		scrollbar-color: rgba(237,171,46,.35) transparent; }
	.oc-list::-webkit-scrollbar { width: 4px; }
	.oc-list::-webkit-scrollbar-track { background: transparent; }
	.oc-list::-webkit-scrollbar-thumb { background: rgba(237,171,46,.35); border-radius: 4px; }

	/* Album sidebar — same slot as the list panel */
	.oc-asb { position: relative; flex: 1; inset: unset;
		height: 650px; max-height: 650px; min-height: 0;
		border-left: 1px solid rgba(255,255,255,.08); }

	/* numbered pin: show number, hide emoji glyph */
	.oc-pin.is-vis .oc-pin__glyph { display: none; }
	.oc-pin__num { display: flex; align-items: center; justify-content: center; }

	/* numbered list rows */
	.oc-row__num { display: flex; }

	/* hide category tag — panel too narrow for it */
	.oc-row__tag { display: none; }
}

/* responsive */
@media (max-width: 640px) {
	.oc-overlay { padding: 0; align-items: flex-end; justify-content: stretch; }
	.oc-card { width: 100%; max-height: 88%; border-radius: 26px 26px 0 0; }
	.oc-dir { width: 100%; }
	.oc-pin__label { display: none; }
	.oc-overlay--vip { padding: 20px; }
	.oc-vip-card { width: 100%; }
}

/* legal document (Privacy / Terms) — OCnians - Privacy Policy.dc.html */
.oc-main--legaldoc { display: block; padding: 0; background: #e9e0cb; }
.oc-legaldoc__hero { background: #103a2b; border-bottom: 1px solid rgba(237,171,46,.22); padding: 34px 0 30px; }
.oc-legaldoc__hero-inner { max-width: 820px; margin: 0 auto; padding: 0 28px; box-sizing: border-box; }
.oc-legaldoc__eyebrow { display: flex; align-items: center; gap: 10px; font-size: 10px; letter-spacing: .28em; color: #edc97a; text-transform: uppercase; }
.oc-legaldoc__eyebrow-icon { font-size: 20px; }
.oc-legaldoc__title { margin: 10px 0 0; font-family: 'Syne', sans-serif; font-weight: 800; font-size: clamp(30px,5vw,40px); color: #f3efe2; line-height: 1.04; }
.oc-legaldoc__intro { margin: 10px 0 0; font-size: 14.5px; color: #a9c4b4; max-width: 560px; line-height: 1.55; }
.oc-legaldoc__updated { display: inline-block; margin-top: 14px; font-size: 12px; color: #7fae93; }
.oc-legaldoc__body { background: #e9e0cb; }
.oc-legaldoc__body-inner { max-width: 820px; margin: 0 auto; padding: 14px 28px 60px; box-sizing: border-box; color: #2c281d; }
.oc-legaldoc__toc { display: flex; gap: 8px; flex-wrap: wrap; padding: 24px 0 30px; border-bottom: 2px solid #d8c79b; margin-bottom: 32px; }
.oc-legaldoc__tocitem { text-decoration: none; padding: 7px 13px; border-radius: 999px; background: #f3ecda; border: 1px solid #d8c79b; font-size: 12px; font-weight: 600; color: #5a5240; transition: .15s; }
.oc-legaldoc__tocitem:hover { background: #1c6b4f; color: #fff; border-color: #1c6b4f; }
.oc-legaldoc__section { margin-bottom: 30px; scroll-margin-top: 84px; }
.oc-legaldoc__h2 { margin: 0 0 12px; font-family: 'Syne', sans-serif; font-weight: 700; font-size: 21px; color: #1c6b4f; display: flex; align-items: center; gap: 11px; }
.oc-legaldoc__num { width: 28px; height: 28px; flex: none; border-radius: 8px; background: #1c6b4f; color: #edd9a8; font-size: 13px; font-weight: 700;
	display: flex; align-items: center; justify-content: center; font-family: 'Space Grotesk', sans-serif; }
.oc-legaldoc__content p { margin: 0 0 11px; font-size: 14.5px; line-height: 1.62; color: #3c382c; }
.oc-legaldoc__bullets { margin: 8px 0 4px; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.oc-legaldoc__bullets li { display: flex; align-items: flex-start; gap: 11px; font-size: 14px; line-height: 1.5; color: #3c382c;
	padding: 11px 14px; background: #f3ecda; border: 1px solid #e0d2ab; border-radius: 11px; }
.oc-legaldoc__bullet-mark { color: #c98a1e; font-weight: 700; flex: none; margin-top: 1px; }
.oc-legaldoc__callout { margin-top: 40px; padding: 22px 24px; border-radius: 16px; background: #0f3d2c; border: 1px solid #1c6b4f;
	display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.oc-legaldoc__callout-icon { font-size: 26px; }
.oc-legaldoc__callout-text { flex: 1; min-width: 200px; }
.oc-legaldoc__callout-title { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 16px; color: #f3efe2; }
.oc-legaldoc__callout-sub { font-size: 13px; color: #a9c4b4; margin-top: 3px; }
.oc-legaldoc__callout-sub a { color: #edc97a; font-weight: 600; text-decoration: none; }
.oc-legaldoc__callout-btn { text-decoration: none; flex: none; padding: 11px 18px; border-radius: 11px; background: #edab2e; color: #231a06; font-family: 'Syne', sans-serif; font-weight: 700; font-size: 13.5px; }

/* FAQ page — OCnians - FAQ.dc.html */
.oc-main--faq { display: block; padding: 0; background: #e9e0cb; }
.oc-faq__hero { background: #103a2b; border-bottom: 1px solid rgba(237,171,46,.22); padding: 34px 0 30px; }
.oc-faq__hero-inner { max-width: 760px; margin: 0 auto; padding: 0 28px; box-sizing: border-box; }
.oc-faq__eyebrow { display: flex; align-items: center; gap: 10px; font-size: 10px; letter-spacing: .28em; color: #edc97a; text-transform: uppercase; }
.oc-faq__eyebrow-icon { font-size: 20px; }
.oc-faq__title { margin: 10px 0 0; font-family: 'Syne', sans-serif; font-weight: 800; font-size: clamp(30px,5vw,40px); color: #f3efe2; line-height: 1.04; }
.oc-faq__intro { margin: 10px 0 0; font-size: 14.5px; color: #a9c4b4; max-width: 540px; line-height: 1.55; }
.oc-faq__body { background: #e9e0cb; }
.oc-faq__body-inner { max-width: 760px; margin: 0 auto; padding: 26px 28px 60px; box-sizing: border-box; color: #2c281d; }
.oc-faq__cats { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 24px; }
.oc-faq__cat { padding: 9px 15px; border-radius: 999px; cursor: pointer; font-family: 'Space Grotesk', sans-serif; font-size: 13px; font-weight: 600;
	background: #f3ecda; color: #5a5240; border: 1px solid #d8c79b; transition: .15s; }
.oc-faq__cat.is-on { background: #1c6b4f; color: #fff; border-color: #1c6b4f; }
.oc-faq__list { display: flex; flex-direction: column; gap: 11px; }
.oc-faq__item { background: #f3ecda; border: 1px solid #d8c79b; border-radius: 14px; overflow: hidden; transition: border-color .15s; }
.oc-faq__item.is-open { border-color: #1c6b4f; }
.oc-faq__q { width: 100%; display: flex; align-items: center; gap: 14px; padding: 18px 20px; background: none; border: none; cursor: pointer; text-align: left; }
.oc-faq__tag { flex: none; font-size: 9px; font-weight: 700; letter-spacing: .1em; padding: 5px 8px; border-radius: 6px; background: #1c6b4f; color: #edd9a8; }
.oc-faq__qtext { flex: 1; font-family: 'Syne', sans-serif; font-weight: 700; font-size: 16px; color: #23463a; line-height: 1.3; }
.oc-faq__sign { flex: none; width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
	font-size: 17px; font-weight: 600; background: #e7ddc4; color: #8a7e5e; transition: .15s; }
.oc-faq__sign::after { content: '+'; }
.oc-faq__item.is-open .oc-faq__sign { background: #edab2e; color: #231a06; }
.oc-faq__item.is-open .oc-faq__sign::after { content: '−'; }
.oc-faq__a { display: none; padding: 0 20px 20px 64px; }
.oc-faq__item.is-open .oc-faq__a { display: block; }
.oc-faq__a p { margin: 0 0 10px; font-size: 14.5px; line-height: 1.62; color: #3c382c; }
.oc-faq__help { margin-top: 36px; padding: 24px; border-radius: 16px; background: #0f3d2c; border: 1px solid #1c6b4f; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.oc-faq__help-icon { font-size: 28px; }
.oc-faq__help-text { flex: 1; min-width: 200px; }
.oc-faq__help-title { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 17px; color: #f3efe2; }
.oc-faq__help-sub { font-size: 13px; color: #a9c4b4; margin-top: 3px; }
.oc-faq__help-btn { text-decoration: none; flex: none; padding: 12px 20px; border-radius: 12px; background: #edab2e; color: #231a06; font-family: 'Syne', sans-serif; font-weight: 700; font-size: 14px; }
@media (max-width: 600px) { .oc-faq__a { padding-left: 20px; } }

/* VIP Membership landing — OCnians - VIP Membership.dc.html */
.oc-main--vip { display: block; padding: 0; background: #e9e0cb; }
.oc-vip__hero { position: relative; overflow: hidden; background: radial-gradient(120% 100% at 80% 0%, #1c5e46 0%, #0f3d2c 55%, #0b2c20 100%); padding: 54px 30px 60px; }
.oc-vip__hero::before { content: ''; position: absolute; inset: 0; background: radial-gradient(80% 60% at 78% 18%, rgba(237,171,46,.22), transparent 60%); pointer-events: none; }
.oc-vip__hero-inner { position: relative; max-width: 1040px; margin: 0 auto; display: grid; grid-template-columns: 1fr 360px; gap: 40px; align-items: center; }
.oc-vip__badge { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border-radius: 999px; background: rgba(237,171,46,.16); border: 1px solid rgba(237,171,46,.4); font-size: 11px; letter-spacing: .16em; color: #edc97a; text-transform: uppercase; }
.oc-vip__heading { margin: 18px 0 0; font-family: 'Syne', sans-serif; font-weight: 800; font-size: clamp(34px,5vw,48px); line-height: 1.02; color: #f3efe2; }
.oc-vip__intro { margin: 16px 0 0; font-size: 16px; line-height: 1.55; color: #a9c4b4; max-width: 440px; }
.oc-vip__cta-row { display: flex; align-items: center; gap: 18px; margin-top: 26px; flex-wrap: wrap; }
.oc-vip__join { text-decoration: none; display: inline-block; padding: 16px 30px; border-radius: 14px; background: linear-gradient(135deg,#edab2e,#e8821e); color: #231a06; font-family: 'Syne', sans-serif; font-weight: 800; font-size: 16px; box-shadow: 0 10px 30px rgba(232,130,30,.4); }
.oc-main--vip .oc-vip__price-note { display: flex; flex-direction: column; font-size: 13px; color: #cfe6d8; }
.oc-main--vip .oc-vip__price-note strong { color: #edc97a; }
.oc-vip__socks { font-size: 11.5px; color: #7fae93; }
/* membership card */
.oc-vip__card { position: relative; border-radius: 22px; overflow: hidden; background: linear-gradient(150deg,#edab2e,#e8821e); padding: 2px; box-shadow: 0 20px 50px rgba(0,0,0,.35); }
.oc-vip__card-inner { position: relative; border-radius: 20px; background: #0b2c20; padding: 26px 24px; overflow: hidden; }
.oc-vip__card-star { position: absolute; right: -30px; top: -30px; font-family: 'Syne', sans-serif; font-weight: 800; font-size: 160px; color: rgba(237,171,46,.07); line-height: .7; }
.oc-vip__card-top { position: relative; display: flex; align-items: center; justify-content: space-between; }
.oc-vip__card-vip { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 20px; color: #edab2e; }
.oc-vip__card-price { position: relative; margin-top: 30px; display: flex; align-items: baseline; gap: 8px; }
.oc-vip__card-amt { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 46px; color: #f3efe2; }
.oc-vip__card-init { font-size: 13px; color: #7fae93; }
.oc-vip__card-sub { position: relative; font-size: 13px; color: #cfe6d8; margin-top: 2px; }
.oc-vip__card-divider { height: 1px; background: rgba(237,171,46,.25); margin: 20px 0; }
.oc-vip__card-perks { position: relative; display: flex; flex-direction: column; gap: 9px; }
.oc-vip__card-perk { display: flex; align-items: center; gap: 9px; font-size: 12.5px; color: #dbe9df; }
.oc-vip__card-check { width: 18px; height: 18px; flex: none; border-radius: 50%; background: rgba(237,171,46,.18); color: #edc97a; font-size: 10px; display: flex; align-items: center; justify-content: center; }
.oc-vip__card-foot { position: relative; margin-top: 18px; display: flex; align-items: center; gap: 6px; font-size: 10px; letter-spacing: .2em; color: #7fae93; text-transform: uppercase; }
.oc-vip__card-rule { flex: 1; height: 1px; background: rgba(127,174,147,.3); }
/* sections */
.oc-vip__section { max-width: 1040px; margin: 0 auto; padding: 50px 28px 10px; }
.oc-vip__section--narrow { max-width: 760px; padding-top: 46px; }
.oc-vip__head { text-align: center; margin-bottom: 34px; }
.oc-vip__eyebrow { font-size: 10px; letter-spacing: .28em; color: #c98a1e; text-transform: uppercase; }
.oc-vip__h2 { margin: 8px 0 0; font-family: 'Syne', sans-serif; font-weight: 800; font-size: 30px; color: #1c6b4f; }
.oc-vip__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.oc-main--vip .oc-vip__benefit { background: #f3ecda; border: 1px solid #d8c79b; border-radius: 16px; padding: 22px 20px; }
.oc-vip__benefit-icon { display: inline-flex; width: 44px; height: 44px; border-radius: 12px; align-items: center; justify-content: center; font-size: 20px; border: 1px solid; }
.oc-vip__benefit-title { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 16px; color: #23463a; margin-top: 14px; }
.oc-vip__benefit-desc { font-size: 13px; color: #5a5240; line-height: 1.5; margin-top: 5px; }
/* comparison table */
.oc-vip__table { border-radius: 18px; overflow: hidden; border: 1px solid #d8c79b; }
.oc-vip__trow { display: grid; grid-template-columns: 1fr 120px 120px; border-top: 1px solid #e0d2ab; }
.oc-vip__trow:nth-child(odd) { background: #f6efdd; }
.oc-vip__trow:nth-child(even) { background: #efe6cf; }
.oc-vip__trow--head { background: #0f3d2c !important; border-top: none; }
.oc-vip__tcell { padding: 14px 12px; text-align: center; font-size: 15px; color: #1c6b4f; }
.oc-vip__tcell--feature { text-align: left; padding-left: 18px; font-size: 13.5px; color: #3c382c; }
.oc-vip__tcell--free { color: #9a8e6e; }
.oc-vip__tcell--vip { background: rgba(237,171,46,.07); }
.oc-vip__trow--head .oc-vip__tcell { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 14px; color: #cfe6d8; }
.oc-vip__trow--head .oc-vip__tcell--feature { font-size: 12px; letter-spacing: .1em; color: #7fae93; text-transform: uppercase; }
.oc-vip__trow--head .oc-vip__tcell--vip { color: #edab2e; background: rgba(237,171,46,.12); }
/* final cta */
.oc-vip__final-wrap { max-width: 1040px; margin: 46px auto 0; padding: 0 28px 56px; }
.oc-vip__final { position: relative; overflow: hidden; border-radius: 22px; background: linear-gradient(135deg,#1c6b4f,#0f3d2c); padding: 42px 36px; text-align: center; }
.oc-vip__final::before { content: ''; position: absolute; inset: 0; background: radial-gradient(70% 80% at 50% 0%, rgba(237,171,46,.2), transparent 60%); }
.oc-vip__final-icon, .oc-vip__final-h, .oc-vip__final-t, .oc-vip__final .oc-vip__join { position: relative; }
.oc-vip__final-icon { font-size: 34px; }
.oc-vip__final-h { margin: 12px 0 0; font-family: 'Syne', sans-serif; font-weight: 800; font-size: 30px; color: #f3efe2; }
.oc-vip__final-t { margin: 10px auto 0; font-size: 14.5px; color: #a9c4b4; max-width: 440px; line-height: 1.55; }
.oc-vip__final .oc-vip__join { margin-top: 24px; }
@media (max-width: 860px) {
	.oc-vip__hero-inner { grid-template-columns: 1fr; }
	.oc-vip__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) { .oc-vip__grid { grid-template-columns: 1fr; } }

/* ===== My Account dashboard — OCnians - My Account.dc.html ===== */
.oc-main--account { display: block; padding: 0; background: #e9e0cb; }
.oc-acc-wrap { max-width: 1080px; width: 100%; margin: 0 auto; padding: 28px 28px 40px; box-sizing: border-box; }
.oc-acc-wrap .woocommerce { display: flex; align-items: stretch; min-height: 64vh; border-radius: 18px; overflow: hidden; border: 1px solid #d8c79b; }
/* Login page: reset the WooCommerce chrome wrapper — the .oc-lg card provides its own */
.oc-acc-wrap .woocommerce:has(.oc-lg) { display: block; min-height: 0; border-radius: 0; border: none; overflow: visible; background: transparent; }
.oc-acc-wrap .woocommerce-notices-wrapper { width: 100%; }

/* sidebar */
.oc-acc__nav { flex: none; width: 262px; box-sizing: border-box; padding: 24px 18px; background: #103a2b; border-right: 1px solid rgba(237,171,46,.25); display: flex; flex-direction: column; gap: 4px; }
.oc-acc__chip { display: flex; align-items: center; gap: 12px; padding: 14px; margin-bottom: 12px; background: #0f3d2c; border: 1px solid rgba(237,171,46,.3); border-radius: 14px; }
.oc-acc__avatar { width: 46px; height: 46px; flex: none; border-radius: 50%; background: linear-gradient(135deg,#edab2e,#e8821e); display: flex; align-items: center; justify-content: center; font-family: 'Syne', sans-serif; font-weight: 800; font-size: 18px; color: #231a06; }
.oc-acc__chip-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.oc-acc__chip-name { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 14px; color: #f3efe2; }
.oc-acc__chip-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 9.5px; font-weight: 700; letter-spacing: .08em; color: #231a06; background: #edab2e; padding: 2px 8px; border-radius: 999px; width: max-content; }
.oc-acc__chip-badge--free { color: #cfe6d8; background: rgba(255,255,255,.08); }
.oc-acc__navitem { display: flex; align-items: center; gap: 11px; padding: 11px 14px; border-radius: 10px; text-decoration: none; cursor: pointer; font-family: 'Space Grotesk', sans-serif; font-size: 13.5px; font-weight: 500; color: #cfe6d8; border: 1px solid transparent; transition: .15s; }
.oc-acc__navitem:hover { background: rgba(255,255,255,.05); }
.oc-acc__navitem.is-active { background: #edab2e; color: #231a06; font-weight: 700; border-color: #edab2e; }
.oc-acc__navicon { font-size: 15px; width: 18px; text-align: center; }
.oc-acc__navlabel { flex: 1; }
.oc-acc__navbadge { font-size: 10px; font-weight: 700; padding: 1px 7px; border-radius: 999px; background: rgba(237,171,46,.2); color: #edc97a; }
.oc-acc__navitem.is-active .oc-acc__navbadge { background: rgba(0,0,0,.18); color: #231a06; }
.oc-acc__signout { margin-top: auto; display: flex; align-items: center; gap: 11px; padding: 11px 14px; border-radius: 10px; border: 1px solid rgba(255,255,255,.1); text-decoration: none; color: #7fae93; font-family: 'Space Grotesk', sans-serif; font-size: 13px; font-weight: 500; }
.oc-acc__signout:hover { color: #cfe6d8; border-color: rgba(255,255,255,.2); }

/* content area */
.oc-acc-wrap .woocommerce-MyAccount-content { flex: 1; min-width: 0; background: #f3ecda; padding: 30px 36px 70px; color: #2c281d; }
.oc-acc__panel { max-width: 760px; margin: 0 auto; display: flex; flex-direction: column; gap: 20px; }
.oc-acc__h1 { margin: 0; font-family: 'Syne', sans-serif; font-weight: 800; font-size: 30px; color: #1c6b4f; }
.oc-acc__lead { margin: -10px 0 0; font-size: 14px; color: #7a7158; line-height: 1.5; }
.oc-acc__welcome { display: flex; flex-direction: column; gap: 6px; }
.oc-acc__welcome .oc-acc__lead { margin: 0; }

/* stat tiles */
.oc-acc__tiles { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.oc-acc__tile { background: #fff; border: 1px solid #e0d2ab; border-radius: 15px; padding: 18px 16px; }
.oc-acc__tile-icon { font-size: 20px; }
.oc-acc__tile-value { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 26px; color: #1c6b4f; margin-top: 8px; }
.oc-acc__tile-label { font-size: 11.5px; color: #7a7158; margin-top: 2px; }

/* membership card */
.oc-acc__memcard { position: relative; overflow: hidden; border-radius: 18px; background: linear-gradient(135deg,#0f3d2c,#1c6b4f); padding: 24px; color: #f3efe2; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.oc-acc__memcard-star { position: absolute; right: -20px; top: -26px; font-family: 'Syne', sans-serif; font-weight: 800; font-size: 150px; color: rgba(237,171,46,.08); line-height: .7; }
.oc-acc__memcard-main { position: relative; flex: 1; min-width: 180px; }
.oc-acc__memcard-eyebrow { font-size: 10px; letter-spacing: .2em; color: #edc97a; text-transform: uppercase; }
.oc-acc__memcard-plan { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 22px; margin-top: 4px; }
.oc-acc__memcard-sub { font-size: 12.5px; color: #a9c4b4; margin-top: 6px; }
.oc-acc__memcard-btn { position: relative; text-decoration: none; padding: 11px 18px; border-radius: 11px; border: 1px solid rgba(237,171,46,.5); background: rgba(237,171,46,.12); color: #edc97a; font-family: 'Space Grotesk', sans-serif; font-weight: 600; font-size: 13px; }
.oc-acc__memcard-btn--go { border: none; background: #edab2e; color: #231a06; font-weight: 700; }

/* raffle strip / generic row */
.oc-acc__raffle { background: #fff; border: 1px solid #e0d2ab; border-radius: 16px; padding: 18px 20px; display: flex; align-items: center; gap: 15px; }
.oc-acc__raffle-icon { width: 48px; height: 48px; flex: none; border-radius: 12px; background: rgba(62,155,99,.16); border: 1px solid rgba(62,155,99,.4); display: flex; align-items: center; justify-content: center; font-size: 22px; }
.oc-acc__raffle-main { flex: 1; min-width: 0; }
.oc-acc__raffle-eyebrow { font-size: 10px; letter-spacing: .14em; color: #9a8e6e; text-transform: uppercase; }
.oc-acc__raffle-title { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 16px; color: #23463a; margin-top: 2px; }
.oc-acc__raffle-meta { font-size: 12px; color: #7a7158; }
.oc-acc__raffle-btn { flex: none; text-decoration: none; padding: 10px 14px; border-radius: 10px; background: #1c6b4f; color: #fff; font-weight: 600; font-size: 12.5px; }
.oc-acc__rafflebar { display: flex; align-items: baseline; gap: 10px; background: #0f3d2c; border-radius: 14px; padding: 16px 20px; color: #cfe6d8; font-size: 13px; }
.oc-acc__rafflebar-n { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 24px; color: #edab2e; }

/* generic list rows (raffles) */
.oc-acc__list { display: flex; flex-direction: column; gap: 11px; }
.oc-acc__row { background: #fff; border: 1px solid #e0d2ab; border-radius: 16px; padding: 16px 18px; display: flex; align-items: center; gap: 14px; }
.oc-acc__rowicon { width: 46px; height: 46px; flex: none; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 20px; border: 1px solid; }
.oc-acc__rowmain { flex: 1; min-width: 0; }
.oc-acc__rowtitle { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 15px; color: #23463a; }
.oc-acc__rowmeta { font-size: 12px; color: #7a7158; margin-top: 2px; }
.oc-acc__rowright { text-align: right; }
.oc-acc__rownum { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 18px; color: #1c6b4f; }
.oc-acc__rowsub { font-size: 10px; color: #9a8e6e; text-transform: uppercase; letter-spacing: .1em; }

/* haunts grid */
.oc-acc__grid2 { display: grid; grid-template-columns: repeat(2,1fr); gap: 14px; }
.oc-acc__haunt { background: #fff; border: 1px solid #e0d2ab; border-radius: 15px; padding: 16px 18px; }
.oc-acc__haunt-top { display: flex; align-items: center; justify-content: space-between; }
.oc-acc__haunt-glyph { font-size: 22px; }
.oc-acc__haunt-tag { font-size: 9.5px; font-weight: 700; letter-spacing: .06em; padding: 4px 9px; border-radius: 999px; text-transform: uppercase; }
.oc-acc__haunt-name { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 15px; color: #23463a; margin-top: 12px; }
.oc-acc__haunt-date { font-size: 11.5px; color: #7a7158; margin-top: 2px; }

/* saved spots */
.oc-acc__saved { background: #fff; border: 1px solid #e0d2ab; border-radius: 14px; padding: 14px 16px; display: flex; align-items: center; gap: 14px; text-decoration: none; }
.oc-acc__saved:hover { border-color: #cdbb8e; }
.oc-acc__saved-dot { width: 42px; height: 42px; flex: none; border-radius: 11px; display: flex; align-items: center; justify-content: center; font-size: 18px; color: #231a06; }
.oc-acc__saved-main { flex: 1; display: flex; flex-direction: column; }
.oc-acc__saved-name { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 15px; color: #23463a; }
.oc-acc__saved-meta { font-size: 12px; color: #7a7158; }
.oc-acc__saved-tag { flex: none; font-size: 10px; font-weight: 700; padding: 4px 9px; border-radius: 999px; border: 1px solid; }

/* settings prefs */
.oc-acc__prefs { background: #fff; border: 1px solid #e0d2ab; border-radius: 16px; padding: 6px 20px 18px; }
.oc-acc__pref { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 15px 0; border-bottom: 1px solid #efe6cf; }
.oc-acc__pref-label { font-size: 14px; font-weight: 600; color: #23463a; }
.oc-acc__pref-desc { font-size: 12px; color: #7a7158; margin-top: 1px; }
.oc-acc__switch { position: relative; width: 46px; height: 26px; flex: none; border-radius: 999px; background: #cbbd96; cursor: pointer; transition: .18s; }
.oc-acc__switch.is-on { background: #1c6b4f; }
.oc-acc__switch:has(input:checked) { background: #1c6b4f; }
.oc-acc__switch input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.oc-acc__knob { position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.3); transition: .18s; pointer-events: none; }
.oc-acc__switch.is-on .oc-acc__knob { left: 23px; }
.oc-acc__switch:has(input:checked) .oc-acc__knob { left: 23px; }

/* empty states + buttons */
.oc-acc__empty { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; padding: 40px 24px; background: #fff; border: 1px dashed #d8c79b; border-radius: 16px; font-size: 30px; color: #1c6b4f; }
.oc-acc__empty span { font-size: 13.5px; color: #7a7158; max-width: 360px; }
.oc-acc__btn { align-self: flex-start; text-decoration: none; padding: 12px 20px; border-radius: 12px; background: #edab2e; color: #231a06; font-family: 'Syne', sans-serif; font-weight: 700; font-size: 14px; border: none; cursor: pointer; }
.oc-acc__btn--save { margin-top: 16px; }

/* native WC bits inside the account content */
.oc-acc-wrap .woocommerce-MyAccount-content a.button,
.oc-acc-wrap .woocommerce-MyAccount-content button.button { background: #1c6b4f; color: #fff !important; border-radius: 11px; border: none; padding: 11px 18px; font-family: 'Space Grotesk', sans-serif; font-weight: 600; }
.oc-acc-wrap .woocommerce-orders-table,
.oc-acc-wrap .woocommerce-MyAccount-content > .woocommerce-Addresses,
.oc-acc-wrap .ocnians-vip-account { max-width: 760px; margin: 0 auto; }

/* orders table — branded to the paper/green account theme */
.oc-acc-wrap .woocommerce-orders-table { width: 100%; border-collapse: separate; border-spacing: 0 10px; font-family: 'Space Grotesk', sans-serif; border: none; margin-bottom: 30px; }
.oc-acc-wrap .woocommerce-orders-table thead { background: transparent; }
.oc-acc-wrap .woocommerce-orders-table__header { text-align: left; padding: 2px 16px; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: #0f3d2b; font-weight: 700; background: transparent; border: none; }
.oc-acc-wrap .woocommerce-orders-table__header-order-actions,
.oc-acc-wrap .woocommerce-orders-table__cell-order-actions { text-align: right; }
.oc-acc-wrap .woocommerce-orders-table__cell { background: #fff; padding: 15px 16px; font-size: 13.5px; color: #3c382c; border-top: 1px solid #e0d2ab; border-bottom: 1px solid #e0d2ab; vertical-align: middle; }
.oc-acc-wrap .woocommerce-orders-table__cell:first-child { border-left: 1px solid #e0d2ab; border-radius: 14px 0 0 14px; }
.oc-acc-wrap .woocommerce-orders-table__cell:last-child { border-right: 1px solid #e0d2ab; border-radius: 0 14px 14px 0; }
.oc-acc-wrap .woocommerce-orders-table__cell-order-number a { color: #1c6b4f; font-family: 'Syne', sans-serif; font-weight: 700; text-decoration: none; }
.oc-acc-wrap .woocommerce-orders-table__cell-order-number a:hover { color: #0f3d2c; }
.oc-acc-wrap .woocommerce-orders-table__cell-order-date { color: #7a7158; }
.oc-acc-wrap .woocommerce-orders-table__cell-order-total { color: #1c6b4f; font-weight: 700; }
.oc-acc-wrap .woocommerce-orders-table__cell-order-total .woocommerce-Price-amount,
.oc-acc-wrap .woocommerce-orders-table__cell-order-total bdi { color: #1c6b4f; }
.oc-acc-wrap .woocommerce-orders-table__cell-order-status { font-weight: 700; font-size: 12px; letter-spacing: .02em; color: #c98a1e; }
.oc-acc-wrap .woocommerce-orders-table__row--status-completed .woocommerce-orders-table__cell-order-status,
.oc-acc-wrap .woocommerce-orders-table__row--status-processing .woocommerce-orders-table__cell-order-status { color: #1c6b4f; }
.oc-acc-wrap .woocommerce-orders-table__row--status-cancelled .woocommerce-orders-table__cell-order-status,
.oc-acc-wrap .woocommerce-orders-table__row--status-failed .woocommerce-orders-table__cell-order-status,
.oc-acc-wrap .woocommerce-orders-table__row--status-refunded .woocommerce-orders-table__cell-order-status { color: #c0392b; }
.oc-acc-wrap .woocommerce-orders-table__cell-order-actions .button { padding: 8px 14px; font-size: 12.5px; margin: 2px 0 2px 6px; }
/* pagination */
.oc-acc-wrap .woocommerce-pagination .button,
.oc-acc-wrap .woocommerce-Pagination .button { background: #fff; color: #1c6b4f !important; border: 1px solid #d8c79b; }
/* notices / empty state inside the account */
.oc-acc-wrap .woocommerce-info,
.oc-acc-wrap .woocommerce-message,
.oc-acc-wrap .woocommerce-notice { background: #fff; border: 1px solid #e0d2ab; border-left: 3px solid #edab2e; border-radius: 12px; padding: 16px 18px; color: #3c382c; font-size: 14px; box-shadow: none; }
.oc-acc-wrap .woocommerce-info::before,
.oc-acc-wrap .woocommerce-message::before { color: #edab2e; }
/* responsive stacked rows keep rounded cards */
@media (max-width: 600px) {
	.oc-acc-wrap .woocommerce-orders-table__cell { border-radius: 0; border-left: 1px solid #e0d2ab; border-right: 1px solid #e0d2ab; }
	.oc-acc-wrap .woocommerce-orders-table__cell:first-child { border-radius: 14px 14px 0 0; }
	.oc-acc-wrap .woocommerce-orders-table__cell:last-child { border-radius: 0 0 14px 14px; }
}

/* single order view — "Order details" page, branded to match */
.oc-acc-wrap .woocommerce-order-details__title,
.oc-acc-wrap .woocommerce-column__title,
.oc-acc-wrap .woocommerce-order-details h2,
.oc-acc-wrap .woocommerce-MyAccount-content h2:not([class]) { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 18px; color: #0f3d2b; margin: 22px 0 14px; }
.oc-acc-wrap .woocommerce-table--order-details { width: 100%; border-collapse: separate; border-spacing: 0; background: #fff; border: 1px solid #e0d2ab; border-radius: 14px; overflow: hidden; }
.oc-acc-wrap .woocommerce-table--order-details th,
.oc-acc-wrap .woocommerce-table--order-details td { padding: 12px 16px; text-align: left; border-bottom: 1px solid #efe6cf; font-size: 13.5px; color: #3c382c; }
.oc-acc-wrap .woocommerce-table--order-details thead th { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: #0f3d2b; font-weight: 700; background: #f3ecda; }
.oc-acc-wrap .woocommerce-table--order-details tfoot th { color: #0f3d2b; font-weight: 700; }
.oc-acc-wrap .woocommerce-table--order-details tfoot tr:last-child th,
.oc-acc-wrap .woocommerce-table--order-details tfoot tr:last-child td { font-family: 'Syne', sans-serif; font-size: 16px; color: #0f3d2b; }
.oc-acc-wrap .woocommerce-table--order-details a { color: #1c6b4f; font-weight: 600; text-decoration: none; }
.oc-acc-wrap .woocommerce-table--order-details .woocommerce-Price-amount,
.oc-acc-wrap .woocommerce-table--order-details bdi { color: #1c6b4f; }
.oc-acc-wrap .woocommerce-customer-details address { font-style: normal; color: #3c382c; font-size: 13.5px; line-height: 1.6; background: #fff; border: 1px solid #e0d2ab; border-radius: 12px; padding: 14px 16px; }
.oc-acc-wrap .woocommerce-customer-details .woocommerce-column { margin-bottom: 14px; }

/* spot-card Save button */
.oc-card__save { position: absolute; top: 14px; left: 14px; width: 34px; height: 34px; border-radius: 50%; border: none; cursor: pointer; background: rgba(8,20,14,.55); color: #f3efe2; font-size: 17px; line-height: 1; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(3px); transition: .15s; z-index: 3; }
.oc-card__save:hover { background: rgba(8,20,14,.75); }
.oc-card__save.is-on { background: #edab2e; color: #c0392b; }

@media (max-width: 820px) {
	.oc-acc-wrap { padding: 16px 16px 30px; }
	.oc-acc-wrap .woocommerce { flex-direction: column; }
	.oc-acc__nav { width: auto; border-right: none; border-bottom: 1px solid rgba(237,171,46,.25); }
	.oc-acc__signout { margin-top: 8px; }
	.oc-acc__tiles { grid-template-columns: 1fr 1fr 1fr; }
}
@media (max-width: 520px) { .oc-acc__grid2 { grid-template-columns: 1fr; } }

/* ===== Order received / thank you — OCnians - Order Received.dc.html ===== */
@keyframes orPop { from { transform: scale(.7); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@keyframes orRise { from { transform: translateY(16px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.oc-or { max-width: 760px; margin: 0 auto; padding: 40px 0 20px; color: #2c281d; }

/* hero */
.oc-or__hero { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.oc-or__check { width: 78px; height: 78px; border-radius: 50%; background: linear-gradient(135deg,#1c6b4f,#3e9b63); display: flex; align-items: center; justify-content: center; font-size: 38px; color: #fff; box-shadow: 0 0 40px rgba(28,107,79,.35); animation: orPop .45s cubic-bezier(.2,.8,.2,1); }
.oc-or__check--fail { background: linear-gradient(135deg,#c0392b,#e8821e); }
.oc-or__eyebrow { font-size: 10px; letter-spacing: .28em; color: #c98a1e; text-transform: uppercase; }
.oc-or__title { margin: 0; font-family: 'Syne', sans-serif; font-weight: 800; font-size: clamp(28px,5vw,36px); color: #1c6b4f; line-height: 1.05; }
.oc-or__sub { margin: 0; font-size: 14.5px; color: #5a5240; line-height: 1.55; max-width: 440px; }
.oc-or__email, .oc-or__sub .oc-or__email { font-weight: 600; color: #23463a; }

/* meta strip */
.oc-or__meta { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; margin-top: 30px; background: #d8c79b; border: 1px solid #d8c79b; border-radius: 14px; overflow: hidden; }
.oc-or__metacell { background: #f3ecda; padding: 15px 16px; }
.oc-or__metalabel { font-size: 10px; letter-spacing: .12em; color: #9a8e6e; text-transform: uppercase; }
.oc-or__metaval { font-size: 13.5px; font-weight: 600; color: #23463a; margin-top: 5px; }
.oc-or__metaval .amount, .oc-or__metaval bdi { white-space: nowrap; }

/* summary card */
.oc-or__summary { margin-top: 24px; background: #0f3d2c; border: 1px solid #1c6b4f; border-radius: 18px; overflow: hidden; }
.oc-or__summary-head { padding: 16px 20px; border-bottom: 1px solid rgba(237,171,46,.22); display: flex; align-items: center; justify-content: space-between; }
.oc-or__summary-title { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 16px; color: #f3efe2; }
.oc-or__summary-count { font-size: 11px; color: #7fae93; }
.oc-or__lines { padding: 6px 20px; }
.oc-or__line { display: flex; align-items: center; gap: 13px; padding: 13px 0; border-bottom: 1px solid rgba(255,255,255,.06); }
.oc-or__line:last-child { border-bottom: none; }
.oc-or__thumb { width: 42px; height: 42px; flex: none; border-radius: 11px; display: flex; align-items: center; justify-content: center; font-size: 19px; background: #12241a; overflow: hidden; }
.oc-or__thumb img { width: 42px; height: 42px; object-fit: cover; border-radius: 11px; display: block; }
.oc-or__line-main { flex: 1; min-width: 0; }
.oc-or__line-name { font-size: 13.5px; font-weight: 600; color: #f3efe2; }
.oc-or__line-note { font-size: 11.5px; color: #7fae93; margin-top: 2px; }
.oc-or__line-price { font-size: 14px; font-weight: 700; color: #f3efe2; white-space: nowrap; }
.oc-or__line-price.is-free { color: #edc97a; }
.oc-or__line-price .amount { color: inherit; }
.oc-or__totals { padding: 14px 20px; background: rgba(0,0,0,.18); display: flex; flex-direction: column; gap: 9px; }
.oc-or__trow { display: flex; justify-content: space-between; font-size: 13px; color: #cfe6d8; }
.oc-or__trow .amount { color: inherit; }
.oc-or__trow--vip { color: #edc97a; }
.oc-or__trow--vip .amount { color: #edc97a; }
.oc-or__trule { height: 1px; background: rgba(237,171,46,.25); margin: 4px 0; }
.oc-or__trow--total { align-items: baseline; }
.oc-or__trow--total > span:first-child { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 17px; color: #f3efe2; }
.oc-or__grand { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 24px; color: #edab2e; }
.oc-or__grand .amount, .oc-or__grand bdi { color: #edab2e; }

/* two-up */
.oc-or__twoup { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 16px; }
.oc-or__card { background: #f3ecda; border: 1px solid #d8c79b; border-radius: 16px; padding: 18px 20px; }
.oc-or__card-label { font-size: 10px; letter-spacing: .14em; color: #9a8e6e; text-transform: uppercase; margin-bottom: 8px; }
.oc-or__card-addr { font-size: 13px; color: #23463a; line-height: 1.5; font-style: normal; }
.oc-or__card-addr { font-weight: 500; }
.oc-or__card-pay { font-size: 14px; font-weight: 600; color: #23463a; display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.oc-or__card-dots { color: #5a5240; }
.oc-or__card-meta { margin-top: 10px; font-size: 12px; color: #7a7158; }

/* perks */
.oc-or__perks { display: flex; flex-direction: column; gap: 12px; margin-top: 16px; }
.oc-or__perk { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-radius: 14px; text-decoration: none; }
.oc-or__perk--socks { background: linear-gradient(135deg, rgba(237,171,46,.16), rgba(232,130,30,.1)); border: 1px solid rgba(237,171,46,.4); animation: orRise .4s ease; }
.oc-or__perk--vip { background: #1c6b4f; border: 1px solid rgba(237,171,46,.35); }
.oc-or__perk-icon { width: 46px; height: 46px; flex: none; border-radius: 12px; background: linear-gradient(135deg,#edab2e,#e8821e); display: flex; align-items: center; justify-content: center; font-size: 22px; }
.oc-or__perk-icon--vip { background: rgba(237,171,46,.22); border: 1px solid rgba(237,171,46,.4); }
.oc-or__perk-text { flex: 1; }
.oc-or__perk-title { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 15px; color: #23463a; }
.oc-or__perk-title--gold { color: #edab2e; }
.oc-or__perk-desc { font-size: 12.5px; color: #5a5240; margin-top: 2px; }
.oc-or__perk-desc--light { color: #cfe6d8; }

/* what's next */
.oc-or__next { margin-top: 24px; }
.oc-or__next-title { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 16px; color: #1c6b4f; margin-bottom: 12px; }
.oc-or__next-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.oc-or__nextcard { background: #f3ecda; border: 1px solid #e0d2ab; border-radius: 14px; padding: 16px; }
.oc-or__next-icon { font-size: 20px; }
.oc-or__next-h { font-size: 13px; font-weight: 600; color: #23463a; margin-top: 8px; }
.oc-or__next-d { font-size: 11.5px; color: #7a7158; line-height: 1.45; margin-top: 3px; }

/* actions */
.oc-or__actions { display: flex; gap: 12px; margin-top: 26px; flex-wrap: wrap; }
.oc-or__btn { flex: 1; min-width: 180px; text-align: center; text-decoration: none; padding: 15px; border-radius: 13px; font-family: 'Syne', sans-serif; font-weight: 700; font-size: 14.5px; }
.oc-or__btn--green, .oc-or__btn--pay,
a.oc-or__btn--green, a.oc-or__btn--pay { background: #1c6b4f; color: #fff !important; }
.oc-or__btn--gold, a.oc-or__btn--gold { background: #edab2e; color: #231a06 !important; }
.oc-or__help { margin-top: 22px; text-align: center; font-size: 12px; color: #7a7158; }
.oc-or__help a { color: #1c6b4f; font-weight: 600; text-decoration: none; }

@media (max-width: 640px) {
	.oc-or__meta { grid-template-columns: 1fr 1fr; }
	.oc-or__twoup { grid-template-columns: 1fr; }
	.oc-or__next-grid { grid-template-columns: 1fr; }
}

/* ===== Login / Register — OCnians - Login.dc.html ===== */
@keyframes lgRise { from { transform: translateY(14px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }

.oc-lg { padding: 24px 0 40px; }
.oc-lg__card { background: #f3ecda; border: 1px solid #ddcfa8; border-radius: 20px; overflow: hidden;
	box-shadow: 0 12px 40px rgba(120,90,40,.12); display: grid; grid-template-columns: 1.05fr .95fr; }

/* Left: branded panel */
.oc-lg__aside { position: relative; overflow: hidden; padding: 46px 44px; display: flex; flex-direction: column;
	background: radial-gradient(120% 100% at 80% 0%, #1c5e46 0%, #0f3d2c 60%, #0b2c20 100%); }
.oc-lg__aside-glow { position: absolute; inset: 0; background: radial-gradient(70% 60% at 85% 15%, rgba(237,171,46,.18), transparent 60%); pointer-events: none; }
.oc-lg__aside-num { position: absolute; right: -40px; bottom: -50px; font-family: 'Syne', sans-serif; font-weight: 800; font-size: 280px; color: rgba(237,171,46,.06); line-height: .7; user-select: none; }
.oc-lg__aside-body { position: relative; flex: 1; }
.oc-lg__aside-badge { display: inline-flex; align-items: center; gap: 7px; padding: 6px 13px; border-radius: 999px; background: rgba(237,171,46,.16); border: 1px solid rgba(237,171,46,.4); font-size: 10px; letter-spacing: .18em; color: #edc97a; text-transform: uppercase; }
.oc-lg__aside-title { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 30px; line-height: 1.08; color: #f3efe2; margin: 18px 0 0; }
.oc-lg__aside-desc { font-size: 14px; line-height: 1.55; color: #a9c4b4; margin: 12px 0 0; max-width: 340px; }
.oc-lg__perks { list-style: none; margin: 28px 0 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.oc-lg__perk { display: flex; align-items: center; gap: 13px; }
.oc-lg__perk-icon { width: 38px; height: 38px; flex: none; border-radius: 11px; background: rgba(255,255,255,.06); border: 1px solid rgba(237,171,46,.28); display: flex; align-items: center; justify-content: center; font-size: 18px; }
.oc-lg__perk-info { display: flex; flex-direction: column; gap: 1px; }
.oc-lg__perk-title { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 14px; color: #f3efe2; }
.oc-lg__perk-desc { font-size: 11.5px; color: #7fae93; }
.oc-lg__aside-foot { position: relative; margin-top: 32px; padding-top: 20px; display: flex; align-items: center; gap: 10px; font-size: 11px; color: #7fae93; }
.oc-lg__aside-dot { width: 4px; height: 4px; border-radius: 50%; background: #3e6b56; flex: none; }

/* Right: auth panel */
.oc-lg__auth { padding: 42px 44px 46px; display: flex; flex-direction: column; background: #f3ecda; }
.oc-lg__auth-eyebrow { font-size: 10px; letter-spacing: .26em; color: #c98a1e; text-transform: uppercase; }
.oc-lg__auth-title { font-family: 'Syne', sans-serif; font-weight: 800; font-size: clamp(28px,4vw,42px); line-height: 1.04; color: #1c6b4f; margin: 10px 0 0; }
.oc-lg__auth-sub { font-size: 14px; line-height: 1.5; color: #6b5836; margin: 10px 0 0; max-width: 330px; }

/* Tabs */
.oc-lg__tabs { display: flex; gap: 5px; padding: 5px; margin: 26px 0 0; background: #e7dcc0; border-radius: 12px; }
.oc-lg__tab { flex: 1; padding: 11px; border-radius: 9px; border: none; cursor: pointer; font-family: 'Space Grotesk', sans-serif; font-size: 13.5px; font-weight: 700; transition: .15s; background: transparent; color: #8a7f63; }
.oc-lg__tab.is-active { background: #fff; color: #1c6b4f; box-shadow: 0 2px 6px rgba(120,90,40,.14); }

/* Form panel */
.oc-lg__panel { margin-top: 16px; background: #f6eed9; border: 1px solid #ddcfa8; border-radius: 16px; padding: 24px 22px; animation: lgRise .25s ease; }
.oc-lg__panel.is-hidden { display: none; }

/* Fields */
.oc-lg__field { display: flex; flex-direction: column; gap: 7px; margin-bottom: 16px; }
.oc-lg__field label { font-size: 12.5px; font-weight: 600; color: #5a5240; }
.oc-lg__req { color: #c0392b; }
.oc-lg__in, .oc-lg input[type="text"], .oc-lg input[type="email"], .oc-lg input[type="password"] {
	width: 100%; padding: 13px 14px; border-radius: 10px; border: 1px solid #d3c49a;
	background: #fbf6e9; font-family: 'Space Grotesk', sans-serif; font-size: 14px; color: #2c281d; outline: none; transition: .15s; }
.oc-lg__in:focus, .oc-lg input[type="text"]:focus, .oc-lg input[type="email"]:focus, .oc-lg input[type="password"]:focus {
	border-color: #1c6b4f; box-shadow: 0 0 0 3px rgba(28,107,79,.14); }
.oc-lg__in::placeholder { color: #a99e7e; }

/* Password show/hide */
.oc-lg__pw-wrap { position: relative; }
.oc-lg__pw-wrap .oc-lg__in { padding-right: 44px; }
.oc-lg__pw-toggle { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; border: none; background: none; cursor: pointer; font-size: 15px; color: #7a6f52; }

/* Remember / submit row */
.oc-lg__row { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 4px; }
.oc-lg__remember { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #5a5240; cursor: pointer; }
.oc-lg__remember input { width: 16px; height: 16px; accent-color: #1c6b4f; }

/* Buttons */
.oc-lg__submit { padding: 12px 26px; border: none; border-radius: 10px; font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 14px; cursor: pointer; transition: .15s; }
.oc-lg__submit--gold { background: linear-gradient(135deg,#edab2e,#e8821e); color: #231a06; box-shadow: 0 4px 12px rgba(232,130,30,.28); }
.oc-lg__submit--gold:hover { box-shadow: 0 6px 18px rgba(232,130,30,.4); transform: translateY(-1px); }
.oc-lg__submit--green { width: 100%; padding: 13px; background: #1c6b4f; color: #fff; }
.oc-lg__submit--green:hover { background: #195f46; }

/* Misc */
.oc-lg__lost { display: inline-block; margin-top: 12px; font-size: 13px; font-weight: 600; color: #1c6b4f; text-decoration: none; }
.oc-lg__lost:hover { text-decoration: underline; }
.oc-lg__note { font-size: 12.5px; color: #7a7158; line-height: 1.5; margin: 0 0 16px; }
.oc-lg__terms { font-size: 11.5px; color: #8a7f63; line-height: 1.5; margin: 0 0 16px; }
.oc-lg__link { color: #1c6b4f; font-weight: 600; text-decoration: none; }
.oc-lg__link:hover { text-decoration: underline; }

/* VIP callout */
.oc-lg__vip { text-decoration: none; margin-top: 16px; display: flex; align-items: center; gap: 15px; padding: 18px 20px; border-radius: 16px;
	background: linear-gradient(135deg,#1c6b4f,#0f3d2c); border: 1px solid rgba(237,171,46,.35); transition: .15s; }
.oc-lg__vip:hover { border-color: rgba(237,171,46,.6); }
.oc-lg__vip-icon { width: 44px; height: 44px; flex: none; border-radius: 12px; background: linear-gradient(135deg,#edab2e,#e8821e); display: flex; align-items: center; justify-content: center; font-size: 20px; color: #231a06; }
.oc-lg__vip-text { flex: 1; display: flex; flex-direction: column; gap: 3px; }
.oc-lg__vip-text strong { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 15px; color: #f3efe2; }
.oc-lg__vip-text span { font-size: 12px; color: #a9c4b4; }
.oc-lg__vip-arrow { flex: none; color: #edc97a; font-size: 20px; }

/* Responsive */
@media (max-width: 840px) {
	.oc-lg__card { grid-template-columns: 1fr; }
	.oc-lg__aside { display: none; }
	.oc-lg__auth { padding: 32px 24px 36px; }
}

/* ===== Native contact form — OCnians - Contact.dc.html ===== */
.oc-cf { display: flex; flex-direction: column; gap: 16px; }
.oc-cf__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.oc-cf__title { margin: 0; font-family: 'Syne', sans-serif; font-weight: 700; font-size: 20px; color: #23463a; }
.oc-cf__error { padding: 12px 14px; border-radius: 11px; background: #fcebe7; border: 1px solid #e3a99c; color: #9a3a28; font-size: 13px; }
.oc-cf__row { display: flex; gap: 14px; }
.oc-cf__row .oc-cf__field { flex: 1; }
.oc-cf__field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.oc-cf__label { font-size: 11.5px; font-weight: 600; letter-spacing: .04em; color: #5a5240; text-transform: uppercase; }
.oc-cf__in { width: 100%; box-sizing: border-box; padding: 13px 14px; border-radius: 11px; border: 1px solid #d3c49a; background: #fbf6e9;
	font-family: 'Space Grotesk', sans-serif; font-size: 14px; color: #2c281d; outline: none; }
.oc-cf__in:focus { border-color: #1c6b4f; box-shadow: 0 0 0 3px rgba(28,107,79,.14); }
.oc-cf__in::placeholder { color: #a99e7e; }
.oc-cf__textarea { resize: vertical; min-height: 130px; line-height: 1.5; }
/* topic chips (radio) */
.oc-cf__chips { display: flex; gap: 8px; flex-wrap: wrap; }
.oc-cf__chip { position: relative; cursor: pointer; }
.oc-cf__chip input { position: absolute; opacity: 0; width: 0; height: 0; }
.oc-cf__chip span { display: inline-block; padding: 9px 14px; border-radius: 999px; font-family: 'Space Grotesk', sans-serif; font-size: 12.5px; font-weight: 600;
	background: #fbf6e9; color: #5a5240; border: 1px solid #d3c49a; transition: .15s; }
.oc-cf__chip input:checked + span { background: #1c6b4f; color: #fff; border-color: #1c6b4f; }
.oc-cf__chip input:focus-visible + span { box-shadow: 0 0 0 3px rgba(28,107,79,.18); }
/* submit */
.oc-cf__submit { align-self: flex-start; margin-top: 2px; padding: 15px 28px; border: none; border-radius: 14px; cursor: pointer;
	background: linear-gradient(135deg,#edab2e,#e8821e); color: #231a06; font-family: 'Syne', sans-serif; font-weight: 800; font-size: 15px; box-shadow: 0 8px 26px rgba(232,130,30,.32); }
.oc-cf__fine { font-size: 11px; color: #8a7e5e; }
.oc-cf__fine a { color: #1c6b4f; font-weight: 600; text-decoration: none; }
/* success state */
.oc-cf__success { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 14px; padding: 26px 10px; }
.oc-cf__success-check { width: 70px; height: 70px; border-radius: 50%; background: linear-gradient(135deg,#1c6b4f,#3e9b63); display: flex; align-items: center; justify-content: center; font-size: 32px; color: #fff; box-shadow: 0 0 34px rgba(28,107,79,.32); }
.oc-cf__success-title { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 24px; color: #1c6b4f; }
.oc-cf__success-text { font-size: 14px; color: #5a5240; line-height: 1.55; max-width: 340px; }
.oc-cf__success-again { margin-top: 4px; padding: 12px 22px; border-radius: 12px; border: 1px solid #d3c49a; background: transparent; color: #5a5240; font-family: 'Space Grotesk', sans-serif; font-weight: 600; font-size: 13.5px; text-decoration: none; }
@media (max-width: 480px) { .oc-cf__row { flex-direction: column; } }

/* ===== Community popup ===== */
@keyframes commIn  { from { opacity: 0; transform: translateY(22px) scale(.96); } to { opacity: 1; transform: none; } }
@keyframes commOut { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(12px) scale(.97); } }

.oc-comm { position: fixed; inset: 0; z-index: 9000; display: flex; align-items: center; justify-content: center;
	background: rgba(6,10,8,.55); backdrop-filter: blur(6px); opacity: 0; transition: opacity .28s ease; padding: 20px; }
.oc-comm.is-open { opacity: 1; }

.oc-comm__card { position: relative; width: 100%; max-width: 360px; border-radius: 24px; overflow: hidden; text-align: center;
	background: linear-gradient(160deg,#163022 0%,#0e2018 100%);
	border: 1px solid rgba(237,171,46,.28);
	box-shadow: 0 24px 60px rgba(0,0,0,.55), 0 0 0 1px rgba(237,171,46,.1);
	padding: 32px 28px 28px;
	animation: commIn .32s cubic-bezier(.22,.68,0,1.2) both; }
.oc-comm.is-open .oc-comm__card { animation: commIn .32s cubic-bezier(.22,.68,0,1.2) both; }

.oc-comm__close { position: absolute; top: 12px; right: 12px; width: 32px; height: 32px; border-radius: 50%;
	border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.06); color: #cfe6d8;
	font-size: 13px; cursor: pointer; display: flex; align-items: center; justify-content: center;
	transition: .15s; line-height: 1; }
.oc-comm__close:hover { background: rgba(237,171,46,.18); border-color: rgba(237,171,46,.4); color: #edab2e; }

.oc-comm__qr-wrap { display: inline-flex; padding: 12px; border-radius: 16px; background: #fff; margin-bottom: 20px;
	box-shadow: 0 8px 24px rgba(0,0,0,.3); }
.oc-comm__qr { display: block; width: 180px; height: 180px; object-fit: contain; border-radius: 8px; }

.oc-comm__title { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 22px; color: #f3efe2; margin: 0 0 10px; line-height: 1.1; }
.oc-comm__body  { font-size: 13.5px; color: #a9c4b4; line-height: 1.55; margin: 0 0 22px; }

.oc-comm__btn { display: inline-block; padding: 13px 30px; border-radius: 12px; text-decoration: none; font-weight: 700;
	font-family: 'Space Grotesk', sans-serif; font-size: 14.5px;
	background: linear-gradient(135deg,#edab2e,#e8821e); color: #231a06;
	box-shadow: 0 6px 20px rgba(232,130,30,.35); transition: .15s; }
.oc-comm__btn:hover { box-shadow: 0 8px 28px rgba(232,130,30,.5); transform: translateY(-1px); }

@media (max-width: 400px) {
	.oc-comm__card { padding: 28px 18px 22px; }
	.oc-comm__qr { width: 150px; height: 150px; }
}
/* community popup — bottom sheet on phones */
@media (max-width: 520px) {
	.oc-comm { align-items: flex-end; padding: 0; }
	.oc-comm__card { max-width: 100%; border-radius: 24px 24px 0 0; padding: 28px 22px 32px; animation: none; }
}

/* ===== Mobile responsive — global sweep ===== */

/* --- Site header: tighten inner padding on very small phones --- */
@media (max-width: 380px) {
	.oc-header__inner { padding: 0 12px; }
}

/* --- OC App inner header: hide brand text + controls, show burger on mobile --- */
@media (max-width: 640px) {
	.oc-app__header { padding: 10px 14px; gap: 0; justify-content: space-between; }
	/* hide name/tagline — logo only */
	.oc-brand__text { display: none; }
	/* hide desktop controls */
	.oc-app__controls { display: none; }
	/* show burger */
	.oc-app__burger { display: flex; }
	/* chips still visible below */
	.oc-chips { padding: 2px 12px 10px; gap: 6px; }
	.oc-chip { padding: 7px 11px; font-size: 12px; }
}
@media (max-width: 380px) {
	.oc-app__header { padding: 8px 10px; }
}

/* --- Spot card: QR community row on narrow cards --- */
@media (max-width: 420px) {
	.oc-community { flex-direction: column; align-items: flex-start; gap: 10px; }
	.oc-community__qr { width: 80px; height: 80px; }
}

/* --- Intro splash: tighten spacing on mobile --- */
@media (max-width: 640px) {
	.oc-intro__hero { margin: 10px 10px 0; border-radius: 16px; min-height: 180px; }
	.oc-intro__hero-title { font-size: 22px; }
	.oc-intro__body { padding: 8px 16px 20px; gap: 10px; }
	.oc-intro__headline { font-size: 22px; }
	.oc-intro__copy { font-size: 12.5px; }
	.oc-intro__cta { padding: 13px 22px; font-size: 14px; }
}

/* --- Footer: tighten gap on tablet so 3 cols fit comfortably --- */
@media (max-width: 900px) {
	.oc-footer__inner { gap: 20px; }
	.oc-footer__cols { gap: 28px; }
}
/* --- Footer: center everything on mobile --- */
@media (max-width: 640px) {
	.oc-footer { padding: 28px 0 20px; }
	.oc-footer__inner {
		flex-direction: column;
		align-items: center;
		gap: 24px;
		padding: 0 20px;
		text-align: center;
	}
	.oc-footer__brand { flex-direction: column; align-items: center; gap: 8px; }
	.oc-footer__brand-text { align-items: center; }
	.oc-footer__cols {
		flex-direction: column;
		align-items: center;
		gap: 20px;
		width: 100%;
	}
	.oc-footer__col {
		align-items: center;
		min-width: 0;
	}
	.oc-footer__bottom {
		flex-direction: column;
		align-items: center;
		gap: 6px;
		padding: 12px 20px 0;
		text-align: center;
	}
	.oc-footer__bottom span { font-size: 10.5px; }
}
/* --- Footer: tighten padding on very small phones --- */
@media (max-width: 400px) {
	.oc-footer__inner { padding: 0 14px; }
	.oc-footer__bottom { padding: 12px 14px 0; }
}

/* --- Legal / info pages --- */
@media (max-width: 640px) {
	.oc-main--legal { padding: 24px 14px 48px; }
	.oc-paper__head { padding: 20px 18px 16px; }
	.oc-paper__title { font-size: 26px; }
	.oc-paper__body { padding: 18px; font-size: 14px; }
	.oc-paper__foot { padding: 14px 18px 20px; }
}

/* --- 404 page --- */
@media (max-width: 480px) {
	.oc-404__actions { flex-direction: column; align-items: stretch; }
	.oc-404__btn { text-align: center; }
	.oc-404__search { flex-direction: column; }
}

/* --- Contact page --- */
@media (max-width: 640px) {
	.oc-cthero { padding: 22px 0 18px; }
	.oc-cthero__inner { padding: 0 16px; }
	.oc-ctbody__inner { padding: 18px 16px 36px; }
	.oc-ctform { padding: 18px 16px; }
}

/* --- Account page: tighter on small screens --- */
@media (max-width: 480px) {
	.oc-acc-wrap { padding: 12px 12px 24px; }
	.oc-acc-wrap .woocommerce-MyAccount-navigation { padding: 10px; }
	.oc-acc-wrap .woocommerce-MyAccount-content { padding: 18px 14px 36px; }
}

/* --- Login page: extra-small phones --- */
@media (max-width: 480px) {
	.oc-lg { padding: 12px 0 20px; }
	.oc-lg__auth { padding: 24px 16px 26px; }
	.oc-lg__auth-title { font-size: 28px; }
	.oc-lg__panel { padding: 18px 14px; }
	.oc-lg__row { flex-direction: column; align-items: stretch; }
	.oc-lg__submit--gold { text-align: center; }
	.oc-lg__vip { gap: 11px; padding: 14px 16px; }
	.oc-lg__vip-text strong { font-size: 13.5px; }
}

/* --- VIP card overlay on tiny screens --- */
@media (max-width: 400px) {
	.oc-overlay--vip { padding: 10px; }
	.oc-vip-card { width: 100%; }
	.oc-vip__title { font-size: 28px; }
}