:root {
  --yg-logo: url("data:image/webp;base64,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");
  --background: oklch(99.5% .005 250);
  --foreground: oklch(18% .04 260);
  --card: oklch(100% 0 0);
  --surface: oklch(98.5% .008 250);
  --border: oklch(92% .012 260);
  --brand: oklch(32% .13 264);
  --accent: oklch(62% .18 255);
  --coral: oklch(66% .21 25);
  --muted: oklch(96% .012 260);
  --muted-foreground: oklch(50% .03 258);
  --radius: .875rem;
  --shadow: 0 18px 50px -28px rgba(15,23,42,.28);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--background); color: var(--foreground); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input { font: inherit; }
.container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.site-header { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid color-mix(in oklab, var(--border) 75%, transparent); background: color-mix(in oklab, var(--background) 88%, transparent); backdrop-filter: blur(16px); }
.header-inner { min-height: 68px; display: flex; align-items: center; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; letter-spacing: -.025em; }
.brand-mark { width: 34px; height: 34px; flex: 0 0 34px; background-image: var(--yg-logo); background-size: contain; background-repeat: no-repeat; background-position: center; }
.brand-divider { width: 1px; height: 24px; background: var(--border); }
.brand-section { color: var(--muted-foreground); font-size: .92rem; font-weight: 650; }
.nav { margin-left: auto; display: flex; align-items: center; gap: 24px; color: var(--muted-foreground); font-size: .9rem; font-weight: 600; }
.nav a:hover, .footer a:hover { color: var(--accent); }
.back-site { padding: 10px 14px; border: 1px solid var(--border); border-radius: 12px; color: var(--brand); background: var(--card); }
.hero { padding: 76px 0 54px; overflow: hidden; }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr); align-items: center; gap: 64px; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; color: var(--accent); font-size: .78rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.eyebrow::before { content: ""; width: 26px; height: 2px; background: var(--coral); border-radius: 2px; }
h1, h2, h3 { font-family: "Plus Jakarta Sans", Inter, system-ui, sans-serif; letter-spacing: -.035em; }
.hero h1 { margin: 18px 0 18px; max-width: 760px; font-size: clamp(2.55rem, 5.3vw, 5.1rem); line-height: .98; }
.hero h1 span { color: var(--accent); }
.hero-copy { max-width: 640px; margin: 0; color: var(--muted-foreground); font-size: 1.08rem; line-height: 1.75; }
.hero-panel { position: relative; min-height: 390px; border: 1px solid var(--border); border-radius: 28px; box-shadow: var(--shadow); overflow: hidden; }
.graphic-surface { position: relative; display: grid; place-items: center; color: #10233f; background: #91a1c8; isolation: isolate; overflow: hidden; }
.graphic-surface::before, .graphic-surface::after { content: ""; position: absolute; z-index: -1; border-radius: 999px; opacity: .94; }
.graphic-surface::before { width: 42%; aspect-ratio: 1; top: -24%; right: -10%; background: rgba(255,255,255,.18); }
.graphic-surface::after { width: 34%; aspect-ratio: 1; bottom: -27%; left: -9%; background: rgba(255,255,255,.13); }
.graphic-surface svg { width: min(88%, 440px); height: auto; filter: drop-shadow(0 13px 18px rgba(15,35,63,.12)); }
.graphic-window, .graphic-node { fill: rgba(255,255,255,.96); stroke: #10233f; }
.graphic-accent { color: var(--coral); stroke: var(--coral); }
.graphic-backdrop { stroke: none; }
.graphic-backdrop--play { fill: #2d80ed; opacity: .78; }
.graphic-backdrop--bubble { fill: #ef5b56; opacity: .78; }
.graphic-surface[data-graphic-type="relationship"] { background: #93a2c7; }
.graphic-surface[data-graphic-type="comments"] { background: #f15b40; }
.graphic-surface[data-graphic-type="crm"] { background: #b8c8eb; }
.graphic-surface[data-graphic-type="ai"] { background: #65728f; }
.graphic-surface[data-graphic-type="insights"] { background: #86a3d3; }
.graphic-surface[data-graphic-type="content"] { background: #f28b72; }
.graphic-surface--hero { color: rgba(255,255,255,.96); background: linear-gradient(145deg, #10233f, #17387b 58%, #2d80ed); }
.graphic-surface--hero::before, .graphic-surface--hero::after { display: none; }
.graphic-surface--hero svg { width: min(88%, 470px); }
.section { padding: 42px 0 88px; }
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 28px; }
.section-head h2 { margin: 0; font-size: clamp(1.75rem, 3vw, 2.6rem); }
.section-head p { margin: 8px 0 0; color: var(--muted-foreground); }
.search { width: min(340px, 100%); padding: 12px 15px; border: 1px solid var(--border); border-radius: 13px; outline: none; background: var(--card); color: var(--foreground); }
.search:focus { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent) 18%, transparent); }
.article-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.article-card { display: flex; min-height: 330px; flex-direction: column; border: 1px solid var(--border); border-radius: 20px; background: var(--card); box-shadow: var(--shadow); overflow: hidden; transition: transform .2s ease, border-color .2s ease; }
.article-card:hover { transform: translateY(-4px); border-color: color-mix(in oklab, var(--accent) 42%, var(--border)); }
.card-top { min-height: 158px; padding: 12px 22px; }
.card-top svg { width: min(90%, 270px); }
.card-body { display: flex; flex: 1; flex-direction: column; padding: 22px; }
.meta { color: var(--accent); font-size: .75rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.article-card h3 { margin: 12px 0 10px; font-size: 1.35rem; line-height: 1.25; }
.article-card p { margin: 0; color: var(--muted-foreground); line-height: 1.65; font-size: .92rem; }
.read-more { margin-top: auto; padding-top: 22px; color: var(--brand); font-size: .88rem; font-weight: 800; }
.newsletter { margin: 0 0 88px; padding: 34px; display: flex; align-items: center; justify-content: space-between; gap: 32px; border-radius: 24px; color: white; background: linear-gradient(120deg, var(--brand), color-mix(in oklab, var(--brand) 72%, var(--accent))); }
.newsletter h2 { margin: 0; font-size: clamp(1.5rem, 3vw, 2.2rem); }
.newsletter p { margin: 9px 0 0; color: rgba(255,255,255,.72); }
.newsletter a { flex: 0 0 auto; padding: 13px 18px; border-radius: 12px; background: white; color: var(--brand); font-weight: 800; }
.site-footer { border-top: 1px solid var(--border); background: var(--surface); }
.footer-inner { min-height: 130px; display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.footer { color: var(--muted-foreground); font-size: .82rem; }
.footer-links { display: flex; flex-wrap: wrap; gap: 20px; }
.article-hero { padding: 78px 0 40px; }
.article-hero .wrap, .article-content { width: min(780px, calc(100% - 40px)); margin-inline: auto; }
.article-hero h1 { margin: 18px 0; font-size: clamp(2.25rem, 5vw, 4.4rem); line-height: 1.05; }
.article-lead { color: var(--muted-foreground); font-size: 1.15rem; line-height: 1.72; }
.article-info { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 24px; color: var(--muted-foreground); font-size: .85rem; }
.article-visual { width: min(780px, calc(100% - 40px)); min-height: 285px; margin: 38px auto 0; border-radius: 24px; box-shadow: var(--shadow); }
.article-visual svg { width: min(76%, 500px); }
.article-content { padding: 24px 0 90px; }
.article-content h2 { margin: 48px 0 14px; font-size: 1.75rem; }
.article-content h3 { margin: 32px 0 10px; font-size: 1.25rem; }
.article-content p, .article-content li { color: color-mix(in oklab, var(--foreground) 78%, var(--muted-foreground)); font-size: 1.04rem; line-height: 1.82; }
.article-content ul { padding-left: 22px; }
.article-content li { margin: 8px 0; }
.article-content blockquote { margin: 34px 0; padding: 20px 24px; border-left: 4px solid var(--coral); border-radius: 0 14px 14px 0; background: var(--muted); color: var(--brand); font: 700 1.15rem/1.55 "Plus Jakarta Sans", sans-serif; }
.article-cta { margin-top: 52px; padding: 28px; border-radius: 18px; background: var(--brand); color: white; }
.article-cta p { color: rgba(255,255,255,.75); }
.article-cta a { display: inline-block; margin-top: 8px; padding: 12px 16px; border-radius: 10px; background: white; color: var(--brand); font-weight: 800; }
.empty { display: none; padding: 40px; text-align: center; color: var(--muted-foreground); }
@media (max-width: 900px) {
  .hero-grid { grid-template-columns: 1fr; gap: 36px; }
  .hero-panel { min-height: 310px; }
  .article-grid { grid-template-columns: 1fr 1fr; }
  .nav a:not(.back-site) { display: none; }
}
@media (max-width: 640px) {
  .container { width: min(100% - 28px, 1180px); }
  .brand-divider, .brand-section { display: none; }
  .header-inner { gap: 14px; }
  .back-site { padding: 9px 11px; font-size: .8rem; }
  .hero { padding-top: 48px; }
  .hero-panel { min-height: 275px; }
  .article-visual { min-height: 210px; }
  .section-head { align-items: stretch; flex-direction: column; }
  .article-grid { grid-template-columns: 1fr; }
  .newsletter, .footer-inner { align-items: flex-start; flex-direction: column; }
  .newsletter { padding: 28px 24px; }
  .footer-inner { padding-block: 34px; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }
