/*Theme Name: Versantus AITheme URI: https://versantus.aiAuthor: VersantusAuthor URI: https://versantus.co.ukDescription: A modern, dark-mode-first theme inspired by the Versantus.ai website. Bold typography, gradient accents, and a tech-forward aesthetic.Version: 1.0.0Requires at least: 6.0Tested up to: 6.7Requires PHP: 8.0License: GNU General Public License v2 or laterLicense URI: https://www.gnu.org/licenses/gpl-2.0.htmlText Domain: versantus-aiTags: dark-mode, one-column, custom-menu, custom-logo, featured-images, block-styles*//* ========================================================================== CSS Custom Properties ========================================================================== */:root { --color-raspberry: #F0146E; --color-raspberry-text: #FF4D8D; --color-gunmetal: #20212C; --color-eggplant: #310B37; --color-amethyst: #A445B2; --color-yellow: #FFB800; --color-white: #ffffff; --color-grey: #F4F4F4; --color-neutral-50: #f9fafb; --color-neutral-100: #f3f4f6; --color-neutral-200: #e5e7eb; --color-neutral-300: #d1d5db; --color-neutral-400: #9ca3af; --color-neutral-500: #6b7280; --color-neutral-600: #4b5563; --color-neutral-700: #374151; --color-neutral-800: #1f2937; --color-neutral-900: #111827; --gradient-primary: linear-gradient(135deg, #FF4D8D 0%, #B86CCC 100%); --gradient-bg: linear-gradient(125deg, #300A4F 1%, #1F202B 100%); --shadow-soft: 0 4px 20px rgba(0, 0, 0, 0.08); --shadow-lg: 0 10px 40px rgba(0, 0, 0, 0.15); --max-width: 1280px; --header-height: 80px; --tertiary-height: 32px; --font-heading: 'Outfit', 'Outfit Fallback', sans-serif; --font-body: 'Open Sans', 'Open Sans Fallback', sans-serif; --bg-primary: var(--color-white); --bg-secondary: var(--color-neutral-50); --bg-card: var(--color-white); --text-primary: var(--color-gunmetal); --text-secondary: var(--color-neutral-600); --text-muted: var(--color-neutral-500); --border-color: var(--color-neutral-200);}.dark-mode { --bg-primary: var(--color-gunmetal); --bg-secondary: var(--color-neutral-900); --bg-card: var(--color-gunmetal); --text-primary: var(--color-white); --text-secondary: var(--color-neutral-300); --text-muted: var(--color-neutral-400); --border-color: var(--color-neutral-700);}/* ========================================================================== Reset & Base ========================================================================== */*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0;}html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}body { font-family: var(--font-body); background-color: var(--bg-primary); color: var(--text-primary); line-height: 1.6; overflow-x: clip;}h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); font-weight: 700; line-height: 1.2;}a { color: inherit; text-decoration: none;}img { max-width: 100%; height: auto; display: block;}/* ========================================================================== Utility Classes ========================================================================== */.container { max-width: var(--max-width); margin: 0 auto; padding: 0 1.5rem;}.gradient-text { background: var(--gradient-primary); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;}.gradient-bg { background: var(--gradient-primary);}.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;}/* ========================================================================== Buttons ========================================================================== */.btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; font-family: var(--font-heading); font-weight: 600; border: none; cursor: pointer; transition: all 0.2s ease; text-decoration: none; line-height: 1;}.btn-primary { background: var(--color-raspberry); color: var(--color-white); padding: 0.75rem 1.5rem; border-radius: 0.5rem; font-size: 0.9375rem;}.btn-primary:hover { background: #d41263;}.btn-lg { padding: 1rem 2rem; font-size: 1.0625rem; border-radius: 0.5rem;}.btn-pill { border-radius: 9999px;}.btn-gradient { background: var(--gradient-primary); color: var(--color-white); padding: 0.875rem 2rem; border-radius: 9999px; font-size: 1rem;}.btn-gradient:hover { opacity: 0.9; transform: translateY(-1px); box-shadow: 0 4px 15px rgba(240, 20, 110, 0.4);}.btn-outline { background: transparent; color: var(--color-white); padding: 0.875rem 2rem; border-radius: 0.5rem; border: 2px solid var(--color-white); font-size: 1rem;}.btn-outline:hover { background: var(--color-raspberry); color: var(--color-white); border-color: var(--color-raspberry);}.btn-white { background: var(--color-white); color: var(--color-gunmetal); padding: 1rem 2rem; border-radius: 0.5rem; font-size: 1rem;}.btn-white:hover { background: var(--color-neutral-100);}/* ========================================================================== Header / Navigation ========================================================================== */.site-header { position: fixed; top: 0; left: 0; right: 0; z-index: 100;}.main-nav { background: rgba(255,255,255,0.92); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid rgba(0,0,0,0.06); height: var(--header-height); display: flex; align-items: center;}.dark-mode .main-nav { background: rgba(32, 33, 44, 0.92); border-bottom: 1px solid rgba(255,255,255,0.06);}.nav-inner { display: flex; justify-content: space-between; align-items: center; width: 100%;}.site-logo svg { height: 2rem; width: auto; display: block;}.site-logo .logo-text { fill: var(--text-primary);}.site-logo .logo-accent { fill: var(--color-raspberry);}.nav-links { display: none; list-style: none; align-items: center; gap: 2rem;}.nav-links a { font-family: var(--font-heading); font-size: 0.9375rem; color: var(--text-secondary); transition: color 0.2s ease; position: relative; padding: 0.5rem 0;}.nav-links a:hover,.nav-links a.active { color: var(--color-raspberry);}.nav-links a.active::after { content: ''; position: absolute; bottom: -2px; left: 0; right: 0; height: 2px; background: var(--color-raspberry); box-shadow: 0 2px 8px rgba(240, 20, 110, 0.3);}.nav-right { display: none; align-items: center; gap: 1rem;}.nav-cta { font-size: 0.875rem !important; padding: 0.6rem 1.4rem !important;}.theme-toggle { background: none; border: 1px solid rgba(255,255,255,0.15); border-radius: 9999px; width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; cursor: pointer; color: var(--text-secondary); transition: all 0.2s;}.theme-toggle:hover { border-color: var(--color-raspberry); color: var(--color-raspberry);}.theme-toggle { border-color: rgba(0,0,0,0.15);}.theme-toggle .icon-sun { display: block; }.theme-toggle .icon-moon { display: none; }.dark-mode .theme-toggle { border-color: rgba(255,255,255,0.15); }.dark-mode .theme-toggle .icon-sun { display: none; }.dark-mode .theme-toggle .icon-moon { display: block; }@media (min-width: 1024px) { .nav-links { display: flex; } .nav-right { display: flex; } .mobile-toggle { display: none !important; }}.mobile-toggle { display: flex; align-items: center; background: none; border: none; color: var(--text-primary); cursor: pointer; padding: 0.5rem;}.hamburger { width: 24px; height: 24px; position: relative; cursor: pointer; display: flex; align-items: center; justify-content: center;}.hamburger span { display: block; width: 24px; height: 2px; background: var(--text-primary); transition: all 0.3s ease;}.hamburger span::before,.hamburger span::after { content: ''; position: absolute; width: 24px; height: 2px; background: var(--text-primary); transition: all 0.3s ease;}.hamburger span::before { top: 6px; }.hamburger span::after { bottom: 6px; }.mobile-menu { display: none; position: absolute; top: var(--header-height); left: 0; right: 0; background: var(--bg-primary); border-bottom: 1px solid var(--border-color); box-shadow: var(--shadow-lg); padding: 1.5rem;}.mobile-menu.is-open { display: block;}.mobile-menu a { display: flex; align-items: center; gap: 0.75rem; font-family: var(--font-heading); font-size: 1rem; font-weight: 500; color: var(--text-primary); padding: 0.75rem 0; transition: color 0.2s;}.mobile-menu a:hover { color: var(--color-raspberry);}.mobile-menu .btn-primary { width: 100%; margin-top: 1rem; justify-content: center;}.mobile-menu-footer { margin-top: auto; padding-top: 1.5rem; border-top: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; gap: 1rem;}.mobile-theme-toggle .toggle-label { margin-left: 0.5rem; font-size: 0.875rem; color: var(--text-muted);}.theme-toggle { background: none; border: none; color: var(--text-muted); cursor: pointer; padding: 0.25rem; display: flex; align-items: center; font-size: 1.125rem; transition: color 0.2s;}.theme-toggle:hover { color: var(--text-primary);}/* ========================================================================== Hero Section ========================================================================== */.hero { position: relative; min-height: 500px; display: flex; align-items: center; overflow: hidden; margin-top: 0; padding-top: var(--header-height);}.hero-bg { position: absolute; inset: 0; z-index: 0; background: var(--gradient-bg);}.hero-bg::before,.hero-bg::after { content: ''; position: absolute; border-radius: 50%; filter: blur(80px); opacity: 0.6; animation: floatBlob 8s ease-in-out infinite;}.hero-bg::before { width: 500px; height: 500px; background: radial-gradient(circle, #DA0063 0%, transparent 70%); top: -10%; left: 20%;}.hero-bg::after { width: 600px; height: 600px; background: radial-gradient(circle, #6E2991 0%, transparent 70%); bottom: -20%; right: 10%; animation-delay: -4s; animation-direction: reverse;}@keyframes floatBlob { 0%, 100% { transform: translate(0, 0) scale(1); } 33% { transform: translate(30px, -30px) scale(1.05); } 66% { transform: translate(-20px, 20px) scale(0.95); }}.hero-content { position: relative; z-index: 1; text-align: center; padding: 4rem 0; width: 100%;}.hero-eyebrow { font-family: var(--font-heading); font-size: 0.875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.1em; color: var(--color-raspberry); margin-bottom: 1rem;}.hero h1 { font-size: clamp(2.5rem, 6vw, 3.75rem); color: var(--color-white); margin-bottom: 1.5rem;}.hero .typewriter-line { display: block; color: var(--color-raspberry); min-height: 1.2em;}.hero-description { font-size: 1.25rem; color: var(--color-neutral-300); max-width: 48rem; margin: 0 auto 2rem; font-family: var(--font-body);}.hero-buttons { display: flex; flex-direction: column; gap: 1rem; justify-content: center; align-items: center;}@media (min-width: 640px) { .hero-buttons { flex-direction: row; }}.typed-cursor { color: var(--color-white); font-weight: 400; font-family: var(--font-heading); animation: blink 1s infinite;}@keyframes blink { 0%, 100% { opacity: 1; } 50% { opacity: 0; }}/* ========================================================================== Sections ========================================================================== */.section { padding: 6rem 0;}.section-sm { padding: 3rem 0; }.section-md { padding: 4rem 0; }.section-xl { padding: 8rem 0; }.section-white { background: var(--bg-primary);}.section-gray { background: var(--bg-secondary);}.section-dark { background: var(--color-neutral-900); color: var(--color-white);}.section-gradient { background: var(--gradient-primary); color: var(--color-white);}.section-header { text-align: center; margin-bottom: 4rem;}.section-header h2 { font-size: clamp(2rem, 4vw, 2.5rem); margin-bottom: 1.5rem;}.section-header p { font-size: 1.25rem; color: var(--text-secondary); max-width: 48rem; margin: 0 auto;}/* ========================================================================== Features Grid ========================================================================== */.features-grid { display: grid; grid-template-columns: 1fr; gap: 2rem;}@media (min-width: 768px) { .features-grid { grid-template-columns: repeat(2, 1fr); }}@media (min-width: 1024px) { .features-grid { grid-template-columns: repeat(3, 1fr); }}.feature-card { text-align: center; background: var(--bg-card); border-radius: 0.75rem; padding: 2rem; box-shadow: var(--shadow-soft); transition: box-shadow 0.3s ease, transform 0.3s ease; border: 1px solid var(--border-color);}.feature-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-2px);}.feature-icon { width: 4rem; height: 4rem; background: rgba(240, 20, 110, 0.1); border-radius: 1rem; display: flex; align-items: center; justify-content: center; margin: 0 auto 1.5rem;}.feature-icon svg { width: 2rem; height: 2rem; color: var(--color-raspberry);}.feature-card h3 { font-size: 1.25rem; margin-bottom: 1rem;}.feature-card p { color: var(--text-secondary);}/* ========================================================================== CTA Section ========================================================================== */.cta-section { text-align: center; padding: 6rem 0;}.cta-section.gradient { background: var(--gradient-primary);}.cta-section h2 { font-size: clamp(1.75rem, 4vw, 2.5rem); color: var(--color-white); margin-bottom: 1.5rem;}.cta-section p { font-size: 1.25rem; color: rgba(255,255,255,0.85); max-width: 36rem; margin: 0 auto 2rem;}.cta-section .btn-outline { color: #ffffff; border-color: #ffffff;}.cta-section .btn-outline:hover { background: #ffffff; color: var(--color-raspberry); border-color: #ffffff;}/* ========================================================================== Cards (generic) ========================================================================== */.card { display: block; text-decoration: none; color: inherit; background: var(--bg-card); border: 1px solid var(--border-color); border-radius: 0.75rem; overflow: hidden; transition: box-shadow 0.3s ease, transform 0.3s ease;}.card:hover { box-shadow: var(--shadow-lg); transform: translateY(-2px);}.card-image { aspect-ratio: 16/9; overflow: hidden;}.card-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease;}.card:hover .card-image img { transform: scale(1.05);}.card-body { padding: 1.5rem;}.card-body h3 { font-size: 1.25rem; margin-bottom: 0.75rem;}.card-body p { color: var(--text-secondary); margin-bottom: 1rem;}.card-meta { font-size: 0.875rem; color: var(--text-muted); font-family: var(--font-heading);}.card-overlay { border: none; background: none;}.card-overlay .card-link { display: block; text-decoration: none; color: inherit;}.card-overlay .card-image { position: relative; aspect-ratio: 4/3; border-radius: 0.75rem; overflow: hidden;}.card-overlay .card-placeholder { width: 100%; height: 100%; background: linear-gradient(135deg, var(--color-gunmetal), var(--color-eggplant));}.card-overlay .card-gradient { position: absolute; inset: 0; background: linear-gradient( to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.4) 40%, rgba(0,0,0,0.05) 100% ); z-index: 1; transition: background 0.3s ease;}.card-overlay:hover .card-gradient { background: linear-gradient( to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.5) 50%, rgba(0,0,0,0.1) 100% );}.card-overlay .card-overlay-content { position: absolute; bottom: 0; left: 0; right: 0; padding: 1.5rem; z-index: 2; color: #ffffff;}.card-overlay .card-overlay-content h3 { font-family: var(--font-heading); font-size: 1.2rem; font-weight: 700; line-height: 1.3; color: #ffffff; margin: 0;}.card-overlay .card-meta { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.5rem; color: rgba(255,255,255,0.75); font-size: 0.8rem;}.card-overlay .card-tag { background: var(--color-raspberry); color: #ffffff; padding: 0.15rem 0.6rem; border-radius: 9999px; font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.03em;}/* ========================================================================== Footer ========================================================================== */.site-footer { background: var(--color-neutral-900); color: var(--color-white); padding: 4rem 0 0;}.footer-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; padding-bottom: 3rem;}@media (min-width: 768px) { .footer-grid { grid-template-columns: 2fr 1fr 1fr 1fr; }}.footer-brand p { color: var(--color-neutral-400); margin-top: 1.5rem; font-size: 0.9375rem;}.footer-brand .site-logo { margin-bottom: 1rem;}.footer-col h3 { font-size: 1rem; font-weight: 600; margin-bottom: 1rem;}.footer-col ul { list-style: none;}.footer-col ul li { margin-bottom: 0.5rem;}.footer-col ul a { color: var(--color-neutral-400); font-size: 0.9375rem; transition: color 0.2s;}.footer-col ul a:hover { color: var(--color-white);}.footer-bottom { border-top: 1px solid var(--color-neutral-700); padding: 2rem 0; text-align: center;}.footer-bottom p { color: var(--color-neutral-400); font-size: 0.875rem;}.footer-bottom p + p { color: var(--color-neutral-500); margin-top: 0.75rem;}/* ========================================================================== Content / Prose / Gutenberg ========================================================================== */.entry-content { max-width: 48rem; margin: 0 auto; padding: 0 1.5rem;}.entry-content h1 { font-size: 2.25rem; margin: 2rem 0 1rem; }.entry-content h2 { font-size: 1.75rem; margin: 1.75rem 0 0.75rem; }.entry-content h3 { font-size: 1.375rem; margin: 1.5rem 0 0.5rem; }.entry-content h4 { font-size: 1.125rem; margin: 1.25rem 0 0.5rem; }.entry-content p { margin: 1rem 0; line-height: 1.7;}.entry-content ul,.entry-content ol { margin: 1rem 0; padding-left: 1.5rem;}.entry-content li { margin-bottom: 0.25rem;}.entry-content a { color: var(--color-raspberry); text-decoration: underline; text-decoration-color: rgba(240, 20, 110, 0.3); text-underline-offset: 2px; transition: text-decoration-color 0.2s;}.entry-content a:hover { text-decoration-color: var(--color-raspberry);}.entry-content blockquote { border-left: 4px solid var(--color-raspberry); padding-left: 1rem; margin: 1.5rem 0; font-style: italic; color: var(--text-secondary);}.entry-content code { background: var(--bg-secondary); padding: 0.15rem 0.4rem; border-radius: 0.25rem; font-size: 0.875rem;}.entry-content pre { background: var(--color-neutral-800); color: var(--color-white); padding: 1rem; border-radius: 0.5rem; overflow-x: auto; margin: 1rem 0;}.entry-content pre code { background: transparent; padding: 0; color: inherit;}.entry-content img { border-radius: 0.5rem; margin: 1.5rem 0;}.entry-content table { width: 100%; border-collapse: collapse; margin: 1rem 0;}.entry-content th,.entry-content td { border: 1px solid var(--border-color); padding: 0.5rem 1rem; text-align: left;}.entry-content th { background: var(--bg-secondary); font-family: var(--font-heading); font-weight: 600;}/* ========================================================================== Gutenberg Block Styles ========================================================================== */.wp-block-group { max-width: var(--max-width); margin: 0 auto; padding: 0 1.5rem;}.wp-block-columns { display: flex; flex-wrap: wrap; gap: 2rem;}.wp-block-column { flex: 1; min-width: 250px;}.wp-block-button .wp-block-button__link { font-family: var(--font-heading); font-weight: 600; padding: 0.75rem 1.5rem; border-radius: 0.5rem; transition: all 0.2s ease;}.wp-block-button.is-style-fill .wp-block-button__link { background: var(--color-raspberry); color: var(--color-white);}.wp-block-button.is-style-fill .wp-block-button__link:hover { background: #d41263;}.wp-block-button.is-style-outline .wp-block-button__link { border: 2px solid var(--color-raspberry); color: var(--color-raspberry); background: transparent;}.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--color-raspberry); color: var(--color-white);}.wp-block-separator { border: none; border-top: 1px solid var(--border-color); margin: 2rem 0;}.wp-block-image img { border-radius: 0.5rem;}.wp-block-quote { border-left: 4px solid var(--color-raspberry); padding-left: 1rem; margin: 1.5rem 0;}.wp-block-cover { border-radius: 0.75rem; overflow: hidden;}.alignwide { max-width: 1100px; margin-left: auto; margin-right: auto;}.alignfull { max-width: none; margin-left: calc(-50vw + 50%); margin-right: calc(-50vw + 50%); width: 100vw;}/* ========================================================================== Page Templates ========================================================================== */.page-header { padding: calc(var(--header-height, 80px) + 4rem) 0 2rem; margin-top: 0;}.page-header h1 { font-size: clamp(2rem, 4vw, 3rem);}.single-post .entry-header { text-align: center; padding: 4rem 0 2rem; margin-top: 0; padding-top: var(--header-height);}.single-post .entry-header h1 { font-size: clamp(2rem, 5vw, 3rem); max-width: 48rem; margin: 0 auto 1rem;}.single-post .entry-meta { color: var(--text-muted); font-family: var(--font-heading); font-size: 0.9375rem;}.single-post .featured-image { max-width: 48rem; margin: 2rem auto; border-radius: 0.75rem; overflow: hidden;}.single-post .featured-image img { width: 100%; height: auto;}.archive-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; padding: 2rem 0;}@media (min-width: 768px) { .archive-grid { grid-template-columns: repeat(2, 1fr); }}@media (min-width: 1024px) { .archive-grid { grid-template-columns: repeat(3, 1fr); }}.pagination { display: flex; justify-content: center; gap: 0.5rem; padding: 3rem 0;}.pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; border-radius: 0.5rem; font-family: var(--font-heading); font-weight: 600; font-size: 0.875rem; color: var(--text-secondary); transition: all 0.2s; border: 1px solid var(--border-color);}.pagination .page-numbers.current,.pagination .page-numbers:hover { background: var(--color-raspberry); color: var(--color-white); border-color: var(--color-raspberry);}/* ========================================================================== WordPress Specific ========================================================================== */.wp-caption { max-width: 100%;}.wp-caption-text { font-size: 0.875rem; color: var(--text-muted); text-align: center; margin-top: 0.5rem;}.sticky .card { border-color: var(--color-raspberry);}.bypostauthor .card { border-left: 3px solid var(--color-raspberry);}.comments-area { max-width: 48rem; margin: 3rem auto; padding: 0 1.5rem;}.comment-list { list-style: none; padding: 0;}.comment-body { padding: 1.5rem; margin-bottom: 1rem; background: var(--bg-card); border: 1px solid var(--border-color); border-radius: 0.75rem;}.comment-meta { font-family: var(--font-heading); font-size: 0.875rem; color: var(--text-muted); margin-bottom: 0.75rem;}.comment-author { font-weight: 600; color: var(--text-primary);}.comment-respond input[type="text"],.comment-respond input[type="email"],.comment-respond input[type="url"],.comment-respond textarea { width: 100%; padding: 0.75rem 1rem; border: 1px solid var(--border-color); border-radius: 0.5rem; background: var(--bg-card); color: var(--text-primary); font-family: var(--font-body); font-size: 1rem; margin-bottom: 1rem; transition: border-color 0.2s;}.comment-respond input:focus,.comment-respond textarea:focus { outline: none; border-color: var(--color-raspberry);}.comment-respond .submit { background: var(--color-raspberry); color: var(--color-white); font-family: var(--font-heading); font-weight: 600; padding: 0.75rem 1.5rem; border: none; border-radius: 0.5rem; cursor: pointer; transition: background 0.2s;}.comment-respond .submit:hover { background: #d41263;}/* ========================================================================== 404 ========================================================================== */.error-404 { text-align: center; padding: 8rem 0; margin-top: 0; padding-top: var(--header-height);}.error-404 h1 { font-size: 6rem; background: var(--gradient-primary); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;}.error-404 p { font-size: 1.25rem; color: var(--text-secondary); margin: 1rem 0 2rem;}/* ========================================================================== Responsive ========================================================================== */@media (max-width: 767px) { .section { padding: 3rem 0; } .hero { min-height: 400px; } .hero h1 { font-size: 2rem; } .hero-description { font-size: 1rem; } .footer-grid { gap: 1.5rem; }}/* ========================================================================== Widget Areas ========================================================================== */.widget { margin-bottom: 2rem;}.widget-title { font-family: var(--font-heading); font-size: 1.125rem; font-weight: 600; margin-bottom: 1rem; padding-bottom: 0.5rem; border-bottom: 2px solid var(--color-raspberry);}.widget ul { list-style: none; padding: 0;}.widget ul li { padding: 0.375rem 0;}.widget ul a { color: var(--text-secondary); transition: color 0.2s;}.widget ul a:hover { color: var(--color-raspberry);}/* ========================================================================== Search ========================================================================== */.search-form { display: flex; gap: 0.5rem;}.search-form .search-field { flex: 1; padding: 0.75rem 1rem; border: 1px solid var(--border-color); border-radius: 0.5rem; background: var(--bg-card); color: var(--text-primary); font-family: var(--font-body);}.search-form .search-submit { background: var(--color-raspberry); color: var(--color-white); border: none; padding: 0.75rem 1.25rem; border-radius: 0.5rem; font-family: var(--font-heading); font-weight: 600; cursor: pointer;}/* ========================================================================== Stats Grid ========================================================================== */.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 2rem; text-align: center;}.stat-item,.stat { padding: 1rem;}.stat-value { display: block; font-family: var(--font-heading); font-size: 2rem; font-weight: 700; background: var(--gradient-primary); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;}.stat-label { display: block; font-size: 0.9375rem; color: var(--text-secondary); margin-top: 0.25rem;}/* ========================================================================== Approach Steps ========================================================================== */.approach-steps { max-width: 40rem; margin: 0 auto;}.approach-step { display: flex; gap: 1.5rem; padding: 1.5rem 0; border-bottom: 1px solid var(--border-color);}.approach-step:last-child { border-bottom: none;}.step-number { width: 3rem; height: 3rem; border-radius: 50%; background: var(--gradient-primary); color: var(--color-white); display: flex; align-items: center; justify-content: center; font-family: var(--font-heading); font-weight: 700; font-size: 1.125rem; flex-shrink: 0;}.step-content h3 { font-size: 1.125rem; margin-bottom: 0.5rem;}.step-content p { color: var(--text-secondary); line-height: 1.6;}/* ========================================================================== People Grid ========================================================================== */.people-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 1.5rem;}.people-grid--leadership { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));}.person-card { text-align: center; padding: 1.5rem 1rem; background: var(--bg-card); border: 1px solid var(--border-color); border-radius: 0.75rem; transition: transform 0.2s, box-shadow 0.2s;}.person-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg);}.person-avatar { width: 4rem; height: 4rem; border-radius: 50%; background: var(--gradient-primary); color: var(--color-white); display: flex; align-items: center; justify-content: center; font-family: var(--font-heading); font-weight: 700; font-size: 1.5rem; margin: 0 auto 1rem;}.person-avatar--sm { width: 3rem; height: 3rem; font-size: 1.125rem;}.person-card h3 { font-size: 1rem; margin-bottom: 0.25rem;}.person-title { font-size: 0.875rem; color: var(--color-raspberry); font-family: var(--font-heading);}.person-desc { font-size: 0.8125rem; color: var(--text-muted); margin-top: 0.5rem;}/* ========================================================================== Services Grid ========================================================================== */.services-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1.5rem;}.service-card { display: block; text-decoration: none; color: inherit; background: var(--bg-card); border: 1px solid var(--border-color); border-radius: 0.75rem; padding: 2rem; transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;}.service-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); border-color: var(--color-raspberry);}.service-icon { font-size: 2rem; margin-bottom: 1rem;}.service-card h3 { font-size: 1.25rem; margin-bottom: 0.75rem;}.service-card p { color: var(--text-secondary); font-size: 0.9375rem; margin-bottom: 1rem;}.service-link { color: var(--color-raspberry); font-family: var(--font-heading); font-weight: 600; font-size: 0.875rem;}/* ========================================================================== Blog / Filter UI ========================================================================== */.blog-filters { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 2rem; flex-wrap: wrap;}.filter-pills { display: flex; gap: 0.5rem; flex-wrap: wrap;}.filter-pill { background: var(--bg-card); border: 1px solid var(--border-color); color: var(--text-secondary); padding: 0.5rem 1rem; border-radius: 9999px; font-family: var(--font-heading); font-size: 0.8125rem; font-weight: 500; cursor: pointer; transition: all 0.2s;}.filter-pill:hover,.filter-pill.active { background: var(--color-raspberry); color: var(--color-white); border-color: var(--color-raspberry);}.filter-select { background: var(--bg-card); border: 1px solid var(--border-color); color: var(--text-primary); padding: 0.5rem 1rem; border-radius: 0.5rem; font-family: var(--font-heading); font-size: 0.8125rem;}.blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1.5rem;}.blog-card,.cs-card { transition: opacity 0.3s, transform 0.3s;}.blog-card.hidden,.cs-card.hidden { opacity: 0; transform: scale(0.95); position: absolute; pointer-events: none;}.blog-hero-card { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; text-decoration: none; color: inherit; background: var(--bg-card); border: 1px solid var(--border-color); border-radius: 0.75rem; overflow: hidden; transition: box-shadow 0.3s, transform 0.3s;}.blog-hero-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-2px);}.blog-hero-image { aspect-ratio: 16/9; overflow: hidden;}.blog-hero-content { padding: 2rem; display: flex; flex-direction: column; justify-content: center;}.blog-hero-badge { display: inline-block; background: var(--color-raspberry); color: #fff; padding: 0.25rem 0.75rem; border-radius: 9999px; font-size: 0.75rem; font-weight: 600; text-transform: uppercase; font-family: var(--font-heading); margin-bottom: 1rem; width: fit-content;}.blog-hero-content h2 { font-size: 1.5rem; margin-bottom: 0.75rem;}.blog-hero-content p { color: var(--text-secondary); margin-bottom: 1rem;}@media (max-width: 767px) { .blog-hero-card { grid-template-columns: 1fr; }}/* ========================================================================== Contact Page ========================================================================== */.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem;}@media (max-width: 767px) { .contact-grid { grid-template-columns: 1fr; gap: 3rem; }}.contact-method { display: flex; gap: 1rem; margin-bottom: 1.5rem;}.contact-icon { font-size: 1.5rem; flex-shrink: 0;}.contact-method h3 { font-size: 1rem; margin-bottom: 0.25rem;}.contact-form .form-group { margin-bottom: 1.25rem;}.contact-form label { display: block; font-family: var(--font-heading); font-weight: 600; font-size: 0.875rem; margin-bottom: 0.5rem;}.contact-form label .required { color: var(--color-raspberry);}.contact-form input,.contact-form textarea,.contact-form select { width: 100%; padding: 0.75rem 1rem; border: 1px solid var(--border-color); border-radius: 0.5rem; background: var(--bg-card); color: var(--text-primary); font-family: var(--font-body); font-size: 1rem; transition: border-color 0.2s;}.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus { outline: none; border-color: var(--color-raspberry);}.faq-item { border: 1px solid var(--border-color); border-radius: 0.5rem; margin-bottom: 0.75rem; overflow: hidden;}.faq-item summary { padding: 1rem 1.25rem; cursor: pointer; font-family: var(--font-heading); font-weight: 600; font-size: 0.9375rem; list-style: none; display: flex; justify-content: space-between; align-items: center;}.faq-item summary::after { content: '+'; font-size: 1.25rem; color: var(--color-raspberry); transition: transform 0.2s;}.faq-item[open] summary::after { content: '−';}.faq-item p { padding: 0 1.25rem 1rem; color: var(--text-secondary); line-height: 1.6;}/* ========================================================================== Tools Grid ========================================================================== */.tools-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.5rem;}.tool-card { background: var(--bg-card); border: 1px solid var(--border-color); border-radius: 0.75rem; padding: 1.5rem; transition: transform 0.2s, box-shadow 0.2s;}.tool-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg);}.tool-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 0.75rem;}.tool-card h3 { font-size: 1.125rem;}.tool-category { background: rgba(240, 20, 110, 0.1); color: var(--color-raspberry); padding: 0.2rem 0.6rem; border-radius: 9999px; font-size: 0.7rem; font-weight: 600; text-transform: uppercase; font-family: var(--font-heading); white-space: nowrap;}.tool-card p { color: var(--text-secondary); font-size: 0.875rem; margin-bottom: 0.75rem;}.tool-pricing { margin-bottom: 0.5rem;}.tool-price { font-family: var(--font-heading); font-weight: 600; color: var(--color-raspberry);}.tool-rating { font-size: 0.875rem; color: var(--text-muted); margin-bottom: 0.5rem;}.tool-link { display: inline-block; color: var(--color-raspberry); font-family: var(--font-heading); font-weight: 600; font-size: 0.875rem; margin-top: 0.5rem;}.tool-card.hidden { display: none;}/* ========================================================================== HI Tabs ========================================================================== */.hi-btn-primary { background: var(--color-gunmetal); color: #fff;}.hi-btn-primary:hover { background: var(--color-raspberry); color: #fff;}.hi-btn-outline { background: transparent; border: 2px solid var(--color-gunmetal); color: var(--color-gunmetal);}.hi-btn-outline:hover { background: var(--color-gunmetal); color: #fff;}.hi-tabs-wrapper { position: sticky; top: calc(var(--header-height, 80px) + 1px); z-index: 90; background: rgba(255, 255, 255, 0.92); -webkit-backdrop-filter: blur(12px) saturate(180%); backdrop-filter: blur(12px) saturate(180%); padding: 1rem 0; border-bottom: 1px solid var(--border-color);}.dark-mode .hi-tabs-wrapper { background: rgba(26, 26, 46, 0.7);}.hi-tabs { display: flex; gap: 0.5rem; justify-content: center; flex-wrap: wrap; max-width: var(--container-width, 72rem); margin: 0 auto; padding: 0 1rem;}.hi-tab { background: var(--bg-card); border: 2px solid var(--border-color); color: var(--text-secondary); padding: 0.75rem 1.5rem; border-radius: 9999px; font-family: var(--font-heading); font-size: 0.9375rem; font-weight: 600; cursor: pointer; transition: all 0.2s;}.hi-tab:hover,.hi-tab.active { background: var(--color-raspberry); color: var(--color-white); border-color: var(--color-raspberry);}.hi-panel { display: none; animation: fadeIn 0.3s ease;}.hi-panel.active { display: block; padding-top: 2.5rem;}@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); }}/* ========================================================================== Card Placeholder ========================================================================== */.card-placeholder { width: 100%; height: 100%; min-height: 200px; background: linear-gradient(135deg, var(--color-gunmetal), var(--color-eggplant));}.card-gradient { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, transparent 100%);}.card-image { position: relative;}/* ========================================================================== Page Hero (for page.php) ========================================================================== */.page-hero { padding: calc(var(--header-height, 80px) + 4rem) 0 3rem; margin-top: 0; color: var(--color-white); text-align: center;}.page-hero-inner { max-width: 48rem; margin: 0 auto;}.page-hero h1 { font-size: clamp(2rem, 5vw, 3rem); margin-bottom: 1rem; color: var(--color-white);}.page-hero-desc { font-size: 1.25rem; color: var(--color-neutral-300); max-width: 36rem; margin: 0 auto; line-height: 1.6;}.page-hero-meta { font-family: var(--font-heading); font-size: 0.9375rem; color: var(--color-neutral-300); margin-bottom: 0.75rem;}.breadcrumbs { font-family: var(--font-heading); font-size: 0.8125rem; margin-bottom: 1.5rem; color: var(--color-neutral-400);}.breadcrumbs a { color: var(--color-neutral-300); text-decoration: none; transition: color 0.2s;}.breadcrumbs a:hover { color: var(--color-raspberry);}.breadcrumb-sep { margin: 0 0.5rem; opacity: 0.5;}.breadcrumb-current { color: var(--color-white);}.entry-content--wide { max-width: 64rem;}.entry-content .wp-block-group.has-background { border-radius: 0.75rem; padding: 2rem; margin: 2rem 0;}.entry-content .wp-block-columns { margin: 2rem 0;}.entry-content figure { margin: 2rem 0;}.entry-content figure figcaption { text-align: center; font-size: 0.875rem; color: var(--text-muted); margin-top: 0.5rem;}/* ========================================================================== WPForms Dark Mode Styling ========================================================================== */.wpforms-container { font-family: var(--font-body) !important;}.wpforms-container .wpforms-form input[type="text"],.wpforms-container .wpforms-form input[type="email"],.wpforms-container .wpforms-form input[type="tel"],.wpforms-container .wpforms-form input[type="url"],.wpforms-container .wpforms-form input[type="number"],.wpforms-container .wpforms-form select,.wpforms-container .wpforms-form textarea { background: var(--bg-secondary, #2D2D44) !important; border: 1px solid var(--border-color, rgba(255,255,255,0.15)) !important; color: var(--text-primary, #fff) !important; border-radius: 0.5rem !important; padding: 0.75rem 1rem !important; font-family: var(--font-body) !important; font-size: 1rem !important; transition: border-color 0.2s ease, box-shadow 0.2s ease !important;}.wpforms-container .wpforms-form input:focus,.wpforms-container .wpforms-form textarea:focus,.wpforms-container .wpforms-form select:focus { border-color: var(--color-raspberry, #F0146E) !important; box-shadow: 0 0 0 3px rgba(240, 20, 110, 0.2) !important; outline: none; }.wpforms-container .wpforms-form input::placeholder,.wpforms-container .wpforms-form textarea::placeholder { color: var(--text-muted, rgba(255,255,255,0.4)) !important;}.wpforms-container .wpforms-form .wpforms-field-label { color: var(--text-primary, #fff) !important; font-family: var(--font-heading) !important; font-weight: 600 !important; font-size: 0.95rem !important; margin-bottom: 0.5rem !important;}.wpforms-container .wpforms-form .wpforms-field-sublabel { color: var(--text-secondary, rgba(255,255,255,0.6)) !important; font-size: 0.8rem !important;}.wpforms-container .wpforms-form .wpforms-required-label { color: var(--color-raspberry, #F0146E) !important;}.wpforms-container .wpforms-form .wpforms-field { margin-bottom: 1.25rem !important;}.wpforms-container .wpforms-form button[type="submit"],.wpforms-container .wpforms-form .wpforms-submit { background: var(--gradient-primary, linear-gradient(135deg, #F0146E, #8B1E5A)) !important; color: #fff !important; border: none !important; border-radius: 0.5rem !important; padding: 0.875rem 2rem !important; font-family: var(--font-heading) !important; font-weight: 600 !important; font-size: 1rem !important; cursor: pointer !important; transition: opacity 0.2s ease, transform 0.2s ease !important; width: 100% !important;}.wpforms-container .wpforms-form button[type="submit"]:hover,.wpforms-container .wpforms-form .wpforms-submit:hover { opacity: 0.9 !important; transform: translateY(-1px) !important;}.wpforms-container .wpforms-form .wpforms-field-description { color: var(--text-secondary, rgba(255,255,255,0.6)) !important;}.wpforms-container .wpforms-form .wpforms-error,.wpforms-container .wpforms-form .wpforms-field-label-error { color: #ff6b6b !important;}.wpforms-container .wpforms-confirmation-container-full { background: rgba(16, 185, 129, 0.1) !important; border: 1px solid rgba(16, 185, 129, 0.3) !important; color: #10B981 !important; border-radius: 0.75rem !important; padding: 1.5rem !important;}/* ========================================================================== Admin Bar Offset ========================================================================== */body.admin-bar .site-header,body.admin-bar header { top: 32px !important;}body.admin-bar { padding-top: 32px;}body.admin-bar .hi-tabs-wrapper { top: calc(var(--header-height, 80px) + 32px + 1px);}@media screen and (max-width: 782px) { body.admin-bar .site-header, body.admin-bar header { top: 46px !important; } body.admin-bar { padding-top: 46px; } body.admin-bar .hi-tabs-wrapper { top: calc(var(--header-height, 80px) + 46px + 1px); }}/* ========================================================================== About Page — Value & Step Cards ========================================================================== */.value-card,.step-card { background: var(--bg-secondary, rgba(255,255,255,0.05)); border: 1px solid var(--border-color, rgba(255,255,255,0.1)); transition: transform 0.2s ease, border-color 0.2s ease; height: 100%;}.value-card:hover,.step-card:hover { transform: translateY(-4px); border-color: var(--color-raspberry, #F0146E);}.step-number { color: var(--color-raspberry, #F0146E) !important; font-family: var(--font-heading) !important; opacity: 0.8;}.about-mission .lead { max-width: 48rem; margin-left: auto; margin-right: auto;}.values-grid,.approach-steps { margin-top: 2rem !important;}.wp-block-button__link { background: var(--gradient-primary, linear-gradient(135deg, #F0146E, #8B1E5A)) !important; color: #fff !important; border: none !important; border-radius: 0.5rem !important; padding: 0.875rem 2rem !important; font-family: var(--font-heading) !important; font-weight: 600 !important; transition: opacity 0.2s ease, transform 0.2s ease !important;}.wp-block-button__link:hover { opacity: 0.9 !important; transform: translateY(-1px) !important; color: #fff !important;}.wp-block-separator { border-color: var(--border-color, rgba(255,255,255,0.1)) !important; margin: 3rem auto !important;}/* ========================================================================== Nav Dropdowns ========================================================================== */.has-dropdown { position: relative;}.has-dropdown .dropdown { display: none; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); background: var(--bg-primary, #1A1A2E); border: 1px solid var(--border-color, rgba(255,255,255,0.1)); border-radius: 0.5rem; padding: 0.5rem 0; min-width: 180px; list-style: none; margin: 0.5rem 0 0; box-shadow: 0 10px 30px rgba(0,0,0,0.3); z-index: 1000;}.has-dropdown:hover .dropdown,.has-dropdown:focus-within .dropdown { display: block;}.has-dropdown .dropdown li { margin: 0;}.has-dropdown .dropdown a { display: block; padding: 0.5rem 1.25rem; color: var(--text-secondary, rgba(255,255,255,0.7)) !important; font-size: 0.9rem; white-space: nowrap; transition: color 0.2s, background 0.2s;}.has-dropdown .dropdown a:hover { color: #fff !important; background: rgba(240, 20, 110, 0.1);}/* ========================================================================== Gutenberg Full-Width Overrides ========================================================================== */.entry-content .wp-block-columns,.entry-content .wp-block-group.about-values,.entry-content .wp-block-group.about-approach,.entry-content .wp-block-group.about-cta,.entry-content .wp-block-group.about-mission,.entry-content .wp-block-buttons,.entry-content .stats-bar { max-width: 72rem; margin-left: auto; margin-right: auto;}.entry-content .wp-block-group { max-width: none;}.entry-content .wp-block-separator.is-style-wide { max-width: 72rem; margin-left: auto; margin-right: auto;}.entry-content .wp-block-columns { gap: 1.5rem;}.entry-content .about-values,.entry-content .about-approach,.entry-content .about-mission,.entry-content .about-cta { text-align: center;}.entry-content--wide { max-width: 72rem;}.wpforms-confirmation-container-full,.wpforms-confirmation-container-full p,div[submit-success] > p.wpforms-confirmation-container-full { background: rgba(16, 185, 129, 0.15) !important; border: 2px solid #10B981 !important; color: #fff !important; border-radius: 0.75rem !important; padding: 1.5rem !important; font-size: 1.1rem !important; font-weight: 500 !important;}/* ========================================================================== Typography Improvements ========================================================================== */.entry-content h1 { font-size: clamp(2rem, 4vw, 2.75rem) !important; margin: 2.5rem 0 1rem !important; letter-spacing: -0.02em; line-height: 1.15;}.entry-content h2 { font-size: clamp(1.5rem, 3vw, 2rem) !important; margin: 2.25rem 0 0.75rem !important; letter-spacing: -0.015em; line-height: 1.2;}.entry-content h3 { font-size: clamp(1.2rem, 2.5vw, 1.5rem) !important; margin: 1.75rem 0 0.5rem !important; letter-spacing: -0.01em; line-height: 1.25;}.entry-content h4 { font-size: clamp(1.05rem, 2vw, 1.25rem) !important; margin: 1.5rem 0 0.5rem !important; line-height: 1.3;}.entry-content p { line-height: 1.65 !important; margin: 0.875rem 0 !important;}.entry-content .lead,.entry-content p.lead { font-size: clamp(1.1rem, 2vw, 1.3rem) !important; line-height: 1.6 !important; color: var(--text-secondary) !important; max-width: 42rem; margin-left: auto !important; margin-right: auto !important; margin-bottom: 1.5rem !important;}.entry-content ul,.entry-content ol { margin: 1.25rem 0 !important; padding-left: 1.75rem !important;}.entry-content li { margin-bottom: 0.5rem !important; line-height: 1.6;}.entry-content li::marker { color: var(--color-raspberry);}.entry-content blockquote { border-left: 3px solid var(--color-raspberry) !important; padding: 1.25rem 1.5rem !important; margin: 2rem 0 !important; background: rgba(240, 20, 110, 0.05); border-radius: 0 0.5rem 0.5rem 0; font-style: normal !important;}.entry-content blockquote p { font-size: 1.1rem !important; line-height: 1.7 !important; color: var(--text-primary) !important;}.entry-content blockquote cite { display: block; margin-top: 0.75rem; font-size: 0.9rem; color: var(--text-secondary); font-style: normal;}.entry-content figure { margin: 2rem 0;}.entry-content figcaption { font-size: 0.85rem; color: var(--text-muted, rgba(255,255,255,0.5)); text-align: center; margin-top: 0.5rem; font-style: italic;}.entry-content code { font-size: 0.85em !important; padding: 0.2rem 0.45rem !important; border-radius: 0.3rem !important; border: 1px solid var(--border-color, rgba(255,255,255,0.1));}.entry-content pre { border: 1px solid var(--border-color, rgba(255,255,255,0.1)); padding: 1.25rem !important; border-radius: 0.75rem !important; font-size: 0.875rem; line-height: 1.6;}.entry-content strong { font-weight: 600; color: var(--text-primary);}::selection { background: rgba(240, 20, 110, 0.3); color: #fff;}::-moz-selection { background: rgba(240, 20, 110, 0.3); color: #fff;}.hero h1,.page-hero h1,.entry-header h1 { letter-spacing: -0.025em !important;}.section h2,.cta-section h2 { letter-spacing: -0.02em;}.entry-content hr { border: none; border-top: 1px solid var(--border-color, rgba(255,255,255,0.1)); margin: 2.5rem 0;}.entry-content table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; font-size: 0.95rem;}.entry-content th,.entry-content td { padding: 0.75rem 1rem; border: 1px solid var(--border-color, rgba(255,255,255,0.1)); text-align: left;}.entry-content th { background: var(--bg-secondary); font-family: var(--font-heading); font-weight: 600;}.cookie-consent { position: fixed; bottom: 0; left: 0; right: 0; z-index: 9999; background: var(--surface, #1a1a2e); border-top: 1px solid var(--border, rgba(255,255,255,0.1)); padding: 1rem 1.5rem; box-shadow: 0 -4px 20px rgba(0,0,0,0.3);}.cookie-consent-inner { max-width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap;}.cookie-consent p { margin: 0; font-size: 0.875rem; color: var(--text-muted, rgba(255,255,255,0.7)); flex: 1; min-width: 200px;}.cookie-consent a { color: var(--accent, #E1306C); text-decoration: underline;}.cookie-consent-actions { display: flex; gap: 0.75rem; flex-shrink: 0;}.btn-sm { padding: 0.5rem 1.25rem; font-size: 0.8125rem; border-radius: 9999px;}.btn-outline { background: transparent; border: 2px solid var(--color-white); color: var(--color-white); border-radius: 0.5rem; cursor: pointer;}.btn-outline:hover { background: var(--color-raspberry); color: var(--color-white); border-color: var(--color-raspberry);}.goals-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2rem;}.goal-card { background: var(--bg-card); border-radius: 0.75rem; padding: 2rem; box-shadow: var(--shadow-soft); display: flex; flex-direction: column; transition: box-shadow 0.2s, transform 0.2s;}.goal-card:hover { box-shadow: var(--shadow-lg, 0 10px 30px rgba(0,0,0,0.12)); transform: translateY(-2px);}.goal-icon { font-size: 2.5rem; margin-bottom: 1.25rem;}.goal-card h3 { font-size: 1.25rem; margin-bottom: 0.75rem;}.goal-card p { color: var(--text-secondary); flex-grow: 1; margin-bottom: 1.5rem;}.goal-cta { color: var(--color-raspberry); font-weight: 600; text-decoration: none; font-family: var(--font-heading);}.goal-cta:hover { text-decoration: underline;}/* ========================================================================== Accessibility ========================================================================== */.skip-link { position: absolute; top: -100%; left: 1rem; z-index: 100000; padding: 0.75rem 1.5rem; background: var(--color-raspberry); color: #fff; font-weight: 700; font-size: 0.875rem; border-radius: 0 0 0.5rem 0.5rem; text-decoration: none; transition: top 0.2s;}.skip-link:focus { top: 0; outline: 3px solid var(--color-raspberry); outline-offset: 2px;}*:focus-visible { outline: 2px solid var(--color-raspberry); outline-offset: 2px;}input:focus-visible,textarea:focus-visible,select:focus-visible,button:focus-visible,a:focus-visible { outline: 2px solid var(--color-raspberry); outline-offset: 2px;}@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }}/* ========================================================================== Book Landing Page ========================================================================== */.book-hero { position: relative; min-height: 90vh; display: flex; align-items: center; overflow: hidden;}.book-hero__bg { position: absolute; inset: 0; background: linear-gradient(135deg, #1A1A2E 0%, #310B37 40%, #A445B2 100%); z-index: 0;}.book-hero__bg::before,.book-hero__bg::after { content: ''; position: absolute; border-radius: 50%; filter: blur(120px); opacity: 0.25;}.book-hero__bg::before { width: 500px; height: 500px; background: #F0146E; top: 10%; right: 10%; animation: float 20s ease-in-out infinite;}.book-hero__bg::after { width: 400px; height: 400px; background: #7B2FF7; bottom: 10%; left: 20%; animation: float 20s ease-in-out infinite reverse;}.book-hero__inner { position: relative; z-index: 1; display: grid; grid-template-columns: 320px 1fr; gap: 4rem; align-items: center; padding: 8rem 0 6rem;}.book-cover-img { width: 100%; max-width: 320px; height: auto; border-radius: 4px; box-shadow: 0 25px 80px rgba(0,0,0,0.5), 0 0 40px rgba(240,20,110,0.15);}.book-hero__text { color: #fff;}.book-eyebrow { font-size: 0.875rem; text-transform: uppercase; letter-spacing: 0.15em; color: var(--color-raspberry); margin-bottom: 1rem; font-weight: 600;}.book-hero__text h1 { font-size: clamp(2.5rem, 5vw, 4rem); font-family: var(--font-heading); font-weight: 700; line-height: 1.1; margin-bottom: 1.5rem; color: #fff;}.book-subtitle { font-size: 1.25rem; font-style: italic; color: rgba(255,255,255,0.8); margin-bottom: 0.75rem; line-height: 1.5;}.book-tagline { font-size: 0.875rem; text-transform: uppercase; letter-spacing: 0.12em; color: rgba(255,255,255,0.5); margin-bottom: 2rem;}.book-hero__buttons { display: flex; gap: 1rem; flex-wrap: wrap;}.book-intro { padding: 6rem 0; background: var(--bg-primary);}.book-intro__content { max-width: 720px; margin: 0 auto;}.book-intro__content h2 { font-size: clamp(1.75rem, 3vw, 2.25rem); font-family: var(--font-heading); color: var(--text-primary); margin-bottom: 2rem; line-height: 1.3;}.book-intro__content p { font-size: 1.125rem; line-height: 1.8; color: var(--text-secondary); margin-bottom: 1.5rem;}.book-highlights { padding: 5rem 0; background: var(--bg-secondary);}.book-highlights h2 { font-size: clamp(1.75rem, 3vw, 2.25rem); font-family: var(--font-heading); text-align: center; margin-bottom: 3rem; color: var(--text-primary);}.highlights-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 2rem;}.highlight-card { background: var(--bg-card); border-radius: 0.75rem; padding: 2rem; text-align: center; box-shadow: var(--shadow-soft, 0 2px 15px rgba(0,0,0,0.07));}.highlight-icon { font-size: 2.5rem; display: block; margin-bottom: 1rem;}.highlight-card h3 { font-family: var(--font-heading); font-size: 1.25rem; margin-bottom: 0.75rem; color: var(--text-primary);}.highlight-card p { font-size: 0.9375rem; line-height: 1.6; color: var(--text-secondary);}.book-chapters { padding: 5rem 0; background: var(--bg-primary);}.book-chapters h2 { font-size: clamp(1.75rem, 3vw, 2.25rem); font-family: var(--font-heading); text-align: center; margin-bottom: 3rem; color: var(--text-primary);}.chapters-layout { max-width: 720px; margin: 0 auto; display: flex; flex-direction: column; gap: 2.5rem;}.part-title { font-family: var(--font-heading); font-size: 1.125rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--color-raspberry); margin-bottom: 1rem; padding-bottom: 0.5rem; border-bottom: 2px solid var(--color-raspberry);}.chapter-list { list-style: decimal; padding-left: 1.5rem; display: flex; flex-direction: column; gap: 0.75rem;}.chapter-list li { font-size: 1rem; line-height: 1.6; color: var(--text-secondary);}.chapter-list li strong { color: var(--text-primary);}.book-quote { padding: 5rem 0; background: var(--bg-secondary);}.book-quote blockquote { max-width: 720px; margin: 0 auto; text-align: center; padding: 0; border: none;}.book-quote blockquote p { font-size: clamp(1.25rem, 2.5vw, 1.5rem); font-style: italic; line-height: 1.7; color: var(--text-primary); margin-bottom: 1.5rem;}.book-quote cite { font-style: normal; font-size: 0.9375rem; color: var(--text-muted);}.book-author { padding: 5rem 0; background: var(--bg-primary);}.book-author__inner { max-width: 720px; margin: 0 auto;}.book-author__text h2 { font-family: var(--font-heading); font-size: 1.75rem; margin-bottom: 1.5rem; color: var(--text-primary);}.book-author__text p { font-size: 1.0625rem; line-height: 1.8; color: var(--text-secondary); margin-bottom: 1rem;}.book-author__text a { color: var(--color-raspberry);}.book-cta { text-align: center; padding: 6rem 0;}.book-cta.gradient { background: var(--gradient-primary);}.book-cta h2 { font-size: clamp(1.75rem, 4vw, 2.5rem); color: #fff; margin-bottom: 1.5rem;}.book-cta p { font-size: 1.25rem; color: rgba(255,255,255,0.85); max-width: 36rem; margin: 0 auto 2rem;}.book-cta .btn-outline { color: #ffffff; border-color: #ffffff;}.book-cta .btn-outline:hover { background: #ffffff; color: var(--color-raspberry);}@media (max-width: 768px) { .book-hero__inner { grid-template-columns: 1fr; text-align: center; padding: 6rem 0 4rem; gap: 2rem; } .book-hero__cover { order: -1; } .book-cover-img { max-width: 220px; margin: 0 auto; } .book-hero__buttons { justify-content: center; }}.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;}