/* Review layer over the actual public sources; uses the existing brand palette. */
html[data-editorial] { --editorial-title:clamp(30px,calc(3vw / var(--hp-display-scale,1)),42px); }
html[data-editorial] :is(.hero,.top-hero,.phil-hero,.about-hero,.contact-hero) h1 {
 font-size:var(--editorial-title)!important; font-weight:400!important; line-height:1.65!important; letter-spacing:.045em!important;
}
html[data-editorial] :is(.hero,.top-hero,.phil-hero,.about-hero,.contact-hero) :is(.ink-accent,.title-accent) {
 background:none; color:var(--mod,var(--accent)); -webkit-text-fill-color:currentColor;
}
html[data-editorial] :is(.hero,.top-hero,.phil-hero,.about-hero):before {background:none!important}
html[data-editorial] .top-hero:before {background:var(--paper)!important}
html[data-editorial] :is(.hero,.phil-hero,.about-hero) :is(.grid-overlay,.glow-effect) {display:none}
html[data-editorial] .top-hero {display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:56px;min-height:calc(100svh / var(--hp-display-scale,1) - var(--header-height,90px));padding-block:48px;}
html[data-editorial] .top-hero .hero-copy {max-width:760px;}
html[data-editorial] .top-hero .eyebrow {font-size:10px;letter-spacing:.18em;margin-bottom:25px}
html[data-editorial] .top-hero .hero-lead {font-size:17px!important;line-height:1.95;margin-top:24px;color:var(--muted)}
html[data-editorial] .top-hero .hero-ztt {width:320px;max-width:90%;margin-top:30px;opacity:.65}
html[data-editorial] .top-hero .actions {margin-top:38px;gap:14px}
html[data-editorial] .top-hero .button {font-size:13px;min-height:48px;padding:12px 18px;gap:26px;border-radius:2px;box-shadow:none}
.brand-object {margin:0;display:flex;min-width:0;flex-direction:column;align-items:center;justify-content:center;gap:40px;align-self:stretch;}
.brand-object svg {width:148px;height:auto;aspect-ratio:90 / 116;color:var(--ink);opacity:.78;overflow:hidden}
.brand-object .brand-wordmark {width:330px;max-width:100%;height:auto;opacity:.85}
.brand-object figcaption {font:500 10px/1.8 var(--serif);letter-spacing:.18em;color:var(--muted);text-align:center}
.brand-object figcaption:before {content:'';display:block;width:28px;height:1px;background:var(--accent);margin:0 auto 20px;opacity:.5}
.brand-object .founder-thought {font:400 25px/2 var(--display);letter-spacing:.12em;color:var(--ink);margin:0}
.brand-object .founder-thought span {display:block}
html[data-editorial] .phil-hero {min-height:calc(100svh / var(--hp-display-scale,1) - 91px);padding-block:60px;display:grid;grid-template-columns:1.5fr 1fr;gap:72px;align-items:center}
html[data-editorial] .phil-hero h1 .ph {display:block}
html[data-editorial] .phil-hero .hero-lead {font:400 16px/2.1 var(--sans);color:var(--muted);margin-top:28px;max-width:35em}
.phil-margin {align-self:center;max-width:28em;border-left:1px solid var(--accent-line);padding-left:32px}
.phil-margin .eyebrow {font-size:10px;margin-bottom:22px}
.phil-margin p {font:400 14px/2.2 var(--sans);color:var(--muted)}
.phil-margin a {display:inline-flex;align-items:center;min-height:44px;margin-top:20px;font:400 12px/1.8 var(--sans);color:var(--accent-soft);text-decoration:none;border-bottom:1px solid var(--accent-line)}
html[data-editorial] .hero.hero-fullscreen {display:flex;align-items:center;justify-content:flex-start;text-align:left;min-height:calc(100svh / var(--hp-display-scale,1) - 91px);height:auto;padding:60px 48px;background:var(--paper)}
html[data-editorial] .hero-fullscreen .hero-content {width:100%;max-width:1184px;margin:auto;padding:0;text-align:left}
html[data-editorial] .hero-fullscreen .hero-badge {background:none;border:0;padding:0;border-radius:0;margin-bottom:26px;display:block;color:var(--accent);font:500 10px/1.8 var(--serif);letter-spacing:.18em}
html[data-editorial] .hero-fullscreen .hero-title {margin:0}
html[data-editorial] .hero-fullscreen .hero-subtitle {font:400 16px/2 var(--sans);color:var(--muted);margin-top:24px;max-width:40em}
html[data-editorial] .hero-fullscreen .subtitle-philosophy {font-style:normal;font-size:14px;display:block;margin-top:14px}
html[data-editorial] .hero-fullscreen .scroll-indicator {display:none}
.sim-entry {display:inline-flex;align-items:center;gap:40px;min-height:48px;margin-top:32px;color:var(--accent-soft);border-bottom:1px solid var(--accent-line);font:400 14px/1.6 var(--sans);text-decoration:none}
@media(max-width:1000px){
 html[data-editorial] .top-hero{grid-template-columns:minmax(0,1fr) 200px;gap:30px}
 .brand-object svg{width:110px}.brand-object .founder-thought{font-size:19px}
 html[data-editorial] .phil-hero{gap:36px}
}
@media(max-width:767px){
 html[data-editorial]{--editorial-title:28px}
 html[data-editorial] :is(.top-hero,.phil-hero){display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:32px;min-height:calc(100svh - 75px);padding-block:32px}
 html[data-editorial] .top-hero .eyebrow{font-size:9px;letter-spacing:.12em}
 html[data-editorial] .top-hero .hero-lead{font-size:15px!important}
 html[data-editorial] .top-hero .hero-copy{order:1}
 .brand-object{order:0;align-self:flex-start;gap:0;align-items:flex-start}
 .brand-object svg{width:36px}.brand-object figcaption{display:none}
 .brand-object .brand-wordmark{width:150px}
 .brand-object .founder-thought{font-size:15px;line-height:1.7}
 .brand-object .founder-thought span{display:inline}
 html[data-editorial] .top-hero .hero-ztt{width:260px;margin-top:24px}
 html[data-editorial] .top-hero .actions{margin-top:28px}
 html[data-editorial] .phil-hero .hero-lead{font-size:15px}
 .phil-margin{align-self:stretch;padding-left:20px;max-width:none}
 .phil-margin p{font-size:13px;line-height:1.9}.phil-margin .eyebrow{margin-bottom:8px}
 html[data-editorial] .hero.hero-fullscreen{padding:40px 22px;min-height:calc(100svh - 75px)}
 html[data-editorial] .hero-fullscreen .hero-subtitle{font-size:15px}
}
@media(min-width:768px) and (max-height:700px){
 html[data-editorial] .top-hero,html[data-editorial] .phil-hero{padding-block:28px}
 html[data-editorial] .top-hero .hero-ztt{margin-top:20px}
 html[data-editorial] .top-hero .actions{margin-top:24px}
}

