@font-face {
font-family: 'Mona Sans';
font-style: normal;
font-weight: 300 700;
font-display: swap;
src: url('https://cdn.jsdelivr.net/fontsource/fonts/mona-sans:vf@latest/latin-wght-normal.woff2') format('woff2-variations');
}
:root {
--bg: #0d0f10;
--surface: #171a1c;
--surface-2: #1c2122;
--text: #e7e3da;
--text-soft: #a9b1ac;
--muted: #7f8782;
--sage: #8ea596;
--bronze: #a88a6d;
--bronze-soft: rgba(168, 138, 109, 0.18);
--border-dark: rgba(231, 227, 218, 0.08);
--ink: #2d2a26;
--ink-soft: #5f5850;
--paper: #efece6;
--paper-2: #e8e3db;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
margin: 0;
background:
radial-gradient(circle at 50% 0%, rgba(168, 138, 109, 0.08), transparent 22%),
radial-gradient(circle at 12% 18%, rgba(142, 165, 150, 0.05), transparent 20%),
linear-gradient(180deg, #111314 0%, #0d0f10 42%, #0b0c0d 100%);
color: var(--text-soft);
font-family: 'Mona Sans', sans-serif;
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
}
.font-head { font-family: 'Poppins', sans-serif; }

/* HERO */
.hero-shell { max-width: 1500px; margin: 0 auto; padding: 24px; }
.hero-card {
position: relative; overflow: hidden; border: 1px solid var(--border-dark); border-radius: 30px;
background: linear-gradient(180deg, rgba(23, 26, 28, 0.92), rgba(14, 16, 17, 0.98));
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02), 0 30px 90px rgba(0, 0, 0, 0.24);
}
.top-image-zone { position: relative; min-height: 760px; overflow: hidden; background: #d6d0c8; }
.top-image-zone img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.01); }
.top-image-zone::after {
content: ''; position: absolute; inset: 0;
background:
linear-gradient(180deg, rgba(12,12,12,0.08), rgba(12,12,12,0.18) 34%, rgba(12,12,12,0.24) 64%, rgba(12,12,12,0.42) 100%),
linear-gradient(0deg, rgba(13,15,16,0.60) 0%, rgba(13,15,16,0.24) 20%, rgba(13,15,16,0.00) 42%),
radial-gradient(circle at 50% 18%, rgba(168,138,109,0.10), transparent 18%),
linear-gradient(180deg, rgba(255,255,255,0.04), transparent 20%);
pointer-events: none;
}
.top-image-zone::before {
content: ''; position: absolute; inset: 0;
background-image: linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);
background-size: 80px 80px;
mask-image: radial-gradient(circle at center, black 24%, transparent 88%);
-webkit-mask-image: radial-gradient(circle at center, black 24%, transparent 88%);
opacity: 0.18; pointer-events: none;
}
.nav-wrap { position: absolute; left: 50%; top: 32px; transform: translateX(-50%); z-index: 3; width: min(calc(100% - 48px), 980px); }
.nav-pill {
display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 12px 16px; border-radius: 999px;
border: 1px solid rgba(231,227,218,0.12); background: rgba(24,22,20,0.16); backdrop-filter: blur(8px);
box-shadow: inset 0 1px 0 rgba(231,227,218,0.03);
}
.nav-link { color: rgba(231,227,218,0.74); text-decoration: none; transition: color 180ms ease, opacity 180ms ease; }
.nav-link:hover { color: var(--text); opacity: 1; }
.brand-mark { width: 36px; height: 36px; border-radius: 999px; border: 1px solid rgba(231,227,218,0.14); background: rgba(231,227,218,0.04); display: inline-flex; align-items: center; justify-content: center; color: var(--text); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; flex: 0 0 auto; }
.brand-name { color: var(--text); }
.brand-sub { color: rgba(231,227,218,0.64); }
.nav-book-btn { display: inline-flex; align-items: center; gap: 10px; border-radius: 999px; background: rgba(45,42,38,0.72); padding: 10px 18px; color: var(--paper); text-decoration: none; font-size: 12px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; box-shadow: 0 8px 24px rgba(0,0,0,0.12); transition: transform 180ms ease, background 180ms ease; }
.nav-book-btn:hover { transform: translateY(-1px); background: rgba(45,42,38,0.86); }
.mobile-menu-btn { display: none; width: 42px; height: 42px; border-radius: 999px; border: 1px solid rgba(231,227,218,0.14); background: rgba(231,227,218,0.05); align-items: center; justify-content: center; color: var(--text); flex: 0 0 auto; }
.hero-copy { position: relative; z-index: 2; display: flex; min-height: 760px; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 140px 24px 88px; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 999px; border: 1px solid rgba(168,138,109,0.28); background: rgba(18,21,23,0.24); backdrop-filter: blur(14px); color: rgba(231,227,218,0.84); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; }
.eyebrow-dot { width: 8px; height: 8px; border-radius: 999px; background: var(--bronze); box-shadow: 0 0 0 7px rgba(168,138,109,0.08); }
.hero-title { margin: 22px 0 0; max-width: 1100px; font-size: clamp(3.1rem, 6vw, 5.7rem); line-height: 0.90; letter-spacing: -0.07em; color: var(--text); }
.hero-title .block { display: block; }
.hero-divider { width: 170px; height: 1px; margin: 26px auto 0; background: linear-gradient(90deg, rgba(168,138,109,0), rgba(168,138,109,0.74), rgba(168,138,109,0)); }
.hero-text { max-width: 820px; margin: 22px auto 0; font-size: 17px; line-height: 1.95; color: rgba(231,227,218,0.88); text-shadow: 0 1px 10px rgba(0,0,0,0.10); }
.bottom-paper { background: linear-gradient(180deg, var(--paper), var(--paper-2)); padding: 42px 40px 52px; color: var(--ink); border-top: 1px solid rgba(0,0,0,0.05); }
.section-kicker { font-size: 11px; line-height: 1; letter-spacing: 0.12em; text-transform: uppercase; color: var(--bronze); margin-bottom: 16px; }
.section-title { margin: 0; font-size: clamp(2.25rem, 4.1vw, 4rem); line-height: 0.96; letter-spacing: -0.06em; color: var(--ink); }
.section-title-split { font-size: clamp(1.9rem, 3.2vw, 3rem); line-height: 1.0; }
.section-title-split .reveal-line { display: block; }
.section-text { margin: 0; font-size: 15px; line-height: 1.5; color: var(--ink-soft); max-width: 620px; }
.cta-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.btn-primary, .btn-secondary { display: inline-flex; align-items: center; gap: 10px; padding: 14px 22px; border-radius: 999px; font-size: 14px; font-weight: 500; text-decoration: none; transition: transform 180ms ease, background 180ms ease, color 180ms ease, border-color 180ms ease; }
.btn-primary { background: var(--ink); color: var(--paper); }
.btn-primary:hover { transform: translateY(-1px); }
.btn-secondary { border: 1px solid rgba(45,42,38,0.12); color: var(--ink); background: rgba(255,255,255,0.36); }
.btn-secondary:hover { border-color: rgba(168,138,109,0.28); background: rgba(255,255,255,0.50); }
.method-layout { display: grid; grid-template-columns: 0.92fr 1.08fr; gap: 40px; align-items: start; }
.method-left, .method-right { min-width: 0; }
.method-right { display: flex; flex-direction: column; }
.method-right-text { margin-bottom: 28px; }
.method-cards-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.method-card { position: relative; min-height: 460px; border-radius: 22px; overflow: hidden; background: #d8d3cb; border: 1px solid rgba(0,0,0,0.05); transition: transform 0.3s ease; }
.method-card::before { content: ""; position: absolute; inset: 0; background: radial-gradient(500px circle at var(--mouse-x) var(--mouse-y), rgba(255,255,255,0.22), transparent 40%); z-index: 2; opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }
.method-card::after { content: ""; position: absolute; inset: 0; padding: 1px; border-radius: inherit; background: radial-gradient(380px circle at var(--mouse-x) var(--mouse-y), rgba(168,138,109,0.26), transparent 42%); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; z-index: 3; opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }
.method-card:hover::before, .method-card:hover::after { opacity: 1; }
.method-card:hover { transform: translateY(-4px); }
.method-card-image { position: absolute; inset: 0; width: 100%; height: 100%; display: block; object-fit: cover; transition: transform 0.7s ease; filter: saturate(0.82) brightness(0.96); }
.method-card:hover .method-card-image { transform: scale(1.06); }
.method-card-overlay { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.08) 52%, rgba(13,15,16,0.68) 100%); pointer-events: none; }
.method-card-content { position: absolute; inset: auto 0 0 0; z-index: 4; padding: 22px 22px 20px; }
.method-card.reveal-seq { opacity: 0; transform: translateY(34px); transition: opacity 0.95s cubic-bezier(0.16,1,0.3,1), transform 0.95s cubic-bezier(0.16,1,0.3,1); }
.method-card.reveal-seq.is-revealed { opacity: 1; transform: translateY(0); }
.icon-pulse { position: relative; display: inline-flex; color: var(--bronze); }
.sonar-ring { position: absolute; inset: 0; border-radius: 50%; border: 1px solid currentColor; animation: sonar 2s cubic-bezier(0,0,0.2,1) infinite; pointer-events: none; }

