/* =========================================================
   NAIRL — Front-end component styles
   Section patterns use core blocks carrying the class names below.
   Values come straight from the design system (tokens.css / theme.json).
   ========================================================= */

/* ---- Base ---- */
body{font-family:var(--font-sans);color:var(--fg);background:var(--bg);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}

/* FSE layout fixes:
   1) Template-part wrappers must not form a box, or the sticky header would
      only stick inside its own (header-height) wrapper and scroll away.
   2) Remove the root block-gap between top-level blocks so the bands and the
      header/subnav sit flush (each section owns its padding). */
.wp-block-template-part{display:contents}
.wp-site-blocks>*{margin-block-start:0;margin-block-end:0}

/* Full-bleed section helper: cancel the editor content padding so bands
   reach the viewport edges; each section sets its own inner gutter. */
.nairl-section{padding-left:0;padding-right:0;margin-top:0;margin-bottom:0;width:100%}
.nairl-inner{max-width:var(--container);margin-inline:auto}

/* Cancel core's block-gap margins on the containers we lay out with CSS
   grid/flex, so rows stay aligned. */
.pillars-grid>*,.news-grid>*,.logo-grid>*,.partners-row>*,
.engage-grid>*,.engage-list>*,.pillars-head>*,.news-head>*{margin-top:0;margin-block-start:0}

/* Eyebrow (section kicker) — 14px uppercase sky blue + 44x2 rule */
.eyebrow{font-size:calc((14px) * var(--fs-scale));letter-spacing:.16em;text-transform:uppercase;color:var(--accent-500);font-weight:700;margin:0 0 16px;font-family:var(--font-sans)}
/* Korean line-breaking: break only at spaces (eojeol) instead of mid-syllable,
   so narrow screens don't split words like "글로/벌". keep-all is the standard
   fix for Hangul; overflow-wrap is a safety net for rare space-less long runs. */
.nairl-ko{word-break:keep-all;overflow-wrap:break-word}
/* Korean eyebrows: wide tracking + uppercase suit Latin, not Hangul. */
.nairl-ko .eyebrow{letter-spacing:.01em;text-transform:none}
/* Pretendard Hangul tracks a touch loose. Tighten ONLY Hangul runs (wrapped in
   .kr by assets/js/nav.js on Korean pages); Latin keeps its original spacing. */
.nairl-ko .kr{letter-spacing:-0.025em}
.eyebrow::after{content:"";display:block;width:44px;height:2px;background:var(--accent-500);margin-top:10px}

/* Buttons (homepage CTAs use core buttons carrying .is-style-* / class names) */
.wp-block-button.btn-primary .wp-block-button__link,
.btn.primary{background:var(--navy-800);color:#fff;border:1px solid transparent;border-radius:var(--radius-sm);font-weight:600;font-size:calc((14px) * var(--fs-scale));line-height:1;font-family:var(--font-sans);padding:13px 22px;transition:all 150ms var(--ease-standard)}
.wp-block-button.btn-primary .wp-block-button__link:hover,
.btn.primary:hover{background:var(--navy-900);transform:translateY(-1px);color:#fff}
.wp-block-button.btn-secondary .wp-block-button__link,
.btn.secondary{background:transparent;color:var(--navy-800);border:1px solid var(--navy-800);border-radius:var(--radius-sm);font-weight:600;font-size:calc((14px) * var(--fs-scale));line-height:1;font-family:var(--font-sans);padding:13px 22px;transition:all 150ms var(--ease-standard)}
.wp-block-button.btn-secondary .wp-block-button__link:hover,
.btn.secondary:hover{background:var(--navy-050);color:var(--navy-800)}

/* ---- Hero ---- */
.hero{position:relative;overflow:hidden;padding:120px var(--gutter) 96px;text-align:center}
.hero .bg-wave{position:absolute;left:50%;top:50%;transform:translate(-50%,-46%);width:min(1600px,128%);max-width:none;height:auto;pointer-events:none;opacity:.10;margin:0;z-index:0}
.hero-inner{position:relative;z-index:1;max-width:1040px;margin:0 auto}
.hero h1{font-family:var(--font-display);font-weight:600;font-size:calc((clamp(40px,5.4vw,72px)) * var(--fs-scale) * 1.1);line-height:1.05;letter-spacing:-.02em;color:var(--navy-900);margin:0 0 22px;text-wrap:balance}
.hero p{font-family:var(--font-body);font-size:calc((18px) * var(--fs-scale) * 0.9);line-height:1.55;color:var(--fg-muted);max-width:680px;margin:0 auto 32px;font-weight:400}
.hero p strong{font-weight:600}
/* Make the CTA rows self-sufficient (don't rely on core block-library CSS). */
.wp-block-buttons{display:flex;flex-wrap:wrap;gap:12px}
.wp-block-button{display:inline-block}
.wp-block-button__link{display:inline-block;text-decoration:none}
.hero .wp-block-buttons{justify-content:center}

/* ---- Pillars (3 research focus cards) ---- */
.pillars{background:var(--gray-050);padding:80px var(--gutter);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.pillars-head{display:flex;align-items:flex-end;justify-content:space-between;max-width:var(--container);margin:0 auto 36px;gap:24px}
.pillars-head h2{font-family:var(--font-display);font-weight:500;font-size:calc((36px) * var(--fs-scale));letter-spacing:-.02em;color:var(--navy-900);margin:0;max-width:560px;line-height:1.15}
.pillars-head .lnk{font-size:calc((13px) * var(--fs-scale));font-weight:600;color:var(--navy-700);white-space:nowrap}
.pillars-head .lnk:hover{color:var(--accent-500)}
.pillars-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:var(--container);margin:0 auto}
.pcard{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-sm);padding:32px;transition:all 200ms var(--ease-standard);display:flex;flex-direction:column;gap:14px;min-height:260px}
.pcard:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);border-color:var(--navy-200)}
.pcard h3{font-family:var(--font-display);font-weight:500;font-size:calc((22px) * var(--fs-scale));line-height:1.2;letter-spacing:-.01em;color:var(--navy-900);margin:0}
.pcard h3 a{color:inherit}
.pcard p{font-family:var(--font-body);font-size:calc((14px) * var(--fs-scale));line-height:1.55;color:var(--fg-muted);margin:0;flex:1}
.pcard .more{font-size:calc((13px) * var(--fs-scale));font-weight:600;color:var(--navy-700);margin-top:auto}
.pcard:hover .more{color:var(--accent-500)}

