/* ============================================================
   Options Calculators — component layer
   Tokens come from theme.json (var(--wp--preset--*)).
   Organised: 1 utilities 2 header 3 buttons 4 hero 5 sections
   6 directory 7 cards 8 steps 9 stats 10 carousels 11 faq
   12 calculator widget 13 tables 14 forms/CF7 15 prose
   16 footer 17 motion 18 responsive
   ============================================================ */

/* ---------- 1. Utilities / primitives ---------- */
.oc-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent-bright);
}
.oc-eyebrow::before {
	content: "";
	width: 1.75rem;
	height: 1px;
	background: linear-gradient(90deg, var(--wp--preset--color--accent), transparent);
}
.oc-eyebrow.is-blue { color: var(--wp--preset--color--primary-bright); }
.oc-eyebrow.is-blue::before { background: linear-gradient(90deg, var(--wp--preset--color--primary-bright), transparent); }

.oc-mono { font-family: var(--wp--preset--font-family--mono); font-variant-numeric: tabular-nums; }
.oc-gain { color: var(--wp--preset--color--gain) !important; }
.oc-loss { color: var(--wp--preset--color--loss) !important; }

/* Tag / pill */
.oc-pill {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.3rem 0.7rem;
	border-radius: 999px;
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	line-height: 1;
	border: 1px solid var(--wp--preset--color--border);
	background: rgba(91,131,242,0.10);
	color: var(--wp--preset--color--contrast-2);
}
.oc-pill.is-green { background: rgba(33,216,106,0.12); color: var(--wp--preset--color--accent-bright); border-color: rgba(33,216,106,0.25); }
.oc-pill.is-blue { background: rgba(91,131,242,0.12); color: var(--wp--preset--color--primary-bright); border-color: rgba(91,131,242,0.28); }
.oc-pill.is-red { background: rgba(255,107,94,0.12); color: var(--wp--preset--color--loss-bright); border-color: rgba(255,107,94,0.28); }

/* Hairline divider */
.oc-hairline { height: 1px; border: 0; background: linear-gradient(90deg, transparent, var(--wp--preset--color--border-strong) 50%, transparent); }

/* Soft grid backdrop for dark sections */
.oc-grid-bg { position: relative; isolation: isolate; }
.oc-grid-bg::before {
	content: "";
	position: absolute; inset: 0; z-index: -1;
	background-image:
		linear-gradient(rgba(91,131,242,0.06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(91,131,242,0.06) 1px, transparent 1px);
	background-size: 56px 56px;
	-webkit-mask-image: radial-gradient(120% 90% at 50% 0%, #000 0%, transparent 72%);
	        mask-image: radial-gradient(120% 90% at 50% 0%, #000 0%, transparent 72%);
}

/* ---------- 2. Header (sticky + condense) ---------- */
.oc-header {
	position: sticky;
	top: 0;
	z-index: 50;
	transition: background-color .3s var(--oc-ease), backdrop-filter .3s var(--oc-ease), box-shadow .3s var(--oc-ease), padding .3s var(--oc-ease);
	background: rgba(7,11,22,0.72);
	-webkit-backdrop-filter: saturate(160%) blur(14px);
	        backdrop-filter: saturate(160%) blur(14px);
	border-bottom: 1px solid transparent;
}
.oc-header.is-stuck {
	background: rgba(7,11,22,0.92);
	border-bottom-color: var(--wp--preset--color--border);
	box-shadow: 0 10px 30px rgba(2,6,18,0.45);
}
/* condense the inner padding when stuck */
.oc-header .oc-header-inner { transition: padding .3s var(--oc-ease); }
.oc-header.is-stuck .oc-header-inner { padding-top: .5rem !important; padding-bottom: .5rem !important; }

.oc-header .wp-block-site-logo img { transition: height .3s var(--oc-ease); height: 40px; width: auto; }
.oc-header.is-stuck .wp-block-site-logo img { height: 34px; }

/* Brand wordmark (two-tone) */
.oc-wordmark { font-family: var(--wp--preset--font-family--display); font-weight:700; font-size:1.3rem; letter-spacing:-0.02em; color: var(--wp--preset--color--white); text-decoration:none; white-space:nowrap; line-height:1; }
.oc-wordmark span { color: var(--wp--preset--color--contrast-muted); font-weight:600; }
.oc-wordmark:hover { color: var(--wp--preset--color--white); }
@media (max-width:520px){ .oc-wordmark span { display:none; } }

/* Nav links */
.oc-nav .wp-block-navigation-item__content { font-weight: 500; color: var(--wp--preset--color--contrast-2); padding-block: .4rem; }
.oc-nav .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--contrast); }
.oc-nav .current-menu-item > .wp-block-navigation-item__content,
.oc-nav .wp-block-navigation-item.current-menu-item .wp-block-navigation-item__content { color: var(--wp--preset--color--accent-bright); }

/* Submenu toggle (click-to-open) — match the nav links */
.oc-nav .wp-block-navigation-submenu__toggle,
.oc-nav button.wp-block-navigation-item__content {
	color: var(--wp--preset--color--contrast-2); font-weight: 500; cursor: pointer;
	background: transparent; border: 0; padding-block: .4rem;
}
.oc-nav .wp-block-navigation-submenu__toggle:hover { color: var(--wp--preset--color--contrast); }
.oc-nav .wp-block-navigation__submenu-icon { margin-left: .25rem; }

/* Submenu (dropdown panel) */
.oc-nav .wp-block-navigation__submenu-container {
	background: var(--wp--preset--color--surface-2);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 14px;
	box-shadow: 0 20px 50px rgba(2,6,18,0.6);
	padding: .4rem;
	margin-top: .25rem;
	min-width: 248px;
}
.oc-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	border-radius: 8px; padding: .6rem .85rem; color: var(--wp--preset--color--contrast-2); width: 100%;
}
.oc-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	background: var(--wp--preset--color--surface-3); color: var(--wp--preset--color--contrast);
}