/* RITUAL PANELS */
.ritual-panels-section { position: relative; }
.ritual-panels-shell { max-width: 1500px; margin: 0 auto; padding: 0 24px 24px; }
.ritual-panels-frame { position: relative; overflow: hidden; border: 1px solid rgba(231,227,218,0.08); border-radius: 30px; background: radial-gradient(circle at top center, rgba(168,138,109,0.08), transparent 18%), linear-gradient(180deg, rgba(23,26,28,0.94), rgba(14,16,17,0.98)); box-shadow: inset 0 1px 0 rgba(255,255,255,0.02), 0 30px 90px rgba(0,0,0,0.20); }
.ritual-panels-frame::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(255,255,255,0.015), transparent 16%, transparent 84%, rgba(255,255,255,0.015)), radial-gradient(circle at 18% 14%, rgba(142,165,150,0.04), transparent 18%); }
.ritual-panels-header { position: relative; z-index: 2; padding: 84px 34px 34px; }
.ritual-panels-header-grid { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 22px; }
.ritual-panels-header>.ritual-panels-header-grid>div { display: flex; flex-direction: column; align-items: center; }
.ritual-panels-kicker { margin: 0 0 16px; font-size: 11px; line-height: 1; letter-spacing: 0.12em; text-transform: uppercase; color: var(--bronze); }
.ritual-panels-title { margin: 0; font-size: clamp(2.3rem, 4.4vw, 4.6rem); line-height: 0.94; letter-spacing: -0.065em; color: var(--text); }
.ritual-panels-title .reveal-line { display: block; }
.ritual-panels-text { margin: 0; max-width: 760px; font-size: 16px; line-height: 1.9; color: rgba(231,227,218,0.80); }
.ritual-panels-grid { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); min-height: 640px; }
.ritual-panel { position: relative; overflow: hidden; min-height: 640px; background: #1a1d1f; border-left: 1px solid rgba(231,227,218,0.06); cursor: pointer; }
.ritual-panel:first-child { border-left: none; }
.ritual-panel-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 700ms ease, filter 700ms ease; }
.ritual-panel:hover .ritual-panel-image { transform: scale(1.04); filter: saturate(0.76) brightness(0.78); }
.ritual-panel-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(13,15,16,0.08) 0%, rgba(13,15,16,0.12) 28%, rgba(13,15,16,0.78) 100%); pointer-events: none; }
.ritual-panel::after { content: ""; position: absolute; inset: 0; z-index: 3; background: linear-gradient(180deg, rgba(13,15,16,0.04) 0%, rgba(13,15,16,0.18) 100%); opacity: 0; transition: opacity 400ms ease; pointer-events: none; }
.ritual-panel:hover::after { opacity: 1; }
.ritual-panel-base { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; padding: 28px 22px 24px; transition: opacity 260ms ease, transform 260ms ease; }
.ritual-panel:hover .ritual-panel-base { opacity: 0; transform: translateX(-10px); }
.ritual-panel-index { display: block; margin-bottom: 8px; font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(231,227,218,0.62); }
.ritual-panel-title { margin: 0; font-size: clamp(2.2rem, 3vw, 3.6rem); line-height: 0.95; letter-spacing: -0.045em; color: var(--text); }
.ritual-panel-detail { position: absolute; inset: 0 0 0 auto; width: 78%; z-index: 4; display: flex; flex-direction: column; justify-content: flex-end; padding: 28px 22px 24px; background: linear-gradient(180deg, rgba(231,227,218,0.10) 0%, rgba(231,227,218,0.08) 18%, rgba(35,39,40,0.56) 55%, rgba(27,31,33,0.82) 100%); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-left: 1px solid rgba(231,227,218,0.10); box-shadow: inset 1px 0 0 rgba(255,255,255,0.03); opacity: 0; transform: translateX(100%); transition: opacity 400ms ease, transform 520ms cubic-bezier(0.16,1,0.3,1); }
.ritual-panel:hover .ritual-panel-detail { opacity: 1; transform: translateX(0); }
.ritual-panel-line { width: 0; height: 1px; margin-bottom: 20px; background: linear-gradient(90deg, rgba(168,138,109,0.88), rgba(231,227,218,0.34)); transition: width 500ms ease 120ms; }
.ritual-panel:hover .ritual-panel-line { width: 100%; }
.ritual-panel-detail-title { margin: 0; font-size: 28px; line-height: 1; letter-spacing: -0.045em; color: var(--text); }
.ritual-panel-detail-text { margin: 14px 0 0; max-width: 28ch; font-size: 14px; line-height: 1.8; color: rgba(231,227,218,0.82); }
.ritual-panel-tags { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.ritual-panel-tags span { display: inline-flex; align-items: center; min-height: 32px; padding: 0 11px; border-radius: 999px; border: 1px solid rgba(231,227,218,0.10); background: rgba(231,227,218,0.04); font-size: 11px; color: rgba(231,227,218,0.76); }

/* STUDIO */
.studio-section { position: relative; }
.studio-shell { max-width: 1500px; margin: 0 auto; padding: 0 24px 24px; }
.studio-frame { position: relative; overflow: hidden; border: 1px solid rgba(45,42,38,0.08); border-radius: 30px; background: radial-gradient(circle at top center, rgba(168,138,109,0.07), transparent 20%), linear-gradient(180deg, var(--paper) 0%, var(--paper-2) 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,0.34), 0 24px 60px rgba(0,0,0,0.08); }
.studio-frame::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(255,255,255,0.22), transparent 14%, transparent 86%, rgba(0,0,0,0.02)), radial-gradient(circle at 18% 14%, rgba(142,165,150,0.04), transparent 18%); }
.studio-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 0.92fr 1.08fr; gap: 44px; align-items: stretch; padding: 88px 34px; }
.studio-copy { display: flex; flex-direction: column; justify-content: space-between; min-width: 0; }
.studio-kicker { margin: 0 0 16px; font-size: 11px; line-height: 1; letter-spacing: 0.12em; text-transform: uppercase; color: var(--bronze); }
.studio-title { margin: 0; max-width: 12ch; font-size: clamp(2.3rem, 4vw, 4.3rem); line-height: 0.94; letter-spacing: -0.065em; color: var(--ink); }
.studio-title .reveal-line { display: block; }
.studio-text { margin: 28px 0 0; max-width: 500px; font-size: 15px; line-height: 1.95; color: var(--ink-soft); }
.studio-note { margin-top: 28px; max-width: 500px; padding-top: 18px; border-top: 1px solid rgba(168,138,109,0.24); font-size: 14px; line-height: 1.85; color: rgba(118,100,84,0.88); }
.studio-points { display: grid; grid-template-columns: 1fr; gap: 14px; margin-top: 32px; }
.studio-point { display: grid; grid-template-columns: 28px 1fr; gap: 16px; align-items: start; padding-top: 16px; border-top: 1px solid rgba(45,42,38,0.08); }
.studio-point:first-child { padding-top: 0; border-top: none; }
.studio-point-index { font-size: 11px; line-height: 1; letter-spacing: 0.12em; text-transform: uppercase; color: var(--bronze); padding-top: 3px; }
.studio-point-title { margin: 0 0 3px; font-size: 16px; line-height: 1.25; letter-spacing: -0.02em; color: var(--ink); }
.studio-point-text { font-size: 14px; line-height: 1.55; color: var(--ink-soft); max-width: 46ch; }
.studio-media { min-width: 0; display: grid; grid-template-rows: 1fr; gap: 18px; }
.studio-main-card { position: relative; min-height: 540px; height: 100%; border-radius: 24px; overflow: hidden; background: #ddd7cf; border: 1px solid rgba(45,42,38,0.08); box-shadow: inset 0 1px 0 rgba(255,255,255,0.25); }
.studio-main-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.studio-main-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.00) 28%, rgba(45,42,38,0.12) 100%), linear-gradient(0deg, rgba(45,42,38,0.18) 0%, rgba(45,42,38,0.00) 30%); pointer-events: none; }
.studio-main-card::before { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: 24px; padding: 1px; background: linear-gradient(160deg, rgba(168,138,109,0.24), transparent 40%, transparent 60%, rgba(142,165,150,0.10)); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }
.studio-main-label { position: absolute; left: 18px; bottom: 18px; z-index: 2; display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 999px; background: rgba(239,236,230,0.62); color: var(--ink); border: 1px solid rgba(45,42,38,0.08); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; }
.studio-subgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.studio-subcard { position: relative; min-height: 210px; border-radius: 22px; overflow: hidden; padding: 22px 20px 20px; border: 1px solid rgba(45,42,38,0.08); background: linear-gradient(180deg, rgba(255,255,255,0.46), rgba(255,255,255,0.22)), rgba(245,240,235,0.72); box-shadow: inset 0 1px 0 rgba(255,255,255,0.4), 0 8px 24px rgba(0,0,0,0.03); }
.studio-subcard-eyebrow { display: inline-block; margin-bottom: 14px; font-size: 11px; line-height: 1; letter-spacing: 0.12em; text-transform: uppercase; color: var(--bronze); }
.studio-subcard-title { margin: 0 0 12px; font-size: 22px; line-height: 1; letter-spacing: -0.04em; color: var(--ink); }
.studio-subcard-text { margin: 0; font-size: 14px; line-height: 1.8; color: var(--ink-soft); max-width: 28ch; }
@media (max-width: 1080px) { .studio-grid { grid-template-columns: 1fr; gap: 34px; } .studio-title { max-width: none; } .studio-main-card { min-height: 460px; } }
@media (max-width: 720px) { .studio-shell { padding: 0 14px 14px; } .studio-grid { padding: 56px 18px; gap: 26px; } .studio-main-card { min-height: 360px; } .studio-subgrid { grid-template-columns: 1fr; } .studio-subcard { min-height: auto; } }