/* ---- News rail ---- */
.news{max-width:var(--container);margin:0 auto;padding:96px var(--gutter)}
.news-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:36px;gap:24px}
.news-head h2{font-family:var(--font-display);font-weight:500;font-size:calc((36px) * var(--fs-scale));letter-spacing:-.02em;color:var(--navy-900);margin:0}
.news-head .lnk{font-size:calc((13px) * var(--fs-scale));font-weight:600;color:var(--navy-700);white-space:nowrap}
.news-head .lnk:hover{color:var(--accent-500)}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.ncard{display:flex;flex-direction:column;transition:transform 200ms;text-decoration:none;color:inherit}
.ncard:hover{transform:translateY(-2px)}
.ncard:hover h4{color:var(--accent-500)}
.ncard .wp-block-image,.ncard .photo{margin:0}
.ncard .wp-block-image img,.ncard .photo img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--radius-sm)}
.ncard .photo{aspect-ratio:1/1;border-radius:var(--radius-sm);overflow:hidden;background:linear-gradient(180deg,var(--navy-100),var(--gray-100))}
.ncard .meta{display:flex;gap:10px;align-items:center;margin-top:16px;font-size:calc((11px) * var(--fs-scale));letter-spacing:.12em;text-transform:uppercase;color:var(--fg-subtle);font-weight:600}
.ncard .meta b{color:var(--accent-500)}
.ncard h4{font-family:var(--font-display);font-weight:500;font-size:calc((20px) * var(--fs-scale));line-height:1.25;letter-spacing:-.01em;color:var(--navy-900);margin:10px 0 0;transition:color 150ms}

