/* MediaWarden environmental palette and depth refresh. */
:root{
  --forest:#314532;
  --olive-dark:#4b543b;
  --olive-soft:#dfe4d3;
  --olive-mist:#f1f3e9;
  --lake-soft:#dcecf5;
  --lake-pale:#eef6f9;
  --warm-paper:#fbfbf7;
  --shadow:0 28px 70px -42px rgba(0,56,104,.42);
}

body{
  background:var(--warm-paper);
  background-image:linear-gradient(180deg,rgba(220,236,245,.34),transparent 470px);
}

.site-header{
  border-bottom-color:rgba(0,56,104,.13);
}

/* Crop the approved raster mark with HTML/CSS; nested SVG images are not
   consistently painted by every hosted browser origin. */
.wordmark .brand-shield,
.wordmark .brand-name{
  position:relative;
  overflow:hidden;
}

.wordmark .brand-shield img,
.wordmark .brand-name img{
  position:absolute;
  display:block;
  max-width:none;
}

.wordmark .brand-shield img{
  width:170.62%;
  left:-35.37%;
  top:-12.2%;
}

.wordmark .brand-name img{
  width:113.79%;
  left:-9.44%;
  top:0;
  transform:translateY(-77.35%);
}

.site-header nav a{
  text-decoration-color:var(--brand-olive);
  text-underline-offset:6px;
}

.status{
  background:var(--olive-mist);
  border-color:#cbd2bd;
  color:var(--forest);
}

.hero{
  position:relative;
  isolation:isolate;
  width:min(1380px,calc(100% - 48px));
  margin-bottom:34px;
  padding:96px 70px 88px;
  border:1px solid rgba(0,56,104,.12);
  border-radius:30px;
  overflow:hidden;
  background:
    radial-gradient(circle at 16% 12%,rgba(255,255,255,.92) 0 12%,transparent 38%),
    linear-gradient(118deg,var(--lake-pale) 0 50%,var(--olive-mist) 50% 100%);
  box-shadow:0 34px 90px -66px rgba(0,56,104,.9);
}

.hero::before,
.hero::after{
  content:"";
  position:absolute;
  z-index:-1;
  pointer-events:none;
  border:1px solid rgba(96,104,75,.2);
  border-radius:50%;
  transform:rotate(-10deg);
}

.hero::before{
  width:780px;
  height:360px;
  right:-280px;
  top:-205px;
  box-shadow:0 0 0 24px rgba(96,104,75,.035),0 0 0 49px rgba(24,115,180,.035),0 0 0 76px rgba(96,104,75,.025);
}

.hero::after{
  width:430px;
  height:220px;
  left:-260px;
  bottom:-120px;
  box-shadow:0 0 0 28px rgba(24,115,180,.035),0 0 0 58px rgba(96,104,75,.035);
}

.hero-copy{
  position:relative;
  z-index:1;
}

.hero-copy .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:12px;
  color:var(--forest);
}

.hero-copy .eyebrow::before{
  content:"";
  width:30px;
  height:2px;
  background:var(--brand-olive);
}

.hero h1 em{
  color:var(--brand-blue);
}

.hero-intro{
  color:#3e5867;
}

.button{
  border-radius:999px;
  box-shadow:0 10px 26px -18px rgba(0,56,104,.9);
  transition:transform .2s ease,background .2s ease,box-shadow .2s ease;
}

.button:hover{
  transform:translateY(-2px);
  box-shadow:0 15px 30px -18px rgba(0,56,104,.85);
}

.catalog-window{
  border-color:rgba(0,56,104,.18);
  border-radius:18px;
  box-shadow:20px 24px 0 -10px rgba(96,104,75,.17),var(--shadow);
  transform:rotate(1.2deg);
}