/* ===== HOW IT WORKS — flow diagram ===== */
.flow-inner { position: relative; z-index: 1; padding: 76px 34px 84px; }
.flow-head { max-width: 660px; margin: 0 auto; text-align: center; }
.flow-head .studio-kicker { text-align: center; }
.flow-title { margin: 0 auto; max-width: 20ch; font-size: clamp(2rem, 3.4vw, 3.4rem); line-height: 0.98; letter-spacing: -0.05em; color: var(--ink); }
.flow-title .reveal-line { display: block; }
.flow-intro { margin: 22px auto 0; max-width: 54ch; font-size: 15px; line-height: 1.8; color: var(--ink-soft); }

.flow-wr {
  width: 100%; max-width: 620px; margin: 56px auto 0;
  --flow-card: #ffffff; --flow-detail: #f0efec; --flow-border: #d8d5cc; --flow-border-strong: #bfbcb1;
  --flow-text: #2d2a26; --flow-text-2: #5f5850; --flow-text-muted: #8a8177;
  --blue-bg:#E6F1FB; --blue-fg:#185FA5;
  --purple-bg:#EEEDFE; --purple-fg:#3C3489; --purple-border:#AFA9EC; --purple-icon-bg:#CECBF6; --purple-badge-bg:#CECBF6; --purple-badge-fg:#3C3489; --purple-card-bg:#F4F3FE;
  --teal-bg:#E1F5EE; --teal-fg:#0F6E56;
  --green-bg:#EAF3DE; --green-fg:#3B6D11;
  --amber-bg:#FAEEDA; --amber-fg:#854F0B;
  --dot-1:#185FA5; --dot-2:#7F77DD; --dot-3:#1D9E75;
}
.flow-ws { position: relative; }
.flow-row { display: flex; align-items: center; justify-content: center; position: relative; }
.flow-row-rev { flex-direction: row-reverse; }

/* cards */
.flow-c { position: relative; width: 150px; padding: 20px 12px 16px; border-radius: 14px; text-align: center; transition: transform 0.35s ease, box-shadow 0.35s ease; cursor: pointer; z-index: 2; flex-shrink: 0; background: var(--flow-card); border: 0.5px solid var(--flow-border); box-shadow: 0 6px 16px rgba(45,42,38,0.05); font: inherit; }
.flow-c > * { display: block; }
.flow-c:hover { transform: translateY(-4px) scale(1.03); }
.flow-c:focus-visible { outline: 2px solid var(--bronze); outline-offset: 3px; }
.flow-c.is-active { box-shadow: 0 0 0 1.5px var(--bronze), 0 10px 22px rgba(45,42,38,0.12); }
.flow-c--ai { background: var(--purple-card-bg); border: 1.5px solid var(--purple-border); }

/* icons */
.flow-ci { width: 42px; height: 42px; border-radius: 11px; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; font-size: 21px; }
.flow-ci--blue { background: var(--blue-bg); color: var(--blue-fg); }
.flow-ci--purple { background: var(--purple-icon-bg); color: var(--purple-icon-fg); }
.flow-ci--teal { background: var(--teal-bg); color: var(--teal-fg); }
.flow-ci--green { background: var(--green-bg); color: var(--green-fg); }
.flow-ci--amber { background: var(--amber-bg); color: var(--amber-fg); }

/* labels */
.flow-cl { font-size: 13px; font-weight: 600; color: var(--flow-text); margin: 0 0 3px; letter-spacing: -0.01em; }
.flow-cs { font-size: 10.5px; color: var(--flow-text-2); margin: 0; line-height: 1.35; }
.flow-sn { position: absolute; bottom: -20px; left: 50%; transform: translateX(-50%); font-size: 10px; color: var(--flow-text-muted); font-weight: 600; letter-spacing: 0.08em; }

/* AI badge & pulse */
.flow-badge { position: absolute; top: -9px; left: 50%; transform: translateX(-50%); font-size: 9px; font-weight: 700; letter-spacing: 0.06em; padding: 2px 9px; border-radius: 8px; white-space: nowrap; z-index: 3; background: var(--purple-badge-bg); color: var(--purple-badge-fg); }
.flow-pulse { position: absolute; inset: -5px; border-radius: 18px; border: 1.5px solid var(--purple-border); opacity: 0; animation: flow-pr 3s ease-out infinite; pointer-events: none; }
@keyframes flow-pr { 0% { opacity: 0.45; transform: scale(1); } 100% { opacity: 0; transform: scale(1.1); } }