/* 1-A selected. Reduce the area and repetition of gold, keeping the brand palette. */
html[data-editorial-tone="quiet"] .top-hero h1 .ink-accent {
 color:var(--ink);-webkit-text-fill-color:currentColor;
}
html[data-editorial-tone="quiet"] .top-hero .button-primary {
 background:transparent;border:1px solid var(--accent-line);color:var(--accent-soft);box-shadow:none;
}
html[data-editorial-tone="quiet"] .top-hero .button-primary:hover {
 background:color-mix(in srgb,var(--accent) 7%,transparent);border-color:var(--accent);box-shadow:none;
}
html[data-editorial-tone="quiet"] .top-hero .button-ghost {
 background:transparent;border-color:var(--line);color:var(--muted);
}
html[data-editorial-tone="quiet"] .top-hero .button-ghost:hover {
 border-color:var(--muted);color:var(--ink);
}

/* A restrained, static tonal change within hero lettering; no background wash. */
@supports (background-clip:text) {
 html[data-editorial][data-editorial-title="gradient"] :is(.hero,.phil-hero,.about-hero,.contact-hero) h1 :is(.ink-accent,.title-accent) {
  background:linear-gradient(110deg,color-mix(in srgb,var(--mod-soft,var(--accent-soft)) 82%,var(--ink)) 0%,var(--mod,var(--accent)) 78%,color-mix(in srgb,var(--mod,var(--accent)) 88%,var(--muted)) 100%);
  background-clip:text;-webkit-background-clip:text;color:var(--mod,var(--accent));-webkit-text-fill-color:transparent;
 }
 html[data-editorial][data-editorial-title="gradient"] :is(.hero,.phil-hero,.about-hero,.contact-hero) h1:not(:has(.ink-accent,.title-accent)) {
  background:linear-gradient(110deg,var(--ink),color-mix(in srgb,var(--ink) 78%,var(--accent-soft)));
  background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;
 }
}
@media (forced-colors:active) {
 html[data-editorial][data-editorial-title="gradient"] :is(.hero,.phil-hero,.about-hero,.contact-hero) h1,
 html[data-editorial][data-editorial-title="gradient"] :is(.hero,.phil-hero,.about-hero,.contact-hero) h1 :is(.ink-accent,.title-accent) {
  background:none;color:CanvasText;-webkit-text-fill-color:currentColor;
 }
}
/* The service diagram keeps its proportions on scaled desktop displays. */
@media (min-width:1441px) {
 html[data-editorial][data-page="service"] .hero {padding-block:56px;}
}