/* ---------- 3. Buttons ---------- */
.wp-block-button__link {
	transition: transform .18s var(--oc-ease), box-shadow .18s var(--oc-ease), background-color .18s var(--oc-ease), color .18s var(--oc-ease);
	will-change: transform;
	box-shadow: 0 6px 18px rgba(33,216,106,0.22);
	cursor: pointer;
}
.wp-block-button__link:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(33,216,106,0.34); }
.wp-block-button__link:active { transform: translateY(0); }

/* Secondary / outline variation */
.wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-button.oc-btn-secondary .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--contrast);
	border: 1px solid var(--wp--preset--color--border-strong);
	box-shadow: none;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.oc-btn-secondary .wp-block-button__link:hover {
	background: rgba(91,131,242,0.10);
	border-color: var(--wp--preset--color--primary-bright);
	color: var(--wp--preset--color--white);
	transform: translateY(-2px);
	box-shadow: 0 10px 26px rgba(91,131,242,0.25);
}

/* Ghost variation */
.wp-block-button.oc-btn-ghost .wp-block-button__link {
	background: transparent; color: var(--wp--preset--color--contrast-2);
	box-shadow: none; padding-inline: .6rem;
}
.wp-block-button.oc-btn-ghost .wp-block-button__link:hover { color: var(--wp--preset--color--accent-bright); transform: none; }

.wp-block-button.is-style-outline .wp-block-button__link::after { content: none; }

/* ---------- 4. Hero ---------- */
.oc-hero { position: relative; overflow: clip; }
.oc-hero__visual {
	position: relative;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--xl, 22px);
	background:
		radial-gradient(120% 120% at 80% 0%, rgba(33,216,106,0.10), transparent 55%),
		linear-gradient(160deg, #16213A 0%, #0B1222 100%);
	box-shadow: 0 30px 70px rgba(2,6,18,0.6);
	overflow: hidden;
}
.oc-hero__visual svg { display: block; width: 100%; height: auto; }