/* connectors */
.flow-cn { width: 40px; height: 2px; flex-shrink: 0; position: relative; z-index: 1; }
.flow-cn-l { position: absolute; top: 0; left: 0; right: 0; border-top: 1.5px dashed var(--flow-border-strong); }
.flow-cn-d { position: absolute; top: -3px; width: 7px; height: 7px; border-radius: 50%; opacity: 0; }
@keyframes flow-fd { 0% { left: -4px; opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { left: calc(100% - 4px); opacity: 0; } }
.flow-r1c1 .flow-cn-d { background: var(--dot-1); animation: flow-fd 2.4s ease-in-out infinite 0s; }
.flow-r1c2 .flow-cn-d { background: var(--dot-2); animation: flow-fd 2.4s ease-in-out infinite 0.5s; }
.flow-r2c1 .flow-cn-d { background: var(--dot-3); animation: flow-fd 2.4s ease-in-out infinite 2.6s; }
.flow-r2c2 .flow-cn-d { background: var(--dot-2); animation: flow-fd 2.4s ease-in-out infinite 3.2s; }
/* row 2 flows right-to-left (serpentine); reverse the dot travel so it moves with the flow */
@keyframes flow-fd-rev { 0% { left: calc(100% - 4px); opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { left: -4px; opacity: 0; } }
.flow-row-rev .flow-cn-d { animation-name: flow-fd-rev; }

/* turn connector */
.flow-turn { display: flex; justify-content: flex-end; padding: 0 60px; height: 46px; }
.flow-turn-line { width: 2px; height: 100%; border-left: 1.5px dashed var(--flow-border-strong); position: relative; }
.flow-turn-dot { position: absolute; left: -4px; width: 8px; height: 8px; border-radius: 50%; background: var(--dot-2); opacity: 0; animation: flow-down 2.4s ease-in-out infinite 2s; }
@keyframes flow-down { 0% { top: -4px; opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { top: calc(100% - 4px); opacity: 0; } }

/* detail panel */
.flow-det { margin: 32px auto 0; max-width: 520px; min-height: 56px; padding: 16px 22px; background: var(--flow-detail); border: 1px solid var(--flow-border); border-radius: 14px; font-size: 13px; color: var(--flow-text-2); line-height: 1.6; text-align: center; transition: opacity 0.3s; }
.flow-det-t { font-size: 14px; font-weight: 600; color: var(--flow-text); margin: 0 0 4px; }

/* reduced motion */
@media (prefers-reduced-motion: reduce) {
  .flow-cn-d, .flow-turn-dot, .flow-pulse { animation: none !important; opacity: 0; }
  .flow-ws, .flow-c { transition: none !important; }
}

/* mobile: stack the flow vertically */
@keyframes flow-fd-v { 0% { top: -4px; opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { top: calc(100% - 4px); opacity: 0; } }
@media (max-width: 640px) {
  .flow-inner { padding: 52px 16px 60px; }
  .flow-wr { perspective: none; max-width: 300px; }
  .flow-ws { transform: none !important; }
  .flow-ws:hover { transform: none !important; }
  .flow-row { flex-direction: column; }
  .flow-c { width: 100%; }
  .flow-c:hover { transform: none; }
  .flow-sn { bottom: auto; top: 15px; left: auto; right: 15px; transform: none; }
  .flow-cn { width: 2px; height: 26px; }
  .flow-cn-l { top: 0; bottom: 0; left: 50%; right: auto; transform: translateX(-50%); border-top: none; border-left: 1.5px dashed var(--flow-border-strong); }
  .flow-cn-d { top: -4px; left: -3px !important; }
  .flow-r1c1 .flow-cn-d, .flow-r1c2 .flow-cn-d, .flow-r2c1 .flow-cn-d, .flow-r2c2 .flow-cn-d { animation-name: flow-fd-v; }
  .flow-turn { justify-content: center; padding: 0; height: 26px; }
}

/* GROWS WITH YOU (dark) */
.membership-section-v2 { position: relative; }
.membership-shell-v2 { max-width: 1500px; margin: 0 auto; padding: 0 24px 24px; }
.membership-frame-v2 { position: relative; overflow: hidden; border: 1px solid rgba(231,227,218,0.08); border-radius: 30px; background: radial-gradient(circle at 50% 0%, rgba(168,138,109,0.10), transparent 24%), radial-gradient(circle at 12% 20%, rgba(142,165,150,0.05), transparent 20%), linear-gradient(180deg, rgba(25,27,29,0.96), rgba(14,16,17,0.99)); box-shadow: inset 0 1px 0 rgba(255,255,255,0.02), 0 30px 90px rgba(0,0,0,0.20); }
.membership-frame-v2::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(255,255,255,0.015), transparent 16%, transparent 84%, rgba(255,255,255,0.015)), radial-gradient(circle at 78% 34%, rgba(168,138,109,0.05), transparent 18%); }
.membership-inner-v2 { position: relative; z-index: 1; padding: 84px 34px 34px; }
.membership-top-v2 { display: flex; flex-direction: column; align-items: center; text-align: center; }
.membership-eyebrow-v2 { display: inline-flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 999px; border: 1px solid rgba(168,138,109,0.24); background: rgba(18,21,23,0.22); backdrop-filter: blur(12px); color: rgba(231,227,218,0.82); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; }
.membership-eyebrow-v2::before { content: ""; width: 8px; height: 8px; border-radius: 999px; background: var(--bronze); box-shadow: 0 0 0 7px rgba(168,138,109,0.08); }
.membership-title-v2 { margin: 22px 0 0; max-width: 18ch; font-size: clamp(2.5rem, 4.5vw, 4.9rem); line-height: 0.94; letter-spacing: -0.065em; color: var(--text); }
.membership-title-v2 .reveal-line { display: block; }
.membership-copy-v2 { margin-top: 24px; display: flex; flex-direction: column; align-items: center; }
.membership-text-v2 { margin: 0; max-width: 760px; font-size: 16px; line-height: 1.9; color: rgba(231,227,218,0.80); }
.membership-main-v2 { display: grid; grid-template-columns: 0.72fr 1.28fr; gap: 30px; align-items: start; margin-top: 52px; }
.membership-points-v2 { display: grid; gap: 26px; padding-top: 6px; }
.membership-point-v2 { display: grid; grid-template-columns: 30px 1fr; gap: 14px; align-items: start; padding-top: 16px; border-top: 1px solid rgba(231,227,218,0.08); }
.membership-point-v2:first-child { padding-top: 0; border-top: none; }
.membership-point-number-v2 { font-size: 11px; line-height: 1; letter-spacing: 0.12em; text-transform: uppercase; color: var(--bronze); padding-top: 6px; }
.membership-point-content-v2 { min-width: 0; }
.membership-point-title-v2 { margin: 0 0 8px; font-size: 22px; line-height: 1.15; letter-spacing: -0.03em; color: var(--text); }
.membership-point-text-v2 { margin: 0; font-size: 15px; line-height: 1.8; color: rgba(169,177,172,0.82); max-width: 34ch; }
.membership-cards-v2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.membership-card-v2 { position: relative; overflow: hidden; border-radius: 30px; border: 1px solid rgba(231,227,218,0.08); background: radial-gradient(circle at top left, rgba(168,138,109,0.08), transparent 24%), linear-gradient(180deg, rgba(31,34,36,0.96), rgba(18,20,21,0.99)); box-shadow: inset 0 1px 0 rgba(255,255,255,0.02), 0 10px 24px rgba(0,0,0,0.14); transition: transform 220ms ease, border-color 220ms ease; display: flex; flex-direction: column; }
.membership-card-v2:hover { transform: translateY(-4px); border-color: rgba(168,138,109,0.20); }
.membership-card-v2.featured { border-color: rgba(168,138,109,0.55); background: linear-gradient(180deg, rgba(168,138,109,0.96), rgba(139,113,88,0.96)); }
.membership-card-v2.featured:hover { border-color: rgba(168,138,109,0.7); }
/* legibility for content sitting on the bronze featured card */
.membership-card-v2.featured .membership-card-label-v2 { color: rgba(255,255,255,0.80); }
.membership-card-v2.featured .membership-card-badge-v2 { border-color: rgba(255,255,255,0.38); background: rgba(255,255,255,0.16); color: #fff; }
.membership-card-v2.featured .membership-card-name-v2 { color: #fff; }
.membership-card-v2.featured .membership-card-desc-v2 { color: rgba(255,255,255,0.88); }
.membership-card-v2.featured .membership-includes-v2 { color: rgba(255,255,255,0.80); }
.membership-card-v2.featured .membership-includes-note-v2 { color: rgba(255,255,255,0.82); }
.membership-card-v2.featured .membership-feature-row-v2 span { color: rgba(255,255,255,0.92); }
.membership-card-v2.featured .membership-feature-row-v2 iconify-icon { color: #ffffff; }
.membership-card-v2.featured .membership-plan-btn-v2.secondary { background: rgba(0,0,0,0.16); border-color: rgba(255,255,255,0.30); color: #fff; }
.membership-card-v2.featured .membership-plan-btn-v2.secondary:hover { border-color: rgba(255,255,255,0.55); }
/* Second (platform) card — light/whitish variant */
.membership-card-v2:not(.featured) { border-color: rgba(45,42,38,0.10); background: linear-gradient(180deg, #f2eee8 0%, #e6e1d8 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,0.6), 0 10px 24px rgba(0,0,0,0.10); }
.membership-card-v2:not(.featured):hover { border-color: rgba(168,138,109,0.35); }
.membership-card-v2:not(.featured) .membership-card-label-v2 { color: rgba(45,42,38,0.62); }
.membership-card-v2:not(.featured) .membership-card-name-v2 { color: var(--ink); }
.membership-card-v2:not(.featured) .membership-card-desc-v2 { color: var(--ink-soft); }
.membership-card-v2:not(.featured) .membership-includes-v2 { color: rgba(45,42,38,0.62); }
.membership-card-v2:not(.featured) .membership-includes-note-v2 { color: rgba(95,88,80,0.82); }
.membership-card-v2:not(.featured) .membership-feature-row-v2 span { color: rgba(45,42,38,0.88); }
.membership-card-v2:not(.featured) .membership-feature-row-v2 iconify-icon { color: var(--bronze); }
.membership-card-v2:not(.featured) .membership-plan-btn-v2.secondary { background: rgba(45,42,38,0.05); border-color: rgba(45,42,38,0.16); color: var(--ink); }
.membership-card-v2:not(.featured) .membership-plan-btn-v2.secondary:hover { border-color: rgba(168,138,109,0.4); }
.membership-card-top-v2 { padding: 24px 22px 0; }
.membership-card-topbar-v2 { display: flex; justify-content: space-between; align-items: center; gap: 10px; min-height: 28px; margin-bottom: 20px; }
.membership-card-label-v2 { font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(231,227,218,0.62); }
.membership-card-badge-v2 { display: inline-flex; align-items: center; min-height: 28px; padding: 0 10px; border-radius: 999px; border: 1px solid rgba(168,138,109,0.18); background: rgba(168,138,109,0.08); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--bronze); }
.membership-card-name-v2 { margin: 0; font-size: 30px; line-height: 0.98; letter-spacing: -0.05em; color: var(--text); }
.membership-card-desc-v2 { margin: 14px 0 0; font-size: 15px; line-height: 1.8; color: rgba(169,177,172,0.82); min-height: 108px; }
.membership-card-actions-v2 { padding: 20px 22px 0; display: grid; gap: 12px; }
.membership-plan-btn-v2 { display: inline-flex; align-items: center; justify-content: center; width: 100%; min-height: 48px; border-radius: 999px; text-decoration: none; font-size: 14px; font-weight: 500; transition: transform 180ms ease, background 180ms ease, border-color 180ms ease; }
.membership-plan-btn-v2.primary { background: linear-gradient(180deg, rgba(42,37,33,0.98), rgba(24,22,20,1)); color: var(--text); border: 1px solid rgba(255,255,255,0.16); box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 8px 20px rgba(0,0,0,0.28); }
.membership-plan-btn-v2.primary:hover { transform: translateY(-1px); }
.membership-plan-btn-v2.secondary { background: rgba(231,227,218,0.04); color: var(--text); border: 1px solid rgba(231,227,218,0.08); }
.membership-plan-btn-v2.secondary:hover { transform: translateY(-1px); border-color: rgba(168,138,109,0.18); }
.membership-card-bottom-v2 { padding: 22px 22px 24px; }
.membership-includes-v2 { margin: 0 0 14px; font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(231,227,218,0.62); }
.membership-includes-note-v2 { margin: 0 0 18px; font-size: 14px; line-height: 1.7; color: rgba(169,177,172,0.78); }
.membership-feature-list-v2 { display: grid; gap: 12px; }
.membership-feature-row-v2 { display: grid; grid-template-columns: 18px 1fr; gap: 10px; align-items: start; }
.membership-feature-row-v2 iconify-icon { color: var(--bronze); margin-top: 2px; }
.membership-feature-row-v2 span { font-size: 15px; line-height: 1.7; color: rgba(231,227,218,0.80); }
@media (max-width: 1080px) { .membership-main-v2 { grid-template-columns: 1fr; } .membership-title-v2 { max-width: none; } .membership-card-desc-v2 { min-height: 0; } }
@media (max-width: 720px) { .membership-shell-v2 { padding: 0 14px 14px; } .membership-inner-v2 { padding: 56px 18px 18px; } .membership-cards-v2 { grid-template-columns: 1fr; } .membership-card-name-v2 { font-size: 26px; } .membership-title-v2 { max-width: 12ch; } }

/* OUTCOMES (paper) */
.outcomes-section-v1 { position: relative; }
.outcomes-shell-v1 { max-width: 1500px; margin: 0 auto; padding: 0 24px 24px; }
.outcomes-frame-v1 { position: relative; overflow: hidden; border: 1px solid rgba(45,42,38,0.08); border-radius: 30px; background: radial-gradient(circle at top center, rgba(168,138,109,0.05), transparent 22%), radial-gradient(circle at 14% 18%, rgba(142,165,150,0.04), transparent 20%), linear-gradient(180deg, #f2eee8 0%, #e8e3db 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,0.52), 0 24px 60px rgba(0,0,0,0.06); }
.outcomes-frame-v1::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(255,255,255,0.18), transparent 18%, transparent 82%, rgba(255,255,255,0.10)), radial-gradient(circle at 84% 18%, rgba(142,165,150,0.04), transparent 20%); }
.outcomes-inner-v1 { position: relative; z-index: 1; padding: 84px 34px; }
.outcomes-top-v1 { display: grid; grid-template-columns: 1fr; gap: 18px; margin-bottom: 48px; }
.outcomes-eyebrow-v1 { display: inline-flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 999px; border: 1px solid rgba(168,138,109,0.18); background: rgba(255,255,255,0.42); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); color: rgba(45,42,38,0.72); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; width: fit-content; }
.outcomes-eyebrow-v1::before { content: ""; width: 8px; height: 8px; border-radius: 999px; background: var(--bronze); box-shadow: 0 0 0 7px rgba(168,138,109,0.08); }
.outcomes-title-v1 { margin: 0; max-width: none; font-size: clamp(2.5rem, 4.5vw, 4.9rem); line-height: 0.92; letter-spacing: -0.065em; color: var(--ink); }
.outcomes-title-v1 .reveal-line { display: block; }
.outcomes-text-v1 { margin: 2px 0 0; max-width: 700px; font-size: 16px; line-height: 1.9; color: rgba(95,88,80,0.88); }
.outcomes-grid-v1 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; align-items: start; }
.outcome-card-v1 { min-width: 0; border-radius: 30px; border: 1px solid rgba(45,42,38,0.06); background: linear-gradient(180deg, rgba(255,255,255,0.34), rgba(255,255,255,0.14)), rgba(255,255,255,0.18); box-shadow: inset 0 1px 0 rgba(255,255,255,0.62), 0 18px 42px rgba(0,0,0,0.06); padding: 20px 20px 22px; }
.outcome-card-media-v1 { position: relative; overflow: hidden; min-height: 430px; border-radius: 22px; background: #d8d3cb; border: 1px solid rgba(45,42,38,0.06); box-shadow: inset 0 1px 0 rgba(255,255,255,0.20), 0 8px 22px rgba(0,0,0,0.04); }
.outcome-card-image-v1 { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 700ms ease, filter 700ms ease; filter: saturate(0.84) brightness(0.96); }
.outcome-card-v1:hover .outcome-card-image-v1 { transform: scale(1.035); filter: saturate(0.90) brightness(0.93); }
.outcome-card-media-v1::after { content: ""; position: absolute; inset: 0; border-radius: 22px; background: linear-gradient(180deg, rgba(24,21,18,0.00) 0%, rgba(24,21,18,0.04) 58%, rgba(24,21,18,0.16) 100%); pointer-events: none; }
.outcome-card-frame-v1 { position: absolute; inset: 16px; z-index: 2; border-radius: 16px; border: 1px solid rgba(168,138,109,0.18); opacity: 0.82; transition: border-color 220ms ease, opacity 220ms ease; }
.outcome-card-v1:hover .outcome-card-frame-v1 { border-color: rgba(168,138,109,0.26); opacity: 1; }
.outcome-card-body-v1 { padding: 16px 8px 0; border-bottom: none; }
.outcome-index-v1 { display: inline-flex; align-items: center; min-height: 30px; padding: 0 12px; margin: 0 0 14px; border-radius: 999px; border: 1px solid rgba(168,138,109,0.14); background: rgba(168,138,109,0.07); font-size: 10px; line-height: 1; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(118,100,84,0.88); }
.outcome-title-v1 { margin: 0; max-width: none; font-size: 29px; line-height: 1; letter-spacing: -0.05em; color: var(--ink); }
.outcome-text-v1 { margin: 18px 0 0; max-width: none; font-size: 14px; line-height: 1.95; color: rgba(95,88,80,0.88); }
@media (max-width: 1080px) { .outcomes-text-v1 { max-width: 700px; } .outcomes-grid-v1 { grid-template-columns: 1fr; gap: 22px; } .outcome-card-media-v1 { min-height: 360px; } }
@media (max-width: 720px) { .outcomes-shell-v1 { padding: 0 14px 14px; } .outcomes-inner-v1 { padding: 56px 18px; } .outcomes-text-v1 { max-width: 100%; } .outcome-card-v1 { padding: 14px 14px 18px; border-radius: 24px; } .outcome-card-media-v1 { min-height: 320px; border-radius: 20px; } .outcome-card-media-v1::after { border-radius: 20px; } .outcome-card-frame-v1 { inset: 14px; border-radius: 15px; } .outcome-title-v1 { font-size: 26px; } }

/* TESTIMONIALS (dark) */
.testimonials-section-v1 { position: relative; }
.testimonials-shell-v1 { max-width: 1500px; margin: 0 auto; padding: 0 24px 24px; }
.testimonials-frame-v1 { position: relative; overflow: hidden; border: 1px solid rgba(231,227,218,0.08); border-radius: 30px; background: radial-gradient(circle at 18% 16%, rgba(168,138,109,0.10), transparent 22%), radial-gradient(circle at 82% 78%, rgba(142,165,150,0.04), transparent 24%), linear-gradient(135deg, rgba(24,22,20,0.96) 0%, rgba(14,16,17,0.99) 52%, rgba(11,13,14,1) 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,0.02), 0 30px 90px rgba(0,0,0,0.20); }
.testimonials-frame-v1::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(255,255,255,0.012), transparent 18%, transparent 82%, rgba(255,255,255,0.012)), radial-gradient(circle at 75% 20%, rgba(168,138,109,0.035), transparent 18%); }
.testimonials-inner-v1 { position: relative; z-index: 1; padding: 84px 34px; }
.testimonials-head-v1 { max-width: 920px; margin: 0 auto 48px; text-align: center; }
.testimonials-eyebrow-v1 { display: inline-flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 999px; border: 1px solid rgba(168,138,109,0.18); background: rgba(255,255,255,0.03); backdrop-filter: blur(10px); color: rgba(231,227,218,0.76); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; }
.testimonials-eyebrow-v1::before { content: ""; width: 8px; height: 8px; border-radius: 999px; background: var(--bronze); box-shadow: 0 0 0 7px rgba(168,138,109,0.08); }
.testimonials-title-v1 { margin: 22px 0 0; font-size: clamp(2.5rem, 4.5vw, 4.9rem); line-height: 0.94; letter-spacing: -0.065em; color: var(--text); }
.testimonials-title-v1 .reveal-line { display: block; }
.testimonials-text-v1 { margin: 22px auto 0; max-width: 760px; font-size: 16px; line-height: 1.9; color: rgba(169,177,172,0.90); }
.testimonials-grid-v1 { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 20px; align-items: stretch; }
.testimonial-featured-v1 { position: relative; min-height: 420px; border-radius: 28px; overflow: hidden; border: 1px solid rgba(231,227,218,0.08); background: radial-gradient(circle at top left, rgba(168,138,109,0.12), transparent 24%), linear-gradient(180deg, rgba(35,31,28,0.82), rgba(18,20,21,0.94)); box-shadow: inset 0 1px 0 rgba(255,255,255,0.03), 0 12px 28px rgba(0,0,0,0.16); padding: 30px 30px 26px; display: flex; flex-direction: column; justify-content: space-between; }
.testimonial-featured-top-v1 { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.testimonial-rating-v1 { display: inline-flex; gap: 6px; color: rgba(168,138,109,0.92); }
.testimonial-rating-v1 iconify-icon { font-size: 16px; }
.testimonial-badge-v1 { display: inline-flex; align-items: center; min-height: 30px; padding: 0 12px; border-radius: 999px; border: 1px solid rgba(231,227,218,0.08); background: rgba(255,255,255,0.03); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(231,227,218,0.64); }
.testimonial-quote-v1 { margin: 28px 0 0; max-width: 15ch; font-size: clamp(2.1rem, 3.2vw, 3.3rem); line-height: 0.98; letter-spacing: -0.045em; color: var(--text); }
.testimonial-body-v1 { margin: 18px 0 0; max-width: 62ch; font-size: 16px; line-height: 1.95; color: rgba(169,177,172,0.88); }
.testimonial-featured-footer-v1 { margin-top: 28px; padding-top: 20px; border-top: 1px solid rgba(231,227,218,0.08); display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.testimonial-person-v1 { display: flex; flex-direction: column; gap: 4px; }
.testimonial-name-v1 { font-size: 15px; font-weight: 500; color: var(--text); }
.testimonial-role-v1 { font-size: 13px; color: rgba(169,177,172,0.72); }
.testimonial-meta-v1 { font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(168,138,109,0.72); }
.testimonials-side-v1 { display: grid; grid-template-rows: repeat(3, minmax(0, 1fr)); gap: 20px; }
.testimonial-card-v1 { position: relative; min-height: 126px; padding: 22px 20px 20px; border-radius: 22px; border: 1px solid rgba(231,227,218,0.08); background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.015)); box-shadow: inset 0 1px 0 rgba(255,255,255,0.02); transition: transform 220ms ease, border-color 220ms ease; }
.testimonial-card-v1:hover { transform: translateY(-3px); border-color: rgba(168,138,109,0.20); }
.testimonial-card-head-v1 { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 14px; }
.testimonial-card-name-v1 { font-size: 14px; font-weight: 500; color: var(--text); }
.testimonial-card-role-v1 { font-size: 12px; color: rgba(169,177,172,0.68); }
.testimonial-card-text-v1 { font-size: 14px; line-height: 1.8; color: rgba(169,177,172,0.84); }
@media (max-width: 1080px) { .testimonials-grid-v1 { grid-template-columns: 1fr; } .testimonials-side-v1 { grid-template-columns: 1fr; grid-template-rows: auto; } .testimonial-featured-v1 { min-height: auto; } .testimonial-quote-v1 { max-width: none; } }
@media (max-width: 720px) { .testimonials-shell-v1 { padding: 0 14px 14px; } .testimonials-inner-v1 { padding: 56px 18px; } .testimonials-title-v1 { font-size: clamp(2.2rem, 10vw, 3.6rem); } .testimonial-featured-v1 { padding: 24px 20px 20px; } .testimonial-quote-v1 { font-size: clamp(1.9rem, 8vw, 2.8rem); } }


/* WHO IT'S FOR — business types */
.audience-grid-v1 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.audience-card-v1 { position: relative; padding: 26px 22px 24px; border-radius: 22px; border: 1px solid rgba(231,227,218,0.08); background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.015)); box-shadow: inset 0 1px 0 rgba(255,255,255,0.02); transition: transform 220ms ease, border-color 220ms ease, background 220ms ease; }
.audience-card-v1:hover { transform: translateY(-4px); border-color: rgba(168,138,109,0.22); background: linear-gradient(180deg, rgba(168,138,109,0.06), rgba(255,255,255,0.015)); }
.audience-icon-v1 { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 14px; border: 1px solid rgba(168,138,109,0.20); background: rgba(168,138,109,0.10); color: var(--bronze); font-size: 24px; margin-bottom: 18px; }
.audience-name-v1 { margin: 0 0 8px; font-size: 20px; line-height: 1.05; letter-spacing: -0.03em; color: var(--text); }
.audience-text-v1 { margin: 0; font-size: 14px; line-height: 1.7; color: rgba(169,177,172,0.82); }
@media (max-width: 1080px) { .audience-grid-v1 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .audience-grid-v1 { grid-template-columns: 1fr; } }

/* FAQ + FINAL CTA (paper) */
.final-section-v1 { position: relative; }
.final-shell-v1 { max-width: 1500px; margin: 0 auto; padding: 0 24px 24px; }
.final-frame-v1 { position: relative; overflow: hidden; border: 1px solid rgba(45,42,38,0.08); border-radius: 30px; background: radial-gradient(circle at top center, rgba(168,138,109,0.05), transparent 20%), linear-gradient(180deg, #f2eee8 0%, #e8e2d9 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,0.5), 0 24px 60px rgba(0,0,0,0.06); }
.final-frame-v1::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(255,255,255,0.18), transparent 18%, transparent 82%, rgba(255,255,255,0.08)), radial-gradient(circle at 84% 16%, rgba(142,165,150,0.05), transparent 20%); }
.final-inner-v1 { position: relative; z-index: 1; padding: 84px 34px 34px; }
.final-head-v1 { max-width: 1040px; margin: 0 auto 42px; text-align: center; }
.final-eyebrow-v1 { display: inline-flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 999px; border: 1px solid rgba(168,138,109,0.18); background: rgba(255,255,255,0.42); backdrop-filter: blur(10px); color: rgba(45,42,38,0.72); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; }
.final-eyebrow-v1::before { content: ""; width: 8px; height: 8px; border-radius: 999px; background: var(--bronze); box-shadow: 0 0 0 7px rgba(168,138,109,0.08); }
.final-title-v1 { margin: 22px 0 0; font-size: clamp(2.4rem, 4.5vw, 4.8rem); line-height: 0.94; letter-spacing: -0.065em; color: var(--ink); }
.final-title-v1 .reveal-line { display: block; }
.final-text-v1 { margin: 22px auto 0; max-width: 760px; font-size: 16px; line-height: 1.9; color: rgba(95,88,80,0.88); }
.faq-list-v1 { display: grid; gap: 12px; max-width: 760px; margin: 0 auto; }
.faq-item-v1 { border: 1px solid rgba(45,42,38,0.08); border-radius: 20px; background: linear-gradient(180deg, rgba(255,255,255,0.48), rgba(255,255,255,0.22)), rgba(245,240,235,0.72); box-shadow: inset 0 1px 0 rgba(255,255,255,0.55), 0 8px 20px rgba(0,0,0,0.03); overflow: hidden; transition: border-color 220ms ease, box-shadow 220ms ease, background 220ms ease; }
.faq-item-v1:hover { border-color: rgba(168,138,109,0.20); }
.faq-item-v1.active { border-color: rgba(168,138,109,0.26); background: linear-gradient(180deg, rgba(255,255,255,0.6), rgba(255,255,255,0.3)), rgba(245,240,235,0.82); box-shadow: inset 0 1px 0 rgba(255,255,255,0.6), 0 12px 28px rgba(0,0,0,0.05); }
.faq-question-v1 { width: 100%; background: transparent; border: none; outline: none; cursor: pointer; padding: 20px 20px 18px; display: flex; align-items: center; justify-content: space-between; gap: 16px; text-align: left; }
.faq-question-v1 span { font-size: 18px; line-height: 1.4; letter-spacing: -0.02em; color: var(--ink); font-weight: 500; }
.faq-icon-v1 { width: 32px; height: 32px; flex: 0 0 auto; border-radius: 999px; border: 1px solid rgba(168,138,109,0.18); background: rgba(168,138,109,0.08); display: inline-flex; align-items: center; justify-content: center; color: var(--bronze); font-size: 18px; line-height: 1; transition: transform 220ms ease, background 220ms ease, border-color 220ms ease; }
.faq-item-v1.active .faq-icon-v1 { transform: rotate(45deg); background: rgba(168,138,109,0.14); border-color: rgba(168,138,109,0.26); }
.faq-answer-v1 { max-height: 0; overflow: hidden; transition: max-height 320ms ease; }
.faq-answer-inner-v1 { padding: 0 20px 20px; font-size: 15px; line-height: 1.85; color: rgba(95,88,80,0.84); max-width: 60ch; }
.faq-note-v1 { margin: 26px auto 0; max-width: 60ch; text-align: center; font-size: 15px; line-height: 1.9; color: rgba(95,88,80,0.72); }
.final-cta-wrap-v1 { margin-top: 46px; }
.final-cta-panel-v1 { position: relative; overflow: hidden; border-radius: 28px; border: 1px solid rgba(168,138,109,0.14); background: radial-gradient(circle at top left, rgba(168,138,109,0.10), transparent 22%), linear-gradient(180deg, rgba(255,255,255,0.55), rgba(255,255,255,0.26)), rgba(239,236,230,0.82); box-shadow: inset 0 1px 0 rgba(255,255,255,0.58), 0 16px 34px rgba(0,0,0,0.05); padding: 34px 28px 28px; }
.final-cta-panel-v1::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(135deg, rgba(168,138,109,0.08), transparent 32%), radial-gradient(circle at 85% 20%, rgba(142,165,150,0.07), transparent 22%); }
.final-cta-grid-v1 { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: end; }
.final-cta-copy-v1 { min-width: 0; }
.final-cta-kicker-v1 { display: inline-block; margin-bottom: 12px; font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--bronze); }
.final-cta-title-v1 { margin: 0; font-size: clamp(2rem, 3.8vw, 3.7rem); line-height: 0.96; letter-spacing: -0.055em; color: var(--ink); }
.final-cta-text-v1 { margin: 18px 0 0; max-width: 54ch; font-size: 15px; line-height: 1.9; color: rgba(95,88,80,0.86); }
.final-cta-actions-v1 { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-end; }
.final-btn-v1 { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 22px; border-radius: 999px; text-decoration: none; font-size: 13px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; transition: transform 180ms ease, background 180ms ease, border-color 180ms ease; }
.final-btn-v1.primary { background: linear-gradient(180deg, rgba(168,138,109,0.96), rgba(139,113,88,0.96)); color: white; box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 8px 18px rgba(0,0,0,0.12); }
.final-btn-v1.primary:hover { transform: translateY(-1px); }
.final-btn-v1.secondary { border: 1px solid rgba(45,42,38,0.10); background: rgba(255,255,255,0.35); color: var(--ink); }
.final-btn-v1.secondary:hover { transform: translateY(-1px); border-color: rgba(168,138,109,0.20); }
@media (max-width: 1080px) { .final-cta-grid-v1 { grid-template-columns: 1fr; } .final-cta-actions-v1 { justify-content: flex-start; } }
@media (max-width: 720px) { .final-shell-v1 { padding: 0 14px 14px; } .final-inner-v1 { padding: 56px 18px 18px; } .final-title-v1 { font-size: clamp(2.1rem, 10vw, 3.4rem); } .faq-question-v1 span { font-size: 16px; } .final-cta-panel-v1 { padding: 24px 18px 18px; } }

