/* Tide: a wide, immersive composition. Load after the shared site base. */
:root { color-scheme: dark; --bg: #081c28; --surface: #102c39; --text: #f1f5ee; --muted: #adc1c8; --accent: #7bdfc4; --line: #33505d; --font-display: "Avenir Next", Avenir, sans-serif; }
body { background: radial-gradient(ellipse at 90% 15%, #14455355 0, transparent 35%), var(--bg); }
.site-header { display: grid; grid-template-columns: 1fr auto auto; border-bottom: 1px solid var(--line); }
.page-shell { display: grid; grid-template-columns: minmax(0, 1fr); }
.brand-mark { border-color: var(--accent); color: var(--accent); }
.hero { display: grid; grid-template-columns: 1.3fr 1fr; gap: clamp(2rem, 4vw, 4rem); min-height: 0; padding-block: 3rem 3.5rem; }
.hero h1 { max-width: 16ch; font-size: clamp(2.5rem, 4.4vw, 4.4rem); font-weight: 400; }
.hero .eyebrow::before { content: ""; display: inline-block; width: .4rem; height: .4rem; margin-right: .7rem; background: var(--accent); border-radius: 50%; vertical-align: .1em; box-shadow: 0 0 16px #7bdfc470; }
.hero-visual { padding: 1.2rem 0 0 1.2rem; }
.hero-visual::before { content: ""; position: absolute; inset: 0 2rem 3.5rem 0; border: 1px solid var(--line); border-radius: 46% 46% 3px 3px; z-index: -1; }
.portrait { border-radius: 46% 46% 3px 3px; aspect-ratio: 1.15; box-shadow: 0 30px 70px #0003; }
.visual-caption { padding-inline: .3rem; }
.button { border-radius: 3rem; color: #08251f; }
.proof-strip { grid-template-columns: repeat(3, 1fr); padding-block: 2.2rem; }
.stat:not(:first-child) { border-left: 1px solid var(--line); padding-left: 2rem; }
.section-services { border-bottom: 1px solid var(--line); }
.service-card { border-radius: .25rem; background: linear-gradient(160deg, #143442, #0c2430); }
.service-card:nth-child(2) { background: linear-gradient(160deg, #173e48, #0c2933); }
.service-card:nth-child(3) { background: linear-gradient(160deg, #164a4b, #103039); }
.service-card h3 { font-size: 1.7rem; }
.card-number { font-family: ui-monospace, monospace; }
.project-card { border-width: 1px 0 0; padding-inline: 0; }
.section-work { padding-bottom: 3rem; }
.about-note { padding-block: .5rem; }
.contact-panel { border-radius: .25rem; background: radial-gradient(ellipse at right bottom, #24636475, transparent 70%), #102c39; }
.proof-strip:has(.stats-grid) { display: block; }
.stats-grid .stat { display: flex; }
.stats-grid .stat strong { font-size: clamp(2.2rem, 3.8vw, 3.5rem); }
.hero .eyebrow:has(.status-dot)::before { content: none; }
.portrait-frame + .visual-caption { margin-top: 1.5rem; }
@media (max-width: 800px) { .site-header { grid-template-columns: 1fr auto; } .primary-nav { grid-row: 2; grid-column: 1/-1; width: 100%; } .language-switch { grid-row: 1; grid-column: 2; } .stats-grid .stat { flex-direction: column; align-items: flex-start; } }
@media (max-width: 700px) { .hero { display: grid; grid-template-columns: 1fr; padding-block: 3rem; } .hero h1 { max-width: 16ch; } .hero-visual { width: 100%; max-width: 480px; justify-self: center; } .portrait { aspect-ratio: 1.12; } .stat:not(:first-child) { padding-left: .8rem; } .proof-strip { gap: .7rem; } }

/* Preserve intrinsic sizing with the production markup. */
.page-shell > section, .hero-copy { min-width: 0; }
.brand-mark { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }

/* Original small illustrations, shared placement in assets/ornaments.css. */
:root {
  --ornament-scene: url("/themes/artwork/ornaments/tide-scene.svg?v=7903b2115ed17484");
  --ornament-detail: url("/themes/artwork/ornaments/tide-detail.svg?v=7903b2115ed17484");
  --ornament-edge: url("/themes/artwork/ornaments/tide-edge.svg?v=7903b2115ed17484");
}
@media screen and (forced-colors: none) {
  .service-card { box-shadow: inset 0 1px 0 color-mix(in srgb, var(--accent), transparent 89%), 0 8px 22px -16px #0009; }
  .project-card { background-image: linear-gradient(135deg, color-mix(in srgb, var(--accent), transparent 96%), transparent 75%); }
}