:root {
  --ink: #071722;
  --ink-2: #0b2333;
  --ink-3: #12384b;
  --gold: #d89a2b;
  --gold-2: #f0bd59;
  --cyan: #28b9d0;
  --teal: #1a8ea7;
  --ivory: #faf8f2;
  --paper: #fff;
  --soft: #f1f5f6;
  --text: #102332;
  --muted: #61717b;
  --line: #dbe3e7;
  --radius: 18px;
  --radius-sm: 12px;
  --shadow: 0 14px 35px rgba(6, 23, 34, .10);
  --wrap: 1380px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--ivory); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.55; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
.wrap { width: min(var(--wrap), 94vw); margin-inline: auto; }
.skip-link { position: fixed; left: 12px; top: 12px; z-index: 1000; transform: translateY(-160%); background: #fff; color: #061722; padding: 10px 14px; border-radius: 8px; box-shadow: var(--shadow); }
.skip-link:focus { transform: translateY(0); }

.utility-bar { background: #05141f; color: #bdd0da; font-size: .82rem; }
.utility-bar__inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 34px; }
.utility-bar nav { display: flex; gap: 18px; }
.utility-bar a:hover, .utility-bar a:focus-visible { color: var(--gold-2); }

.site-header { position: sticky; top: 0; z-index: 100; background: rgba(7, 23, 34, .97); border-bottom: 1px solid rgba(240, 189, 89, .26); backdrop-filter: blur(12px); }
.site-header__inner { min-height: 72px; display: flex; align-items: center; gap: 28px; }
.brand img { width: auto; height: 35px; }
.primary-nav { margin-left: auto; display: flex; align-items: center; gap: 21px; color: #f4f7f8; font-weight: 700; font-size: .94rem; }
.primary-nav a { padding: 9px 0; border-bottom: 2px solid transparent; }
.primary-nav a:hover, .primary-nav a:focus-visible { color: var(--gold-2); }
.primary-nav a[aria-current="page"] { color: var(--gold-2); border-bottom-color: var(--gold); }
.menu-button { display: none; margin-left: auto; align-items: center; gap: 9px; background: transparent; color: white; border: 1px solid #365365; border-radius: 10px; padding: 8px 11px; }
.menu-button__bars, .menu-button__bars::before, .menu-button__bars::after { display: block; width: 18px; height: 2px; background: currentColor; content: ""; position: relative; }
.menu-button__bars::before { position: absolute; top: -6px; }
.menu-button__bars::after { position: absolute; top: 6px; }

.hero { position: relative; overflow: hidden; background: radial-gradient(circle at 50% 98%, rgba(40, 185, 208, .32), transparent 23%), linear-gradient(103deg, #081824 0%, #0b2434 50%, #06131f 100%); color: #fff; border-bottom: 1px solid rgba(216, 154, 43, .45); }
.hero::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(to bottom, #000, transparent 82%); }
.hero-globe { position: absolute; left: 50%; bottom: -175px; transform: translateX(-50%); width: 650px; height: 325px; border: 2px solid rgba(40,185,208,.42); border-radius: 50%; box-shadow: 0 0 105px rgba(40,185,208,.42); opacity: .5; }
.hero-globe::before, .hero-globe::after { content: ""; position: absolute; inset: 36px 85px; border: 1px solid rgba(216,154,43,.45); border-radius: 50%; transform: rotate(15deg); }
.hero-globe::after { transform: rotate(-15deg); }
.hero-grid { position: relative; display: grid; grid-template-columns: minmax(190px, .85fr) minmax(540px, 1.7fr) minmax(190px, .85fr); grid-template-areas: "thinker center robot"; gap: 18px; align-items: end; min-height: 530px; padding-top: 30px; }
.hero-portrait { margin: 0; height: 470px; overflow: hidden; position: relative; align-self: end; }
.hero-portrait img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.96) contrast(1.04); }
.hero-portrait::after { content: ""; position: absolute; inset: 0; }
.hero-portrait--thinker { grid-area: thinker; border-radius: 0 42% 0 0; }
.hero-portrait--thinker::after { background: linear-gradient(90deg, rgba(7,23,34,.02), rgba(7,23,34,.16) 52%, #0a2030 100%); }
.hero-portrait--robot { grid-area: robot; border-radius: 42% 0 0 0; }
.hero-portrait--robot::after { background: linear-gradient(270deg, rgba(7,23,34,.02), rgba(7,23,34,.16) 52%, #0a2030 100%); }
.hero-center { grid-area: center; position: relative; z-index: 3; text-align: center; align-self: center; padding: 34px 0 68px; }
.hero-frame { max-width: 840px; margin: auto; background: rgba(7,23,34,.73); border: 2px solid var(--gold); border-radius: 24px; padding: 34px 36px 31px; box-shadow: 0 0 0 5px rgba(216,154,43,.09), 0 25px 70px rgba(0,0,0,.32); }
.eyebrow, .kicker { margin: 0 0 8px; letter-spacing: .18em; text-transform: uppercase; font-size: .74rem; font-weight: 800; color: #92dce8; }
.kicker { color: #16768b; }
.hero h1 { max-width: 830px; margin: 12px auto 18px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.65rem, 4.6vw, 4.7rem); line-height: 1.02; letter-spacing: -.025em; }
.hero h1 em { color: var(--gold-2); font-style: italic; }
.hero-lead { max-width: 760px; margin: 0 auto 20px; color: #d7e5eb; font-size: 1.08rem; }
.hero-topics { display: flex; justify-content: center; flex-wrap: wrap; gap: 7px 15px; margin: 0 0 25px; color: #9ee5f0; font-size: .72rem; font-weight: 800; letter-spacing: .10em; text-transform: uppercase; }
.button-row { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.hero .button-row { justify-content: center; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 11px 18px; border-radius: 11px; border: 1px solid transparent; font-weight: 800; transition: transform .15s ease, border-color .15s ease, background .15s ease; }
.button:hover, .button:focus-visible { transform: translateY(-1px); }
.button--primary { background: linear-gradient(135deg, var(--gold-2), var(--gold)); color: #0a1720; }
.button--secondary { border-color: #2fb9d0; color: #eafcff; background: rgba(0,0,0,.14); }
.button--outline { border-color: #9daeb6; color: var(--text); background: transparent; }

.section-shortcuts { background: #fff; border-bottom: 1px solid var(--line); box-shadow: 0 9px 28px rgba(6,23,34,.06); }
.section-shortcuts__grid { display: grid; grid-template-columns: repeat(8, 1fr); }
.section-shortcuts a { min-width: 0; padding: 17px 9px 16px; text-align: center; border-right: 1px solid #edf1f3; }
.section-shortcuts a:first-child { border-left: 1px solid #edf1f3; }
.section-shortcuts strong, .section-shortcuts span { display: block; }
.section-shortcuts strong { font-size: .9rem; }
.section-shortcuts span { margin-top: 3px; color: var(--muted); font-size: .72rem; }
.section-shortcuts a:hover, .section-shortcuts a:focus-visible { background: #f3fafb; }

.section { padding: 54px 0; }
.section--soft { background: var(--soft); border-block: 1px solid #e0e8eb; }
.section-heading { margin-bottom: 24px; }
.section-heading--split { display: flex; justify-content: space-between; align-items: end; gap: 24px; }
.section-heading h2, .browse-topics h2, .connect-card h2, .experiments h2, .domains h2, .stub-card h1 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 3vw, 2.65rem); line-height: 1.08; }
.section-heading p:not(.kicker), .browse-topics p, .connect-card p { margin: 7px 0 0; color: var(--muted); }
.text-link { color: #12677a; font-weight: 800; }
.text-link:hover, .text-link:focus-visible { text-decoration: underline; }

.category-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.category-card { min-height: 130px; position: relative; padding: 19px 42px 19px 19px; background: #fff; border: 1px solid #dfe7ea; border-radius: var(--radius-sm); box-shadow: 0 5px 15px rgba(8,30,44,.04); }
.category-card strong, .category-card span { display: block; }
.category-card strong { font-family: Georgia, serif; font-size: 1.08rem; }
.category-card span { margin-top: 7px; color: var(--muted); font-size: .88rem; }
.category-card b { position: absolute; right: 17px; top: 18px; color: var(--gold); }
.category-card:hover, .category-card:focus-visible { border-color: #9ccdd5; transform: translateY(-1px); }

.article-grid { display: grid; grid-template-columns: 1.35fr repeat(3, 1fr); gap: 17px; }
.article-card { overflow: hidden; background: #fff; border: 1px solid #e2e8ea; border-radius: var(--radius); box-shadow: 0 6px 18px rgba(8,30,44,.05); }
.article-card__visual { position: relative; aspect-ratio: 16 / 9; display: flex; align-items: end; padding: 14px; background: radial-gradient(circle at 75% 25%, rgba(240,189,89,.45), transparent 22%), linear-gradient(135deg, #0c2c3e, #187e95); overflow: hidden; }
.article-card__visual::before, .article-card__visual::after { content: ""; position: absolute; border: 1px solid rgba(255,255,255,.15); border-radius: 50%; }
.article-card__visual::before { width: 180px; height: 180px; right: -35px; top: -58px; }
.article-card__visual::after { width: 110px; height: 110px; right: 2px; top: -20px; border-color: rgba(240,189,89,.35); }
.article-card__visual > span { color: rgba(255,255,255,.72); text-transform: uppercase; letter-spacing: .13em; font-size: .68rem; font-weight: 800; }
.article-card__body { padding: 18px; }
.status-badge { display: inline-flex; align-items: center; min-height: 26px; padding: 4px 9px; border-radius: 999px; background: #e7f7fa; color: #0d697a; font-size: .68rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.article-card h3, .archive-card h3, .experiment-list h3 { margin: 10px 0 8px; font-family: Georgia, serif; font-size: 1.25rem; line-height: 1.18; }
.article-card p, .archive-card p, .experiment-list p { color: var(--muted); font-size: .93rem; }
.article-card--featured h3 { font-size: 1.55rem; }

.utility-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; }
.utility-card { position: relative; min-height: 150px; padding: 20px; background: #fff; border: 1px solid #dfe7ea; border-radius: var(--radius-sm); }
.utility-card__mark { display: inline-flex; min-width: 34px; height: 34px; align-items: center; justify-content: center; margin-bottom: 16px; border-radius: 9px; background: #e6f7f9; color: #10748a; font-weight: 900; }
.utility-card strong, .utility-card > span:last-child { display: block; }
.utility-card strong { margin-bottom: 6px; }
.utility-card > span:last-child { color: var(--muted); font-size: .88rem; }
.utility-card--code .utility-card__mark { min-width: 48px; background: #edf0f8; color: #334e7e; font-size: .78rem; }
.utility-card:hover, .utility-card:focus-visible { border-color: #9ccdd5; box-shadow: 0 9px 24px rgba(8,30,44,.07); }

.experiments { background: linear-gradient(112deg, #0a1f2d, #0c3143 72%, #0d3b4d); color: #fff; }
.experiments__grid { display: grid; grid-template-columns: .9fr 1.35fr; gap: 52px; align-items: center; }
.experiments h2 { margin-bottom: 12px; }
.experiments p { color: #bdd0da; }
.experiment-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.experiment-list article { padding: 18px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.13); border-radius: 14px; }
.experiment-list h3 { color: #fff; }
.experiment-list p { margin-bottom: 0; }

.archive { background: #081c29; color: #fff; }
.section-heading--light p:not(.kicker) { color: #bed0d9; }
.section-heading--light .text-link { color: #9fe3ee; }
.archive-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.archive-card { padding: 20px; background: #0e2b3d; border: 1px solid #21485d; border-radius: 15px; }
.archive-card p { color: #bed0d9; }

.browse-topics { display: grid; grid-template-columns: .72fr 1.28fr; gap: 44px; align-items: center; }
.topic-cloud { display: flex; flex-wrap: wrap; gap: 10px; }
.topic-cloud a { padding: 10px 13px; background: #fff; border: 1px solid #dce5e8; border-radius: 999px; font-weight: 750; }
.topic-cloud a:hover, .topic-cloud a:focus-visible { border-color: var(--teal); background: #f2fbfc; }

.domains { padding: 52px 0; background: linear-gradient(115deg, #092235, #0b3042 62%, #123c4f); color: #fff; }
.domains__grid { display: grid; grid-template-columns: .95fr 1.15fr; gap: 38px; align-items: center; }
.domains p:not(.eyebrow) { max-width: 660px; color: #c7dae2; }
.domain-search { padding: 18px; background: #fff; border-radius: 17px; color: var(--text); box-shadow: 0 16px 35px rgba(0,0,0,.15); }
.domain-search label { display: block; margin-bottom: 8px; font-weight: 800; }
.domain-search > div { display: flex; gap: 9px; }
.domain-search input { flex: 1; min-width: 0; padding: 13px 14px; border: 1px solid #cad6db; border-radius: 10px; }
.domain-search button { border: 0; border-radius: 10px; background: var(--gold-2); color: #10202a; font-weight: 850; padding: 0 16px; cursor: pointer; }
.domain-search small { display: block; margin-top: 9px; color: #687982; }

.connect-card { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 25px; background: #fff; border: 1px solid #dce5e8; border-radius: var(--radius); box-shadow: 0 8px 22px rgba(8,30,44,.05); }

.site-footer { padding: 40px 0 22px; background: #061722; color: #c4d3da; }
.footer-grid { display: grid; grid-template-columns: 2fr repeat(3, 1fr); gap: 32px; }
.footer-brand img { height: 34px; width: auto; margin-bottom: 15px; }
.footer-brand p { max-width: 520px; }
.site-footer h2 { margin: 0 0 10px; color: #fff; font-size: .92rem; }
.site-footer nav a { display: block; margin: 7px 0; font-size: .9rem; }
.site-footer a:hover, .site-footer a:focus-visible { color: var(--gold-2); }
.muted { color: #8da1ac; }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; margin-top: 30px; padding-top: 18px; border-top: 1px solid #173646; color: #859aa5; font-size: .78rem; }

.stub-main { min-height: 62vh; padding: 72px 0; }
.stub-card { max-width: 860px; padding: 34px; background: #fff; border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow); }
.stub-card p { color: var(--muted); }
.stub-query { padding: 12px; background: #eef7f8; border-radius: 10px; }

:focus-visible { outline: 3px solid #59cce0; outline-offset: 3px; }

@media (max-width: 1180px) {
  .primary-nav { gap: 14px; font-size: .87rem; }
  .section-shortcuts__grid { grid-template-columns: repeat(4, 1fr); }
  .section-shortcuts a:nth-child(4n+1) { border-left: 1px solid #edf1f3; }
  .section-shortcuts a:nth-child(n+5) { border-top: 1px solid #edf1f3; }
  .article-grid { grid-template-columns: repeat(2, 1fr); }
  .category-grid { grid-template-columns: repeat(2, 1fr); }
  .utility-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 960px) {
  .utility-bar { display: none; }
  .site-header__inner { min-height: 64px; }
  .menu-button { display: inline-flex; }
  .primary-nav { display: none; position: absolute; left: 3vw; right: 3vw; top: calc(100% + 8px); margin: 0; padding: 12px; flex-direction: column; align-items: stretch; gap: 0; background: #0a2231; border: 1px solid #345164; border-radius: 14px; box-shadow: 0 20px 45px rgba(0,0,0,.28); }
  .primary-nav[data-open] { display: flex; }
  .primary-nav a { padding: 10px 12px; border-bottom: 1px solid #173a4d; }
  .primary-nav a:last-child { border-bottom: 0; }
  .hero-grid { grid-template-columns: 1fr 1fr; grid-template-areas: "center center" "thinker robot"; min-height: auto; gap: 0; padding-top: 0; }
  .hero-center { padding: 40px 0 12px; }
  .hero-frame { padding: 28px 24px; }
  .hero-portrait { height: 210px; width: 100%; opacity: .82; }
  .hero-portrait--thinker { border-radius: 0 52% 0 0; }
  .hero-portrait--robot { border-radius: 52% 0 0 0; }
  .hero-portrait--thinker img { object-position: center 20%; }
  .hero-portrait--robot img { object-position: center 18%; }
  .hero-globe { bottom: -90px; width: 430px; height: 215px; }
  .experiments__grid, .browse-topics, .domains__grid { grid-template-columns: 1fr; }
  .experiment-list { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 700px) {
  .wrap { width: min(92vw, var(--wrap)); }
  .brand img { height: 30px; }
  .hero-center { padding-top: 30px; }
  .hero-frame { padding: 24px 18px; border-radius: 19px; }
  .hero h1 { font-size: clamp(2.35rem, 10vw, 3.1rem); }
  .hero-lead { font-size: 1rem; }
  .hero-portrait { height: 150px; }
  .hero-topics { gap: 6px 10px; }
  .section-shortcuts__grid { grid-template-columns: repeat(2, 1fr); width: 100%; }
  .section-shortcuts a:nth-child(n+3) { border-top: 1px solid #edf1f3; }
  .section { padding: 40px 0; }
  .section-heading--split { align-items: start; flex-direction: column; }
  .category-grid, .article-grid, .utility-grid, .archive-grid, .experiment-list { grid-template-columns: 1fr; }
  .article-card--featured h3 { font-size: 1.3rem; }
  .experiments__grid { gap: 26px; }
  .domain-search > div { flex-direction: column; }
  .domain-search button { min-height: 45px; }
  .connect-card { align-items: stretch; flex-direction: column; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-bottom { flex-direction: column; }
}

@media (max-width: 420px) {
  .hero h1 { font-size: 2.25rem; }
  .hero-portrait { height: 130px; }
  .section-shortcuts strong { font-size: .85rem; }
  .section-shortcuts span { display: none; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-brand { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}


/* Static preview: secondary page components */
.page-hero { position: relative; overflow: hidden; background: radial-gradient(circle at 85% 20%, rgba(40,185,208,.22), transparent 24%), linear-gradient(115deg,#071722,#0b3042 70%,#0f4053); color:#fff; border-bottom:1px solid rgba(216,154,43,.42); }
.page-hero::before { content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size:40px 40px; opacity:.6; }
.page-hero__grid { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr); gap:46px; align-items:center; min-height:300px; padding-block:44px; }
.page-hero__grid:not(:has(.page-hero__visual)) { grid-template-columns:minmax(0,900px); }
.page-hero h1 { margin:8px 0 14px; max-width:900px; font:700 clamp(2.5rem,5vw,4.8rem)/1.02 Georgia,"Times New Roman",serif; letter-spacing:-.028em; }
.page-hero__lead { max-width:800px; margin:0 0 18px; color:#d0e1e7; font-size:1.08rem; }
.page-hero__visual { overflow:hidden; border:1px solid rgba(240,189,89,.5); border-radius:18px; box-shadow:0 18px 45px rgba(0,0,0,.26); transform:rotate(1.2deg); }
.page-hero__visual img { width:100%; aspect-ratio:16/10; object-fit:cover; object-position:center top; }
.hero-topics--left { justify-content:flex-start; margin-bottom:0; }
.breadcrumbs { display:flex; flex-wrap:wrap; gap:8px; padding:18px 0 0; color:#697b84; font-size:.82rem; }
.breadcrumbs a { color:#12677a; font-weight:750; }
.bc-home { font-weight:850; color:#213845; }
.filter-row { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:22px; }
.filter-chip { border:1px solid #cad8de; background:#fff; color:#28434f; border-radius:999px; padding:8px 13px; cursor:pointer; font-weight:750; }
.filter-chip:hover,.filter-chip.is-active { background:#0e6b7f; border-color:#0e6b7f; color:#fff; }
.content-list { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.content-card { padding:24px; background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:0 5px 16px rgba(8,30,44,.045); }
.content-card[hidden] { display:none; }
.content-card__top { display:flex; justify-content:space-between; gap:14px; align-items:center; }
.content-card__topic { color:#61717b; font-size:.78rem; font-weight:750; }
.content-card h2,.tool-card h2,.script-card h2,.archive-entry h2,.domain-card h2,.topic-card h2,.experiment-card h2,.search-result h2 { margin:12px 0 8px; font:700 1.42rem/1.16 Georgia,serif; }
.content-card p { color:var(--muted); }
.content-card__meta { margin:14px 0 8px; color:#71848e; font-size:.78rem; }
.article-shell { padding-top:34px; }
.article-layout { display:grid; grid-template-columns:240px minmax(0,780px); justify-content:center; gap:46px; align-items:start; }
.article-toc { position:sticky; top:95px; display:grid; gap:8px; padding:18px; background:#fff; border:1px solid var(--line); border-radius:14px; color:#5f737e; font-size:.83rem; }
.article-toc > strong { color:var(--text); font-family:Georgia,serif; font-size:1.05rem; }
.article-toc a { color:#14687a; }
.article-toc hr { width:100%; border:0; border-top:1px solid var(--line); }
.meta-label { margin-top:5px; color:#8799a2; text-transform:uppercase; letter-spacing:.08em; font-size:.66rem; font-weight:850; }
.article-body { min-width:0; padding:0 0 30px; }
.article-body > section { margin:0 0 38px; scroll-margin-top:105px; }
.article-body h2 { margin:0 0 12px; font:700 2rem/1.12 Georgia,serif; }
.article-body p,.article-body li { font-size:1.04rem; color:#334c58; }
.article-body code { background:#eef3f5; padding:2px 5px; border-radius:5px; }
.standfirst { font-size:1.25rem!important; color:#173542!important; }
.demo-notice,.callout,.answer-box,.key-takeaways,.safety-box,.section-note { padding:16px 18px; border-radius:12px; }
.demo-notice { margin-bottom:24px; background:#fff3d5; border:1px solid #eed18d; color:#71581d; }
.answer-box { background:#eaf8fa; border-left:4px solid #1c99af; }
.callout { background:#f1f5f6; border:1px solid #dce5e8; }
.key-takeaways { background:#071f2c; color:#fff; }
.key-takeaways h2,.key-takeaways li { color:#fff; }
.article-body blockquote { margin:24px 0; padding:8px 0 8px 22px; border-left:3px solid var(--gold); color:#485f69; font:italic 1.16rem/1.55 Georgia,serif; }
.related-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.mini-card { display:block; padding:16px; border:1px solid var(--line); border-radius:12px; background:#fff; }
.mini-card strong,.mini-card span { display:block; }
.mini-card span { margin-top:4px; color:var(--muted); font-size:.88rem; }
.tool-grid-large { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.tool-card { display:grid; grid-template-columns:64px 1fr; gap:18px; min-height:170px; padding:23px; background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:0 6px 17px rgba(8,30,44,.045); }
.tool-card:hover { border-color:#8ecbd5; }
.tool-icon { display:flex; align-items:center; justify-content:center; width:58px; height:58px; border-radius:14px; background:#e7f7fa; color:#0b7185; font:800 1.35rem/1 monospace; }
.tool-card h2 { margin-top:0; }
.tool-card p { color:var(--muted); }
.tool-state { color:#12677a; font-weight:800; font-size:.83rem; }
.section-note { margin-top:24px; background:#f0f5f6; border:1px solid #d8e2e6; color:#516873; }
.tool-layout,.script-detail { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(260px,.6fr); gap:24px; align-items:start; }
.tool-workbench,.tool-notes,.script-main,.subscribe-card,.rss-card,.prose-card,.principles-card { background:#fff; border:1px solid var(--line); border-radius:16px; padding:24px; box-shadow:0 6px 18px rgba(8,30,44,.045); }
.tool-workbench label,.subscribe-card label,.domain-controls label,.search-box label { display:block; margin-bottom:8px; font-weight:850; }
.tool-textarea,.tool-input,.subscribe-card input,.domain-controls input,.search-box input { width:100%; border:1px solid #c6d4da; border-radius:10px; padding:12px 13px; background:#fff; color:var(--text); }
.tool-textarea { resize:vertical; }
.code-input { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:.9rem; }
.tool-actions { display:flex; flex-wrap:wrap; gap:9px; margin:14px 0; }
.button--ghost { background:#eef3f5; color:#263e49; }
.tool-message { min-height:24px; margin:8px 0; font-weight:750; }
.tool-message.is-error { color:#a33131; }
.tool-message.is-ok { color:#176b48; }
.stats-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin-top:15px; }
.stats-grid div { padding:14px 10px; background:#f2f7f8; border-radius:10px; text-align:center; }
.stats-grid strong,.stats-grid span { display:block; }
.stats-grid strong { font-size:1.45rem; }
.stats-grid span { color:#697c86; font-size:.74rem; }
.result-panel { margin-top:14px; padding:17px; background:#f1f6f7; border:1px solid #dae4e7; border-radius:12px; }
.result-panel.is-valid { background:#e9f7ee; border-color:#b9ddc7; color:#17683d; }
.result-panel.is-invalid { background:#fff0f0; border-color:#e7c2c2; color:#983838; }
.tool-notes h2 { margin-top:0; font-family:Georgia,serif; }
.tool-notes h3 { margin-bottom:4px; font-size:.84rem; text-transform:uppercase; letter-spacing:.07em; color:#617782; }
.script-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.script-card { padding:22px; background:#fff; border:1px solid var(--line); border-radius:15px; }
.code-pill { display:inline-flex; padding:5px 9px; border-radius:7px; background:#e9edf7; color:#324d7b; font:800 .7rem/1 ui-monospace,monospace; }
.script-env { margin-left:8px; color:#71838c; font-size:.73rem; }
.script-card p { color:var(--muted); }
.detail-meta { display:flex; flex-wrap:wrap; gap:10px 16px; color:#637780; font-size:.8rem; }
.script-main h2 { margin-top:32px; font-family:Georgia,serif; }
.code-block { overflow:hidden; margin:18px 0; background:#061722; border:1px solid #173b4d; border-radius:13px; color:#d7e6eb; }
.code-block__bar { display:flex; justify-content:space-between; align-items:center; padding:9px 12px; background:#0b2736; color:#a9c6d1; font-size:.78rem; }
.code-block__bar button { border:1px solid #3a5a69; border-radius:7px; padding:5px 10px; background:#102f40; color:#fff; cursor:pointer; }
.code-block pre { overflow:auto; margin:0; padding:18px; }
.code-block code { font: .87rem/1.55 ui-monospace,SFMono-Regular,Consolas,monospace; }
.safety-box { margin-top:24px; background:#fff5dc; border:1px solid #efd393; }
.archive-status-guide { padding:23px; background:#fff; border:1px solid var(--line); border-radius:16px; }
.archive-status-guide h2 { margin-top:0; font-family:Georgia,serif; }
.archive-status-guide .topic-cloud span { padding:9px 12px; border:1px solid #dce5e8; border-radius:999px; background:#f8fbfb; font-weight:750; }
.archive-list { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin-top:18px; }
.archive-entry { padding:21px; background:#0b2736; color:#fff; border:1px solid #22485a; border-radius:15px; }
.archive-entry p,.archive-entry small { color:#bed0d9; }
.domain-controls { display:grid; grid-template-columns:auto minmax(260px,1fr) auto; gap:12px; align-items:center; padding:16px; margin-bottom:18px; background:#fff; border:1px solid var(--line); border-radius:13px; }
.domain-controls label { margin:0; }
.domain-controls span { color:#6d808a; font-size:.82rem; }
.domain-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.domain-card { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:17px; background:#fff; border:1px solid var(--line); border-radius:12px; }
.domain-card[hidden] { display:none; }
.domain-card h2 { margin:0 0 4px; font-size:1.04rem; }
.domain-card span { color:#6d7f88; font-size:.74rem; }
.domain-price { text-align:right; white-space:nowrap; }
.domain-price strong,.domain-price small { display:block; }
.domain-price small { color:#6d7f88; }
.topic-directory { display:grid; gap:12px; }
.topic-card { display:grid; grid-template-columns:58px 1fr 30px; align-items:center; gap:18px; padding:19px 22px; background:#fff; border:1px solid var(--line); border-radius:14px; }
.topic-card:hover { border-color:#8ecbd5; }
.topic-card__index { font:800 1.25rem/1 Georgia,serif; color:var(--gold); }
.topic-card h2 { margin:0 0 5px; }
.topic-card p { margin:0; color:var(--muted); }
.topic-card b { color:#148097; }
.experiment-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.experiment-card { padding:20px; background:#fff; border:1px solid var(--line); border-radius:15px; }
.experiment-card p { color:var(--muted); }
.experiment-meter { height:6px; overflow:hidden; margin:18px 0 8px; background:#e5edef; border-radius:999px; }
.experiment-meter span { display:block; height:100%; background:linear-gradient(90deg,#188ba4,#d89a2b); }
.experiment-card small { color:#71838c; }
.prose-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:18px; }
.prose-card h2,.principles-card h2 { font-family:Georgia,serif; }
.prose-card blockquote { padding-left:18px; border-left:3px solid var(--gold); font:italic 1.35rem Georgia,serif; }
.principles-card { background:#0a2737; color:#fff; }
.principles-card li { margin-bottom:10px; color:#d0e0e6; }
.timeline { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.timeline > div { position:relative; padding:19px; background:#fff; border:1px solid var(--line); border-radius:14px; }
.timeline b { display:flex; align-items:center; justify-content:center; width:32px; height:32px; margin-bottom:12px; border-radius:50%; background:#0e7186; color:#fff; }
.timeline strong,.timeline span { display:block; }
.timeline span { margin-top:6px; color:var(--muted); font-size:.84rem; }
.search-shell { max-width:980px; margin:auto; }
.search-box { position:sticky; top:84px; z-index:10; padding:16px; background:rgba(250,248,242,.96); border-bottom:1px solid var(--line); backdrop-filter:blur(8px); }
.search-box input { font-size:1.05rem; }
.search-box span { display:block; margin-top:7px; color:#667983; font-size:.78rem; }
.search-results { display:grid; gap:10px; margin-top:15px; }
.search-result { padding:20px; background:#fff; border:1px solid var(--line); border-radius:14px; }
.search-result[hidden] { display:none; }
.search-result h2 { margin:9px 0 5px; }
.search-result p { margin:0 0 8px; color:var(--muted); }
.search-result small { color:#71838c; }
.narrow { max-width:760px; }
.subscribe-card { display:grid; gap:10px; }
.subscribe-card h2,.rss-card h2 { margin:0; font-family:Georgia,serif; }
.subscribe-card .button { justify-self:start; }
.form-message { min-height:24px; margin:0; color:#176b48; font-weight:750; }
.rss-card { margin-top:18px; }

@media (max-width: 960px) {
  .page-hero__grid,.page-hero__grid:not(:has(.page-hero__visual)),.tool-layout,.script-detail,.prose-grid { grid-template-columns:1fr; }
  .page-hero__visual { max-width:560px; }
  .article-layout { grid-template-columns:1fr; }
  .article-toc { position:static; grid-template-columns:repeat(2,1fr); }
  .domain-grid,.experiment-grid { grid-template-columns:repeat(2,1fr); }
  .timeline { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 700px) {
  .content-list,.tool-grid-large,.script-grid,.archive-list,.domain-grid,.experiment-grid,.related-grid,.timeline { grid-template-columns:1fr; }
  .page-hero__grid { min-height:250px; padding-block:32px; gap:22px; }
  .page-hero h1 { font-size:clamp(2.35rem,11vw,3.2rem); }
  .tool-card { grid-template-columns:50px 1fr; padding:18px; }
  .tool-icon { width:48px; height:48px; }
  .stats-grid { grid-template-columns:repeat(2,1fr); }
  .domain-controls { grid-template-columns:1fr; }
  .article-toc { grid-template-columns:1fr; }
  .topic-card { grid-template-columns:42px 1fr 22px; padding:16px; gap:12px; }
}

/* =========================================================
   YNIA v0.3 — approved header / signature hero direction
   Compact editorial header + framed museum-quality hero.
   ========================================================= */
.utility-bar { display:none !important; }
.ynia-header {
  position: sticky;
  top: 0;
  z-index: 120;
  background: rgba(5,20,31,.985);
  border-bottom: 1px solid rgba(226,167,60,.38);
  box-shadow: 0 8px 28px rgba(0,0,0,.2);
  backdrop-filter: blur(12px);
}
.ynia-header__inner {
  min-height: 70px;
  display:flex;
  align-items:center;
  gap:24px;
}
.ynia-brand {
  display:flex;
  flex-direction:column;
  flex:0 0 auto;
  min-width:235px;
  line-height:1;
}
.ynia-brand img { height:31px; width:auto; }
.ynia-brand span {
  margin-top:4px;
  color:#9fb7c3;
  font-size:.48rem;
  font-weight:750;
  letter-spacing:.16em;
  text-transform:uppercase;
  white-space:nowrap;
}
.ynia-primary-nav {
  margin-left:auto;
  gap:18px;
  font-size:.78rem;
  font-weight:700;
}
.ynia-primary-nav a {
  padding:25px 0 22px;
  border-bottom:2px solid transparent;
  color:#eef5f7;
}
.ynia-primary-nav a:hover,
.ynia-primary-nav a:focus-visible,
.ynia-primary-nav a[aria-current="page"] { color:#f0bd59; }
.ynia-primary-nav a[aria-current="page"] { border-bottom-color:#d89a2b; }
.ynia-header__actions { display:flex; align-items:center; gap:10px; margin-left:2px; }
.ynia-search {
  width:38px;
  height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(240,189,89,.72);
  border-radius:50%;
  color:#f5cf78;
  font-size:1.5rem;
  line-height:1;
}
.ynia-search:hover,.ynia-search:focus-visible { background:#102c3d; }
.ynia-subscribe {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:8px 15px;
  border:1px solid #d89a2b;
  border-radius:7px;
  color:#f6cb6e;
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.02em;
}
.ynia-subscribe:hover,.ynia-subscribe:focus-visible { background:#d89a2b; color:#071722; }

.signature-hero {
  position:relative;
  min-height:525px;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(circle at 50% 88%, rgba(9,127,166,.34), transparent 28%),
    radial-gradient(circle at 12% 45%, rgba(212,151,44,.11), transparent 22%),
    radial-gradient(circle at 88% 42%, rgba(10,163,213,.14), transparent 22%),
    linear-gradient(180deg,#061925 0%,#072232 66%,#061722 100%);
  border-bottom:1px solid rgba(216,154,43,.35);
}
.signature-hero::before {
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:38px 38px;
  opacity:.42;
  pointer-events:none;
}
.signature-hero::after {
  content:"";
  position:absolute;
  left:50%;
  bottom:-12px;
  width:min(1080px,82vw);
  height:190px;
  transform:translateX(-50%);
  background:radial-gradient(ellipse at center,rgba(20,178,221,.18),transparent 67%);
  filter:blur(5px);
}
.signature-hero__stage {
  position:relative;
  z-index:3;
  min-height:525px;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:88px 260px 190px;
}
.signature-hero__stage::before,
.signature-hero__stage::after {
  content:"";
  position:absolute;
  pointer-events:none;
}
.signature-hero__stage::before {
  inset:31px 82px 18px;
  border:2px solid rgba(224,163,50,.91);
  border-radius:2px;
  box-shadow:
    0 0 0 5px rgba(216,154,43,.09),
    inset 0 0 0 1px rgba(255,215,118,.15),
    0 18px 60px rgba(0,0,0,.2);
}
.signature-hero__stage::after {
  inset:42px 93px 29px;
  border:1px solid rgba(240,189,89,.35);
}
.signature-hero__side {
  position:absolute;
  z-index:2;
  bottom:0;
  height:min(465px,88%);
  width:auto;
  pointer-events:none;
  user-select:none;
}
.signature-hero__side--left { left:max(0px,calc(50% - 700px)); }
.signature-hero__side--right { right:max(0px,calc(50% - 700px)); }
.signature-hero__globe {
  position:absolute;
  z-index:1;
  left:50%;
  bottom:-2px;
  transform:translateX(-50%);
  width:min(760px,65vw);
  max-width:none;
  opacity:.98;
  pointer-events:none;
}
.signature-hero__plaque {
  position:absolute;
  z-index:6;
  top:17px;
  left:50%;
  transform:translateX(-50%);
  min-width:270px;
  padding:9px 25px 8px;
  border:2px solid #d7a33f;
  outline:1px solid rgba(255,215,115,.35);
  outline-offset:4px;
  background:linear-gradient(180deg,#102435,#081722);
  box-shadow:0 7px 18px rgba(0,0,0,.3), inset 0 0 22px rgba(216,154,43,.08);
  color:#f4cf78;
  text-align:center;
  font-family:Georgia,"Times New Roman",serif;
  font-size:.84rem;
  letter-spacing:.42em;
  text-indent:.42em;
}
.signature-hero__plaque::before,
.signature-hero__plaque::after {
  content:"";
  position:absolute;
  top:50%;
  width:82px;
  height:1px;
  background:linear-gradient(90deg,transparent,#d89a2b);
}
.signature-hero__plaque::before { right:100%; margin-right:12px; }
.signature-hero__plaque::after { left:100%; margin-left:12px; transform:scaleX(-1); }
.signature-hero__content {
  position:relative;
  z-index:7;
  width:min(690px,100%);
  text-align:center;
  text-shadow:0 3px 18px rgba(0,0,0,.46);
}
.signature-hero h1 {
  margin:0;
  font:700 clamp(2.55rem,4.25vw,4.45rem)/.98 Georgia,"Times New Roman",serif;
  letter-spacing:-.035em;
}
.signature-hero h1 em { color:#f0bd59; font-style:italic; }
.signature-hero__eyebrow {
  margin:22px auto 0;
  color:#e0e9ed;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.28em;
  line-height:1.5;
  text-transform:uppercase;
}
.signature-hero__buttons { justify-content:center; margin-top:22px; }
.signature-hero__buttons .button { min-height:44px; padding:10px 22px; border-radius:999px; font-size:.8rem; text-transform:uppercase; letter-spacing:.02em; }
.signature-hero__button-secondary {
  color:#eef9fc;
  border:1px solid rgba(217,234,240,.55);
  background:rgba(5,18,28,.64);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);
}
.signature-hero__button-secondary:hover,.signature-hero__button-secondary:focus-visible { border-color:#41c5dc; background:#0b2b3c; }
.signature-hero__rail {
  position:absolute;
  z-index:5;
  top:62px;
  display:flex;
  flex-direction:column;
  gap:5px;
  color:#a9bec8;
  font-size:.53rem;
  font-weight:800;
  letter-spacing:.22em;
  line-height:1.15;
  text-transform:uppercase;
}
.signature-hero__rail--left { left:18px; }
.signature-hero__rail--right { right:14px; align-items:flex-end; text-align:right; }

.hero-shortcuts {
  position:relative;
  z-index:10;
  background:#061722;
  color:#edf6f8;
  border-top:1px solid rgba(240,189,89,.34);
  border-bottom:1px solid rgba(240,189,89,.28);
  box-shadow:0 9px 22px rgba(0,0,0,.12);
}
.hero-shortcuts__grid {
  display:grid;
  grid-template-columns:repeat(6,1fr);
}
.hero-shortcuts a {
  position:relative;
  min-height:114px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:14px 18px;
  text-align:center;
}
.hero-shortcuts a:not(:last-child)::after {
  content:"";
  position:absolute;
  right:0;
  top:18px;
  bottom:18px;
  width:1px;
  background:linear-gradient(180deg,transparent,rgba(216,154,43,.65),transparent);
}
.hero-shortcuts a:hover,.hero-shortcuts a:focus-visible { background:#0a2636; }
.hero-shortcuts__icon { color:#f5f7f8; font-size:1.7rem; line-height:1; margin-bottom:7px; }
.hero-shortcuts__icon--code { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:1.15rem; font-weight:900; }
.hero-shortcuts strong { font-family:Georgia,"Times New Roman",serif; font-size:1rem; }
.hero-shortcuts small { display:block; max-width:165px; margin-top:3px; color:#aebfc8; font-size:.67rem; line-height:1.28; }

/* Make the first editorial section sit cleanly under the cinematic top. */
.hero-shortcuts + .section { padding-top:44px; }

@media (max-width: 1240px) {
  .ynia-primary-nav { gap:13px; font-size:.73rem; }
  .ynia-brand { min-width:210px; }
  .ynia-brand img { height:29px; }
  .ynia-brand span { font-size:.43rem; }
  .ynia-subscribe { display:none; }
  .signature-hero__stage { padding-inline:220px; }
  .signature-hero__stage::before { inset-inline:62px; }
  .signature-hero__stage::after { inset-inline:73px; }
}

@media (max-width: 1020px) {
  .ynia-header__actions { margin-left:auto; }
  .ynia-primary-nav { display:none; }
  .menu-button { display:inline-flex; order:3; }
  .ynia-header__actions { order:2; }
  .ynia-primary-nav[data-open] {
    display:flex;
    position:absolute;
    top:calc(100% + 8px);
    right:3vw;
    left:3vw;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding:10px;
    background:#071d2a;
    border:1px solid #355266;
    border-radius:12px;
    box-shadow:0 18px 45px rgba(0,0,0,.35);
  }
  .ynia-primary-nav[data-open] a { padding:11px 12px; border-bottom:1px solid #17394b; }
  .signature-hero { min-height:500px; }
  .signature-hero__stage { min-height:500px; padding:90px 150px 170px; }
  .signature-hero__side { height:420px; opacity:.86; }
  .signature-hero__stage::before { inset:30px 28px 18px; }
  .signature-hero__stage::after { inset:41px 39px 29px; }
  .signature-hero__rail { display:none; }
  .hero-shortcuts__grid { grid-template-columns:repeat(3,1fr); }
  .hero-shortcuts a:nth-child(-n+3) { border-bottom:1px solid rgba(255,255,255,.06); }
}

@media (max-width: 700px) {
  .ynia-header__inner { min-height:62px; gap:10px; }
  .ynia-brand { min-width:0; }
  .ynia-brand img { height:27px; }
  .ynia-brand span { display:none; }
  .ynia-search { width:34px; height:34px; }
  .menu-button { padding:7px 9px; }
  .menu-button span:last-child { display:none; }
  .signature-hero { min-height:520px; }
  .signature-hero__stage {
    min-height:520px;
    padding:88px 22px 180px;
    align-items:flex-start;
  }
  .signature-hero__stage::before { inset:25px 8px 12px; }
  .signature-hero__stage::after { inset:34px 16px 20px; }
  .signature-hero__plaque { min-width:220px; padding-inline:16px; font-size:.68rem; letter-spacing:.31em; text-indent:.31em; }
  .signature-hero__plaque::before,.signature-hero__plaque::after { width:28px; }
  .signature-hero__content { width:100%; }
  .signature-hero h1 { font-size:clamp(2.3rem,10.4vw,3.2rem); }
  .signature-hero__eyebrow { margin-top:17px; font-size:.62rem; letter-spacing:.19em; }
  .signature-hero__side { height:235px; bottom:0; opacity:.9; }
  .signature-hero__side--left { left:-62px; }
  .signature-hero__side--right { right:-62px; }
  .signature-hero__globe { width:520px; max-width:115vw; bottom:-3px; }
  .signature-hero__buttons { margin-top:17px; }
  .signature-hero__buttons .button { min-height:40px; padding:9px 15px; font-size:.7rem; }
  .hero-shortcuts__grid { grid-template-columns:repeat(2,1fr); width:100%; }
  .hero-shortcuts a { min-height:96px; padding:12px 10px; }
  .hero-shortcuts a:nth-child(n) { border-bottom:1px solid rgba(255,255,255,.06); }
  .hero-shortcuts a:nth-last-child(-n+2) { border-bottom:0; }
  .hero-shortcuts a:nth-child(odd)::after { display:block; }
  .hero-shortcuts a:nth-child(even)::after { display:none; }
  .hero-shortcuts small { font-size:.62rem; }
}

@media (max-width: 420px) {
  .ynia-header__inner { gap:7px; }
  .ynia-brand img { height:25px; }
  .ynia-search { display:none; }
  .signature-hero { min-height:500px; }
  .signature-hero__stage { min-height:500px; padding-top:82px; }
  .signature-hero h1 { font-size:2.22rem; }
  .signature-hero__side { height:205px; }
  .signature-hero__side--left { left:-68px; }
  .signature-hero__side--right { right:-68px; }
  .hero-shortcuts small { display:none; }
  .hero-shortcuts a { min-height:74px; }
}


/* YNIA production hero — selected artwork with real HTML interaction layer */
.ynia-header__inner{min-height:68px}.ynia-brand{display:grid;gap:2px}.ynia-brand span{font-size:.62rem;color:#9fb5c1;letter-spacing:.05em}.ynia-header__actions{display:flex;align-items:center;gap:9px}.ynia-search{display:grid;place-items:center;width:38px;height:38px;border:1px solid #345466;border-radius:50%;color:#fff;font-size:1.25rem}.ynia-subscribe{padding:9px 13px;border-radius:8px;background:linear-gradient(135deg,#f0bd59,#d89a2b);color:#091923;font-weight:850}.production-hero{position:relative;min-height:clamp(500px,55vw,760px);overflow:hidden;background:#071722;color:#fff;border-bottom:1px solid #9b6a1a}.production-hero__image{position:absolute;inset:0;background:url('/assets/img/hero/connected-tomorrow.jpg') center center/cover no-repeat;filter:brightness(1.07) saturate(1.04)}.production-hero__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,13,21,.32),rgba(2,13,21,.15) 36%,rgba(2,13,21,.10) 65%,rgba(2,13,21,.28)),linear-gradient(0deg,rgba(3,17,27,.72),transparent 43%)}.production-hero__content{position:relative;z-index:3;display:flex;min-height:clamp(500px,55vw,760px);flex-direction:column;align-items:center;justify-content:flex-end;text-align:center;padding:0 16px clamp(42px,6vw,80px)}.production-hero__brand{margin:0 0 8px;color:#f0c36e;font-family:Georgia,serif;font-size:.82rem;font-weight:900;letter-spacing:.24em;text-shadow:0 2px 12px #000}.production-hero h1{max-width:900px;margin:0 auto 14px;font:700 clamp(2.1rem,3.6vw,4rem)/1.02 Georgia,'Times New Roman',serif;letter-spacing:-.025em;text-shadow:0 3px 18px #000}.production-hero h1 em{color:#f3c66e}.production-hero__content>p:not(.production-hero__brand){max-width:820px;margin:0 auto 20px;color:#edf6f8;font-size:clamp(.98rem,1.45vw,1.16rem);text-shadow:0 2px 12px #000}.production-hero__secondary{border-color:#6fd3e5;background:rgba(5,26,38,.62);color:#fff}.hero-hotspot{position:absolute;z-index:4;border:1px solid transparent;border-radius:18px;outline:none}.hero-hotspot span{position:absolute;left:50%;bottom:8px;transform:translate(-50%,8px);opacity:0;white-space:nowrap;padding:6px 9px;border-radius:7px;background:rgba(3,19,29,.92);color:#f3ca79;font-size:.72rem;font-weight:850;transition:.18s}.hero-hotspot:hover,.hero-hotspot:focus-visible{border-color:rgba(240,189,89,.75);box-shadow:0 0 28px rgba(40,185,208,.24),inset 0 0 35px rgba(240,189,89,.08);background:rgba(255,255,255,.015)}.hero-hotspot:hover span,.hero-hotspot:focus-visible span{opacity:1;transform:translate(-50%,0)}.hero-hotspot--thinker{left:7%;top:15%;width:23%;height:66%}.hero-hotspot--ai{right:7%;top:15%;width:23%;height:66%}.hero-hotspot--globe{left:39%;top:33%;width:23%;height:35%;border-radius:50%}.hero-hotspot--tools{right:1.5%;bottom:7%;width:18%;height:22%}.hero-shortcuts{background:#071722;color:#fff;border-bottom:1px solid #284453}.hero-shortcuts__grid{display:grid;grid-template-columns:repeat(6,1fr)}.hero-shortcuts a{display:grid;gap:4px;padding:17px 13px;text-align:center;border-right:1px solid #1e3948}.hero-shortcuts a:first-child{border-left:1px solid #1e3948}.hero-shortcuts strong{color:#f0bd59}.hero-shortcuts small{color:#9fb5c1}.hero-shortcuts a:hover{background:#0b2b3c}.production-article{max-width:820px;margin:auto}.production-article>p:first-child{font-size:1.2rem}.article-meta{display:flex;flex-wrap:wrap;gap:8px 14px;color:#b7ced7;font-size:.78rem}.article-meta span{padding-right:14px;border-right:1px solid #476371}.article-meta span:last-child{border-right:0}
@media(max-width:900px){.ynia-header__actions{margin-left:auto}.ynia-subscribe{display:none}.production-hero{min-height:620px}.production-hero__content{min-height:620px}.hero-hotspot{display:none}.hero-shortcuts__grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:600px){.ynia-brand span{display:none}.production-hero{min-height:540px}.production-hero__image{background-position:52% center}.production-hero__content{min-height:540px;padding-bottom:34px}.production-hero h1{font-size:clamp(2rem,9vw,2.75rem)}.hero-shortcuts__grid{grid-template-columns:repeat(2,1fr)}.hero-shortcuts small{display:none}}@media(prefers-reduced-motion:reduce){.hero-hotspot span{transition:none}}


/* ============================================================
   YNIA Production Theme v1.1 — Modern editorial / pop-tech
   Distinct from Future-Proof Marketing Press. Flat, crisp, fast.
   ============================================================ */
:root{
  --ink:#10172a;--ink-2:#17213a;--ink-3:#243453;
  --cyan:#12bfd2;--teal:#087f93;--blue:#315cff;--magenta:#d92f88;
  --yellow:#ffd84a;--orange:#ff8a2a;--ivory:#f7f6f2;--paper:#fff;
  --soft:#eef4f6;--text:#172033;--muted:#607080;--line:#cad8df;
  --radius:10px;--radius-sm:8px;--shadow:7px 7px 0 rgba(16,23,42,.08);
}
body{background:#f7f6f2;color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
.site-header{background:#0d1930;border-bottom:3px solid var(--yellow);backdrop-filter:none;box-shadow:0 3px 0 rgba(49,92,255,.12)}
.site-header__inner,.ynia-header__inner{min-height:64px;gap:22px}
.ynia-brand{display:flex;align-items:center;min-width:230px;gap:0}
.ynia-brand img,.brand img{display:block;width:auto!important;height:auto!important;max-width:220px;max-height:40px;object-fit:contain;object-position:left center}
.ynia-brand span{display:none}
.primary-nav,.ynia-primary-nav{gap:18px;font-size:.88rem;font-weight:800}
.primary-nav a{position:relative;padding:21px 0 18px;border:0;color:#f6f8fb}
.primary-nav a::after{content:"";position:absolute;left:0;right:100%;bottom:12px;height:3px;background:var(--yellow);transition:right .16s ease}
.primary-nav a:hover,.primary-nav a:focus-visible,.primary-nav a[aria-current="page"]{color:var(--yellow)}
.primary-nav a:hover::after,.primary-nav a:focus-visible::after,.primary-nav a[aria-current="page"]::after{right:0}
.ynia-search{border:2px solid #536884;border-radius:8px;background:#12213b;color:#fff}
.ynia-search:hover,.ynia-search:focus-visible{border-color:var(--cyan);background:#0a4051}
.ynia-subscribe{border-radius:7px;background:var(--yellow);color:#141b2e;box-shadow:3px 3px 0 var(--magenta);font-weight:900}
.ynia-subscribe:hover,.ynia-subscribe:focus-visible{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--magenta)}

/* Image-led homepage banner. Painted prototype nav is cropped away on desktop. */
.interactive-banner{--mx:50%;--my:42%;position:relative;isolation:isolate;overflow:hidden;width:100%;aspect-ratio:1913/744;background:#0b2037;border-bottom:0}
.interactive-banner__art{position:absolute;inset:0;background-image:url('/assets/img/hero/connected-tomorrow.jpg');background-size:100% auto;background-position:center -6.8vw;background-repeat:no-repeat;filter:saturate(1.02) contrast(1.02) brightness(1.035);transform:scale(1.002);transition:filter .2s ease}
.interactive-banner__light{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle 18vw at var(--mx) var(--my),rgba(255,255,255,.10),transparent 68%);mix-blend-mode:screen;opacity:.85}
.banner-hotspot{position:absolute;z-index:3;border:2px solid transparent;border-radius:10px;outline:0;transition:background .16s,border-color .16s,box-shadow .16s,transform .16s}
.banner-hotspot span{position:absolute;left:50%;bottom:8px;max-width:260px;transform:translate(-50%,10px);opacity:0;padding:7px 10px;background:#0d1930;color:#fff;border:1px solid var(--cyan);box-shadow:4px 4px 0 var(--magenta);font-size:.72rem;font-weight:850;letter-spacing:.02em;white-space:nowrap;pointer-events:none;transition:.16s}
.banner-hotspot:hover,.banner-hotspot:focus-visible{border-color:rgba(255,216,74,.92);background:rgba(18,191,210,.07);box-shadow:0 0 0 4px rgba(49,92,255,.12),0 0 32px rgba(18,191,210,.28);transform:translateY(-1px)}
.banner-hotspot:hover span,.banner-hotspot:focus-visible span{opacity:1;transform:translate(-50%,0)}
.banner-hotspot--thinker{left:5.5%;top:11%;width:24%;height:74%}
.banner-hotspot--left-books{left:0;top:52%;width:13%;height:43%}
.banner-hotspot--articles{left:37.2%;top:41.5%;width:13.2%;height:10%}
.banner-hotspot--tools{left:51.6%;top:41.5%;width:10.3%;height:10%}
.banner-hotspot--ai{right:6%;top:10%;width:23%;height:76%}
.banner-hotspot--right-books{right:0;top:52%;width:14%;height:44%}
.banner-hotspot--globe{left:29%;bottom:-2%;width:41%;height:39%;border-radius:50% 50% 8px 8px}
.hero-semantic{background:#fff;border-bottom:1px solid #cbd8df}
.hero-semantic__inner{display:grid;grid-template-columns:1.05fr 1.25fr auto;gap:24px;align-items:center;padding-block:18px}
.hero-semantic__eyebrow{margin:0 0 3px;color:var(--blue);font-size:.68rem;font-weight:900;letter-spacing:.15em;text-transform:uppercase}
.hero-semantic h1{margin:0;font:850 clamp(1.25rem,1.65vw,1.65rem)/1.08 Inter,ui-sans-serif,system-ui,sans-serif;letter-spacing:-.025em;color:#111a31}
.hero-semantic>div>p,.hero-semantic__inner>p{margin:0;color:#506171;font-size:.88rem;line-height:1.5}
.hero-semantic__actions{display:flex;gap:8px;white-space:nowrap}
.hero-semantic__actions a{padding:9px 12px;border:2px solid #17213a;border-radius:6px;font-size:.78rem;font-weight:900}
.hero-semantic__actions a:first-child{background:var(--yellow);box-shadow:3px 3px 0 var(--magenta)}
.hero-semantic__actions a:last-child{background:#17213a;color:#fff;box-shadow:3px 3px 0 var(--cyan)}
.hero-semantic__actions a:hover,.hero-semantic__actions a:focus-visible{transform:translate(-1px,-1px)}

/* Modern pop-editorial body — less museum, less AI-template aesthetic. */
.section{padding:48px 0}.section--soft{background:#edf3f5;border-block:1px solid #cbd8df}
.kicker,.eyebrow{color:var(--magenta)!important;font-weight:950;letter-spacing:.16em;text-transform:uppercase}
.section-heading h2,.browse-topics h2,.connect-card h2,.experiments h2,.domains h2,.stub-card h1{font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-weight:900;letter-spacing:-.035em;font-size:clamp(1.75rem,2.5vw,2.35rem)}
.category-grid,.utility-grid,.article-grid{gap:16px}
.category-card,.utility-card,.article-card,.connect-card,.stub-card{border:2px solid #b8c9d2;border-radius:8px;box-shadow:5px 5px 0 rgba(49,92,255,.08)}
.category-card:hover,.category-card:focus-visible,.utility-card:hover,.utility-card:focus-visible,.article-card:hover{border-color:var(--blue);box-shadow:6px 6px 0 rgba(217,47,136,.14);transform:translate(-1px,-1px)}
.category-card strong,.article-card h3,.archive-card h3,.experiment-list h3{font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-weight:900;letter-spacing:-.015em}
.status-badge{border-radius:4px;background:#dffaff;color:#086579;border:1px solid #8adce8}
.utility-card__mark{border-radius:6px;background:#fff2b9;color:#17213a;border:1px solid #f0ca29}
.text-link{color:var(--blue)}
.experiments{background:#1b2350;position:relative}.experiments::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 49%,rgba(255,255,255,.035) 50%,transparent 51%);background-size:34px 34px;pointer-events:none}
.archive{background:#10172a}.archive-card{background:#182443;border:1px solid #384e70;border-radius:7px}
.domains{background:#0c6b7f}.domain-search{border-radius:8px;box-shadow:6px 6px 0 #17213a}.domain-search button{background:var(--yellow);border:2px solid #17213a;border-radius:6px}
.topic-cloud a{border:2px solid #b8c9d2;border-radius:6px;background:#fff;box-shadow:2px 2px 0 rgba(16,23,42,.08)}
.topic-cloud a:hover,.topic-cloud a:focus-visible{background:#dcfaff;border-color:var(--cyan)}
.site-footer{background:#10172a;border-top:5px solid var(--cyan)}
.site-footer::before{content:"";display:block;height:5px;margin-top:-45px;margin-bottom:40px;background:linear-gradient(90deg,var(--yellow) 0 25%,var(--magenta) 25% 50%,var(--cyan) 50% 75%,var(--blue) 75%)}
:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}

@media(max-width:1100px){
 .ynia-brand{min-width:190px}.ynia-brand img,.brand img{max-width:190px;max-height:35px}.primary-nav{gap:12px;font-size:.82rem}
 .interactive-banner{aspect-ratio:1913/760}.interactive-banner__art{background-size:auto 112%;background-position:center center}
 .hero-semantic__inner{grid-template-columns:1fr 1fr}.hero-semantic__actions{grid-column:1/-1}
}
@media(max-width:960px){
 .site-header__inner,.ynia-header__inner{min-height:58px}.ynia-brand img,.brand img{max-width:185px;max-height:32px}
 .primary-nav{background:#101b34;border:2px solid #394c70;border-radius:7px;box-shadow:6px 6px 0 rgba(217,47,136,.25)}
 .primary-nav a{padding:10px 12px}.primary-nav a::after{display:none}
 .interactive-banner{aspect-ratio:16/8.7}.interactive-banner__art{background-size:auto 100%;background-position:center center}
 .banner-hotspot{display:none}
 .hero-semantic__inner{grid-template-columns:1fr;gap:10px}.hero-semantic__actions{grid-column:auto}
}
@media(max-width:600px){
 .ynia-brand img,.brand img{max-width:160px;max-height:29px}.ynia-search{width:34px;height:34px}.interactive-banner{aspect-ratio:4/3;min-height:0}
 .interactive-banner__art{background-size:auto 100%;background-position:center center}
 .hero-semantic__inner{padding-block:14px}.hero-semantic h1{font-size:1.22rem}.hero-semantic__inner>p{font-size:.82rem}.hero-semantic__actions{display:grid;grid-template-columns:1fr 1fr}.hero-semantic__actions a{text-align:center;padding:9px 7px}
}
@media(prefers-reduced-motion:reduce){.banner-hotspot,.banner-hotspot span,.primary-nav a::after,.ynia-subscribe{transition:none!important}}


/* YNIA security/website diagnostics tools */
.tools-section-title{margin:0 0 6px;font:800 clamp(1.35rem,2.4vw,2rem)/1.1 system-ui,sans-serif;color:#08263a}.tools-section-intro{margin:0 0 20px;color:var(--muted);max-width:850px}.tool-card--security{border-left:4px solid #18b7d6}.tool-card--security .tool-icon{background:#071f32;color:#61e7ff;box-shadow:4px 4px 0 #ffcc29}.diagnostic-input-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:stretch}.diagnostic-input-row .button{white-space:nowrap}.tool-help{margin:8px 0 0;color:var(--muted);font-size:.88rem}.tool-note-list{padding-left:20px;color:var(--muted)}.tool-note-list li{margin:7px 0}.diag-loading{padding:20px;border:1px dashed #a9c7d1;border-radius:12px;background:#f4fbfd}.diag-summary{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;margin:18px 0;padding:18px;border:2px solid #b7cbd3;background:#f8fbfc;box-shadow:5px 5px 0 rgba(8,38,58,.08)}.diag-summary h2{margin:0 0 4px;font-size:1.18rem}.diag-summary p{margin:0;color:var(--muted)}.diag-score{font:900 2.1rem/1 system-ui,sans-serif}.diag-good{border-color:#22a06b;background:#effbf5}.diag-fair{border-color:#22a6c8;background:#f0fbfe}.diag-weak{border-color:#e3a008;background:#fff9e9}.diag-poor{border-color:#c73b50;background:#fff2f4}.diag-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:16px 0}.diag-kv{padding:12px;border:1px solid var(--line);background:#fff}.diag-kv span{display:block;color:var(--muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.06em}.diag-kv strong{display:block;margin-top:4px;overflow-wrap:anywhere}.diag-checks{display:grid;gap:12px}.diag-check{padding:16px;border:1px solid var(--line);background:#fff}.diag-check h3{margin:0;font-size:1rem}.diag-check p{margin:9px 0;color:var(--muted)}.diag-check code,.diag-check pre,.diag-details pre{display:block;white-space:pre-wrap;overflow-wrap:anywhere;padding:10px;background:#071f32;color:#e9fbff;border-radius:8px;font-size:.82rem}.diag-check-head{display:flex;gap:10px;justify-content:space-between;align-items:flex-start}.diag-badge{display:inline-block;padding:4px 8px;border-radius:999px;font-size:.72rem;font-weight:850;line-height:1.2;white-space:nowrap}.diag-pass{background:#d9f6e8;color:#0b6742}.diag-warn{background:#fff0bf;color:#7a5200}.diag-fail{background:#ffe0e5;color:#8e2134}.diag-pill-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.diag-details{margin-top:14px;border:1px solid var(--line);padding:12px;background:#fff}.diag-details summary{cursor:pointer;font-weight:800}.diag-chain{display:grid;gap:10px;margin-top:16px}.diag-hop{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:start;padding:12px;border:1px solid var(--line);background:#fff}.diag-hop>span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#071f32;color:#fff;font-weight:900}.diag-hop small{color:var(--muted);overflow-wrap:anywhere}
@media(max-width:700px){.diagnostic-input-row{grid-template-columns:1fr}.diag-meta{grid-template-columns:1fr}.diag-summary{grid-template-columns:1fr}.diag-check-head{display:block}.diag-check-head .diag-badge{margin-top:8px}}

/* YNIA Smart Productivity Tools v1.3 */
.smart-tool-shell{max-width:980px;margin:0 auto}.tool-workbench{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.72fr);gap:22px;align-items:start}.tool-panel{background:#fff;border:1px solid #dbe7ee;border-radius:14px;padding:20px;box-shadow:8px 8px 0 #e9f5f7}.tool-panel textarea,.result-text{width:100%;box-sizing:border-box;border:1px solid #b9ccd8;border-radius:10px;padding:14px;font:inherit;line-height:1.55;background:#fbfdff;color:#102433}.tool-panel textarea:focus{outline:3px solid rgba(0,194,255,.16);border-color:#00a8d9}.tool-run{display:inline-flex;margin-top:12px;padding:11px 17px;border:0;border-radius:9px;background:#082d43;color:#fff;font-weight:750;cursor:pointer}.tool-run:hover,.tool-run:focus{background:#006c8f}.tool-disclaimer{margin-top:18px;padding:12px 14px;border-left:4px solid #f5b82e;background:#fff8dd;color:#3c3526;font-size:.92rem}.smart-grid{display:grid;grid-template-columns:auto 1fr;gap:7px 12px;padding:12px;background:#f5fbfd;border-radius:10px}.smart-grid b{font-size:1.1rem;color:#08364c}.score-ring{display:flex;flex-direction:column;justify-content:center;align-items:center;width:116px;height:116px;border:8px solid #00b8d9;border-radius:50%;font-size:2rem;font-weight:850;color:#082d43;margin-bottom:16px}.score-ring small{font-size:.7rem;font-weight:650}.analysis-copy{white-space:pre-wrap;line-height:1.7;border:1px solid #d9e4ea;background:#fbfdff;padding:14px;border-radius:10px;max-height:360px;overflow:auto}.analysis-copy mark{background:#ffe48a;padding:1px 2px}.pass{color:#136c45}.warn{color:#8b5a00}.tool-trust{display:flex;flex-wrap:wrap;gap:8px;margin:.8rem 0}.tool-trust span{border:1px solid #b8dbe7;background:#effbff;border-radius:999px;padding:5px 9px;font-size:.78rem;font-weight:700}.tools-category{margin-top:34px}.tools-category h2{margin-bottom:6px}.tools-category>p{margin-top:0;color:#526875}@media(max-width:780px){.tool-workbench{grid-template-columns:1fr}.tool-panel{box-shadow:4px 4px 0 #e9f5f7}}