/*
Theme Name: Adipramono 2026
Theme URI: https://adipramono.com
Author: Adi Pramono
Author URI: https://adipramono.com
Description: Minimalist typography-focused WordPress theme based on Underscores (_s) and Gutenberg block editor, built for web developers and agencies.
Version: 1.0.0
Tested up to: 6.7
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: adipramono_2026
Tags: custom-menu, block-styles, one-column, custom-colors, full-site-editing-compatible, portfolio, agency

Adipramono 2026 WordPress Theme, Copyright 2026 Adi Pramono.
Based on Underscores http://underscores.me/, (C) 2012-2026 Automattic, Inc.
*/

/* ==========================================================================
   1. CORE DESIGN SYSTEM & VARIABLES
   ========================================================================== */
:root {
  --bg-page: #FAF9F5;
  --text-primary: #1A1A1A;
  --text-secondary: #555555;
  --text-muted: #888888;
  --border-line: #E2DFD7;
  --accent-link: #9E3A14;
  --accent-blue: #0693e3;
  --accent-blue-soft: rgba(6, 147, 227, 0.12);
  
  --font-serif: 'Newsreader', Georgia, serif;
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: 'Space Mono', monospace;
}

/* ==========================================================================
   2. RESET & BASE STYLES
   ========================================================================== */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-sans);
  background-color: var(--bg-page);
  color: var(--text-primary);
  line-height: 1.75;
  font-size: 1rem;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Single Narrow Center Column */
.column-container,
.site-main-container {
  max-width: 620px;
  margin: 0 auto;
  padding: 5rem 1.5rem 6rem 1.5rem;
}

/* ==========================================================================
   3. TYPOGRAPHY & LINKS
   ========================================================================== */
p, .wp-block-paragraph {
  color: var(--text-secondary);
  margin-bottom: 1.25rem;
  font-size: 1.025rem;
  line-height: 1.75;
}

p strong, .wp-block-paragraph strong {
  color: var(--text-primary);
  font-weight: 600;
}

p.lead,
.lead-paragraph,
.wp-block-paragraph.is-style-lead-paragraph,
.wp-block-paragraph.has-large-font-size {
  font-size: 1.18rem;
  color: var(--text-primary);
  line-height: 1.7;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--text-primary);
  font-weight: 400;
  line-height: 1.2;
}

h2, .wp-block-heading.level-2, h2.wp-block-heading {
  scroll-margin-top: 140px;
}

/* Minimalist Hero Section & Big H1 Title */
.hero-section,
.wp-block-group.hero-section {
  min-height: 180px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-bottom: 2.5rem;
  padding: 1.5rem 0 1rem 0;
}

/* Global H1 Styling - 2.4rem across all pages (Homepage, Works, Inner Pages) */
h1, .wp-block-heading.level-1,
h1.hero-title,
.hero-title,
.wp-block-heading.hero-title,
.wp-block-heading.is-style-hero-title,
h1.is-style-hero-title,
body.home h1,
body.front-page h1,
body.home .hero-title,
body.front-page .hero-title {
  font-family: var(--font-serif) !important;
  font-size: 2.4rem !important;
  font-weight: 400 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.15 !important;
  color: var(--text-primary) !important;
  margin-bottom: 1.5rem !important;
  margin-top: 0 !important;
}



/* Hero Title Accent Highlight & Underline Options */
h1 em, h1 .hero-italic, .hero-title em {
  font-style: italic !important;
}

h1 strong, h1 .hero-bold, .hero-title strong {
  font-weight: 600 !important;
}

h1 span.hero-highlight, .hero-title .hero-highlight, h1 u, .hero-title u {
  text-decoration: none !important;
  border-bottom: 2.5px solid var(--accent-link);
  padding-bottom: 2px;
}

h1 span.hero-bg-highlight, .hero-title .hero-bg-highlight {
  background: linear-gradient(180deg, transparent 62%, rgba(158, 58, 20, 0.18) 62%);
  padding: 0 4px;
}

h2, h2.section-heading, .wp-block-heading, .wp-block-heading.is-style-serif-heading {
  font-family: var(--font-serif);
  font-size: 1.65rem;
  font-weight: 400;
  font-style: italic;
  color: var(--text-primary);
  margin-bottom: 1.25rem;
  margin-top: 2rem;
}

h2:first-child, .wp-block-heading:first-child {
  margin-top: 0;
}

h3, .wp-block-heading.level-3 {
  font-family: var(--font-sans);
  font-size: 1.15rem;
  font-weight: 600;
  margin-bottom: 0.75rem;
  margin-top: 1.5rem;
}

a {
  color: var(--text-primary);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: #CCCCCC;
  transition: all 0.15s ease;
}

a:hover {
  color: var(--accent-link);
  text-decoration-color: var(--accent-link);
}

hr, .divider, hr.wp-block-separator, .wp-block-separator {
  height: 1px;
  background-color: var(--border-line);
  border: none;
  margin: 3rem 0;
  opacity: 1;
}

/* Lists */
ul, ol {
  color: var(--text-secondary);
  margin-bottom: 1.5rem;
}

ul.list-block, ol.list-block, .wp-block-list.is-style-list-block {
  padding-left: 1.25rem;
  margin-bottom: 1.5rem;
}

ul.list-block li, ol.list-block li, .wp-block-list.is-style-list-block li {
  margin-bottom: 0.5rem;
}

/* ==========================================================================
   4. HEADER & NAVIGATION
   ========================================================================== */
header.site-header {
  margin-bottom: 3.5rem;
  transition: padding 0.25s ease, background-color 0.25s ease, margin-bottom 0.25s ease;
  will-change: padding, background-color, margin-bottom;
}

/* Sticky Option enabled */
header.site-header.has-sticky-option {
  position: sticky;
  top: 0;
  z-index: 1000;
  background-color: var(--bg-page) !important;
}

/* Scrolled Mode (only when user scrolls down >= 90px) */
header.site-header.has-sticky-option.is-scrolled {
  background-color: var(--bg-page) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding-top: 1rem !important;
  padding-bottom: 0.5rem !important;
  border-bottom: none !important;
  box-shadow: none !important;
  margin-bottom: 2.5rem;
}

h1.site-title {
  font-family: var(--font-serif);
  font-size: 2.75rem;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.15;
  margin-bottom: 0.25rem;
  color: var(--text-primary);
  transition: padding-top 0.25s ease, margin 0.25s ease;
  will-change: padding-top, margin-bottom;
}

header.site-header.has-sticky-option.is-scrolled h1.site-title {
  font-size: 2.75rem !important;
  padding-top: 1.5rem !important;
  margin-bottom: 0.5rem;
}

.site-title a {
  color: var(--text-primary);
  text-decoration: none;
}

.site-subtitle {
  font-family: var(--font-mono);
  font-size: 0.825rem;
  color: var(--text-muted);
  margin-bottom: 1.5rem;
  transition: opacity 0.2s ease, max-height 0.25s ease, margin 0.25s ease;
  opacity: 1;
  max-height: 60px;
  overflow: hidden;
  will-change: opacity, max-height;
}

/* Subtitle ONLY hides when scrolled down */
header.site-header.has-sticky-option.is-scrolled .site-subtitle {
  opacity: 0;
  max-height: 0;
  margin-bottom: 0 !important;
  margin-top: 0 !important;
  padding: 0 !important;
}

header.site-header.has-sticky-option.is-scrolled nav.site-nav {
  margin-bottom: 0 !important;
}

/* Nav Menu */
nav.site-nav {
  font-family: var(--font-mono);
  font-size: 0.85rem;
  border-top: 1px solid var(--border-line);
  border-bottom: 1px solid var(--border-line);
  padding: 0.75rem 0;
  margin-bottom: 3rem;
}

nav.site-nav ul {
  display: flex;
  gap: 1.25rem;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0;
}

nav.site-nav a,
nav.site-nav ul li a {
  color: var(--text-secondary);
  text-decoration: none;
}

nav.site-nav a:hover, 
nav.site-nav a.active,
nav.site-nav ul li a:hover,
nav.site-nav ul li.current-menu-item > a,
nav.site-nav ul li.current_page_item > a,
nav.site-nav ul li.current-menu-ancestor > a {
  color: var(--accent-link);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Screen reader text for accessibility */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
}

/* ==========================================================================
   5. CUSTOM UTILITY & BLOCK COMPONENT CLASSES (FOR GUTENBERG)
   ========================================================================== */

/* Timeline Component (e.g. About Page) */
.timeline-stream, ul.timeline-stream, .is-style-timeline-stream, ul.is-style-timeline-stream {
  list-style: none;
  padding: 0;
  margin: 0 0 2rem 0;
}

.timeline-entry, li.timeline-entry {
  margin-bottom: 1.25rem;
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 1rem;
  font-size: 0.95rem;
}

.timeline-date {
  font-family: var(--font-mono);
  font-size: 0.8rem;
  color: var(--text-muted);
}