/* small floating data chips inside hero visual */
.oc-chip {
	position: absolute;
	display: inline-flex; align-items: center; gap: .45rem;
	padding: .5rem .75rem;
	background: rgba(11,18,34,0.9);
	border: 1px solid var(--wp--preset--color--border-strong);
	border-radius: 12px;
	font-family: var(--wp--preset--font-family--mono);
	font-size: .8rem; font-weight: 500;
	box-shadow: 0 12px 30px rgba(2,6,18,0.5);
	backdrop-filter: blur(6px);
}
.oc-chip .dot { width: .5rem; height: .5rem; border-radius: 999px; }
.oc-chip .dot.up { background: var(--wp--preset--color--accent); box-shadow: 0 0 10px var(--wp--preset--color--accent); }
.oc-chip .dot.down { background: var(--wp--preset--color--loss); box-shadow: 0 0 10px var(--wp--preset--color--loss); }

/* trust row */
.oc-trustrow { display:flex; flex-wrap:wrap; align-items:center; gap: 1.25rem 2rem; opacity:.85; }
.oc-trustrow span { font-family: var(--wp--preset--font-family--mono); font-size:.8rem; letter-spacing:.06em; color: var(--wp--preset--color--contrast-muted); text-transform: uppercase; }

/* ---------- 5. Section helpers ---------- */
.oc-section { position: relative; }
.oc-section.is-surface { background: var(--wp--preset--color--surface); }
.oc-section.is-surface-2 { background: var(--wp--preset--color--surface-2); }
.oc-card-grid { display: grid; gap: 1.25rem; }

/* ---------- 6. Calculator directory ---------- */
.oc-dir { display: grid; gap: 2.5rem; }
.oc-dir__group-head { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; margin-bottom: 1.1rem; }
.oc-dir__group-head h3 { margin:0; font-size: var(--wp--preset--font-size--x-large); }
.oc-dir__count { font-family: var(--wp--preset--font-family--mono); font-size:.8rem; color: var(--wp--preset--color--contrast-muted); }
.oc-tiles { display:grid; grid-template-columns: repeat(auto-fill, minmax(264px, 1fr)); gap: 1.25rem; align-items: stretch; }

.oc-tile {
	display:flex; flex-direction:column; gap:.5rem;
	padding: 1.3rem 1.35rem 1.4rem;
	background: var(--wp--preset--color--surface-2);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 16px;
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
	position: relative;
	transition: transform .2s var(--oc-ease), border-color .2s var(--oc-ease), box-shadow .2s var(--oc-ease), background .2s var(--oc-ease);
}
.oc-tile:hover {
	transform: translateY(-3px);
	border-color: var(--wp--preset--color--primary-bright);
	box-shadow: 0 18px 40px rgba(2,6,18,0.5), 0 0 0 1px rgba(91,131,242,0.25);
}
.oc-tile:hover .oc-tile__icon { background: rgba(33,216,106,0.16); border-color: rgba(33,216,106,0.4); }
.oc-tile__icon {
	width: 42px; height: 42px; border-radius: 11px;
	display:grid; place-items:center;
	background: rgba(91,131,242,0.12);
	border: 1px solid rgba(91,131,242,0.28);
	color: var(--wp--preset--color--primary-bright);
	transition: background .2s var(--oc-ease), border-color .2s var(--oc-ease), color .2s var(--oc-ease);
}
.oc-tile:hover .oc-tile__icon { color: var(--wp--preset--color--accent-bright); }
.oc-tile__icon svg { width: 22px; height: 22px; }
/* ticker-style abbreviation badge (replaces repeated icons) */
.oc-tile__abbr {
	width: 48px; height: 48px; border-radius: 12px;
	display:grid; place-items:center;
	background: rgba(91,131,242,0.12);
	border: 1px solid rgba(91,131,242,0.28);
	color: var(--wp--preset--color--primary-bright);
	font-family: var(--wp--preset--font-family--mono);
	font-weight: 600; font-size: .82rem; letter-spacing: .01em; line-height: 1;
	transition: background .2s var(--oc-ease), border-color .2s var(--oc-ease), color .2s var(--oc-ease);
}
.oc-tile:hover .oc-tile__abbr { background: rgba(33,216,106,0.16); border-color: rgba(33,216,106,0.4); color: var(--wp--preset--color--accent-bright); }
.oc-tile__title { font-family: var(--wp--preset--font-family--display); font-weight:600; font-size: 1.06rem; line-height:1.25; margin:0; }
.oc-tile__desc { font-size:.9rem; color: var(--wp--preset--color--contrast-muted); line-height:1.5; margin:0; }
.oc-tile__cta { margin-top:auto; font-family: var(--wp--preset--font-family--mono); font-size:.78rem; letter-spacing:.04em; color: var(--wp--preset--color--accent-bright); display:inline-flex; align-items:center; gap:.35rem; }
.oc-tile__cta svg { width: 14px; height:14px; transition: transform .2s var(--oc-ease); }
.oc-tile:hover .oc-tile__cta svg { transform: translateX(3px); }