/* FOOTER */
.site-footer-v1 { position: relative; }
.site-footer-shell-v1 { max-width: 1500px; margin: 0 auto; padding: 0 24px 24px; }
.site-footer-frame-v1 { position: relative; overflow: hidden; border: 1px solid rgba(231,227,218,0.08); border-radius: 30px; background: radial-gradient(circle at 18% 18%, rgba(168,138,109,0.08), transparent 22%), radial-gradient(circle at 82% 78%, rgba(142,165,150,0.04), transparent 24%), linear-gradient(135deg, rgba(20,19,18,0.98) 0%, rgba(12,14,15,0.99) 54%, rgba(9,10,11,1) 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,0.02), 0 24px 60px rgba(0,0,0,0.16); }
.site-footer-frame-v1::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(255,255,255,0.015), transparent 18%, transparent 82%, rgba(255,255,255,0.01)), radial-gradient(circle at 75% 20%, rgba(168,138,109,0.03), transparent 18%); }
.site-footer-inner-v1 { position: relative; z-index: 1; padding: 52px 34px 24px; }
.site-footer-top-v1 { display: grid; grid-template-columns: 1.2fr 0.8fr 0.8fr; gap: 28px; align-items: start; }
.site-footer-brand-v1 { max-width: 460px; }
.site-footer-mark-v1 { width: 42px; height: 42px; border-radius: 999px; border: 1px solid rgba(231,227,218,0.14); background: rgba(231,227,218,0.04); display: inline-flex; align-items: center; justify-content: center; color: var(--text); font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 16px; }
.site-footer-name-v1 { margin: 0; font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 0.95; letter-spacing: -0.05em; color: var(--text); }
.site-footer-text-v1 { margin: 18px 0 0; font-size: 15px; line-height: 1.9; color: rgba(169,177,172,0.82); max-width: 40ch; }
.site-footer-heading-v1 { margin: 0 0 14px; font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(168,138,109,0.82); }
.site-footer-links-v1 { display: grid; gap: 10px; }
.site-footer-link-v1 { color: rgba(231,227,218,0.78); text-decoration: none; font-size: 15px; line-height: 1.7; transition: color 180ms ease, transform 180ms ease; }
.site-footer-link-v1:hover { color: var(--text); transform: translateX(2px); }
.site-footer-contact-v1 { display: grid; gap: 10px; }
.site-footer-contact-item-v1 { color: rgba(169,177,172,0.82); text-decoration: none; font-size: 15px; line-height: 1.7; transition: color 180ms ease; }
.site-footer-contact-item-v1:hover { color: var(--text); }
.site-footer-bottom-v1 { margin-top: 34px; padding-top: 18px; border-top: 1px solid rgba(231,227,218,0.08); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.site-footer-meta-v1 { font-size: 13px; color: rgba(169,177,172,0.64); }
.site-footer-legal-v1 { display: flex; flex-wrap: wrap; gap: 16px; }
.site-footer-legal-v1 a { font-size: 13px; color: rgba(169,177,172,0.64); text-decoration: none; transition: color 180ms ease; }
.site-footer-legal-v1 a:hover { color: var(--text); }
@media (max-width: 1080px) { .site-footer-top-v1 { grid-template-columns: 1fr 1fr; } .site-footer-brand-v1 { grid-column: 1 / -1; } }
@media (max-width: 720px) { .site-footer-shell-v1 { padding: 0 14px 14px; } .site-footer-inner-v1 { padding: 34px 18px 18px; } .site-footer-top-v1 { grid-template-columns: 1fr; gap: 24px; } .site-footer-bottom-v1 { flex-direction: column; align-items: flex-start; } }

/* ANIMATION / REVEAL */
@keyframes sonar { 0% { transform: scale(1); opacity: 0.8; } 100% { transform: scale(2.5); opacity: 0; } }
.reveal-trigger .reveal-word { display: inline-block; opacity: 0; transform: translateY(24px); transition: opacity 0.9s cubic-bezier(0.16,1,0.3,1), transform 0.9s cubic-bezier(0.16,1,0.3,1); }
.reveal-trigger.is-revealed .reveal-word { opacity: 1; transform: translateY(0); }
.reveal-trigger .reveal-line { opacity: 0; transform: translateY(24px); transition: opacity 0.9s cubic-bezier(0.16,1,0.3,1), transform 0.9s cubic-bezier(0.16,1,0.3,1); }
.reveal-trigger.is-revealed .reveal-line { opacity: 1; transform: translateY(0); }
.reveal-para { opacity: 0; transform: translateY(40px); transition: opacity 1.1s cubic-bezier(0.16,1,0.3,1), transform 1.1s cubic-bezier(0.16,1,0.3,1); }
.reveal-para.is-revealed { opacity: 1; transform: translateY(0); }
.reveal-fade { opacity: 0; transform: translateY(12px); transition: opacity 1s cubic-bezier(0.16,1,0.3,1), transform 1s cubic-bezier(0.16,1,0.3,1); }
.reveal-fade.is-revealed { opacity: 1; transform: translateY(0); }
.reveal-img { opacity: 0; transform: scale(1.05); transition: opacity 1.4s cubic-bezier(0.16,1,0.3,1), transform 1.4s cubic-bezier(0.16,1,0.3,1); }
.reveal-img.is-revealed { opacity: 1; transform: scale(1.01); }

/* RESPONSIVE */
@media (max-width: 1080px) {
.nav-wrap { width: calc(100% - 36px); }
.nav-pill nav { display: none !important; }
.nav-book-btn { display: none; }
.mobile-menu-btn { display: inline-flex; }
.method-layout { grid-template-columns: 1fr; gap: 28px; }
.method-right-text { margin-bottom: 20px; }
.ritual-panels-header-grid { gap: 18px; }
.ritual-panels-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); min-height: auto; }
.ritual-panel { min-height: 460px; }
}
@media (max-width: 720px) {
.hero-shell { padding: 14px; }
.top-image-zone { min-height: 700px; }
.hero-copy { min-height: 700px; padding-top: 120px; padding-bottom: 68px; }
.bottom-paper { padding: 30px 22px 36px; }
.hero-text { font-size: 15px; }
.nav-pill { padding: 12px 14px; }
.section-title { font-size: clamp(2rem, 8vw, 3rem); }
.method-cards-grid { grid-template-columns: 1fr; gap: 18px; }
.method-card { min-height: 360px; }
.ritual-panels-shell { padding: 0 14px 14px; }
.ritual-panels-header { padding: 56px 18px 22px; }
.ritual-panels-grid { grid-template-columns: 1fr; }
.ritual-panel { min-height: 380px; border-left: none; border-top: 1px solid rgba(231,227,218,0.06); }
.ritual-panel:first-child { border-top: none; }
.ritual-panel-detail { inset: auto 0 0 0; width: 100%; opacity: 1; transform: translateX(0); background: linear-gradient(180deg, rgba(27,31,33,0.10) 0%, rgba(33,38,39,0.80) 100%); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-left: none; }
.ritual-panel-base { opacity: 0; transform: none; }
.ritual-panel-line { width: 100%; }
}
.editorial-eyebrow.reveal-fade { opacity: 0; transform: translateY(16px); filter: blur(4px); transition: opacity 0.7s cubic-bezier(0.16,1,0.3,1), transform 0.7s cubic-bezier(0.16,1,0.3,1), filter 0.7s cubic-bezier(0.16,1,0.3,1); }
.editorial-eyebrow.reveal-fade.is-revealed { opacity: 1; transform: translateY(0); filter: blur(0); }
.editorial-para.reveal-para { opacity: 0; transform: translateY(18px); transition: opacity 0.85s cubic-bezier(0.16,1,0.3,1), transform 0.85s cubic-bezier(0.16,1,0.3,1); }
.editorial-para.reveal-para.is-revealed { opacity: 1; transform: translateY(0); }
.editorial-panel.reveal-fade { opacity: 0; transform: translateY(24px) scale(1.02); transition: opacity 1s cubic-bezier(0.16,1,0.3,1), transform 1s cubic-bezier(0.16,1,0.3,1); }
.editorial-panel.reveal-fade.is-revealed { opacity: 1; transform: translateY(0) scale(1); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; } }