.timeline-detail {
  color: var(--text-secondary);
}

.timeline-detail strong {
  color: var(--text-primary);
}

/* Selected Work / Stream Index Component */
.stream-list, ul.stream-list, .is-style-stream-list, ul.is-style-stream-list {
  list-style: none;
  padding: 0;
  margin: 2.5rem 0 0 0;
}

.stream-item, li.stream-item {
  margin-bottom: 2.5rem;
}

.stream-item-title {
  font-size: 1.075rem;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 0.25rem;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.stream-item-meta {
  font-family: var(--font-mono);
  font-size: 0.775rem;
  color: var(--text-muted);
  font-weight: 400;
}

.stream-item-desc {
  font-size: 0.95rem;
  color: var(--text-secondary);
  margin-bottom: 0.35rem;
}

.stream-item-link {
  font-family: var(--font-mono);
  font-size: 0.8rem;
}

/* Contact Stream Component */
.contact-stream, ul.contact-stream, .is-style-contact-stream, ul.is-style-contact-stream {
  list-style: none;
  padding: 0;
  margin: 2.5rem 0 0 0;
  font-family: var(--font-mono);
  font-size: 0.925rem;
}

.contact-stream li {
  margin-bottom: 1rem;
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 0.5rem;
}

.contact-label {
  color: var(--text-muted);
}

/* Monospace note / link prompt */
.mono-prompt,
.is-style-mono-prompt,
p.is-style-mono-prompt,
.wp-block-paragraph.is-style-mono-prompt,
html body .entry-content p.is-style-mono-prompt,
html body .entry-content .is-style-mono-prompt,
html body p.is-style-mono-prompt,
html body .is-style-mono-prompt {
  font-family: 'Space Mono', var(--wp--preset--font-family--space-mono), var(--font-mono), monospace !important;
  font-size: 0.85rem !important;
  margin-top: 1rem !important;
  color: var(--text-secondary) !important;
}

.mono-prompt a,
.is-style-mono-prompt a,
p.is-style-mono-prompt a,
.wp-block-paragraph.is-style-mono-prompt a,
html body .entry-content p.is-style-mono-prompt a,
html body .entry-content .is-style-mono-prompt a {
  font-family: inherit !important;
  font-size: inherit !important;
}

/* ==========================================================================
   6. FOOTER & SOCIAL ICONS
   ========================================================================== */
footer.site-footer {
  margin-top: 4.5rem;
  border-top: 1px solid var(--border-line);
  padding-top: 2.5rem;
}

.footer-cta {
  font-size: 1.05rem;
  color: var(--text-primary);
  margin-bottom: 1.75rem;
}

.social-icons-row {
  display: flex;
  gap: 1.25rem;
  align-items: center;
  margin-bottom: 2rem;
}

.social-icon-link {
  color: var(--text-muted);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: color 0.15s ease;
}

.social-icon-link:hover {
  color: var(--accent-link);
}

.social-icon-link svg {
  width: 20px;
  height: 20px;
  fill: currentColor;
}

.copyright-line {
  font-family: var(--font-mono);
  font-size: 0.775rem;
  color: var(--text-muted);
}

/* ==========================================================================
   7. GUTENBERG / BLOCK EDITOR ALIGNMENTS & DEFAULTS
   ========================================================================== */
.wp-block-group,
.wp-block-columns,
.wp-block-column {
  margin-bottom: 2rem;
}

.alignwide, .alignfull {
  max-width: 100%;
}

.wp-block-quote {
  border-left: 2px solid var(--accent-link);
  padding-left: 1.25rem;
  margin: 2rem 0;
  font-style: italic;
  color: var(--text-primary);
}

.wp-block-quote cite {
  display: block;
  font-family: var(--font-mono);
  font-size: 0.8rem;
  color: var(--text-muted);
  font-style: normal;
  margin-top: 0.5rem;
}

.wp-block-button__link {
  background-color: var(--text-primary);
  color: #FFFFFF !important;
  font-family: var(--font-mono);
  font-size: 0.85rem;
  padding: 0.6rem 1.2rem;
  border-radius: 0;
  text-decoration: none !important;
  transition: background-color 0.15s ease;
}

.wp-block-button__link:hover {
  background-color: var(--accent-link);
  color: #FFFFFF !important;
}

/* ==========================================================================
   8. RESPONSIVE BREAKPOINTS
   ========================================================================== */
@media (max-width: 520px) {
  .column-container, .site-main-container {
    padding: 3rem 1.25rem 4rem 1.25rem;
  }

  h1.site-title {
    font-size: 2.25rem;
  }

  .timeline-entry, li.timeline-entry {
    grid-template-columns: 1fr;
    gap: 0.1rem;
    margin-bottom: 1.5rem;
  }

  .contact-stream li {
    grid-template-columns: 1fr;
    gap: 0.1rem;
    margin-bottom: 1.25rem;
  }
}

/* ==========================================================================
   9. CUSTOM FAQ ACCORDION & HUMAN PHILOSOPHY COMPONENTS
   ========================================================================== */

/* FAQ Accordion Component */
.faq-accordion, .wp-block-group.faq-accordion {
  margin: 2rem 0;
  border-top: 1px solid var(--border-line);
}

.faq-item, details.faq-item {
  border-bottom: 1px solid var(--border-line);
  padding: 1.25rem 0;
}

.faq-question, summary.faq-question {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 400;
  color: var(--text-primary);
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  user-select: none;
  transition: color 0.15s ease;
}

.faq-question::-webkit-details-marker {
  display: none;
}

.faq-question::after {
  content: '+';
  font-family: var(--font-mono);
  font-size: 1.2rem;
  color: var(--text-muted);
  transition: transform 0.2s ease, color 0.2s ease;
  line-height: 1;
}

details.faq-item[open] .faq-question::after {
  content: '−';
  color: var(--accent-link);
}

.faq-answer {
  margin-top: 0.75rem;
  color: var(--text-secondary);
  font-size: 1rem;
  line-height: 1.7;
}

.faq-answer p:last-child {
  margin-bottom: 0;
}

/* Human Developer AI Philosophy Component */
.philosophy-card,
.wp-block-group.philosophy-card,
.is-style-philosophy-card,
.wp-block-group.is-style-philosophy-card,
.wp-block-quote.is-style-philosophy-card {
  background-color: #EFECE4 !important;
  border-left: 4px solid var(--accent-link) !important;
  border-top: 1px solid var(--border-line) !important;
  border-right: 1px solid var(--border-line) !important;
  border-bottom: 1px solid var(--border-line) !important;
  padding: 1.75rem 2rem !important;
  margin: 2.5rem 0 !important;
  border-radius: 2px;
}

.philosophy-card .philosophy-title,
.is-style-philosophy-card .philosophy-title,
.philosophy-title {
  font-family: var(--font-serif) !important;
  font-size: 1.35rem !important;
  font-style: italic !important;
  color: var(--text-primary) !important;
  margin-bottom: 0.75rem !important;
}

.philosophy-card p,
.is-style-philosophy-card p,
.philosophy-text p {
  color: var(--text-secondary) !important;
  font-size: 1rem !important;
  line-height: 1.7 !important;
}

.philosophy-meta {
  font-family: var(--font-mono) !important;
  font-size: 0.8rem !important;
  color: var(--text-muted) !important;
  margin-top: 0.85rem !important;
}

/* ==========================================================================
   10. DEV THOUGHTS BLOG STREAM COMPONENT
   ========================================================================== */
.dev-thoughts-stream,
.wp-block-group.dev-thoughts-stream {
  margin: 2.5rem 0;
}

.dev-thoughts-list,
ul.dev-thoughts-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 1.25rem 0 !important;
}

.dev-thoughts-item,
li.dev-thoughts-item {
  display: flex !important;
  justify-content: space-between !important;
  align-items: baseline !important;
  padding: 0.85rem 0 !important;
  border-bottom: 1px dashed var(--border-line) !important;
  gap: 1rem !important;
}

.dev-thoughts-item:last-child,
li.dev-thoughts-item:last-child {
  border-bottom: none !important;
}

.dev-thoughts-title,
a.dev-thoughts-title {
  font-family: var(--font-serif) !important;
  font-size: 1.15rem !important;
  color: var(--text-primary) !important;
  text-decoration: none !important;
  transition: color 0.15s ease !important;
}

.dev-thoughts-title:hover,
a.dev-thoughts-title:hover {
  color: var(--accent-link) !important;
  text-decoration: underline !important;
}

.dev-thoughts-date,
span.dev-thoughts-date {
  font-family: var(--font-mono) !important;
  font-size: 0.8rem !important;
  color: var(--text-muted) !important;
  white-space: nowrap !important;
}

@media (max-width: 520px) {
  .dev-thoughts-item,
  li.dev-thoughts-item {
    flex-direction: column !important;
    gap: 0.25rem !important;
  }
}

