/* Blog, blog articles, contact and CMS pages (.page-hero + .content-shell / .blog-grid): panel design language. */
body.public-area{--cm-ink:#0f172a;--cm-text:#334155;--cm-muted:#64748b;--cm-line:#e6e9ee;--cm-soft:#f5f6f8;--cm-tint:#eef4f9;--cm-navy:#0b1220;--cm-blue:#2b5875;--cm-band:radial-gradient(900px 320px at 85% -30%,rgba(127,177,209,.28),transparent 60%),linear-gradient(120deg,#0b1220 0%,#13233b 58%,#1b3550 100%)}

/* Page hero spacing */
body.public-area .page-hero{padding:72px 0 64px}
body.public-area .page-hero h1{font-weight:600;letter-spacing:-.035em}

/* Grey canvas under content pages */
body.public-area .page-hero~.site-wide.content-shell,body.public-area .page-hero~.content-shell{position:relative}
body.public-area:has(.page-hero) main,body.public-area:has(.page-hero) .page-hero~section,body.public-area:has(.page-hero .eyebrow) .page-hero~.section{background:var(--cm-soft)}
body.public-area:has(.page-hero):has(.content-shell){background:var(--cm-soft)}

/* Two-column content shell: main column card + sticky side card */
body.public-area .content-shell{gap:28px;padding:48px 0 80px;align-items:start}
body.public-area .content-shell>:first-child{background:#fff;border:1px solid var(--cm-line);box-shadow:0 1px 2px rgba(15,23,42,.04);padding:44px 48px;min-width:0}
body.public-area .content-shell>.side-note,body.public-area .content-shell>aside{position:sticky;top:110px;background:#fff;border:1px solid var(--cm-line);border-top:3px solid var(--cm-navy);padding:26px;box-shadow:0 1px 2px rgba(15,23,42,.04)}
body.public-area .side-note .eyebrow{color:var(--cm-blue)!important}
body.public-area .side-note h3{color:var(--cm-ink);font-weight:600;letter-spacing:-.02em}
body.public-area .side-note p{color:var(--cm-muted)}
body.public-area .side-note .btn-dark,body.public-area .side-note .btn-primary{background:var(--cm-band)!important;border:0;color:#fff!important}

/* Article typography */
body.public-area .rich-content{color:var(--cm-text);font-size:17px;line-height:1.78}
body.public-area .rich-content h2{color:var(--cm-ink);font-size:30px;font-weight:600;letter-spacing:-.025em;margin:44px 0 14px;padding-top:6px}
body.public-area .rich-content h2:first-child{margin-top:0}
body.public-area .rich-content h3{color:var(--cm-ink);font-size:21px;font-weight:600;margin:30px 0 10px}
body.public-area .rich-content p,body.public-area .rich-content li{color:var(--cm-text)}
body.public-area .rich-content a{color:var(--cm-blue);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
body.public-area .rich-content a:hover{color:var(--cm-navy)}
body.public-area .rich-content ul li::marker,body.public-area .rich-content ol li::marker{color:var(--cm-blue);font-weight:700}
body.public-area .rich-content blockquote{margin:26px 0;padding:18px 22px;background:var(--cm-tint);border-left:4px solid var(--cm-blue);color:var(--cm-ink);font-size:18px}
body.public-area .rich-content img{max-width:100%;height:auto;border:1px solid var(--cm-line)}
body.public-area .rich-content table{width:100%;border-collapse:collapse;margin:22px 0;font-size:15px}
body.public-area .rich-content th{background:var(--cm-soft);color:var(--cm-ink);text-align:left}
body.public-area .rich-content :is(th,td){border:1px solid var(--cm-line);padding:10px 12px}

/* Blog index cards (home page slider has its own styles) */
body.public-area .page-hero~.section .blog-grid{gap:20px}
body.public-area .page-hero~.section .blog-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--cm-line);border-top:3px solid var(--cm-navy);padding:0 0 22px;box-shadow:0 1px 2px rgba(15,23,42,.04);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
body.public-area .page-hero~.section .blog-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(15,23,42,.1);border-color:#cbd8e4}
body.public-area .page-hero~.section .blog-card>*:not(.thumb){padding-left:22px;padding-right:22px}
body.public-area .page-hero~.section .blog-card:not(:has(.thumb)){padding-top:22px}
body.public-area .page-hero~.section .blog-card .thumb{margin:0 0 18px;border:0}
body.public-area .page-hero~.section .blog-card .thumb img{transition:transform .4s ease}
body.public-area .page-hero~.section .blog-card:hover .thumb img{transform:scale(1.04)}
body.public-area .page-hero~.section .blog-card time{display:inline-block;align-self:flex-start;margin-left:22px;padding:4px 8px!important;background:var(--cm-tint);color:var(--cm-blue);font-weight:700}
body.public-area .page-hero~.section .blog-card h3{color:var(--cm-ink);font-weight:600;font-size:22px;letter-spacing:-.02em;margin:12px 0 8px}
body.public-area .page-hero~.section .blog-card h3 a:hover{color:var(--cm-blue)}
body.public-area .page-hero~.section .blog-card p{color:var(--cm-muted);flex:1}
body.public-area .page-hero~.section .blog-card>a:last-child strong{color:var(--cm-blue)}

/* Contact form */
body.public-area .content-shell form.card{border:0!important;box-shadow:none!important;padding:0!important;margin-top:18px}
body.public-area .content-shell>:first-child>h2{color:var(--cm-ink);font-weight:600;letter-spacing:-.025em}
body.public-area .content-shell form .btn-primary,body.public-area .content-shell form .btn-dark{background:var(--cm-band)!important;border:0!important;color:#fff!important;padding:15px 22px}
body.public-area .content-shell .flash{padding:12px 14px;margin-bottom:16px;border:1px solid}

@media(max-width:820px){
  /* Hero */
  body.public-area .page-hero{padding:28px 0 26px!important}
  body.public-area .page-hero h1{font-size:32px!important;line-height:1.08!important;margin:6px 0 10px!important}
  body.public-area .page-hero p{font-size:15px!important;margin:0!important}
  body.public-area .page-hero .eyebrow{font-size:10px!important;margin-bottom:6px!important}

  /* Content shell (articles, contact, CMS pages) */
  body.public-area .content-shell{padding:16px 0 40px;gap:14px}
  body.public-area .content-shell>:first-child{padding:20px 18px}
  body.public-area .content-shell>.side-note,body.public-area .content-shell>aside{position:static;padding:18px}
  body.public-area .side-note h3{font-size:19px!important}
  body.public-area .rich-content{font-size:16px;line-height:1.7}
  body.public-area .rich-content h2{font-size:23px;margin:30px 0 10px}
  body.public-area .rich-content h3{font-size:18px;margin:22px 0 8px}
  body.public-area .rich-content blockquote{font-size:16px;padding:14px 16px}
  body.public-area .rich-content table{display:block;overflow-x:auto}

  /* Blog index: compact horizontal cards */
  body.public-area .page-hero~.section{padding:20px 0 40px!important}
  body.public-area .page-hero~.section .blog-grid{gap:10px}
  body.public-area .page-hero~.section .blog-card{display:grid;grid-template-columns:104px minmax(0,1fr);grid-template-rows:auto auto 1fr auto;column-gap:14px;padding:12px!important;border-top-width:3px}
  body.public-area .page-hero~.section .blog-card>*:not(.thumb){padding-left:0;padding-right:0;grid-column:2}
  body.public-area .page-hero~.section .blog-card .thumb{grid-column:1;grid-row:1/span 4;margin:0!important;width:104px;height:104px;aspect-ratio:auto}
  body.public-area .page-hero~.section .blog-card .thumb img{width:100%;height:100%;object-fit:cover}
  body.public-area .page-hero~.section .blog-card:not(:has(.thumb)){grid-template-columns:1fr;padding-top:12px}
  body.public-area .page-hero~.section .blog-card:not(:has(.thumb))>*{grid-column:1}
  body.public-area .page-hero~.section .blog-card time{margin-left:0;font-size:10px!important;padding:3px 6px!important}
  body.public-area .page-hero~.section .blog-card h3{font-size:16px;line-height:1.25;margin:6px 0 4px}
  body.public-area .page-hero~.section .blog-card p{font-size:13px;line-height:1.45;margin:0 0 6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  body.public-area .page-hero~.section .blog-card>a:last-child{font-size:13px}
  body.public-area .page-hero~.section .blog-card:hover{transform:none}

  /* Contact form: 16px fields stop iOS zoom */
  body.public-area .content-shell form .field input,body.public-area .content-shell form .field select,body.public-area .content-shell form .field textarea{font-size:16px}
  body.public-area .content-shell form .form-grid{gap:0 12px}
  body.public-area .content-shell form .field{margin-bottom:12px}
  body.public-area .content-shell form .btn-primary,body.public-area .content-shell form .btn-dark{width:100%;justify-content:center}
  body.public-area .content-shell>:first-child>h2{font-size:24px}
}