/* ===== MODALS (booking + send-an-invoice) — ported ===== */
body.modal-open { overflow: hidden; }
.modal-overlay { position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(8,9,10,0.72); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); opacity: 0; visibility: hidden; transition: opacity 260ms ease, visibility 260ms ease; }
.modal-overlay.open { opacity: 1; visibility: visible; }
.modal-overlay[hidden] { display: none; }
.modal { width: 100%; max-width: 620px; max-height: calc(100vh - 48px); overflow-y: auto; background: linear-gradient(180deg, rgba(28,33,34,0.98), rgba(14,16,17,0.99)); border: 1px solid rgba(231,227,218,0.12); border-radius: 24px; box-shadow: 0 30px 90px rgba(0,0,0,0.45); padding: 28px 28px 24px; transform: translateY(18px) scale(0.98); transition: transform 300ms cubic-bezier(0.16,1,0.3,1); color: var(--text-soft); }
.modal-overlay.open .modal { transform: none; }
.modal--form { max-width: 480px; }
.modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.modal-head .eyebrow { display: inline-flex; padding: 0; border: none; background: none; backdrop-filter: none; font-family: 'Miranda Sans', sans-serif; font-size: 11px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--bronze); }
.modal-head h2 { font-family: 'Miranda Sans', sans-serif; font-size: 24px; font-weight: 600; letter-spacing: -0.03em; line-height: 1.2; margin: 8px 0 0; color: var(--text); }
.modal-head p { color: var(--text-soft); font-size: 14px; line-height: 1.6; margin-top: 8px; }
.modal-close { flex: none; width: 34px; height: 34px; border-radius: 12px; border: 1px solid rgba(231,227,218,0.12); background: rgba(231,227,218,0.04); color: var(--text-soft); font-size: 18px; line-height: 1; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: color 200ms ease, border-color 200ms ease, background-color 200ms ease; }
.modal-close:hover { color: var(--text); border-color: rgba(168,138,109,0.4); }
.modal-close:focus-visible { outline: 2px solid var(--bronze); outline-offset: 2px; }
.cal-wrap { position: relative; margin-top: 18px; border-radius: 16px; overflow: hidden; min-height: 120px; background: #fff; }
.calendly-inline-widget { min-width: 320px; height: 680px; }
.cal-loading { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #7f8782; font-size: 13px; letter-spacing: 0.04em; }
.cal-fallback { padding: 44px 24px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.cal-loading[hidden], .cal-fallback[hidden] { display: none; }
.cal-fallback p { color: #4a5262; font-size: 14px; }
.modal-form { margin-top: 22px; display: flex; flex-direction: column; gap: 15px; }
.modal-form .field { display: flex; flex-direction: column; gap: 7px; }
.modal-form label { font-family: 'Miranda Sans', sans-serif; font-size: 10px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.modal-form label .req { color: var(--bronze); }
.modal-form label .hint { text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--muted); margin-left: 4px; }
.modal-form input, .modal-form textarea { font-family: 'Mona Sans', sans-serif; font-size: 15px; color: var(--text); background: rgba(231,227,218,0.04); border: 1px solid rgba(231,227,218,0.12); border-radius: 12px; padding: 12px 14px; width: 100%; transition: border-color 200ms ease, background-color 200ms ease; }
.modal-form textarea { resize: vertical; min-height: 84px; line-height: 1.55; }
.modal-form input::placeholder, .modal-form textarea::placeholder { color: var(--muted); }
.modal-form input:focus, .modal-form textarea:focus { outline: none; border-color: rgba(168,138,109,0.55); background: rgba(231,227,218,0.06); }
.modal-form .field[hidden] { display: none; }
.modal-form input[type=file] { padding: 9px 12px; cursor: pointer; color: var(--text-soft); font-size: 13.5px; }
.modal-form input[type=file]::file-selector-button { font-family: 'Mona Sans', sans-serif; font-size: 13px; font-weight: 600; margin-right: 12px; padding: 8px 14px; border-radius: 10px; border: 1px solid rgba(231,227,218,0.16); background: rgba(231,227,218,0.06); color: var(--text); cursor: pointer; transition: border-color 200ms ease, color 200ms ease; }
.modal-form input[type=file]::file-selector-button:hover { border-color: var(--bronze); color: var(--bronze); }
.modal-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 50px; margin-top: 4px; border: none; border-radius: 999px; background: linear-gradient(180deg, rgba(168,138,109,0.96), rgba(139,113,88,0.96)); color: #fff; font-family: 'Mona Sans', sans-serif; font-size: 14px; font-weight: 500; cursor: pointer; box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 8px 20px rgba(0,0,0,0.2); transition: transform 180ms ease; text-decoration: none; }
.modal-btn:hover { transform: translateY(-1px); }
.modal-btn[disabled] { opacity: 0.6; cursor: default; transform: none; }
.cal-fallback .modal-btn { width: auto; padding: 0 22px; min-height: 46px; }
.modal-error { color: #e0857a; font-size: 13px; margin: -2px 0 0; }
.modal-error[hidden] { display: none; }
.modal-foot { margin-top: 14px; font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); text-align: center; }
.modal-success { text-align: center; padding: 12px 0 4px; }
.modal-success[hidden] { display: none; }
.modal-success .tick { width: 52px; height: 52px; margin: 0 auto 16px; border-radius: 50%; background: var(--bronze-soft); color: var(--bronze); display: flex; align-items: center; justify-content: center; font-size: 26px; }
.modal-success h2 { font-family: 'Miranda Sans', sans-serif; font-size: 22px; font-weight: 600; color: var(--text); }
.modal-success p { color: var(--text-soft); font-size: 14px; line-height: 1.6; margin-top: 10px; }
@media (max-width: 480px) { .modal { padding: 22px 18px; } .modal-head h2 { font-size: 21px; } .calendly-inline-widget { height: 620px; } }


/* Mobile nav menu */
.mobile-menu { position: absolute; left: 0; right: 0; top: calc(100% + 10px); z-index: 5; display: flex; flex-direction: column; gap: 4px; padding: 12px; border-radius: 22px; border: 1px solid rgba(231,227,218,0.12); background: rgba(18,20,22,0.94); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 20px 50px rgba(0,0,0,0.40); }
.mobile-menu[hidden] { display: none; }
.mobile-menu-link { padding: 12px 14px; border-radius: 14px; color: rgba(231,227,218,0.82); text-decoration: none; font-size: 15px; transition: background 160ms ease, color 160ms ease; }
.mobile-menu-link:hover { background: rgba(231,227,218,0.05); color: var(--text); }
.mobile-menu-cta { margin-top: 6px; padding: 13px 14px; border-radius: 999px; text-align: center; background: linear-gradient(180deg, rgba(168,138,109,0.96), rgba(139,113,88,0.96)); color: #fff; text-decoration: none; font-size: 12px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; }
@media (min-width: 1081px) { .mobile-menu { display: none !important; } }