/* Core Latest Posts Block Styling for Dev Thoughts */
.wp-block-latest-posts,
ul.wp-block-latest-posts {
  list-style: none !important;
  padding: 0 !important;
  margin: 1.25rem 0 !important;
}

.wp-block-latest-posts li {
  display: flex !important;
  justify-content: space-between !important;
  align-items: baseline !important;
  padding: 0.85rem 0 !important;
  border-bottom: 1px dashed var(--border-line) !important;
  gap: 1rem !important;
  margin-bottom: 0 !important;
}

.wp-block-latest-posts li:last-child {
  border-bottom: none !important;
}

.wp-block-latest-posts a {
  font-family: var(--font-serif) !important;
  font-size: 1.15rem !important;
  color: var(--text-primary) !important;
  text-decoration: none !important;
  transition: color 0.15s ease !important;
}

.wp-block-latest-posts a:hover {
  color: var(--accent-link) !important;
  text-decoration: underline !important;
}

.wp-block-latest-posts .wp-block-latest-posts__post-date,
.wp-block-latest-posts time {
  font-family: var(--font-mono) !important;
  font-size: 0.8rem !important;
  color: var(--text-muted) !important;
  white-space: nowrap !important;
}

@media (max-width: 520px) {
  .wp-block-latest-posts li {
    flex-direction: column !important;
    gap: 0.25rem !important;
  }
}

/* ==========================================================================
   11. RUNNING & DISCIPLINE COMPONENT
   ========================================================================== */
.running-section,
.wp-block-group.running-section {
  margin: 2.5rem 0;
}

.running-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
  margin: 1.25rem 0;
}

.running-card {
  overflow: hidden;
  border: 1px solid var(--border-line);
  background-color: #EFECE4;
}

.running-card img {
  width: 100%;
  height: 180px;
  object-fit: cover;
  display: block;
  transition: transform 0.25s ease;
}

.running-card img:hover {
  transform: scale(1.03);
}

.strava-link,
a.strava-link {
  font-family: var(--font-mono) !important;
  font-size: 0.85rem !important;
  color: var(--accent-link) !important;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-top: 0.75rem;
}

.strava-link:hover,
a.strava-link:hover {
  text-decoration: underline !important;
}

/* Strava Best Efforts Monospace Component */
.best-efforts-card {
  background-color: #EFECE4;
  border-left: 3px solid var(--accent-link);
  border-top: 1px solid var(--border-line);
  border-right: 1px solid var(--border-line);
  border-bottom: 1px solid var(--border-line);
  padding: 1.25rem 1.5rem;
  margin: 1.25rem 0;
  width: 100% !important;
  max-width: 100% !important;
}

.best-efforts-title {
  font-family: var(--font-mono) !important;
  font-size: 0.8rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: var(--text-muted) !important;
  margin-bottom: 0.75rem !important;
}

.best-efforts-list,
ul.best-efforts-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  font-family: var(--font-mono) !important;
  font-size: 0.9rem !important;
}

.best-efforts-list li,
ul.best-efforts-list li {
  display: flex !important;
  justify-content: space-between !important;
  padding: 0.35rem 0 !important;
  border-bottom: 1px dashed var(--border-line) !important;
  color: var(--text-secondary) !important;
}

.best-efforts-list li:last-child,
ul.best-efforts-list li:last-child {
  border-bottom: none !important;
}

.best-efforts-list li strong,
ul.best-efforts-list li strong {
  color: var(--text-primary) !important;
  font-weight: 600 !important;
}

@media (max-width: 520px) {
  .running-grid {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   12. LIGHTBOX MODAL & FLEXIBLE GALLERY LAYOUTS
   ========================================================================== */

/* Lightbox Modal Base Overlay */
.lightbox-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 999999;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}

.lightbox-modal.active {
  opacity: 1;
  visibility: visible;
}

.lightbox-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(15, 15, 15, 0.92);
  backdrop-filter: blur(4px);
}

.lightbox-content {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 90%;
  max-width: 1100px;
  height: 85vh;
}

.lightbox-image-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  max-height: 100%;
}

.lightbox-image {
  max-width: 90vw;
  max-height: 75vh;
  object-fit: contain;
  border-radius: 2px;
  box-shadow: 0 10px 40px rgba(0,0,0,0.5);
}

.lightbox-caption {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 1.05rem;
  color: #EFECE4;
  margin-top: 1rem;
  text-align: center;
}

/* Lightbox Nav Buttons */
.lightbox-close,
.lightbox-prev,
.lightbox-next {
  background: rgba(255, 255, 255, 0.15);
  color: #FFFFFF;
  border: 1px solid rgba(255, 255, 255, 0.3);
  font-size: 1.75rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s ease;
  user-select: none;
}

.lightbox-close:hover,
.lightbox-prev:hover,
.lightbox-next:hover {
  background: var(--accent-link);
}

.lightbox-close {
  position: absolute;
  top: -40px;
  right: 0;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  line-height: 1;
}

.lightbox-prev,
.lightbox-next {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.lightbox-prev {
  left: 10px;
}

.lightbox-next {
  right: 10px;
}

/* Custom Gallery Layouts (Single, Grid, Mosaic) */
.gallery-single {
  margin: 2rem 0;
}

.gallery-single img {
  width: 100%;
  height: auto;
  border-radius: 2px;
  border: 1px solid var(--border-line);
}

/* Grid Layouts (2, 3, 4 columns) */
.gallery-grid,
.gallery-grid-2,
.gallery-grid-3,
.gallery-grid-4 {
  display: grid;
  gap: 0.85rem;
  margin: 2rem 0;
}

.gallery-grid-2 { grid-template-columns: repeat(2, 1fr); }
.gallery-grid-3, .gallery-grid { grid-template-columns: repeat(3, 1fr); }
.gallery-grid-4 { grid-template-columns: repeat(4, 1fr); }

.gallery-grid img,
.gallery-grid-2 img,
.gallery-grid-3 img,
.gallery-grid-4 img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  border-radius: 2px;
  border: 1px solid var(--border-line);
  transition: transform 0.2s ease;
}

.gallery-grid img:hover,
.gallery-grid-2 img:hover,
.gallery-grid-3 img:hover,
.gallery-grid-4 img:hover {
  transform: scale(1.02);
}

/* Mosaic / Asymmetric Layout */
.gallery-mosaic {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 180px;
  gap: 0.85rem;
  margin: 2rem 0;
}

.gallery-mosaic figure:nth-child(1) {
  grid-column: span 2;
  grid-row: span 2;
}

.gallery-mosaic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 2px;
  border: 1px solid var(--border-line);
  transition: transform 0.2s ease;
}

.gallery-mosaic img:hover {
  transform: scale(1.02);
}

@media (max-width: 520px) {
  .gallery-grid-2, .gallery-grid-3, .gallery-grid-4, .gallery-grid, .gallery-mosaic {
    grid-template-columns: 1fr !important;
    grid-auto-rows: auto !important;
  }
  .gallery-mosaic figure:nth-child(1) {
    grid-column: span 1 !important;
    grid-row: span 1 !important;
  }
  .lightbox-prev { left: 0; }
  .lightbox-next { right: 0; }
}

/* ==========================================================================
   13. DESKTOP FLOATING SECTION ANCHOR NAVIGATION
   ========================================================================== */
@media (min-width: 768px) {
  .floating-nav-container {
    position: fixed;
    top: 140px;
    right: max(1.5rem, calc((100vw - 640px) / 2 - 230px));
    width: 210px;
    z-index: 999;
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateX(0) !important;
    font-family: var(--font-mono);
  }

  @media (max-width: 1200px) {
    .floating-nav-container {
      right: 1rem;
      width: 180px;
    }
  }

  .floating-nav-container.is-visible {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateX(0) !important;
  }

  .floating-nav-title {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-muted);
    margin-bottom: 0.75rem;
    border-bottom: 1px solid var(--border-line);
    padding-bottom: 0.4rem;
  }

  .floating-nav-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .floating-nav-list li {
    margin-bottom: 0.5rem;
  }

  .floating-nav-list a {
    font-size: 0.78rem;
    color: var(--text-secondary);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    transition: color 0.2s ease, transform 0.2s ease;
    line-height: 1.3;
  }

  .floating-nav-list a::before {
    content: '•';
    color: var(--text-muted);
    transition: color 0.2s ease, transform 0.2s ease;
  }

  .floating-nav-list a:hover,
  .floating-nav-list a.is-active {
    color: var(--accent-link);
    transform: translateX(3px);
  }

  .floating-nav-list a.is-active::before {
    color: var(--accent-link);
    content: '→';
  }

  /* Comedic Google Display-style Ad Box */
  .funny-ad-box {
    margin-top: 1.5rem;
    background-color: #EFECE4;
    border: 1px solid var(--border-line);
    border-radius: 4px;
    padding: 0.85rem 1rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
    font-family: var(--font-sans);
  }

  .funny-ad-header {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.5rem;
  }

  .funny-ad-badge {
    background-color: #1A73E8;
    color: #FFFFFF;
    font-family: var(--font-mono);
    font-size: 0.65rem;
    font-weight: 700;
    padding: 0.15rem 0.35rem;
    border-radius: 2px;
    text-transform: uppercase;
    line-height: 1;
  }

  .funny-ad-by {
    font-family: var(--font-mono);
    font-size: 0.65rem;
    color: var(--text-muted);
    line-height: 1;
  }

  .funny-ad-title {
    font-family: var(--font-serif);
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.25;
    margin-bottom: 0.35rem;
  }

  .funny-ad-desc {
    font-size: 0.75rem;
    color: var(--text-secondary);
    line-height: 1.35;
    margin-bottom: 0.75rem;
  }

  .funny-ad-button {
    display: block;
    width: 100%;
    text-align: center;
    background-color: var(--accent-link);
    color: #FFFFFF !important;
    font-family: var(--font-mono);
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.45rem 0.5rem;
    border-radius: 3px;
    text-decoration: none !important;
    transition: background-color 0.2s ease, transform 0.2s ease;
  }

  .funny-ad-button:hover {
    background-color: #000000;
    transform: translateY(-1px);
  }
}

