/* Obsidian: the proposed dark-first visual direction for Pixakova, currently on the company home page only.
   Everything is scoped under body.theme-obsidian, so other pages keep the approved design until this is signed off.
   Type: Instrument Sans (already self-hosted) for display and text, system monospace for labels. */
.theme-obsidian {
  --o-bg: #0a0a0f;
  --o-raise: #14141b;
  --o-raise-2: #1c1c25;
  --o-line: rgba(255, 255, 255, 0.08);
  --o-line-strong: rgba(255, 255, 255, 0.16);
  --o-text: #ededf2;
  --o-muted: #9c9cb0;
  --o-violet: #8b7cff;
  --o-violet-soft: rgba(139, 124, 255, 0.14);
  --o-sun: #ffcf3d;
  --o-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --o-ease: cubic-bezier(0.22, 1, 0.36, 1);
  /* Shared components (header, footer, buttons) read these, so they turn dark with the theme */
  --paper: var(--o-bg); --surface: var(--o-bg); --ink: var(--o-text); --ink-soft: var(--o-muted);
  --line: var(--o-line); --indigo: var(--o-violet); --indigo-fg: var(--o-bg); --sun: var(--o-sun);
  --display: var(--body);
  background: var(--o-bg);
  color: var(--o-text);
  color-scheme: dark;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.theme-obsidian h1, .theme-obsidian h2, .theme-obsidian h3 { font-weight: 600; letter-spacing: -0.035em; }
.theme-obsidian ::selection { background: var(--o-violet); color: var(--o-bg); }
.theme-obsidian a:focus-visible, .theme-obsidian button:focus-visible { outline: 2px solid var(--o-violet); outline-offset: 3px; border-radius: 6px; }
/* The pixel: one 6px violet square is the recurring unit of the system (logo, labels, key words, glyphs, hero) */
.o-label { display: inline-flex; align-items: center; gap: 10px; font-family: var(--o-mono); font-size: 0.8rem; letter-spacing: 0.02em; color: var(--o-muted); }
.o-label::before { content: ""; width: 6px; height: 6px; border-radius: 1.5px; background: var(--o-violet); box-shadow: 0 0 10px rgba(139, 124, 255, 0.6); }

/* Header: translucent, sticky, hairline */
.theme-obsidian .site-header { position: sticky; top: 0; z-index: 10; background: rgba(10, 10, 15, 0.72); border-bottom-color: var(--o-line); -webkit-backdrop-filter: saturate(160%) blur(14px); backdrop-filter: saturate(160%) blur(14px); }
.theme-obsidian .site-header .wrap { padding-block: 14px; }
.theme-obsidian .logo { font-family: var(--body); font-weight: 600; font-size: 1.12rem; letter-spacing: -0.02em; }
.theme-obsidian .logo-mark { grid-template-columns: repeat(2, 8px); gap: 2px; }
.theme-obsidian .logo-mark i { width: 8px; height: 8px; border-radius: 1.5px; background: var(--o-violet); }
.theme-obsidian .logo-mark i:nth-child(2) { background: var(--o-sun); }
.theme-obsidian .logo-mark i:nth-child(3) { background: var(--o-text); }
.theme-obsidian .logo-mark i:nth-child(4) { background: #3a3a48; transition: background-color .35s ease; }
.theme-obsidian .logo:hover .logo-mark i:nth-child(4) { background: var(--o-violet); }
.theme-obsidian .nav { gap: 26px; font-size: 0.9rem; }
.theme-obsidian .nav a:not(.btn) { color: var(--o-muted); transition: color .2s ease; }
.theme-obsidian .nav a:not(.btn):hover { color: var(--o-text); text-decoration: none; }
.theme-obsidian .nav .btn { background: var(--o-text); color: var(--o-bg); border-radius: 999px; padding: 7px 16px; font-size: 0.88rem; }
.theme-obsidian .nav .btn:hover { transform: none; background: #fff; }

/* Footer */
.theme-obsidian .site-footer { background: var(--o-bg); border-top-color: var(--o-line); font-size: 0.92rem; }
.theme-obsidian .site-footer h2 { font-family: var(--o-mono); font-weight: 500; letter-spacing: 0.04em; font-size: 0.75rem; }
.theme-obsidian .site-footer a { color: var(--o-muted); transition: color .2s ease; }
.theme-obsidian .site-footer a:hover { color: var(--o-text); text-decoration: none; }

/* Hero: brand first */
.o-hero { position: relative; overflow: hidden; border-bottom: 1px solid var(--o-line); }
.o-hero::before { content: ""; position: absolute; top: 50%; right: max(-120px, calc(50% - 760px)); width: 860px; height: 860px; transform: translateY(-50%); background: radial-gradient(closest-side, rgba(139, 124, 255, 0.18), transparent 72%); pointer-events: none; }
@media (max-width: 900px) { .o-hero::before { top: auto; bottom: -320px; right: -280px; transform: none; } }
.o-hero__inner { position: relative; display: grid; grid-template-columns: 1.05fr 1fr; gap: 40px; align-items: center; min-height: min(76vh, 740px); padding-block: 88px 96px; }
.o-hero h1 { font-size: clamp(3.2rem, 9vw, 7.4rem); line-height: 0.95; letter-spacing: -0.055em; margin: 22px 0 28px; }
.o-lede { font-size: clamp(1.08rem, 1.6vw, 1.3rem); line-height: 1.55; color: var(--o-muted); max-width: 40ch; }
.o-hero__jump { margin-top: 40px; }
.o-hero__jump a { display: inline-flex; align-items: center; gap: 10px; color: var(--o-text); text-decoration: none; font-weight: 500; font-size: 0.95rem; padding-bottom: 4px; border-bottom: 1px solid var(--o-line-strong); transition: border-color .25s ease, gap .25s var(--o-ease); }
.o-hero__jump a:hover { border-color: var(--o-violet); gap: 14px; }
.o-hero__art { justify-self: end; width: 100%; max-width: 580px; -webkit-mask-image: radial-gradient(closest-side, #000 72%, transparent); mask-image: radial-gradient(closest-side, #000 72%, transparent); }
.lattice { display: block; width: 100%; height: auto; }
.lattice .c { fill: rgba(255, 255, 255, 0.025); stroke: rgba(255, 255, 255, 0.07); stroke-width: 1; }
.lattice .glow rect { fill: var(--o-violet); }
.lattice .glow { opacity: 0.55; animation: o-glow-in 1.2s ease 1.3s both, o-breathe 7s ease-in-out 2.5s infinite; }
.lattice .l { fill: var(--o-violet); animation: o-light .5s ease both; animation-delay: calc(var(--i) * 85ms + 300ms); }
.lattice .s { fill: var(--o-sun); animation: o-light .5s ease 1.4s both; }
.lattice .p { fill: var(--o-violet); opacity: 0.08; animation: o-pulse 6s ease-in-out infinite; }
.lattice .p2 { animation-delay: 1.5s; } .lattice .p3 { animation-delay: 3s; } .lattice .p4 { animation-delay: 4.5s; }
@keyframes o-light { from { opacity: 0.06; } 60% { opacity: 1; fill: #b3a9ff; } to { opacity: 1; } }
@keyframes o-glow-in { from { opacity: 0; } to { opacity: 0.55; } }
@keyframes o-breathe { 0%, 100% { opacity: 0.55; } 50% { opacity: 0.8; } }
@keyframes o-pulse { 0%, 100% { opacity: 0.08; } 50% { opacity: 0.6; } }

/* Load reveal */
.o-reveal { animation: o-rise .9s var(--o-ease) both; }
.o-d1 { animation-delay: .08s; } .o-d2 { animation-delay: .18s; } .o-d3 { animation-delay: .28s; }
@keyframes o-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

/* Section heads */
.o-head { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: end; margin-bottom: 40px; }
.o-head h2 { font-size: clamp(2.2rem, 4.6vw, 3.6rem); line-height: 1; }
.o-sub { color: var(--o-muted); font-size: 1.05rem; max-width: 44ch; justify-self: end; }

/* Two equal pathways, one split panel */
.o-paths { padding-block: 104px 96px; }
.o-split { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--o-line); border-radius: 20px; overflow: hidden; background: var(--o-raise); }
.path { --mx: 50%; --my: 0%; position: relative; display: flex; flex-direction: column; gap: 18px; padding: 40px 44px 44px; color: var(--o-text); text-decoration: none; isolation: isolate; transition: background-color .3s ease; }
.path + .path { border-left: 1px solid var(--o-line); }
.path::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(420px circle at var(--mx) var(--my), var(--o-violet-soft), transparent 70%); opacity: 0; transition: opacity .35s ease; }
.path:hover::before, .path:focus-visible::before { opacity: 1; }
.path:hover { background-color: var(--o-raise-2); }
.path:focus-visible { outline-offset: -3px; border-radius: 0; }
.path-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 44px; }
.glyph { width: 88px; height: 64px; flex: none; }
.glyph .g-frame { fill: none; stroke: var(--o-line-strong); stroke-width: 1.2; }
.glyph .g-fill { fill: var(--o-raise-2); }
.glyph .g-dim { fill: rgba(255, 255, 255, 0.07); }
.glyph .g-mid { fill: rgba(255, 255, 255, 0.11); }
.glyph .g-on { fill: var(--o-violet); }
.glyph .g-on2 { fill: var(--o-violet); opacity: 0.45; transition: opacity .35s ease; }
.path:hover .g-on2 { opacity: 1; }
.path h3 { font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 1.05; max-width: 15ch; }
.path-text { color: var(--o-muted); max-width: 40ch; font-size: 1.05rem; margin-bottom: 14px; }
.path-cta { align-self: flex-start; margin-top: auto; display: inline-flex; align-items: center; gap: 10px; padding: 12px 20px 12px 22px; border-radius: 999px; background: var(--o-text); color: var(--o-bg); font-weight: 600; font-size: 0.96rem; transition: background-color .3s ease, color .3s ease; }
.path:hover .path-cta, .path:focus-visible .path-cta { background: var(--o-violet); color: var(--o-bg); }
.path-cta svg { transition: transform .3s var(--o-ease); }
.path:hover .path-cta svg { transform: translateX(4px); }

/* How we work: editorial headline and paragraph */
.o-approach { border-top: 1px solid var(--o-line); padding-block: 96px; }
.o-approach__inner { display: grid; grid-template-columns: 200px 1fr; gap: 40px; align-items: baseline; }
.o-editorial { display: grid; grid-template-columns: 1.3fr 1fr; gap: 56px; align-items: end; }
.o-editorial h2 { font-size: clamp(2.2rem, 4.6vw, 3.6rem); line-height: 1.02; max-width: 14ch; }
.o-editorial p { color: var(--o-muted); font-size: 1.1rem; line-height: 1.65; max-width: 40ch; padding-left: 20px; border-left: 2px solid var(--o-violet); }

/* Close */
.o-close { border-top: 1px solid var(--o-line); padding-block: 96px 104px; text-align: center; background: radial-gradient(60% 120% at 50% 100%, rgba(139, 124, 255, 0.12), transparent 70%); }
.o-close__inner { display: grid; justify-items: center; gap: 18px; }
.o-mark { display: grid; grid-template-columns: repeat(2, 10px); gap: 3px; margin-bottom: 8px; }
.o-mark i { width: 10px; height: 10px; border-radius: 2px; background: var(--o-violet); }
.o-mark i:nth-child(2) { background: var(--o-sun); } .o-mark i:nth-child(3) { background: var(--o-text); } .o-mark i:nth-child(4) { background: #3a3a48; }
.o-close h2 { font-size: clamp(2rem, 4.4vw, 3.2rem); line-height: 1.04; max-width: 16ch; }
.o-close p { color: var(--o-muted); max-width: 46ch; }
.o-btn { margin-top: 12px; display: inline-flex; align-items: center; padding: 12px 22px; border-radius: 999px; background: var(--o-text); color: var(--o-bg); font-weight: 600; text-decoration: none; transition: background-color .2s ease, transform .2s var(--o-ease); }
.o-btn:hover { background: #fff; transform: translateY(-1px); }

@media (max-width: 900px) {
  .o-hero__inner { grid-template-columns: 1fr; min-height: 0; padding-block: 72px 80px; gap: 8px; }
  .o-hero__art { justify-self: start; max-width: 380px; margin: 32px 0 0 -20px; }
  .o-head, .o-approach__inner, .o-editorial { grid-template-columns: 1fr; gap: 20px; }
  .o-approach__inner { gap: 16px; }
  .o-sub { justify-self: start; }
  .o-split { grid-template-columns: 1fr; }
  .path + .path { border-left: 0; border-top: 1px solid var(--o-line); }
  .o-paths, .o-close { padding-block: 72px; }
  .o-approach { padding-block: 64px; }
}
@media (max-width: 600px) {
  .theme-obsidian .site-header { position: static; }
  .theme-obsidian .site-header .wrap { row-gap: 10px; }
  .theme-obsidian .nav { gap: 18px; font-size: 0.88rem; }
  .theme-obsidian .nav .btn { padding: 5px 13px; }
  .o-hero__inner { padding-block: 48px 64px; }
  .path { padding: 30px 24px; }
  .path-top { margin-bottom: 24px; }
  .glyph { width: 66px; height: 48px; }
  .o-hero h1 { letter-spacing: -0.05em; }
}
@media (prefers-reduced-motion: reduce) {
  .o-reveal, .lattice .p, .lattice .l, .lattice .s, .lattice .glow { animation: none; }
  .lattice .p { opacity: 0.25; }
  .path::before, .path, .path-cta, .path-cta svg, .o-btn, .o-hero__jump a, .glyph .g-on2, .theme-obsidian .logo-mark i { transition: none; }
  .path:hover .path-cta svg, .o-btn:hover { transform: none; }
}

/* ---------- Site-wide components (every page uses the obsidian theme) ---------- */
.theme-obsidian input:focus-visible, .theme-obsidian select:focus-visible, .theme-obsidian textarea:focus-visible, .theme-obsidian summary:focus-visible { outline: 2px solid var(--o-violet); outline-offset: 2px; }

/* Labels use the same pixel marker as the home page */
.theme-obsidian .eyebrow { font-family: var(--o-mono); font-size: 0.8rem; font-weight: 400; letter-spacing: 0.02em; text-transform: none; color: var(--o-muted); gap: 10px; }
.theme-obsidian .eyebrow::before { width: 6px; height: 6px; margin-right: 0; border-radius: 1.5px; background: var(--o-violet); box-shadow: 0 0 10px rgba(139, 124, 255, 0.6); }
.theme-obsidian .tag { font-family: var(--o-mono); font-size: 0.78rem; font-weight: 400; letter-spacing: 0.02em; text-transform: none; color: var(--o-violet); }
.theme-obsidian .lede { color: var(--o-muted); }

/* Buttons: one primary (off-white pill) and one secondary (outline pill) everywhere */
.theme-obsidian .btn { border-radius: 999px; font-weight: 600; border-width: 1px; }
.theme-obsidian .btn.primary { background: var(--o-text); color: var(--o-bg); }
.theme-obsidian .btn.primary:hover { background: #fff; }
.theme-obsidian .btn.secondary { color: var(--o-text); border-color: var(--o-line-strong); }
.theme-obsidian .btn.secondary:hover { border-color: var(--o-violet); background: var(--o-violet-soft); transform: none; }
.theme-obsidian .btn:disabled { opacity: 0.6; }

/* Page headers */
.theme-obsidian .page-hero { position: relative; padding-block: 88px 64px; overflow: hidden; border-bottom: 1px solid var(--o-line); }
.theme-obsidian .page-hero::before { content: ""; position: absolute; top: -60%; right: -10%; width: 640px; height: 640px; background: radial-gradient(closest-side, rgba(139, 124, 255, 0.14), transparent 72%); pointer-events: none; }
.theme-obsidian .page-hero .wrap { position: relative; }
.theme-obsidian .page-hero h1 { font-size: clamp(2.6rem, 6vw, 4.6rem); line-height: 1; letter-spacing: -0.045em; max-width: 16ch; margin: 18px 0 22px; }
.theme-obsidian .page-hero .lede { font-size: 1.15rem; max-width: 50ch; }
.theme-obsidian .hero h1 { font-weight: 600; letter-spacing: -0.045em; }

/* Sections */
.theme-obsidian .section { padding-block: 96px; }
.theme-obsidian .section.alt { background: #0d0d14; }
.theme-obsidian .section-head h2 { font-size: clamp(2rem, 4vw, 2.9rem); line-height: 1.04; }

/* Cards: ruled columns by default (editorial), boxed only where the box means something (pricing, quotes, roles, forms) */
.theme-obsidian .card { background: transparent; border: 0; border-top: 1px solid var(--o-line-strong); border-radius: 0; padding: 22px 4px 0 0; }
.theme-obsidian .section.alt .card { background: transparent; }
.theme-obsidian .card h3 { font-size: 1.25rem; letter-spacing: -0.02em; }
.theme-obsidian .card .price { font-size: 1.7rem; font-weight: 600; }
.theme-obsidian.page-services .card, .theme-obsidian .roles .card, .theme-obsidian figure.card { background: var(--o-raise); border: 1px solid var(--o-line); border-radius: 16px; padding: 28px; }
.theme-obsidian.page-services .section.alt .card { background: var(--o-raise); }
.theme-obsidian .card.featured { border: 1px solid var(--o-violet); box-shadow: 0 0 0 1px var(--o-violet-soft), 0 20px 60px -30px rgba(139, 124, 255, 0.5); }
.theme-obsidian .badge { background: var(--o-sun); color: #15182b; font-family: var(--o-mono); font-weight: 500; letter-spacing: 0.02em; text-transform: none; font-size: 0.74rem; }

/* Why Pixakova: a ruled list (headline left, explanation right) so it does not repeat the three-column cards above it */
.theme-obsidian .why-list { border-top: 1px solid var(--o-line-strong); }
.theme-obsidian .why-list > div { display: grid; grid-template-columns: 1fr 1.5fr; gap: 40px; padding: 28px 0; border-bottom: 1px solid var(--o-line); align-items: baseline; }
.theme-obsidian .why-list h3 { font-size: 1.3rem; letter-spacing: -0.02em; }
.theme-obsidian .why-list p { max-width: 52ch; }
@media (max-width: 700px) { .theme-obsidian .why-list > div { grid-template-columns: 1fr; gap: 8px; } }

/* Real process steps keep their numbers, set quietly */
.theme-obsidian .steps li { border-top: 1px solid var(--o-line-strong); }
.theme-obsidian .steps li::before { font-family: var(--o-mono); font-weight: 400; font-size: 0.82rem; color: var(--o-violet); }

/* Work / demos */
.theme-obsidian .work-feature { background: var(--o-raise); border-color: var(--o-line); border-radius: 18px; }
.theme-obsidian .work-feature__link { color: var(--o-violet); }
.theme-obsidian .work-thumb, .theme-obsidian .work-thumb-img, .theme-obsidian .work-feature__img { border-radius: 14px; }
.theme-obsidian .concept-note { color: var(--o-muted); }

/* Closing band */
.theme-obsidian .band { background: radial-gradient(70% 160% at 85% 100%, rgba(139, 124, 255, 0.16), transparent 70%), var(--o-raise); color: var(--o-text); border-top: 1px solid var(--o-line); }
.theme-obsidian .band .wrap { padding-block: 64px; }
.theme-obsidian .band h2 { font-size: clamp(1.9rem, 3.6vw, 2.8rem); max-width: 20ch; }
.theme-obsidian .band p { color: var(--o-muted); opacity: 1; }
.theme-obsidian .band .btn.primary { background: var(--o-text); color: var(--o-bg); }

/* Tables, FAQ */
.theme-obsidian .table-wrap { background: var(--o-raise); border-color: var(--o-line); border-radius: 16px; }
.theme-obsidian th { font-family: var(--o-mono); font-size: 0.76rem; letter-spacing: 0.02em; text-transform: none; font-weight: 400; }
.theme-obsidian td, .theme-obsidian th { border-bottom-color: var(--o-line); }
.theme-obsidian .faq details { background: var(--o-raise); border-color: var(--o-line); border-radius: 14px; transition: border-color .25s ease; }
.theme-obsidian .faq details[open], .theme-obsidian .faq details:hover { border-color: var(--o-line-strong); }
.theme-obsidian .faq summary { cursor: pointer; }

/* Forms */
.theme-obsidian form.enquiry, .theme-obsidian .apply-closed { background: var(--o-raise); border-color: var(--o-line); border-radius: 20px; }
.theme-obsidian .field input, .theme-obsidian .field textarea, .theme-obsidian .field select { background: var(--o-bg); border-color: var(--o-line-strong); color: var(--o-text); border-radius: 12px; transition: border-color .2s ease; }
.theme-obsidian .field input:hover, .theme-obsidian .field textarea:hover, .theme-obsidian .field select:hover { border-color: rgba(255, 255, 255, 0.28); }
.theme-obsidian .field input::placeholder, .theme-obsidian .field textarea::placeholder { color: #6e6e82; }
.theme-obsidian .choices label { background: var(--o-bg); border-color: var(--o-line-strong); }
.theme-obsidian .choices label:has(input:checked) { border-color: var(--o-violet); background: var(--o-violet-soft); }
.theme-obsidian .form-status { color: var(--o-violet); }
.theme-obsidian .form-status.is-error { color: #ff8a80; }
.theme-obsidian .next-steps li::marker { color: var(--o-violet); }

/* About, creators, legal */
.theme-obsidian .portrait.photo { border-radius: 18px; }
.theme-obsidian .chips li { background: var(--o-raise); border-color: var(--o-line); }
.theme-obsidian .terms li { border-left-color: var(--o-violet); }
.theme-obsidian .legal a, .theme-obsidian .prose a, .theme-obsidian .form-note a, .theme-obsidian .contact-details a { color: var(--o-text); text-decoration-color: var(--o-violet); text-underline-offset: 3px; }
.theme-obsidian .subnav { background: transparent; border-bottom-color: var(--o-line); }
.theme-obsidian .subnav a { color: var(--o-muted); transition: color .2s ease; }
.theme-obsidian .subnav a:hover, .theme-obsidian .subnav a[aria-current="page"] { color: var(--o-text); }

@media (max-width: 900px) {
  .theme-obsidian .section { padding-block: 72px; }
  .theme-obsidian .page-hero { padding-block: 64px 44px; }
}
@media (prefers-reduced-motion: reduce) {
  .theme-obsidian .faq details, .theme-obsidian .field input, .theme-obsidian .field textarea, .theme-obsidian .field select, .theme-obsidian .subnav a { transition: none; }
}

/* Creators: hero artwork and "who it is for" */
.theme-obsidian .page-hero--art .wrap { display: grid; grid-template-columns: 1.2fr 1fr; gap: 40px; align-items: center; }
.theme-obsidian .page-hero--art h1 { max-width: 14ch; }
.page-hero__art { justify-self: end; width: 100%; max-width: 380px; -webkit-mask-image: radial-gradient(closest-side, #000 70%, transparent); mask-image: radial-gradient(closest-side, #000 70%, transparent); }
.mini-lattice { display: block; width: 100%; height: auto; }
.mini-lattice .c { fill: rgba(255, 255, 255, 0.025); stroke: rgba(255, 255, 255, 0.07); }
.mini-lattice .l { fill: var(--o-violet); filter: drop-shadow(0 0 8px rgba(139, 124, 255, 0.55)); }
.mini-lattice .s { fill: var(--o-sun); }
.theme-obsidian .who { padding-block: 72px; }
.who__inner { display: grid; grid-template-columns: 1.3fr 1fr; gap: 56px; align-items: end; }
.who h2 { font-size: clamp(2rem, 4vw, 2.9rem); line-height: 1.04; margin-top: 14px; max-width: 16ch; }
.who__text { color: var(--o-muted); font-size: 1.08rem; padding-left: 20px; border-left: 2px solid var(--o-violet); max-width: 38ch; }
@media (max-width: 900px) {
  .theme-obsidian .page-hero--art .wrap, .who__inner { grid-template-columns: 1fr; gap: 24px; }
  .page-hero__art { justify-self: start; max-width: 260px; }
}
.theme-obsidian .apply-closed { display: grid; gap: 14px; padding: 32px; border: 1px solid var(--o-line); }
.theme-obsidian .apply-closed .btn-row { margin-top: 8px; }

/* Form fields share one height across browsers (Safari draws native selects shorter), with a custom chevron on dropdowns */
.theme-obsidian .field input, .theme-obsidian .field select { height: 52px; padding-block: 0; line-height: 1.2; }
.theme-obsidian .field select { -webkit-appearance: none; appearance: none; padding-right: 44px; cursor: pointer; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%239c9cb0' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; background-size: 16px; }
.theme-obsidian .field select:focus-visible { border-color: var(--o-violet); }
.theme-obsidian .field input:focus-visible, .theme-obsidian .field textarea:focus-visible { border-color: var(--o-violet); outline-offset: 1px; }

/* About: closing row, a line on the left and two identical buttons on the right */
.about-cta { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; margin-top: 64px; padding-top: 32px; border-top: 1px solid var(--o-line-strong); }
.about-cta p { font-size: clamp(1.3rem, 2.4vw, 1.75rem); letter-spacing: -0.02em; font-weight: 600; }