/* ---- Partners ---- */
.partners{background:var(--gray-050);padding:80px var(--gutter);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.partners-inner{max-width:var(--container);margin:0 auto;text-align:center}
.partners h3{font-family:var(--font-display);font-weight:500;font-size:calc((28px) * var(--fs-scale));color:var(--navy-900);margin:0 0 8px;letter-spacing:-.01em}
.partners-inner>p{font-size:calc((14px) * var(--fs-scale));color:var(--fg-muted);margin:0 0 36px}
.partners-row{display:flex;align-items:center;justify-content:space-between;gap:40px;max-width:920px;margin:0 auto}
.partners-row .wp-block-image{flex:1 1 0;min-width:0;margin:0}
.partners-row img{width:100%;height:48px;object-fit:contain;filter:grayscale(.1);opacity:.95;transition:opacity 200ms}
.partners-row .wp-block-image:hover img{opacity:1;filter:none}
.partners-group{margin-top:52px}
.partners-group .eyebrow{display:block;max-width:920px;margin:0 auto 22px;text-align:left}
.logo-grid{display:grid;gap:14px;max-width:920px;margin:0 auto}
.logo-grid.gov{grid-template-columns:repeat(4,1fr)}
.logo-grid.industry{grid-template-columns:repeat(6,1fr)}
.logo-grid .wp-block-image{box-sizing:border-box;display:flex;align-items:center;justify-content:center;margin:0;background:var(--white);border:1px solid var(--border);border-radius:var(--radius-sm);transition:border-color 160ms,box-shadow 160ms;overflow:hidden}
.logo-grid .wp-block-image:hover{border-color:var(--navy-200);box-shadow:var(--shadow-sm)}
/* Logo links wrap only the <img>; display:contents keeps the figure's layout. */
.logo-link{display:contents}
.partners-row img,.logo-grid img{cursor:pointer}
.logo-grid img{box-sizing:border-box;display:block;width:100%;max-width:100%;height:76px;object-fit:contain;padding:14px 18px;opacity:.92;mix-blend-mode:multiply;transition:opacity 160ms;border-radius:var(--radius-sm)}
.logo-grid .wp-block-image:hover img{opacity:1}
@media (max-width:880px){
  .logo-grid.gov{grid-template-columns:repeat(2,1fr)}
  .logo-grid.industry{grid-template-columns:repeat(3,1fr)}
}

/* ---- Engage ---- */
.engage{max-width:var(--container);margin:0 auto;padding:96px var(--gutter);scroll-margin-top:72px}
.engage-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.engage h2{font-family:var(--font-display);font-weight:500;font-size:calc((40px) * var(--fs-scale));line-height:1.1;letter-spacing:-.02em;color:var(--navy-900);margin:0 0 18px}
.engage-col p{font-family:var(--font-body);font-size:calc((16px) * var(--fs-scale));line-height:1.6;color:var(--fg-muted);margin:0 0 24px}
.engage-list{border-top:1px solid var(--border)}
.engage-list .item{padding:20px 0;border-bottom:1px solid var(--border)}
.engage-list h5{margin:0 0 4px;font-size:calc((17px) * var(--fs-scale));font-weight:700;color:var(--navy-900);font-family:var(--font-sans)}
.engage-list .desc{font-family:var(--font-body);font-size:calc((13px) * var(--fs-scale));color:var(--fg-muted);line-height:1.5;margin:0}

/* ---- Footer ---- */
.footer{background:var(--navy-800);color:#fff;padding:80px var(--gutter) 32px;position:relative;overflow:hidden}
.footer-inner{max-width:var(--container);margin:0 auto;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:48px;position:relative;z-index:1}
.footer .footer-logo{height:44px;width:auto;margin-bottom:24px}
.footer h6{font-size:calc((11px) * var(--fs-scale));letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.6);font-weight:600;margin:0 0 16px}
.footer h4{font-family:var(--font-display);font-size:calc((18px) * var(--fs-scale));font-weight:500;margin:0 0 8px;color:#fff;line-height:1.4}
.footer p{font-size:calc((13px) * var(--fs-scale));color:rgba(255,255,255,.7);margin:0;line-height:1.6}
.footer ul{margin:0;padding:0;list-style:none}
.footer ul li{margin-bottom:6px}
.footer ul a{font-size:calc((13px) * var(--fs-scale));color:rgba(255,255,255,.78);transition:color 120ms}
.footer ul a:hover{color:var(--accent-400)}
.footer-bottom{max-width:var(--container);margin:48px auto 0;padding-top:24px;border-top:1px solid rgba(255,255,255,.15);display:flex;justify-content:space-between;font-size:calc((12px) * var(--fs-scale));color:rgba(255,255,255,.55);font-family:var(--font-sans);letter-spacing:.04em}
.footer-bottom .foot-end{display:flex;align-items:center;gap:20px}
.footer-bottom .foot-social{display:inline-flex;align-items:center;color:rgba(255,255,255,.78);transition:color 120ms}
.footer-bottom .foot-social:hover{color:var(--accent-300)}
.footer-bottom .foot-lang{color:rgba(255,255,255,.55)}
.footer .bg-mark{position:absolute;right:-40px;bottom:-40px;width:280px;opacity:.06;pointer-events:none;margin:0}

/* ---- Responsive ---- */
@media (max-width:880px){
  .pillars-grid,.news-grid,.engage-grid,.footer-inner{grid-template-columns:1fr;gap:24px}
  .pillars-head,.news-head{flex-direction:column;align-items:flex-start}
  .partners-row{flex-wrap:wrap;gap:24px}
  .footer-bottom{flex-direction:column;gap:14px}
}