@media (max-width: 767px) {
  .floating-nav-container {
    display: none !important;
  }
}
    display: none !important;
  }
}

/* ==========================================================================
   14. CONTACT PAGE EMAIL STANDOUT BOX
   ========================================================================== */
.email-standout-box {
  background-color: #EFECE4;
  border: 1px solid var(--border-line);
  border-left: 4px solid var(--accent-link);
  border-radius: 4px;
  padding: 1.75rem 2rem;
  margin: 2rem 0;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.02);
}

.email-label {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--text-muted);
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin-bottom: 0.6rem;
}

.email-address {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 1.65rem;
  font-weight: 700;
  color: var(--text-primary);
  text-decoration: none;
  transition: color 0.2s ease, transform 0.2s ease;
  word-break: break-all;
}

.email-address:hover {
  color: var(--accent-link);
  transform: translateX(4px);
}

.email-note {
  font-family: var(--font-sans);
  font-size: 0.82rem;
  color: var(--text-secondary);
  margin-top: 0.6rem;
}

@media (max-width: 600px) {
  .email-standout-box {
    padding: 1.25rem 1.25rem;
  }
  .email-address {
    font-size: 1.25rem;
  }
}

/* ==========================================================================
   15. BLOG POST LIST (MINIMAL STREAM ITEMS)
   ========================================================================== */
.stream-item {
  margin-bottom: 1.25rem;
  padding-bottom: 1.25rem;
  border-bottom: none !important;
}

.stream-item:last-child {
  border-bottom: none !important;
}

.stream-item .entry-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1.5rem;
}

div.stream-item-title,
h2.stream-item-title {
  font-family: var(--font-sans);
  font-size: 1.05rem;
  font-weight: 500;
  margin: 0 !important;
  line-height: 1.4;
  flex: 1;
}

div.stream-item-title a,
h2.stream-item-title a {
  color: var(--text-primary);
  text-decoration: none;
  transition: color 0.15s ease;
}

div.stream-item-title a:hover,
h2.stream-item-title a:hover {
  color: var(--accent-link);
}

.stream-item-meta {
  font-family: var(--font-mono);
  font-size: 0.82rem;
  color: var(--text-muted);
  white-space: nowrap;
}

@media (max-width: 600px) {
  .stream-item .entry-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
  }
}

/* ==========================================================================
   16. PORTFOLIO HOVER IMAGE PREVIEW (CURSOR FOLLOWER)
   ========================================================================== */
.portfolio-hover-preview {
  position: fixed;
  z-index: 9999;
  width: 250px;
  height: 165px;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  border-radius: 6px;
  overflow: hidden;
  background-color: var(--bg-page);
  border: 1px solid var(--border-line);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.14);
  transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1), transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.2s;
  transform: scale(0.95);
}

.portfolio-hover-preview.is-active {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}

.portfolio-hover-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ==========================================================================
   17. SUPERSCRIPT TOOLTIP BADGE & POPUP BUBBLE
   ========================================================================== */
.has-tooltip {
  position: relative;
  display: inline-block;
  cursor: pointer;
}

sup.tooltip-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background-color: var(--accent-link);
  color: #ffffff;
  font-family: var(--font-mono);
  font-size: 0.65rem;
  font-weight: 600;
  line-height: 1;
  margin-left: 3px;
  cursor: help;
  vertical-align: super;
  transition: background-color 0.15s ease, transform 0.15s ease;
}

sup.tooltip-badge:hover,
.has-tooltip:hover sup.tooltip-badge {
  background-color: var(--text-primary);
  transform: scale(1.2);
}

/* Tooltip Popup Bubble */
.has-tooltip::after {
  content: attr(data-tooltip);
  position: absolute;
  bottom: 135%;
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  background-color: #1a1a1a;
  color: #ffffff;
  padding: 0.65rem 0.9rem;
  border-radius: 6px;
  font-family: var(--font-sans);
  font-size: 0.8rem;
  font-weight: 400;
  line-height: 1.4;
  white-space: normal;
  width: max-content;
  max-width: 270px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.22);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 1000;
  transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1), transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.2s;
}

/* Arrow Tip */
.has-tooltip::before {
  content: '';
  position: absolute;
  bottom: 115%;
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  border-width: 6px;
  border-style: solid;
  border-color: #1a1a1a transparent transparent transparent;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 1000;
  transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1), transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.2s;
}

/* Show on Hover & Focus */
.has-tooltip:hover::after,
.has-tooltip:hover::before,
.has-tooltip.is-active::after,
.has-tooltip.is-active::before {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}

/* Single Post Entry Content Bottom Border */
body.single article .entry-content,
article.is-singular .entry-content {
  border-bottom: 1px dashed var(--border-line) !important;
  padding-bottom: 2rem !important;
  margin-bottom: 2rem !important;
}

body.single .entry-content > .wp-block-separator:last-child,
body.single .entry-content > hr:last-child {
  display: none !important;
}

/* ==========================================================================
   18. SINGLE POST NAVIGATION (TOP & BOTTOM STACK, MONO SMALLER FONT)
   ========================================================================== */
.post-navigation,
nav.post-navigation,
.nav-links {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: none !important;
}