.window-bar{
  border-radius:18px 18px 0 0;
  background:linear-gradient(90deg,#f7fafb,var(--olive-mist));
}

.thumb{
  border-radius:7px;
}

.audience-strip{
  color:white;
  border:0;
  background:linear-gradient(105deg,var(--brand-navy),#064e7f 58%,var(--forest));
}

.audience-strip>.wrap{
  padding-block:28px;
}

.audience-strip span,
.audience-strip p{
  color:white;
}

.audience-strip b{
  color:#b8c894;
}

.vision{
  position:relative;
  padding-inline:44px;
}

.vision::before{
  content:"";
  position:absolute;
  top:84px;
  bottom:84px;
  left:0;
  width:5px;
  border-radius:99px;
  background:linear-gradient(var(--brand-blue),var(--brand-olive));
}

.vision h2 em{
  color:var(--brand-olive);
}

.planned{
  padding:54px 50px 28px;
  border:1px solid rgba(0,56,104,.12);
  border-radius:24px;
  background:linear-gradient(145deg,#fff,var(--lake-pale));
  box-shadow:var(--shadow);
}

.section-heading{
  border-bottom-color:rgba(0,56,104,.17);
}

.feature-list article{
  margin-inline:-18px;
  padding-inline:18px;
  border-bottom-color:rgba(0,56,104,.12);
  border-radius:12px;
  transition:background .2s ease,transform .2s ease;
}

.feature-list article:hover{
  background:rgba(223,228,211,.48);
  transform:translateX(4px);
}

.feature-number{
  color:var(--brand-blue);
}

.feature-tag{
  color:var(--forest);
  padding:8px 12px;
  border:1px solid #cbd2bd;
  border-radius:999px;
  background:var(--olive-mist);
}

.principle{
  position:relative;
  overflow:hidden;
  color:white;
  border:0;
  border-radius:26px;
  background:linear-gradient(120deg,var(--forest),var(--olive-dark) 52%,#687052);
  box-shadow:var(--shadow);
}

.principle::after{
  content:"";
  position:absolute;
  width:320px;
  height:320px;
  right:-150px;
  bottom:-190px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:50%;
  box-shadow:0 0 0 30px rgba(255,255,255,.035),0 0 0 64px rgba(255,255,255,.025);
}

.principle>div{
  position:relative;
  z-index:1;
}

.principle .principle-mark{
  padding:24px;
  border-radius:20px;
  background:rgba(255,255,255,.94);
}

.principle .eyebrow,
.principle h2,
.principle p:not(.eyebrow),
.principle .small-note{
  color:white;
}

.principle p:not(.eyebrow){
  opacity:.86;
}

.guide-callout{
  padding:42px 46px;
  border-color:#bfd4e3;
  border-radius:22px;
  background:
    linear-gradient(100deg,rgba(255,255,255,.88),rgba(255,255,255,.25)),
    var(--lake-soft);
  box-shadow:var(--shadow);
}

.insights{
  padding-inline:44px;
}

.insight-grid{
  gap:22px;
  padding-top:26px;
}

.insight-grid article{
  min-height:190px;
  padding:30px 30px 30px 66px;
  border:1px solid rgba(0,56,104,.11);
  border-radius:18px;
  background:#fff;
  box-shadow:0 18px 45px -38px rgba(0,56,104,.75);
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}

.insight-grid article:nth-child(3n+2),
.insight-grid article:nth-child(3n+4){
  background:var(--olive-mist);
}

.insight-grid article:nth-child(3n){
  background:var(--lake-pale);
}

.insight-grid article:hover{
  transform:translateY(-4px);
  border-color:rgba(24,115,180,.35);
  box-shadow:0 24px 48px -32px rgba(0,56,104,.5);
}

.insight-grid article>span{
  left:26px;
  color:var(--brand-blue);
}

.faq{
  padding:64px;
  border-radius:26px;
  background:linear-gradient(135deg,var(--lake-pale),#fff 70%);
  border:1px solid rgba(0,56,104,.1);
}

.faq-list details:first-child,
.faq-list details{
  border-color:rgba(0,56,104,.17);
}

.closing{
  position:relative;
  overflow:hidden;
  background:linear-gradient(115deg,var(--brand-navy),#064e7f 55%,var(--forest));
}

.closing::before,
.closing::after{
  content:"";
  position:absolute;
  width:360px;
  height:190px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:50%;
}

.closing::before{
  left:-180px;
  top:-80px;
  box-shadow:0 0 0 28px rgba(255,255,255,.025),0 0 0 62px rgba(255,255,255,.018);
}

.closing::after{
  right:-160px;
  bottom:-105px;
  box-shadow:0 0 0 28px rgba(255,255,255,.025),0 0 0 62px rgba(255,255,255,.018);
}

.closing .wrap{
  position:relative;
  z-index:1;
}

footer{
  background:var(--warm-paper);
}

/* Article pages keep long-form reading calm while sharing the richer palette. */
.guide{
  position:relative;
}

.guide::before{
  content:"";
  position:absolute;
  z-index:-1;
  width:100vw;
  height:430px;
  left:50%;
  top:0;
  transform:translateX(-50%);
  background:linear-gradient(180deg,var(--lake-pale),rgba(251,251,247,0));
}

.breadcrumbs{
  color:var(--brand-olive);
}

.byline{
  border-color:rgba(0,56,104,.18);
}

.key-points,
.guide-note{
  border-radius:14px;
  background:var(--olive-mist);
}

.guide-note{
  border-left-color:var(--brand-blue);
}

.guide th,
.guide td{
  border-color:#cfd9dc;
}

.guide thead{
  background:var(--lake-soft);
}

.guide blockquote{
  border-left-color:var(--brand-olive);
  color:var(--forest);
}

@media(max-width:1050px){
  .hero{width:calc(100% - 32px);padding:68px 40px}
  .planned{padding:44px 34px 24px}
  .faq{padding:46px}
}

@media(max-width:740px){
  .hero{width:calc(100% - 24px);padding:50px 22px 42px;border-radius:22px}
  .hero::before{right:-520px}
  .catalog-window{transform:none;box-shadow:10px 14px 0 -6px rgba(96,104,75,.16),var(--shadow)}
  .audience-strip>.wrap{padding-block:24px}
  .vision{padding-inline:28px}
  .vision::before{top:52px;bottom:52px}
  .planned{width:calc(100% - 24px);padding:38px 24px 18px;border-radius:20px}
  .feature-list article{margin-inline:-8px;padding-inline:8px}
  .feature-tag{padding:7px 10px}
  .principle{width:calc(100% - 24px);padding:34px 26px;border-radius:22px}
  .principle .principle-mark{display:block;padding:18px;margin-bottom:24px}
  .guide-callout{width:calc(100% - 24px);padding:30px 26px;border-radius:20px}
  .insights{padding-inline:0}
  .insight-grid{gap:14px}
  .insight-grid article{min-height:0;padding:26px 24px 26px 58px}
  .insight-grid article>span{left:22px;top:30px}
  .faq{width:calc(100% - 24px);padding:38px 26px;border-radius:22px}
}

@media(prefers-reduced-motion:reduce){
  .button,.feature-list article,.insight-grid article{transition:none}
  .button:hover,.feature-list article:hover,.insight-grid article:hover{transform:none}
}