/* ---------- 7. Feature / value cards ---------- */
.oc-feature {
	padding: 1.6rem;
	background: linear-gradient(160deg, #131D33 0%, #0D1525 100%);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 18px;
	height: 100%;
	transition: transform .2s var(--oc-ease), border-color .2s var(--oc-ease);
}
.oc-feature:hover { transform: translateY(-3px); border-color: var(--wp--preset--color--border-strong); }
.oc-feature__icon {
	width: 48px; height:48px; border-radius: 13px; display:grid; place-items:center;
	margin-bottom: 1rem;
	background: radial-gradient(120% 120% at 30% 20%, rgba(33,216,106,0.22), rgba(91,131,242,0.12));
	border: 1px solid var(--wp--preset--color--border-strong);
	color: var(--wp--preset--color--accent-bright);
}
.oc-feature__icon svg { width: 24px; height:24px; }
.oc-feature h3 { font-size: 1.2rem; margin:.2rem 0 .5rem; }
.oc-feature p { color: var(--wp--preset--color--contrast-muted); margin:0; font-size:.97rem; line-height:1.6; }

/* ---------- 8. How it works steps ---------- */
.oc-steps { counter-reset: step; display:grid; gap:1.1rem; }
.oc-step { position:relative; padding: 1.4rem 1.4rem 1.4rem 4.4rem; background: var(--wp--preset--color--surface-2); border:1px solid var(--wp--preset--color--border); border-radius:16px; }
.oc-step::before {
	counter-increment: step; content: counter(step,decimal-leading-zero);
	position:absolute; left:1.25rem; top:1.3rem;
	font-family: var(--wp--preset--font-family--mono); font-weight:500; font-size:1.05rem;
	color: var(--wp--preset--color--ink);
	width:2.1rem; height:2.1rem; border-radius:10px; display:grid; place-items:center;
	background: var(--wp--preset--color--accent);
	box-shadow: 0 6px 16px rgba(33,216,106,0.3);
}
.oc-step h3 { margin:0 0 .3rem; font-size:1.12rem; }
.oc-step p { margin:0; color: var(--wp--preset--color--contrast-muted); font-size:.95rem; }

/* ---------- 9. Stats band ---------- */
.oc-stats { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap:1.5rem; }
.oc-stat { text-align:center; padding: 1rem; }
.oc-stat__num { font-family: var(--wp--preset--font-family--display); font-weight:700; font-size: clamp(2.2rem,4vw,3.2rem); line-height:1; letter-spacing:-0.02em; }
.oc-stat__num .unit { color: var(--wp--preset--color--accent-bright); }
.oc-stat__label { margin-top:.5rem; font-size:.92rem; color: var(--wp--preset--color--contrast-muted); }

/* ---------- 10. Carousels (scroll-snap, no autoplay) ---------- */
.oc-carousel { position: relative; }
.oc-track {
	display: flex; gap: 1.25rem;
	overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scroll-padding-left: clamp(1.25rem,5vw,2.5rem);
	-ms-overflow-style: none; scrollbar-width: none;
	align-items: stretch;
}
.oc-track::-webkit-scrollbar { width: 0; height: 0; display: none; }
.oc-track > * { scroll-snap-align: start; flex: 0 0 clamp(290px, 33%, 380px); }
.oc-controls { display:flex; gap:.5rem; }
.oc-arrow {
	width:44px; height:44px; border-radius:999px; display:grid; place-items:center; cursor:pointer;
	background: var(--wp--preset--color--surface-2); border:1px solid var(--wp--preset--color--border-strong); color: var(--wp--preset--color--contrast);
	transition: background .18s var(--oc-ease), border-color .18s var(--oc-ease), transform .18s var(--oc-ease);
}
.oc-arrow:hover { background: var(--wp--preset--color--surface-3); border-color: var(--wp--preset--color--primary-bright); transform: translateY(-1px); }
.oc-arrow[disabled] { opacity:.35; cursor:not-allowed; }
.oc-arrow svg { width:20px; height:20px; }

/* Testimonial card */
.oc-quote {
	display:flex; flex-direction:column; gap:1rem;
	padding:1.6rem; background: linear-gradient(160deg,#131D33,#0D1525);
	border:1px solid var(--wp--preset--color--border); border-radius:18px;
}
.oc-quote__stars { color: var(--wp--preset--color--accent); display:flex; gap:.15rem; }
.oc-quote__stars svg { width:18px; height:18px; }
.oc-quote p { margin:0; color: var(--wp--preset--color--contrast-2); font-size:1.02rem; line-height:1.6; }
.oc-quote__who { display:flex; align-items:center; gap:.8rem; margin-top:auto; padding-top:.6rem; border-top:1px solid var(--wp--preset--color--border); }
.oc-quote__avatar { flex:none; width:44px; height:44px; border-radius:999px; background: radial-gradient(120% 120% at 30% 20%, rgba(91,131,242,0.35), var(--wp--preset--color--surface-3)); border:1px solid var(--wp--preset--color--border-strong); display:grid; place-items:center; font-family:var(--wp--preset--font-family--display); font-weight:700; font-size:1.05rem; color: var(--wp--preset--color--white); }
.oc-quote__meta { display:flex; flex-direction:column; line-height:1.35; }
.oc-quote__name { font-weight:600; font-size:.95rem; color: var(--wp--preset--color--contrast); }
.oc-quote__role { font-size:.82rem; color: var(--wp--preset--color--contrast-muted); }

/* Blog carousel card (also used by Query Loop) */
.oc-postcard {
	display:flex; flex-direction:column; overflow:hidden;
	background: var(--wp--preset--color--surface-2);
	border:1px solid var(--wp--preset--color--border); border-radius:16px;
	transition: transform .2s var(--oc-ease), border-color .2s var(--oc-ease), box-shadow .2s var(--oc-ease);
}
.oc-postcard:hover { transform:translateY(-3px); border-color: var(--wp--preset--color--border-strong); box-shadow:0 16px 38px rgba(2,6,18,0.5); }
.oc-postcard .wp-block-post-featured-image { margin:0; }
.oc-postcard .wp-block-post-featured-image img { aspect-ratio: 16/9; object-fit: cover; width:100%; border-radius:0; }
.oc-postcard .wp-block-post-title { font-size:1.1rem; line-height:1.25; margin:.2rem 0 .4rem; }
.oc-postcard .wp-block-post-title a { color: var(--wp--preset--color--contrast); }
.oc-postcard .wp-block-post-title a:hover { color: var(--wp--preset--color--accent-bright); }

/* When a Query Loop is set to the carousel layout */
.oc-query-carousel .wp-block-post-template {
	display:flex !important; gap:1.25rem;
	overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory;
	scroll-padding-left: clamp(1.25rem,5vw,2.5rem);
	scrollbar-width:none; -ms-overflow-style:none;
	align-items: stretch;
}
.oc-query-carousel .wp-block-post-template::-webkit-scrollbar { width:0; height:0; display:none; }
.oc-query-carousel .wp-block-post-template > li { scroll-snap-align:start; flex:0 0 clamp(290px, 33%, 380px); }

/* ---------- 11. FAQ accordion ---------- */
.oc-faq { display:grid; gap:.75rem; }
.oc-faq details {
	background: var(--wp--preset--color--surface-2);
	border:1px solid var(--wp--preset--color--border); border-radius:14px;
	overflow:hidden; transition: border-color .2s var(--oc-ease);
}
.oc-faq details[open] { border-color: var(--wp--preset--color--border-strong); }
.oc-faq summary {
	list-style:none; cursor:pointer; padding:1.1rem 1.3rem;
	display:flex; align-items:center; justify-content:space-between; gap:1rem;
	font-family: var(--wp--preset--font-family--display); font-weight:600; font-size:1.05rem; color: var(--wp--preset--color--contrast);
}
.oc-faq summary::-webkit-details-marker { display:none; }
.oc-faq summary::after {
	content:""; flex:none; width:20px; height:20px;
	background: currentColor; color: var(--wp--preset--color--accent-bright);
	-webkit-mask:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 5a1 1 0 0 1 1 1v5h5a1 1 0 1 1 0 2h-5v5a1 1 0 1 1-2 0v-5H6a1 1 0 1 1 0-2h5V6a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
	        mask:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M12 5a1 1 0 0 1 1 1v5h5a1 1 0 1 1 0 2h-5v5a1 1 0 1 1-2 0v-5H6a1 1 0 1 1 0-2h5V6a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
	transition: transform .2s var(--oc-ease);
}
.oc-faq details[open] summary::after { transform: rotate(45deg); }
.oc-faq .oc-faq__a { padding: 0 1.3rem 1.2rem; color: var(--wp--preset--color--contrast-muted); line-height:1.65; }
.oc-faq .oc-faq__a p { margin:0 0 .6rem; }
/* native core/details block inside an .oc-faq wrapper */
.oc-faq .wp-block-details { padding: 0; }
.oc-faq .wp-block-details > summary { padding: 1.1rem 1.3rem; }
.oc-faq .wp-block-details > :not(summary) { margin: 0; padding: 0 1.3rem 1.2rem; color: var(--wp--preset--color--contrast-muted); line-height: 1.65; }

/* ---------- 12. Calculator widget wrapper (enterprise-calc-engine [entcalc]) ---------- */
.oc-calc-shell {
	background: linear-gradient(160deg,#101A2E,#0A1322);
	border:1px solid var(--wp--preset--color--border);
	border-radius:20px;
	padding: clamp(1rem, 3vw, 1.75rem);
	box-shadow: 0 24px 60px rgba(2,6,18,0.5);
}
/* Make any plugin-rendered calculator inherit the dark system gracefully */
.oc-calc-shell .entcalc,
.entcalc {
	--ec-bg: var(--wp--preset--color--surface-2);
	--ec-accent: var(--wp--preset--color--accent);
	--ec-text: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--contrast);
	font-family: var(--wp--preset--font-family--body);
}
.entcalc input, .entcalc select, .entcalc textarea {
	background: var(--wp--preset--color--surface); color: var(--wp--preset--color--contrast);
	border:1px solid var(--wp--preset--color--border-strong); border-radius:10px;
}
.entcalc input:focus, .entcalc select:focus { outline:3px solid var(--wp--preset--color--accent-bright); outline-offset:2px; }
.entcalc .ec-result, .entcalc [class*="result"] { font-family: var(--wp--preset--font-family--mono); font-variant-numeric: tabular-nums; }

/* ---------- 13. Tables / payoff ---------- */
.wp-block-table table, .oc-table table { border-collapse: collapse; width:100%; }
.wp-block-table th, .oc-table th {
	background: var(--wp--preset--color--surface-3); color: var(--wp--preset--color--contrast);
	font-family: var(--wp--preset--font-family--body); font-weight:600; text-align:left;
	padding:.7rem .9rem; border-bottom:1px solid var(--wp--preset--color--border-strong);
	font-size:.9rem; letter-spacing:.01em;
}
.wp-block-table td, .oc-table td {
	padding:.65rem .9rem; border-bottom:1px solid var(--wp--preset--color--border);
	font-family: var(--wp--preset--font-family--mono); font-size:.9rem; font-variant-numeric: tabular-nums;
	color: var(--wp--preset--color--contrast-2);
}
.wp-block-table tbody tr:nth-child(odd) td, .oc-table tbody tr:nth-child(odd) td { background: rgba(91,131,242,0.035); }
.wp-block-table figcaption { color: var(--wp--preset--color--contrast-muted); }

/* ---------- 14. Forms / Contact Form 7 ---------- */
.oc-form-card {
	background: linear-gradient(160deg,#121C30,#0B1322);
	border:1px solid var(--wp--preset--color--border);
	border-radius:20px; padding: clamp(1.5rem,4vw,2.5rem);
	box-shadow:0 24px 60px rgba(2,6,18,0.5);
}
.wpcf7 label { display:block; font-weight:600; font-size:.92rem; margin-bottom:.4rem; color: var(--wp--preset--color--contrast); }
.wpcf7-form p { margin: 0 0 1.1rem; }
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="url"],
.wpcf7-form input[type="number"],
.wpcf7-form select,
.wpcf7-form textarea {
	width:100%; box-sizing:border-box;
	background: var(--wp--preset--color--surface); color: var(--wp--preset--color--contrast);
	border:1px solid var(--wp--preset--color--border-strong); border-radius:10px;
	padding:.8rem .9rem; font-size:1rem; font-family: var(--wp--preset--font-family--body);
	min-height:48px; transition: border-color .18s var(--oc-ease), box-shadow .18s var(--oc-ease);
}
.wpcf7-form textarea { min-height:140px; resize:vertical; }
.wpcf7-form ::placeholder { color: var(--wp--preset--color--contrast-muted); }
.wpcf7-form input:focus, .wpcf7-form select:focus, .wpcf7-form textarea:focus {
	outline:none; border-color: var(--wp--preset--color--accent); box-shadow: 0 0 0 3px rgba(33,216,106,0.25);
}
.wpcf7-form input[type="submit"] {
	background: var(--wp--preset--color--accent); color: var(--wp--preset--color--ink);
	border:0; border-radius:10px; font-weight:600; font-size:1rem; cursor:pointer;
	padding:.9rem 1.8rem; min-height:48px;
	box-shadow:0 8px 22px rgba(33,216,106,0.28); transition: transform .18s var(--oc-ease), box-shadow .18s var(--oc-ease), background .18s var(--oc-ease);
}
.wpcf7-form input[type="submit"]:hover { background: var(--wp--preset--color--accent-bright); transform: translateY(-2px); box-shadow:0 12px 30px rgba(33,216,106,0.4); }
.wpcf7 .wpcf7-spinner { background-color: var(--wp--preset--color--surface-3); }
.wpcf7-not-valid-tip { color: var(--wp--preset--color--loss-bright); font-size:.85rem; }
.wpcf7-response-output {
	border-radius:10px; border-width:1px !important; padding:.9rem 1.1rem !important; margin:.5rem 0 0 !important;
	font-size:.92rem; color: var(--wp--preset--color--contrast);
}
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output { border-color: var(--wp--preset--color--loss) !important; background: rgba(255,107,94,0.08); }
.wpcf7 form.sent .wpcf7-response-output { border-color: var(--wp--preset--color--accent) !important; background: rgba(33,216,106,0.08); }
.wpcf7-form .wpcf7-list-item { margin-left:0; }

/* contact info list */
.oc-contact-list { list-style:none; margin:0; padding:0; display:grid; gap:1.1rem; }
.oc-contact-list li { display:flex; gap:.9rem; align-items:flex-start; }
.oc-contact-list .ico { flex:none; width:42px; height:42px; border-radius:11px; display:grid; place-items:center; background: rgba(91,131,242,0.12); border:1px solid rgba(91,131,242,0.28); color: var(--wp--preset--color--primary-bright); }
.oc-contact-list .ico svg { width:20px; height:20px; }
.oc-contact-list .lbl { font-size:.8rem; text-transform:uppercase; letter-spacing:.08em; color: var(--wp--preset--color--contrast-muted); }
.oc-contact-list .val { font-weight:500; color: var(--wp--preset--color--contrast); }

/* ---------- 15. Prose (single / page content) ---------- */
.oc-prose { font-size: 1.0625rem; line-height: 1.75; color: var(--wp--preset--color--contrast-2); }
.oc-prose > * + * { margin-top: 1.3rem; }
.oc-prose h2 { margin-top: 2.6rem; }
.oc-prose h3 { margin-top: 2rem; }
.oc-prose a { color: var(--wp--preset--color--primary-bright); text-underline-offset:3px; text-decoration: underline; text-decoration-color: rgba(91,131,242,.4); }
.oc-prose a:hover { color: var(--wp--preset--color--accent-bright); text-decoration-color: currentColor; }
.oc-prose img, .oc-prose figure img { border-radius:14px; border:1px solid var(--wp--preset--color--border); }
.oc-prose figcaption { color: var(--wp--preset--color--contrast-muted); font-size:.88rem; text-align:center; }
.oc-prose blockquote { margin-inline:0; padding:.5rem 0 .5rem 1.3rem; border-left:3px solid var(--wp--preset--color--accent); color: var(--wp--preset--color--contrast); }
.oc-prose ul, .oc-prose ol { padding-left:1.3rem; }
.oc-prose li { margin:.4rem 0; }
.oc-prose li::marker { color: var(--wp--preset--color--primary-bright); }

/* breadcrumbs */
.oc-breadcrumbs { font-size:.85rem; color: var(--wp--preset--color--contrast-muted); font-family: var(--wp--preset--font-family--mono); }
.oc-breadcrumbs a { color: var(--wp--preset--color--contrast-muted); text-decoration:none; }
.oc-breadcrumbs a:hover { color: var(--wp--preset--color--accent-bright); }
.oc-breadcrumbs .sep { opacity:.5; margin:0 .4rem; }

/* author / meta */
.oc-postmeta { display:flex; flex-wrap:wrap; gap:1rem; align-items:center; color: var(--wp--preset--color--contrast-muted); font-size:.9rem; }
.oc-postmeta .wp-block-post-date, .oc-postmeta .wp-block-post-terms { color: var(--wp--preset--color--contrast-muted); }

/* ---------- 16. Footer ---------- */
.oc-footer { background: var(--wp--preset--color--surface); border-top:1px solid var(--wp--preset--color--border); }
.oc-footer a { color: var(--wp--preset--color--contrast-muted); text-decoration:none; }
.oc-footer a:hover { color: var(--wp--preset--color--accent-bright); }
.oc-footer h4 { font-family: var(--wp--preset--font-family--body); font-size:.8rem; text-transform:uppercase; letter-spacing:.1em; color: var(--wp--preset--color--contrast-muted); margin:0 0 1rem; }
.oc-footer ul { list-style:none; margin:0; padding:0; display:grid; gap:.6rem; }
.oc-footer .oc-foot-bottom { border-top:1px solid var(--wp--preset--color--border); color: var(--wp--preset--color--contrast-muted); font-size:.85rem; }
.oc-footer .oc-disclaimer { color: var(--wp--preset--color--contrast-muted); font-size:.82rem; line-height:1.6; }

/* ---------- 17. Motion: scroll reveal ---------- */
.oc-reveal { opacity:0; transform: translateY(18px); transition: opacity .6s var(--oc-ease), transform .6s var(--oc-ease); will-change: opacity, transform; }
.oc-reveal.is-in { opacity:1; transform:none; }
.oc-reveal.d1 { transition-delay:.07s; } .oc-reveal.d2 { transition-delay:.14s; }
.oc-reveal.d3 { transition-delay:.21s; } .oc-reveal.d4 { transition-delay:.28s; }
@media (prefers-reduced-motion: reduce) {
	.oc-reveal { opacity:1 !important; transform:none !important; transition:none !important; }
}

/* ---------- 18. Responsive ---------- */
@media (max-width: 1024px) {
	.oc-track > *, .oc-query-carousel .wp-block-post-template > li { flex-basis: 60%; }
}
@media (max-width: 781px) {
	.oc-tiles { grid-template-columns: repeat(auto-fill, minmax(100%, 1fr)); }
	.oc-header .oc-header-inner { padding-top:.6rem !important; padding-bottom:.6rem !important; }
	.oc-track > *, .oc-query-carousel .wp-block-post-template > li { flex-basis: 86%; }
}

/* Mobile nav: the core Navigation block handles the overlay; theme its panel */
.wp-block-navigation__responsive-container.is-menu-open {
	background: rgba(7,11,22,0.98) !important;
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size:1.15rem; }