.nav-links {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.nav-previous,
.nav-next {
  width: 100%;
}

.nav-previous a,
.nav-next a,
.post-navigation a,
.post-navigation .nav-title,
.post-navigation .nav-subtitle {
  font-family: 'Space Mono', var(--wp--preset--font-family--space-mono), var(--font-mono), monospace !important;
  font-size: 0.82rem !important;
  line-height: 1.5 !important;
  color: var(--text-muted);
  text-decoration: none;
  transition: color 0.15s ease;
}

.post-navigation a:hover,
.post-navigation a:hover .nav-title,
.post-navigation a:hover .nav-subtitle {
  color: var(--accent-link) !important;
  text-decoration: underline;
}

.post-navigation .nav-subtitle {
  display: inline-block;
  margin-right: 0.35rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
}

/* ==========================================================================
   20. TESTIMONIAL & PARTNER ENDORSEMENT CARDS
   ========================================================================== */
.testimonial-card {
  background-color: #EFECE4 !important;
  border-left: 4px solid var(--accent-link) !important;
  border-top: 1px solid var(--border-line) !important;
  border-right: 1px solid var(--border-line) !important;
  border-bottom: 1px solid var(--border-line) !important;
  padding: 1.5rem 1.75rem !important;
  margin: 1.5rem 0 !important;
  border-radius: 2px;
}

.testimonial-quote {
  font-family: var(--font-serif) !important;
  font-size: 1.05rem !important;
  font-style: italic !important;
  color: var(--text-primary) !important;
  line-height: 1.65 !important;
  margin-bottom: 0.75rem !important;
}

.testimonial-author {
  font-family: var(--font-mono) !important;
  font-size: 0.82rem !important;
  color: var(--text-secondary) !important;
  font-weight: 600 !important;
}

/* ==========================================================================
   21. THE GLOWING ETHERIAL LIGHT ORB COMPONENT
   ========================================================================== */

/* Layer 1: Outer Vertical Drop (Linear Terminal Velocity) */
.money-fall-wrapper {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 10000 !important;
  pointer-events: none !important;
  animation: moneyVerticalDrop 4.8s linear forwards !important;
}

.money-fall-wrapper.fall-complete {
  display: none !important;
}

@keyframes moneyVerticalDrop {
  0% {
    transform: translate(65vw, -80px);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  90% {
    transform: translate(calc(100vw - 4.8rem), calc(100vh - 4.8rem));
    opacity: 1;
  }
  100% {
    transform: translate(calc(100vw - 4rem), calc(100vh - 4rem));
    opacity: 0;
  }
}

/* Layer 2: Middle Sway (Harmonic Pendulum Stall-and-Glide) */
.money-sway-wrapper {
  animation: moneyHarmonicSway 1.6s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite alternate !important;
}

@keyframes moneyHarmonicSway {
  0% {
    transform: translateX(-45px);
  }
  100% {
    transform: translateX(45px);
  }
}

/* Layer 3: Glowing Energy Orb Element (Konsep A: Equatorial Golden Sun) */
.glowing-orb-element.golden-sun-orb {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: radial-gradient(circle at 35% 35%, #FFFBEB 0%, #FBBF24 25%, #F59E0B 55%, #D97706 80%, #7C2D12 100%) !important;
  box-shadow: 0 0 26px rgba(245, 158, 11, 0.85), inset 0 0 12px rgba(255, 255, 255, 0.95) !important;
  animation: goldenSunPulseGlow 2.4s infinite alternate cubic-bezier(0.45, 0.05, 0.55, 0.95) !important;
}

@keyframes goldenSunPulseGlow {
  0% {
    transform: scale(0.92);
    box-shadow: 0 0 18px rgba(245, 158, 11, 0.65), inset 0 0 8px rgba(255, 255, 255, 0.7);
  }
  100% {
    transform: scale(1.08);
    box-shadow: 0 0 34px rgba(245, 158, 11, 0.95), inset 0 0 16px rgba(255, 255, 255, 1);
  }
}

/* Landed Golden Sun Orb Button with Rotating Monospace Text Ring */
.side-ad-flyout-container.orb-flyout-mode {
  position: fixed !important;
  bottom: 2rem !important;
  right: 2rem !important;
  z-index: 9999 !important;
}

.side-ad-toggle-btn.orb-landed-btn.golden-sun-landed {
  position: relative !important;
  width: 118px !important;
  height: 118px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 1 !important;
  transform: scale(1) !important;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* Rotating SVG Monospace Text Ring */
.circular-text-ring-svg {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
  animation: rotateCircleText 16s linear infinite !important;
}

@keyframes rotateCircleText {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.circular-text-element {
  font-family: var(--font-mono, 'Space Mono', monospace) !important;
  font-size: 9.2px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  fill: var(--text-primary, #111827) !important;
  transition: fill 0.3s ease !important;
}

.glowing-orb-landed-icon.golden-sun-icon {
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  background: radial-gradient(circle at 35% 35%, #FFFBEB 0%, #FBBF24 30%, #F59E0B 75%, #D97706 100%) !important;
  box-shadow: 0 0 20px rgba(245, 158, 11, 0.95), inset 0 0 8px rgba(255, 255, 255, 0.95) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

/* Hover State: Fast Spin & Solar Gold Glow */
.side-ad-toggle-btn.orb-landed-btn.golden-sun-landed:hover {
  transform: translateY(-5px) scale(1.05) !important;
}

.side-ad-toggle-btn.orb-landed-btn.golden-sun-landed:hover .circular-text-ring-svg {
  animation-duration: 7s !important;
}

.side-ad-toggle-btn.orb-landed-btn.golden-sun-landed:hover .circular-text-element {
  fill: #F59E0B !important;
}

.side-ad-toggle-btn.orb-landed-btn.golden-sun-landed:hover .glowing-orb-landed-icon.golden-sun-icon {
  transform: scale(1.18) !important;
  box-shadow: 0 0 28px rgba(245, 158, 11, 1), inset 0 0 12px rgba(255, 255, 255, 1) !important;
}

.orb-tooltip-label {
  position: absolute !important;
  right: 126px !important;
  top: 50% !important;
  transform: translateY(-50%) translateX(10px) !important;
  background: #111827 !important;
  color: #FFFFFF !important;
  font-family: var(--font-mono) !important;
  font-size: 0.78rem !important;
  white-space: nowrap !important;
  padding: 0.5rem 0.95rem !important;
  border-radius: 4px !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.25s ease, transform 0.25s ease !important;
}

.orb-tooltip-label::after {
  content: '';
  position: absolute;
  top: 50%;
  right: -5px;
  transform: translateY(-50%);
  border-width: 5px 0 5px 5px;
  border-style: solid;
  border-color: transparent transparent transparent #111827;
}

.side-ad-toggle-btn.orb-landed-btn:hover .orb-tooltip-label {
  opacity: 1 !important;
  transform: translateY(-50%) translateX(0) !important;
}

/* ==========================================================================
   22. INTERACTIVE QUALIFICATION FUNNEL COMPONENT
   ========================================================================== */
.funnel-step {
  display: none;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.funnel-step.is-active {
  display: block;
  opacity: 1;
  transform: translateY(0);
}

.funnel-question {
  font-family: var(--font-sans);
  font-size: 0.92rem;
  line-height: 1.55;
  color: var(--text-primary);
  margin-bottom: 1rem;
  font-weight: 500;
}

.funnel-options-grid {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  margin-bottom: 0.85rem;
}

.funnel-choice-btn, .funnel-link-btn {
  width: 100%;
  padding: 0.65rem 0.95rem;
  background-color: #111827;
  color: #FFFFFF !important;
  border: 1px solid transparent;
  border-radius: 6px;
  font-family: var(--font-mono);
  font-size: 0.8rem;
  font-weight: 600;
  text-align: left;
  cursor: pointer !important;
  pointer-events: auto !important;
  position: relative !important;
  z-index: 10 !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: all 0.2s ease;
  text-decoration: none !important;
  box-sizing: border-box !important;
}

.funnel-choice-btn.secondary, .funnel-link-btn.secondary {
  background-color: transparent;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-line, rgba(0,0,0,0.25));
}

.funnel-choice-btn:hover, .funnel-link-btn:hover {
  background-color: #0693e3;
  color: #FFFFFF !important;
  border-color: #0693e3;
  transform: translateX(3px);
}

.funnel-choice-btn.secondary:hover {
  background-color: rgba(6, 147, 227, 0.08);
  color: #0693e3 !important;
  border-color: #0693e3;
}

.funnel-back-btn {
  background: none;
  border: none;
  color: var(--text-secondary);
  font-family: var(--font-mono);
  font-size: 0.73rem;
  cursor: pointer;
  padding: 0.2rem 0;
  margin-top: 0.4rem;
  text-decoration: underline;
  transition: color 0.2s ease;
}

.funnel-back-btn:hover {
  color: #0693e3;
}

.funnel-success-badge {
  display: inline-block;
  background: rgba(34, 197, 94, 0.15);
  color: #15803D;
  font-family: var(--font-mono);
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.25rem 0.65rem;
  border-radius: 4px;
  margin-bottom: 0.75rem;
}

.magic-meet-btn {
  background-color: #22C55E !important;
  color: #FFFFFF !important;
  box-shadow: 0 4px 14px rgba(34, 197, 94, 0.35) !important;
  text-align: center !important;
  justify-content: center !important;
  display: block !important;
  margin-top: 0.85rem !important;
  padding: 0.75rem 1rem !important;
  border-radius: 6px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

.magic-meet-btn:hover {
  background-color: #15803D !important;
  transform: translateY(-2px) !important;
}

.funnel-subtext {
  font-family: var(--font-sans);
  font-size: 0.8rem;
  color: var(--text-secondary);
  margin-top: 0.85rem;
}

/* ==========================================================================
   23. BREATHABLE SWISS MINIMALIST INTAKE FORM & LANDING STYLING
   ========================================================================== */
.schedule-meeting-landing {
  background: var(--bg-primary, #EFECE4);
}

.minimal-intake-form-wrapper {
  background: transparent;
  padding: 0;
  margin-top: 1rem;
}

.schedule-form-container {
  background: #FFFFFF !important;
  border: 1px solid var(--border-line, rgba(0, 0, 0, 0.14)) !important;
  border-top: 3.5px solid var(--text-primary, #111827) !important;
  border-left: 1px solid var(--border-line, rgba(0, 0, 0, 0.14)) !important;
  padding: 2.25rem 2.5rem !important;
  border-radius: 8px !important;
  margin-top: 1rem !important;
  max-width: 100% !important;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.04) !important;
}

.wpcf7-form .form-group {
  margin-bottom: 1.25rem;
}

/* Floating Label Mechanics */
.field-float-group {
  position: relative !important;
  margin-bottom: 1.25rem !important;
}

.field-float-row {
  display: flex !important;
  gap: 1rem !important;
}

.field-float-row .col-half {
  flex: 1 !important;
  margin-bottom: 1.25rem !important;
}

.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="date"],
.wpcf7-form select,
.wpcf7-form textarea,
.schedule-form .form-control {
  width: 100% !important;
  padding: 0.85rem 1rem 0.45rem !important;
  font-family: var(--font-sans) !important;
  font-size: 0.92rem !important;
  color: var(--text-primary, #111827) !important;
  background: #FFFFFF !important;
  border: 1px solid var(--border-line, rgba(0, 0, 0, 0.18)) !important;
  border-radius: 4px !important;
  box-sizing: border-box !important;
  transition: border-color 0.15s ease !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

.float-label-active {
  top: -0.48rem !important;
  left: 0.75rem !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  background: #FFFFFF !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
}

.wpcf7-form textarea {
  height: 105px !important;
  min-height: 105px !important;
  line-height: 1.55 !important;
  resize: vertical !important;
}

.float-label {
  position: absolute !important;
  left: 0.85rem !important;
  top: 0.65rem !important;
  font-family: var(--font-mono, 'Space Mono', monospace) !important;
  font-size: 0.74rem !important;
  font-weight: 600 !important;
  color: #6B7280 !important;
  letter-spacing: 0.03em !important;
  pointer-events: none !important;
  transition: all 0.15s ease !important;
  background: transparent !important;
  padding: 0 0.2rem !important;
  margin: 0 !important;
}

/* Floating label active state (on focus or when input has text) */
.field-float-group input:focus ~ .float-label,
.field-float-group input:not(:placeholder-shown) ~ .float-label,
.field-float-group textarea:focus ~ .float-label,
.field-float-group textarea:not(:placeholder-shown) ~ .float-label {
  top: -0.48rem !important;
  left: 0.75rem !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  color: #111827 !important;
  background: #FFFFFF !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
}

.wpcf7-form input[type="text"]:focus,
.wpcf7-form input[type="email"]:focus,
.wpcf7-form textarea:focus {
  outline: none !important;
  border-color: #111827 !important;
  box-shadow: 0 0 0 2px rgba(17, 24, 39, 0.06) !important;
}

/* Side-by-side Inline Budget Slider */
.budget-inline-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  background: #FAFAFA !important;
  border: 1px solid var(--border-line, rgba(0, 0, 0, 0.18)) !important;
  border-radius: 4px !important;
  padding: 0.7rem 1rem !important;
  margin-bottom: 1.25rem !important;
  gap: 1rem !important;
}

.budget-label-col {
  display: flex !important;
  align-items: center !important;
  gap: 0.35rem !important;
  white-space: nowrap !important;
}

.budget-title-label {
  font-family: var(--font-mono, 'Space Mono', monospace) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  color: #6B7280 !important;
}

.budget-display-badge {
  background: transparent !important;
  color: #111827 !important;
  font-family: var(--font-mono, 'Space Mono', monospace) !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  padding: 0 !important;
}

.budget-input-col {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
}

.budget-range-input {
  width: 100% !important;
  height: 5px !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  background: #E5E7EB !important;
  border-radius: 3px !important;
  outline: none !important;
  cursor: pointer !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

.budget-range-input::-webkit-slider-thumb {
  -webkit-appearance: none !important;
  appearance: none !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  background: #111827 !important;
  border: 2px solid #FFFFFF !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15) !important;
  cursor: pointer !important;
}

/* Breathable Submit Button */
.wpcf7-submit,
.magic-submit-btn {
  width: 100% !important;
  background-color: #111827 !important;
  color: #FFFFFF !important;
  font-family: var(--font-mono, 'Space Mono', monospace) !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  padding: 0.9rem 1.5rem !important;
  border-radius: 4px !important;
  border: none !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
  margin-top: 0.5rem !important;
  transition: background-color 0.15s ease, transform 0.15s ease !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

.wpcf7-submit:hover,
.magic-submit-btn:hover {
  background-color: #000000 !important;
  color: #FFFFFF !important;
  transform: translateY(-1px) !important;
}

.wpcf7-submit:hover,
.magic-submit-btn:hover {
  background-color: #000000 !important;
  color: #FFFFFF !important;
}

.wpcf7-submit:hover,
.magic-submit-btn:hover {
  background-color: #000000 !important;
  color: #FFFFFF !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15) !important;
}

/* CF7 Response Output Messages */
.wpcf7-response-output {
  margin-top: 1.15rem !important;
  padding: 0.85rem 1.15rem !important;
  border-radius: 4px !important;
  font-family: var(--font-mono) !important;
  font-size: 0.82rem !important;
  line-height: 1.5 !important;
  border: 1px solid var(--border-line, rgba(0, 0, 0, 0.15)) !important;
  background: #FFFFFF !important;
  color: var(--text-primary, #111827) !important;
}


/* Landed Money Badge in Corner */
.side-ad-flyout-container.maple-leaf-mode {
  position: fixed !important;
  bottom: 2.25rem !important;
  right: 2.25rem !important;
  z-index: 9999 !important;
}

.side-ad-toggle-btn.maple-leaf-landed-btn {
  position: relative !important;
  width: 76px !important;
  height: 76px !important;
  padding: 0 !important;
  background: #EFECE4 !important;
  border: 1px dashed var(--border-line, rgba(0,0,0,0.3)) !important;
  border-radius: 50% !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12) !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 0;
  transform: scale(0.5);
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.side-ad-toggle-btn.maple-leaf-landed-btn.is-landed {
  opacity: 1 !important;
  transform: scale(1) !important;
}

.maple-leaf-btn-icon {
  font-size: 2.1rem !important;
  line-height: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: transform 0.3s ease !important;
}

/* Hover State: Dark Obsidian & Terracotta Theme Shimmer */
.side-ad-toggle-btn.maple-leaf-landed-btn:hover {
  background: #111827 !important;
  border-color: #9E3A14 !important;
  transform: translateY(-5px) rotate(-8deg) scale(1.08) !important;
  box-shadow: 0 14px 32px rgba(17, 24, 39, 0.3), 0 0 18px rgba(158, 58, 20, 0.5) !important;
}

.side-ad-toggle-btn.maple-leaf-landed-btn:hover .maple-leaf-btn-icon {
  transform: scale(1.2) rotate(12deg) !important;
}

/* Circular Rotating Text Ring */
.circular-text-ring-svg {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 114px !important;
  height: 114px !important;
  margin-top: -57px !important;
  margin-left: -57px !important;
  pointer-events: none !important;
  animation: rotateOrbTextRing 14s linear infinite !important;
}

@keyframes rotateOrbTextRing {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
/* ==========================================================================
   REVAMPED ABOUT PAGE STYLING (SWISS ELEGANCE)
   ========================================================================== */
.about-page-revamp {
  max-width: 100%;
}

.about-hero-header {
  margin-bottom: 2.5rem;
  padding-bottom: 0;
  border-bottom: none !important;
}

.about-page-title {
  font-family: var(--font-serif) !important;
  font-size: 2.4rem !important;
  font-weight: 400 !important;
  color: var(--text-primary) !important;
  margin-bottom: 0.75rem !important;
}

.about-hero-sub {
  font-family: var(--font-sans);
  font-size: 1.15rem;
  color: var(--accent-link, #9E3A14);
  font-weight: 600;
  line-height: 1.4;
  margin-bottom: 1.75rem;
}

.about-hero-bio p {
  font-family: var(--font-sans);
  font-size: 1.02rem;
  color: var(--text-secondary);
  line-height: 1.65;
  margin-bottom: 1.25rem;
}

/* Stats Grid */
.about-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  margin-top: 2rem;
}

@media (max-width: 768px) {
  .about-stats-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.stat-card {
  background: rgba(0, 0, 0, 0.02);
  border: 1px solid var(--border-line);
  padding: 1.25rem 1rem;
  border-radius: 4px;
  text-align: center;
}

.stat-number {
  display: block;
  font-family: var(--font-mono);
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 0.25rem;
}

.stat-label {
  font-family: var(--font-sans);
  font-size: 0.78rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* Revamped Timeline Wrapper */
.about-timeline-section {
  margin-bottom: 4rem;
}

.about-section-heading {
  font-family: var(--font-serif) !important;
  font-size: 1.75rem !important;
  font-style: italic !important;
  color: var(--text-primary) !important;
  margin-bottom: 0.5rem !important;
}

.about-timeline-intro {
  font-family: var(--font-mono);
  font-size: 0.82rem;
  color: var(--text-muted);
  margin-bottom: 2.5rem;
}

.revamped-timeline-wrapper {
  position: relative !important;
  margin: 2rem 0 3rem 0 !important;
  padding-left: 0 !important;
  border: none !important;
}

.revamped-timeline-card {
  display: flex !important;
  align-items: flex-start !important;
  gap: 1.75rem !important;
  margin-bottom: 2.5rem !important;
  position: relative !important;
  border: none !important;
}

.revamped-timeline-card:last-child {
  margin-bottom: 0 !important;
}

.revamped-timeline-node {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  flex-shrink: 0 !important;
  width: 68px !important;
  height: 68px !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  border: 3px solid var(--accent-link, #9E3A14) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12) !important;
  background-color: #EFECE4 !important;
  cursor: pointer !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease !important;
  z-index: 5 !important;
}

.revamped-timeline-content {
  flex: 1 !important;
}

.revamped-timeline-node:hover {
  transform: scale(1.18) rotate(4deg) !important;
  box-shadow: 0 10px 26px rgba(158, 58, 20, 0.45), 0 0 0 4px var(--bg-page, #FAF9F5) !important;
  border-color: #111827 !important;
}

.revamped-timeline-node .node-zoom-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.6);
  font-size: 1.1rem;
  opacity: 0;
  pointer-events: none;
  transition: all 0.25s ease;
  z-index: 3;
}

.revamped-timeline-node:hover .node-zoom-icon {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.revamped-timeline-node:hover .timeline-thumb-img {
  opacity: 0.45;
  filter: brightness(0.6);
}

.revamped-timeline-badge {
  font-family: var(--font-mono);
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--accent-link, #9E3A14);
  background: rgba(158, 58, 20, 0.08);
  padding: 0.25rem 0.65rem;
  border-radius: 3px;
  display: inline-block;
  margin-bottom: 0.5rem;
  letter-spacing: 0.03em;
}

.revamped-timeline-title {
  font-family: var(--font-sans) !important;
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  color: var(--text-primary) !important;
  margin: 0 0 0.4rem 0 !important;
  line-height: 1.35 !important;
}

.revamped-timeline-title a {
  color: var(--text-primary);
  text-decoration: underline;
  text-decoration-color: var(--border-line);
}

.revamped-timeline-title a:hover {
  color: var(--accent-link);
  text-decoration-color: var(--accent-link);
}

.revamped-timeline-desc {
  font-family: var(--font-sans);
  font-size: 0.95rem;
  color: var(--text-secondary);
  line-height: 1.6;
  margin: 0 !important;
}

/* Agency Partnership Commitment Box */
.about-agency-commitment {
  background-color: rgba(0, 0, 0, 0.02);
  border: 1px solid var(--border-line);
  border-left: 4px solid var(--accent-link);
  border-radius: 4px;
  padding: 2.25rem 2rem;
  margin-top: 3.5rem;
}

.commitment-title {
  font-family: var(--font-serif) !important;
  font-size: 1.4rem !important;
  font-style: italic !important;
  color: var(--text-primary) !important;
  margin-bottom: 1.5rem !important;
}

.commitment-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

@media (max-width: 768px) {
  .commitment-grid {
    grid-template-columns: 1fr;
  }
}

.commitment-item {
  display: flex;
  flex-direction: column;
}

.commitment-icon {
  font-size: 1.5rem;
  margin-bottom: 0.5rem;
}

.commitment-item h4 {
  font-family: var(--font-sans);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 0.4rem;
}

.commitment-item p {
  font-family: var(--font-sans);
  font-size: 0.88rem;
  color: var(--text-secondary);
  line-height: 1.55;
  margin: 0;
}


/* ==========================================================================
   MINIMALIST TIMELINE & CAREER HISTORY STYLING
   ========================================================================== */
/* Timeline Image Node Styling - Exact Center Alignment on Vertical Line */
.timeline-container {
  position: relative !important;
  margin: 2.5rem 0 3rem 0 !important;
  padding-left: 5.5rem !important; /* 88px space: gives 54px clear gap from 68px image node right edge */
  border-left: 2px solid var(--border-line) !important;
}

.timeline-item-with-img {
  position: relative !important;
  margin-bottom: 3rem !important;
  min-height: 68px !important;
}

.timeline-item-with-img::before {
  display: none !important;
}

.timeline-img-node {
  position: absolute !important;
  left: -34px !important; /* -34px = exact half of 68px width -> centers node over 2px border line */
  top: 0 !important;
  width: 68px !important;
  height: 68px !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  border: 3px solid var(--accent-link, #9E3A14) !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.14), 0 0 0 4px var(--bg-page, #FAF9F5) !important;
  background-color: #EFECE4 !important;
  cursor: pointer !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease !important;
  z-index: 2 !important;
}

.timeline-img-node:hover {
  transform: scale(1.15) rotate(3deg) !important;
  box-shadow: 0 10px 24px rgba(158, 58, 20, 0.4), 0 0 0 4px var(--bg-page, #FAF9F5) !important;
  border-color: #111827 !important;
}

.timeline-thumb-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: opacity 0.2s ease !important;
}

.lightbox-counter {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  color: #9CA3AF;
  margin-bottom: 0.3rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.timeline-item:last-child {
  margin-bottom: 0;
}

.timeline-item::before {
  content: '';
  position: absolute;
  left: -2.35rem;
  top: 0.35rem;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: var(--bg-page, #FAF9F5);
  border: 2px solid var(--accent-link, #9E3A14);
  box-shadow: 0 0 0 3px var(--bg-page, #FAF9F5);
  transition: all 0.2s ease;
}

.timeline-item:hover::before {
  background-color: var(--accent-link, #9E3A14);
  transform: scale(1.25);
}

.timeline-badge {
  font-family: var(--font-mono);
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--accent-link, #9E3A14);
  background: rgba(158, 58, 20, 0.08);
  padding: 0.2rem 0.6rem;
  border-radius: 3px;
  display: inline-block;
  margin-bottom: 0.4rem;
  letter-spacing: 0.02em;
}

.timeline-title {
  font-family: var(--font-sans);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--text-primary);
  margin: 0.2rem 0 0.3rem 0 !important;
  line-height: 1.35;
}

.timeline-desc {
  font-family: var(--font-sans);
  font-size: 0.92rem;
  color: var(--text-secondary);
  line-height: 1.55;
  margin: 0 !important;
}

/* Automatic Timeline Enhancement */
ul.timeline-container-auto {
  list-style: none !important;
  position: relative !important;
  margin: 2.5rem 0 3rem 0 !important;
  padding-left: 2rem !important;
  border-left: 2px solid var(--border-line) !important;
}

li.timeline-item-auto {
  position: relative !important;
  margin-bottom: 2rem !important;
  padding-left: 0 !important;
  list-style-type: none !important;
}

li.timeline-item-auto:last-child {
  margin-bottom: 0 !important;
}

li.timeline-item-auto::before {
  content: '' !important;
  position: absolute !important;
  left: -2.35rem !important;
  top: 0.35rem !important;
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  background-color: var(--bg-page, #FAF9F5) !important;
  border: 2px solid var(--accent-link, #9E3A14) !important;
  box-shadow: 0 0 0 3px var(--bg-page, #FAF9F5) !important;
  transition: all 0.2s ease !important;
}

li.timeline-item-auto:hover::before {
  background-color: var(--accent-link, #9E3A14) !important;
  transform: scale(1.25) !important;
}

.timeline-content-body {
  display: block;
  font-family: var(--font-sans);
  font-size: 0.95rem;
  color: var(--text-primary);
  line-height: 1.55;
  margin-top: 0.25rem;
}


.maple-leaf-tooltip-label {
  position: absolute !important;
  right: 92px !important;
  top: 50% !important;
  transform: translateY(-50%) translateX(10px) !important;
  background: #111827 !important;
  color: #FFFFFF !important;
  font-family: var(--font-mono) !important;
  font-size: 0.8rem !important;
  white-space: nowrap !important;
  padding: 0.5rem 0.95rem !important;
  border-radius: 4px !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.25s ease, transform 0.25s ease !important;
}

.maple-leaf-tooltip-label::after {
  content: '';
  position: absolute;
  top: 50%;
  right: -5px;
  transform: translateY(-50%);
  border-width: 5px 0 5px 5px;
  border-style: solid;
  border-color: transparent transparent transparent #111827;
}

.side-ad-toggle-btn.maple-leaf-landed-btn:hover .maple-leaf-tooltip-label {
  opacity: 1 !important;
  transform: translateY(-50%) translateX(0) !important;
}

.side-ad-drawer.maple-leaf-drawer {
  bottom: 4.25rem !important;
  right: 0 !important;
  border-left-color: #C86D51 !important;
}

.side-ad-toggle-btn .badge-icon {
  font-size: 1.05rem !important;
}

.side-ad-toggle-btn .badge-text {
  color: #FFFFFF !important;
  letter-spacing: 0.02em !important;
}

.side-ad-drawer {
  position: absolute !important;
  bottom: 3.25rem !important;
  right: 0 !important;
  width: 320px !important;
  background-color: #EFECE4 !important;
  border: 1px solid var(--border-line) !important;
  border-left: 4px solid var(--accent-link) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
  border-radius: 4px !important;
  padding: 1.25rem 1.5rem !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(10px) !important;
  transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease !important;
}

.side-ad-drawer.is-open {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}

.side-ad-drawer-header {
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  margin-bottom: 0.75rem !important;
}

.side-ad-title {
  font-family: var(--font-serif) !important;
  font-size: 1.1rem !important;
  color: var(--text-primary) !important;
  margin: 0 !important;
}

.side-ad-close-btn {
  background: none !important;
  border: none !important;
  font-size: 1.25rem !important;
  cursor: pointer !important;
  color: var(--text-muted) !important;
  line-height: 1 !important;
  padding: 0 !important;
}

.side-ad-body p {
  font-family: var(--font-sans) !important;
  font-size: 0.9rem !important;
  color: var(--text-secondary) !important;
  line-height: 1.6 !important;
  margin-bottom: 1rem !important;
}

.side-ad-btn {
  font-family: var(--font-mono) !important;
  font-size: 0.82rem !important;
  color: var(--accent-link) !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
}

/* -------------------------------------------------------------------------- */
/* 23. SCHEDULE MEETING LANDING PAGE (STANDALONE & BREATHABLE SWISS INTAKE)   */
/* -------------------------------------------------------------------------- */
.standalone-schedule-page {
	background-color: #EFECE4 !important;
}

.standalone-schedule-page .site-header,
.standalone-schedule-page .site-footer,
.standalone-schedule-page .site-nav,
.standalone-schedule-page #floating-section-nav,
.standalone-schedule-page .funny-ad-box,
.standalone-schedule-page #side-ad-flyout-container {
	display: none !important;
}

/* NUCLEAR HIGH SPECIFICITY RANGE SLIDER STRETCH OVERRIDE */
html body.standalone-schedule-page input[type="range"]#sched_budget_slider,
html body.standalone-schedule-page .adi-intake-slider-input,
.standalone-schedule-page input[type="range"] {
	width: 100% !important;
	min-width: 100% !important;
	max-width: 100% !important;
	flex: 1 1 100% !important;
	display: block !important;
	box-sizing: border-box !important;
	height: 4px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	background: #E5E7EB !important;
	border-radius: 2px !important;
	outline: none !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	accent-color: #111827 !important;
	box-shadow: none !important;
}

/* GENTLE & FRIENDLY VALIDATION STYLING (NO HARSH/SCARY RED) */
.standalone-schedule-page .wpcf7-not-valid,
.standalone-schedule-page .adi-intake-input.wpcf7-not-valid,
.standalone-schedule-page .adi-intake-select.wpcf7-not-valid,
.standalone-schedule-page .adi-intake-textarea.wpcf7-not-valid {
	border-color: #D97706 !important; /* Soft Warm Amber */
	background-color: #FFFDF5 !important;
	box-shadow: 0 0 0 3px rgba(217, 119, 6, 0.08) !important;
}

.standalone-schedule-page .wpcf7-not-valid-tip {
	color: #92400E !important;
	font-family: var(--font-mono, 'Space Mono', monospace) !important;
	font-size: 0.72rem !important;
	font-weight: 500 !important;
	margin-top: 0.35rem !important;
	letter-spacing: 0.02em !important;
}

.standalone-schedule-page .wpcf7-response-output,
.standalone-schedule-page div.wpcf7-response-output {
	margin: 1.25rem 0 0 !important;
	padding: 0.85rem 1.1rem !important;
	border: 1px solid #FCD34D !important;
	background-color: #FFFBEB !important;
	color: #92400E !important;
	font-family: var(--font-mono, 'Space Mono', monospace) !important;
	font-size: 0.8rem !important;
	border-radius: 6px !important;
	line-height: 1.5 !important;
	text-align: center !important;
}


/* ==========================================================================
   SWISS EDITORIAL EXPERIENCE LIST
   ========================================================================== */
.swiss-experience-list {
  margin: 2rem 0 3rem 0;
  border-top: 1px solid var(--border-line);
}

.swiss-experience-item {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 1.5rem;
  padding: 1.6rem 0;
  border-bottom: 1px solid var(--border-line);
  transition: background-color 0.15s ease;
}

.swiss-experience-item:hover {
  background-color: rgba(0, 0, 0, 0.015);
}

.swiss-experience-meta {
  padding-top: 0.15rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.4rem;
}

.swiss-experience-year {
  font-family: var(--font-mono);
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--text-primary);
  letter-spacing: 0.02em;
  display: inline-block;
}

.swiss-experience-cat {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.15rem 0.5rem;
  border-radius: 3px;
  display: inline-block;
  white-space: nowrap;
}

.swiss-cat-works {
  color: var(--accent-link, #9E3A14);
  background-color: rgba(158, 58, 20, 0.08);
}

.swiss-cat-life {
  color: #0D9488;
  background-color: rgba(13, 148, 136, 0.08);
}

.swiss-cat-education {
  color: #0284C7;
  background-color: rgba(2, 132, 199, 0.08);
}


.swiss-experience-body {
  flex: 1;
}

.swiss-experience-title {
  font-family: var(--font-sans) !important;
  font-size: 1.08rem !important;
  font-weight: 600 !important;
  color: var(--text-primary) !important;
  margin: 0 0 0.4rem 0 !important;
  line-height: 1.4 !important;
}

.swiss-experience-title a {
  color: var(--text-primary);
  text-decoration: underline;
  text-decoration-color: var(--border-line);
  transition: color 0.15s ease, text-decoration-color 0.15s ease;
}

.swiss-experience-title a:hover {
  color: var(--accent-link, #9E3A14);
  text-decoration-color: var(--accent-link, #9E3A14);
}

.swiss-experience-desc {
  font-family: var(--font-sans);
  font-size: 0.95rem;
  color: var(--text-secondary);
  line-height: 1.65;
  margin: 0 !important;
}

@media (max-width: 640px) {
  .swiss-experience-item {
    grid-template-columns: 1fr;
    gap: 0.4rem;
    padding: 1.25rem 0;
  }
}

/* ==========================================================================
   COOL SWISS CONTACT PAGE STYLING
   ========================================================================== */
.contact-hero-header {
  margin-bottom: 2.5rem;
}

.contact-page-title {
  font-family: var(--font-serif) !important;
  font-size: 2.5rem !important;
  font-weight: 400 !important;
  color: var(--text-primary) !important;
  margin-bottom: 0.6rem !important;
}

.contact-hero-sub {
  font-family: var(--font-sans);
  font-size: 1.15rem;
  color: var(--text-secondary);
  line-height: 1.6;
  max-width: 620px;
}

.swiss-contact-stream {
  margin: 1.5rem 0 3.5rem 0;
  border-top: 1px solid var(--border-line);
}

.contact-stream-item {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 1.5rem;
  padding: 1.4rem 0;
  border-bottom: 1px solid var(--border-line);
}

.contact-stream-label {
  font-family: var(--font-mono);
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--accent-link, #9E3A14);
  padding-top: 0.15rem;
}

.contact-stream-value {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.contact-stream-value .channel-link,
.contact-stream-value .location-text {
  font-family: var(--font-sans);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--text-primary);
}

.channel-link {
  color: var(--text-primary);
  text-decoration: underline;
  text-decoration-color: var(--border-line);
  transition: color 0.15s ease, text-decoration-color 0.15s ease;
}

.channel-link:hover {
  color: var(--accent-link, #9E3A14);
  text-decoration-color: var(--accent-link, #9E3A14);
}

.contact-stream-note {
  font-family: var(--font-sans);
  font-size: 0.92rem;
  color: var(--text-secondary);
  line-height: 1.5;
}

@media (max-width: 640px) {
  .contact-stream-item {
    grid-template-columns: 1fr;
    gap: 0.35rem;
    padding: 1.1rem 0;
  }
}

.contact-section-heading {
  font-family: var(--font-serif) !important;
  font-size: 1.75rem !important;
  font-style: italic !important;
  font-weight: 400 !important;
  color: var(--text-primary) !important;
  margin-bottom: 1.25rem !important;
}

.swiss-socials-list {
  border-top: 1px solid var(--border-line);
  margin-bottom: 3rem;
}

.swiss-social-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--border-line);
  text-decoration: none !important;
  color: var(--text-primary) !important;
  transition: background-color 0.15s ease, padding-left 0.15s ease;
}

.swiss-social-item:hover {
  background-color: rgba(0, 0, 0, 0.015);
  padding-left: 0.5rem;
}

.social-item-main {
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
  min-width: 180px;
}

.social-name {
  font-family: var(--font-sans);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--text-primary);
}

.social-handle {
  font-family: var(--font-mono);
  font-size: 0.8rem;
  color: var(--accent-link, #9E3A14);
}

.social-desc {
  font-family: var(--font-sans);
  font-size: 0.92rem;
  color: var(--text-secondary);
  flex: 1;
}

@media (max-width: 640px) {
  .swiss-social-item {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
  }
  .social-desc {
    font-size: 0.88rem;
  }
}

.social-arrow {
  font-family: var(--font-mono);
  font-size: 1rem;
  color: var(--text-muted);
  transition: color 0.15s ease, transform 0.15s ease;
}

.swiss-social-item:hover .social-arrow {
  color: var(--accent-link, #9E3A14);
  transform: translateX(4px);
}