/* Hero hierarchy v2: align the visible message, not just the h1 element.
 * Top 1-A stays as approved. One/two-column layouts retain their page roles. */
html[data-editorial] {
 --hero-lead-size:16px;--hero-detail-size:15px;--hero-label-size:10px;
 --hero-action-size:13px;--hero-copy-gap:24px;
}
html[data-editorial] :is(.hero,.phil-hero,.about-hero,.contact-hero) :is(.eyebrow,.platform-eyebrow) {
 font-family:var(--serif);font-size:var(--hero-label-size);line-height:1.8;letter-spacing:.17em;margin-bottom:var(--hero-copy-gap);
}
html[data-editorial] :is(.hero,.phil-hero,.about-hero,.contact-hero) :is(.hero-lead,.hero-subtitle) {
 font-size:var(--hero-lead-size)!important;line-height:1.95;margin-top:var(--hero-copy-gap);color:var(--muted);
}
html[data-editorial] .hero .hero-description {
 font-size:var(--hero-detail-size)!important;line-height:1.95;margin-top:16px;color:var(--muted);
}
html[data-editorial] .hero :is(.hero-subtitle,.hero-lead) strong {font-weight:500;}
html[data-editorial] .hero :is(.actions,.platform-actions) {gap:14px 22px;margin-top:32px;align-items:center;}
html[data-editorial] .hero :is(.button,.platform-button) {
 min-height:48px;padding:12px 18px;gap:26px;border-radius:2px;box-shadow:none;
 font:500 var(--hero-action-size)/1.6 var(--sans);letter-spacing:.025em;
}
html[data-editorial] .hero :is(.button-primary,.platform-button) {
 background:transparent;border:1px solid var(--accent-line);color:var(--accent-soft);box-shadow:none;
}
html[data-editorial] .hero :is(.button-primary,.platform-button):hover {
 background:color-mix(in srgb,var(--accent) 7%,transparent);border-color:var(--accent);box-shadow:none;
}
html[data-editorial] .hero :is(.text-link,.platform-text-link) {
 font:400 var(--hero-action-size)/1.8 var(--sans);color:var(--muted);border-color:var(--accent-line);min-height:44px;
}
/* Service: product identifier below the main message in the visual hierarchy. */
html[data-editorial][data-page="service"] .hero h1 {
 font-size:26px!important;line-height:1.5!important;letter-spacing:.045em!important;margin:0 0 18px;
}
html[data-editorial][data-page="service"] .hero .platform-hero-message {
 font-size:var(--editorial-title);font-weight:400;line-height:1.65;letter-spacing:.045em;margin:0;
}
html[data-editorial] .hero .hero-badge {
 display:block;padding:0;border:0;border-radius:0;background:none;margin-bottom:var(--hero-copy-gap);
 font:500 var(--hero-label-size)/1.8 var(--serif);letter-spacing:.17em;color:var(--accent);
}
html[data-editorial] .hero .hero-badge .badge-text {
 font:inherit;letter-spacing:inherit;background:none;color:inherit;-webkit-text-fill-color:currentColor;
}
/* Existing JS replaces legacy icons with editorial diagrams. Keep its fallback quiet. */
html[data-editorial] .hero .hero-z-icon {width:64px;height:64px;}
html[data-editorial] .hero .hero-z-icon img {width:100%;height:100%;object-fit:contain;}
html[data-editorial] .hero :is(.icon-glow-ring,.icon-glow-aura,.icon-circuit-lines) {display:none;}
html[data-editorial] .hero .hero-stats {margin-top:28px;margin-bottom:0;gap:28px;}
html[data-editorial] .hero .hero-stats .stat-item {text-align:left;}
html[data-editorial] .hero .hero-stats .stat-number {
 font-size:26px;font-weight:400;line-height:1.4;animation:none;transform:none;text-shadow:none;
}
html[data-editorial] .hero .hero-stats .stat-label {font-size:12px;line-height:1.8;color:var(--muted);}
html[data-editorial] .hero .module-hero-figure figcaption {font-size:14px;line-height:1.8;}
html[data-editorial] .hero .module-hero-figure .concept-label {font-size:10px;}
@media(max-width:767px) {
 html[data-editorial] {--hero-lead-size:15px;--hero-detail-size:14px;}
 html[data-editorial][data-page="service"] .hero h1 {font-size:20px!important;margin-bottom:16px;}
 html[data-editorial] .hero :is(.actions,.platform-actions) {align-items:stretch;margin-top:28px;}
 html[data-editorial] .hero .mobile-hero-brief p {font-size:14px;line-height:1.85;}
 html[data-editorial] .hero .mobile-hero-brief .mobile-value-path {font-size:15px;}
 html[data-editorial] .hero .hero-stats .stat-number {font-size:24px;}
}