:root{
  --bg:#ffffff;
  --bg-soft:#f6f7f5;
  --ink:#0e1110;
  --ink-2:#1e2321;
  --muted:#5b615e;
  --line:rgba(14,17,16,.12);

  /* Burke Legal bottle green */
  --accent:#0B3D2E;
  --accent-2:#0F513B;
  --accent-soft:rgba(11,61,46,.08);

  --max:1160px;
  --measure:760px;

  --radius-xl:22px;
  --radius-lg:16px;
  --radius-md:12px;

  --shadow:0 18px 45px rgba(0,0,0,.08);
  --shadow-soft:0 12px 30px rgba(11,61,46,.08);
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}

.page{max-width:var(--max);margin:0 auto;padding:1.6rem 1.5rem 3.2rem}

/* Header */
header{
  position:sticky;top:0;z-index:30;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
  margin:0 -1.5rem;
  padding:0 1.5rem;
}

/* Right column width matches hero globe column.
   Default is 420px (matches .hero-inner). Home page uses 440px (matches .globe-wrap--index). */
body{ --right-col: 420px; }
body.home{ --right-col: 440px; }

.header-inner{
  display:grid;
  grid-template-columns: minmax(0,1fr) minmax(0,var(--right-col));
  align-items:center;
  gap:1.5rem;
}

.brand{display:flex;align-items:center;gap:.9rem;min-width:240px}
.brand img{height:108px;width:auto;display:block} /* DO NOT CHANGE */
.brand-text{display:flex;flex-direction:column;gap:.12rem}

.wordmark{
  font-family:"Space Grotesk",system-ui,sans-serif;
  font-weight:650;font-size:1.02rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink);
}
.submark{font-size:.74rem;text-transform:uppercase;letter-spacing:.18em;color:rgba(91,97,94,.9)}

/* Key layout:
   - header-right spans BOTH columns so the nav can start further left
   - badge stays in the fixed globe column and remains flush right */
.header-right{
  grid-column:2; /* keep it on the same row as the logo */
  display:grid;
  grid-template-columns: minmax(0,1fr) auto; /* nav lane + badge lane */
  align-items:center;
  column-gap:.55rem;
  width:100%;
  min-width:0;
}
/* Nav sits in column 1, anchored to the right edge (near the badge) */
.header-right .nav{ grid-column:1; justify-self:end; }
.header-right .lsoi-badge{ grid-column:2; justify-self:end; }

/* Pills row */
.nav-inner{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:.22rem;
  flex-wrap:nowrap;
  white-space:nowrap;
  min-width:max-content;
}

/* Badge stays in globe column and flush right */
.header-right .lsoi-badge{
  grid-column:2;
  justify-self:end;
}
.lsoi-badge img{height:34px;width:auto;display:block;opacity:.98;margin-left:0} /* DO NOT CHANGE */

/* Nav pill styles */
.nav a{
  color:rgba(91,97,94,.96);
  padding:.54rem .78rem;   /* tightened so Contact fits */
  font-size:.94rem;
  border-radius:999px;
  border:1px solid transparent;
  transition:background .16s ease,color .16s ease,border-color .16s ease;
}
.nav a:hover{
  color:var(--ink);
  background:var(--bg-soft);
  border-color:rgba(14,17,16,.10);
  text-decoration:none;
}
.nav a.active{
  color:var(--accent);
  background:var(--accent-soft);
  border-color:rgba(11,61,46,.22);
}

/* Compact header variant: hide wordmark block only */
body.compact-header .brand-text{ display:none; }

@media (max-width: 980px){
  /* Globe disappears under 980px; collapse header to single column */
  .header-inner{ grid-template-columns:1fr; }

  /* Keep badge visible and nav to left on small widths */
  .header-right{
    grid-column:1;
    grid-template-columns: minmax(0,1fr) auto;
  }
  .header-right .nav{ justify-self:start;margin-left: 0;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .nav-inner{ justify-content:flex-start; }
}
.practice-hero{
  max-width: var(--max);
  margin: 0 auto 2.4rem;
}

.practice-hero img{
  width: 100%;
  height: auto;          /* key line: prevents cropping */
  display: block;
  border-radius: var(--radius-xl);
}
/* Hero (Prestige, top-tier cross-border boutique) */
.hero{
  position:relative;
  padding:4.2rem 0 2.6rem;
  background: linear-gradient(180deg, #ffffff 0%, #fbfbfa 70%, #ffffff 100%);
  border-bottom:1px solid rgba(14,17,16,.10);
  overflow:hidden;
}
.hero-inner{
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 1.5rem;
  display:grid;
  grid-template-columns: minmax(0,1fr) minmax(0,420px);
  gap: 3.2rem;
  align-items:start;
}
.hero-kicker{
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.26em;
  color:var(--accent);
  margin-bottom:1.2rem;
}
.hero-title{
  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  font-size: clamp(2.4rem, 3.6vw, 3.6rem);
  font-weight: 650;
  letter-spacing: .02em;
  margin-bottom: .6rem;
  color: var(--ink);
  max-width: var(--measure);
}
.hero-subtitle{
  font-size: 1.08rem;
  max-width: 46rem;
  color: rgba(91,97,94,.98);


}
.hero-rule{
  width: 96px;
  height: 2px;
  background: var(--accent);
  border-radius: 999px;
  margin: 1.6rem 0 1.4rem;
}
.hero-links{
  display:flex;
  gap:1.4rem;
  flex-wrap:wrap;
}
.hero-links a{
  color: var(--accent);
  font-weight: 650;
  font-size: .98rem;
}
.hero-links a:hover{
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Globe (textured, earth-like rotation) */
.globe-wrap{
  position:relative;
  width:420px;
  height:420px;
}
/* Home page globe size */
.globe-wrap--index{
  width: min(440px, 82vw);
  aspect-ratio: 1 / 1;
  height: auto;
}
.globe{
  position:absolute;
  inset:0;
  border-radius:999px;
  overflow:hidden;
  opacity:.22;
  background:
    radial-gradient(circle at 35% 35%, rgba(255,255,255,.55), rgba(255,255,255,0) 46%),
    radial-gradient(circle at 70% 70%, rgba(0,0,0,.18), rgba(0,0,0,0) 55%),
    linear-gradient(180deg, rgba(11,61,46,.10), rgba(11,61,46,0));
  box-shadow: 0 30px 70px rgba(11,61,46,.10);
}
.globe::before{
  content:"";
  position:absolute;
  inset:-8%;
  background-image: url("assets/world-map-overlay.png");
  background-repeat: repeat-x;
  background-size: 120% auto;
  background-position: 0% 50%;
  filter: saturate(1.1) contrast(1.05);
  opacity:.95;
  transform: scale(1.05);
}
.globe::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,.55), rgba(255,255,255,0) 45%),
    radial-gradient(circle at 70% 70%, rgba(0,0,0,.22), rgba(0,0,0,0) 60%);
  mix-blend-mode: multiply;
  opacity:.65;
}
@media (prefers-reduced-motion: no-preference){
  .globe.spin::before{
    animation: drift 80s linear infinite;
  }
}
@keyframes drift{
  from{ background-position: 0% 50%; }
  to{ background-position: 200% 50%; }
}

/* Layout */
.layout{
  display:grid;
  grid-template-columns:minmax(0,3.7fr) minmax(0,2fr);
  gap:2.4rem;
  margin-top:2.4rem;
  align-items:start;
}
section h2{
  font-family:"Space Grotesk",system-ui,sans-serif;
  font-weight:700;
  margin-bottom:1rem;
  font-size:1.18rem;
  color:var(--ink);
}
.section-body{
  border:1px solid var(--line);
  background:#ffffff;
  border-radius:var(--radius-xl);
  padding:1.55rem 1.55rem;
  box-shadow:var(--shadow-soft);
}
.section-body p{
  color:var(--muted);
  line-height:1.65;
  margin-bottom:.95rem;
  font-size:.98rem;
}
.section-body p:last-child{margin-bottom:0}

.list{list-style:none;display:grid;gap:.9rem}
.list li{color:var(--muted);line-height:1.58}
.list strong{color:var(--ink);font-weight:700}

.chips{display:flex;gap:.55rem;flex-wrap:wrap;margin-top:1.1rem}
.chips span{
  background:var(--bg-soft);
  border:1px solid rgba(14,17,16,.10);
  color:var(--ink-2);
  padding:.45rem .72rem;
  border-radius:999px;
  font-size:.78rem;
  letter-spacing:.04em;
  cursor: default;
  user-select: none;
}

.card{
  border:1px solid var(--line);
  background:#ffffff;
  border-radius:var(--radius-xl);
  padding:1.55rem 1.55rem;
  box-shadow:var(--shadow-soft);
}
.card h3{
  font-family:"Space Grotesk",system-ui,sans-serif;
  font-weight:700;
  color:var(--ink);
  margin-bottom:.65rem;
  font-size:1.02rem;
}
.card p{color:var(--muted);font-size:.95rem;line-height:1.62}

.callout{
  margin-top:1.15rem;
  padding:1.05rem 1.05rem;
  border-radius:1.15rem;
  border:1px solid rgba(11,61,46,.22);
  background: linear-gradient(180deg, rgba(11,61,46,.06), rgba(255,255,255,.0));
}
.callout .label{
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:rgba(14,17,16,.82);
  margin-bottom:.55rem;
}
.callout a{color:var(--accent);font-weight:650}
.callout a:hover{text-decoration:underline}

hr.sep{border:0;border-top:1px solid rgba(14,17,16,.12);margin:2.0rem 0 0}

footer{
  margin-top:2.75rem;
  display:flex;
  justify-content:space-between;
  gap:1.2rem;
  flex-wrap:wrap;
  color:rgba(91,97,94,.92);
  font-size:.82rem;
  border-top:1px solid rgba(14,17,16,.12);
  padding-top:1.25rem;
}

/* Forms */
form{display:grid;gap:.85rem;margin-top:.85rem}
input, textarea{
  width:100%;
  padding:.78rem .9rem;
  border-radius:1rem;
  border:1px solid rgba(14,17,16,.14);
  background:#ffffff;
  color:var(--ink);
  outline:none;
}
input::placeholder, textarea::placeholder{color:rgba(91,97,94,.75)}
textarea{min-height:140px;resize:vertical}
.small{font-size:.82rem;color:rgba(91,97,94,.92);line-height:1.45}

/* Responsive */
@media (max-width: 980px){
  .hero-inner{grid-template-columns:1fr;}
  .globe-wrap{display:none;}

  .hero .hero-inner{grid-template-columns:1fr; gap:1.4rem;}
  .hero-panel{border-left:0; padding-left:0; border-top:1px solid rgba(14,17,16,.12); padding-top:1.2rem;}

  .layout{grid-template-columns:1fr;gap:1.6rem}

  .hero{padding:2.2rem 1.6rem}
  .hero::after{right:-220px;top:-80px;opacity:.75}
}

@media (max-width: 560px){
  .page{padding:1.1rem 1rem 2.6rem}
  header{margin:0 -1rem;padding:0 1rem}
  .hero{padding:1.9rem 1.35rem}
  .hero::after{display:none}
}

/* Placeholder controls */
.btn[disabled], .btn.disabled{
  opacity:.55;
  cursor:not-allowed;
  box-shadow:none !important;
}

/* Home editorial scroll experience */
.home-stack{
  margin-top: 0.8rem;
}
.panel{
  position: relative;
  border:1px solid rgba(14,17,16,.10);
  border-radius: var(--radius-xl);
  background:#fff;
  box-shadow: var(--shadow-soft);
  padding: 2.2rem 2.2rem;
  overflow:hidden;
}
.panel + .panel{ margin-top: 1.35rem; }

.panel .panel-kicker{
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.22em;
  color: var(--accent);
  margin-bottom: .85rem;
}
.panel h2{
  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  font-size: clamp(1.75rem, 2.4vw, 2.25rem);
  font-weight: 650;
  margin-bottom: .8rem;
}
.panel p{ max-width: 72ch; }

.scroll-cue{
  display:inline-flex;
  align-items:center;
  gap:.65rem;
  margin-top: 1.25rem;
  color: rgba(91,97,94,.95);
  font-weight: 600;
  font-size: .92rem;
  text-decoration:none;
}
.scroll-cue:hover{ text-decoration:none; }
.scroll-cue .chev{
  width: 34px; height: 34px;
  border-radius: 999px;
  border:1px solid rgba(14,17,16,.12);
  display:grid; place-items:center;
  background: #fff;
}
@media (prefers-reduced-motion: no-preference){
  .scroll-cue .chev{
    animation: bob 1.6s ease-in-out infinite;
  }
}
@keyframes bob{
  0%,100%{ transform: translateY(0); }
  50%{ transform: translateY(4px); }
}

/* Insights cards */
.cards{
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 1rem;
  margin-top: 1.2rem;
}
.card-link{
  display:block;
  grid-column: span 6;
  border:1px solid rgba(14,17,16,.10);
  border-radius: var(--radius-lg);
  padding: 1.25rem 1.25rem;
  background:#fff;
  box-shadow: 0 10px 25px rgba(0,0,0,.05);
  transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
  text-decoration:none;
}
.card-link:hover{
  transform: translateY(-1px);
  box-shadow: 0 16px 36px rgba(0,0,0,.08);
  border-color: rgba(11,61,46,.22);
  text-decoration:none;
}
.card-type{
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.18em;
  color: rgba(91,97,94,.92);
  margin-bottom: .55rem;
}
.card-title{
  font-weight: 700;
  color: var(--ink);
  margin-bottom: .55rem;
  line-height: 1.25;
}
.card-meta{
  color: rgba(91,97,94,.95);
  font-size: .92rem;
}
@media (max-width: 980px){
  .card-link{ grid-column: span 12; }
}

/* Latest carousel (homepage) */
.carousel{
  margin-top: 1.25rem;
  border: 1px solid rgba(14,17,16,.10);
  border-radius: var(--radius-lg);
  overflow:hidden;
  background:#fff;
}
.carousel-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap: 1rem;
  padding: .95rem 1.1rem;
  border-bottom:1px solid rgba(14,17,16,.10);
}
.carousel-label{
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.18em;
  color: rgba(91,97,94,.92);
}
.carousel-controls{
  display:flex;
  align-items:center;
  gap:.5rem;
}
.icon-btn{
  width:36px;height:36px;
  border-radius:999px;
  border:1px solid rgba(14,17,16,.12);
  background:#fff;
  display:grid;
  place-items:center;
  cursor:pointer;
  transition: transform .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.icon-btn:hover{
  transform: translateY(-1px);
  border-color: rgba(11,61,46,.22);
  box-shadow: 0 10px 25px rgba(0,0,0,.06);
}
.icon-btn:active{ transform: translateY(0); }
.icon-btn[disabled]{
  opacity:.45;
  cursor:not-allowed;
  box-shadow:none;
}
.carousel-viewport{
  position:relative;
  height: 188px;
}
.slide{
  position:absolute;
  inset: 0;
  padding: 1.25rem 1.25rem;
  opacity:0;
  transform: translateX(8px);
  transition: opacity .22s ease, transform .22s ease;
}
.slide.active{
  opacity:1;
  transform: translateX(0);
}
.slide .type{
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.18em;
  color: rgba(91,97,94,.92);
  margin-bottom: .6rem;
}
.slide .title{
  font-weight:700;
  color: var(--ink);
  line-height:1.25;
  font-size: 1.05rem;
  max-width: 70ch;
  margin-bottom: .55rem;
}
.slide .meta{
  color: rgba(91,97,94,.95);
  font-size: .92rem;
  margin-bottom: .9rem;
}
.slide a.read{
  color: var(--accent);
  font-weight:650;
  text-decoration:none;
}
.slide a.read:hover{ text-decoration:underline; text-underline-offset:3px; }

.carousel-dots{
  display:flex;
  gap:.45rem;
  padding: .85rem 1.1rem 1.05rem;
  border-top:1px solid rgba(14,17,16,.10);
}
.dot{
  width: 8px; height: 8px;
  border-radius:999px;
  border:1px solid rgba(14,17,16,.18);
  background: #fff;
  cursor:pointer;
}
.dot.active{
  background: rgba(11,61,46,.45);
  border-color: rgba(11,61,46,.45);
}
@media (max-width: 980px){
  .carousel-viewport{ height: 220px; }
}



/* =========================
   Practice page components
   ========================= */
.masthead{
  margin: 0 calc(50% - 50vw);
  padding: 3.1rem 0 2.2rem;
  border-bottom: 1px solid rgba(14,17,16,.10);
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(11,61,46,.92) 0%, rgba(11,61,46,.70) 48%, rgba(11,61,46,.30) 78%, rgba(11,61,46,0) 100%),
    var(--masthead-image, none);
  background-size: cover;
  background-position: 50% 20%;
}
.masthead::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 22% 30%, rgba(255,255,255,.10), rgba(255,255,255,0) 52%),
    radial-gradient(circle at 78% 40%, rgba(0,0,0,.22), rgba(0,0,0,0) 55%);
  pointer-events:none;
}
.masthead-inner{
  position: relative;
  z-index: 1;
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 1.5rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: .75rem;
  color: #fff;
}
.crumbs{
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .20em;
  color: rgba(255,255,255,.82);
}
.crumbs a{ color: rgba(255,255,255,.88); text-decoration:none; }
.crumbs a:hover{ text-decoration:underline; text-underline-offset:3px; }

.masthead h1{
  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  font-size: clamp(2.05rem, 3.0vw, 3.0rem);
  font-weight: 650;
  letter-spacing: .01em;
  line-height: 1.15;
}
.masthead .lede{
  max-width: 70ch;
  font-size: 1.02rem;
  color: rgba(255,255,255,.92);
  line-height: 1.55;
}

.practice-shell{
  max-width: var(--max);
  margin: 0 auto;
  padding: 2.4rem 1.5rem 3.2rem;
  display: grid;
  grid-template-columns: minmax(0, 3.15fr) minmax(0, 1.55fr);
  gap: 2.4rem;
  align-items: start;
}
.practice-shell h2{
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 700;
  font-size: 1.08rem;
  letter-spacing: .02em;
  margin: 1.75rem 0 .85rem;
}
.practice-shell h2:first-of-type{ margin-top: 0; }

.prose{
  border: 1px solid rgba(14,17,16,.10);
  background: #fff;
  border-radius: var(--radius-xl);
  padding: 1.55rem 1.6rem;
  box-shadow: var(--shadow-soft);
}
.prose p{
  color: rgba(91,97,94,.96);
  line-height: 1.7;
  margin-bottom: 1rem;
  font-size: .98rem;
}
.prose p:last-child{ margin-bottom: 0; }

.proc{
  border: 1px solid rgba(14,17,16,.10);
  background: #fff;
  border-radius: var(--radius-xl);
  padding: 1.35rem 1.45rem;
  box-shadow: var(--shadow-soft);
}
.proc + .proc{ margin-top: 1rem; }
.proc h3{
  font-family: "Space Grotesk", system-ui, sans-serif;
  font-weight: 700;
  font-size: 1.02rem;
  color: var(--ink);
  margin-bottom: .55rem;
}
.proc p{ color: rgba(91,97,94,.96); line-height: 1.65; font-size: .95rem; margin-bottom: .85rem; }
.proc p:last-child{ margin-bottom: 0; }
.proc ul{ margin: .65rem 0 0 1.05rem; display:grid; gap:.45rem; }
.proc li{ color: rgba(91,97,94,.96); line-height: 1.55; font-size: .95rem; }

.sidebar{
  display: grid;
  gap: 1rem;
}
.sidebar-card{
  border: 1px solid rgba(14,17,16,.10);
  background: #fff;
  border-radius: var(--radius-xl);
  padding: 1.25rem 1.25rem;
  box-shadow: var(--shadow-soft);
}
.sidebar-card.sticky{
  position: sticky;
  top: 92px;
}
.sidebar-card .k{
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .18em;
  color: rgba(91,97,94,.90);
  margin-bottom: .55rem;
}
.sidebar-card h3{
  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  font-weight: 650;
  font-size: 1.25rem;
  color: var(--ink);
  margin-bottom: .6rem;
  line-height: 1.2;
}
.sidebar-card p{ color: rgba(91,97,94,.96); line-height: 1.6; font-size: .94rem; }
.sidebar-card a{ color: var(--accent); font-weight: 700; text-decoration: none; }
.sidebar-card a:hover{ text-decoration: underline; text-underline-offset: 3px; }

.pills{
  display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.8rem;
}
.pills span{
  background: var(--bg-soft);
  border: 1px solid rgba(14,17,16,.10);
  color: rgba(30,35,33,.96);
  padding: .38rem .62rem;
  border-radius: 999px;
  font-size: .78rem;
  letter-spacing: .02em;
  user-select: none;
}

@media (max-width: 980px){
  .masthead{ background: linear-gradient(180deg, rgba(11,61,46,.90), rgba(11,61,46,.55)), var(--masthead-image, none); background-position: 50% 18%; }
  .practice-shell{ grid-template-columns: 1fr; }
  .sidebar-card.sticky{ position: static; }
}
.prose.prose--plain{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

/* Optional: keep spacing/typography feeling intentional */
.prose.prose--plain p{
  margin-bottom: 0.9rem;
}
.prose.prose--lead p{
  font-size: 1.28rem;            /* clearly larger than body */
  line-height: 1.5;
  color: rgba(14,17,16,.98);     /* near-black, authoritative */
  font-weight: 450;
 
  max-width: 72ch;
}
.section-italic{
  font-style: italic;
  color: var(--accent);        /* Burke Legal bottle green */
  font-weight: 600;            /* balances italics */
}
.topics-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1.1rem;
  margin-top: 1.1rem;
}

.topic-card{
  display: inline-flex;            /* IMPORTANT */
  align-items: center;
  justify-content: center;

  padding: .75rem 1.1rem;
  border-radius: 999px;

  border: 1px solid rgba(14,17,16,.12);
  background: #fff;

  text-decoration: none;
  min-height: 0;                   /* prevents collapse */
}
.topics-grid{
  display: flex;
  gap: .6rem;
  flex-wrap: wrap;
  margin-bottom: 1.2rem;
}
/* Label styling (prominent but restrained) */
.topic-label{
  font-size: .78rem;
  font-weight: 750;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(14,17,16,.82);
  line-height: 1;
}

/* Hover state */
.topic-card:hover{
  border-color: rgba(11,61,46,.28);
  box-shadow: 0 6px 16px rgba(11,61,46,.10);
  text-decoration: none;
}
/* Latest insights list */
.insight-list{
  list-style: none;
  padding: 0;
  margin: .85rem 0 0;
}

.insight-list li{
  padding: .75rem 0;
  border-bottom: 1px solid rgba(14,17,16,.08);
}

.insight-list li:last-child{
  border-bottom: 0;
}

.meta{
  font-size: .75rem;
  color: rgba(91,97,94,.75);
  margin-bottom: .2rem;
}

.insight-title{
  font-size: .98rem;
  font-weight: 650;
  color: rgb(37,87,73);
  text-decoration: none;
}

.insight-title:hover{
  text-decoration: underline;
  text-underline-offset: 3px;
}

.insight-title.muted{
  color: rgba(91,97,94,.75);
  font-weight: 600;
  cursor: default;
}
/* Ensure Featured Topic cards are clickable */
.topic-card {
  pointer-events: auto;
}

.topic-card * {
  pointer-events: auto;
}

/* =========================
   Mobile hamburger (single source of truth)
   ========================= */

.nav-toggle{
  display:none; /* desktop: hidden */
  align-items:center;
  gap:.5rem;
  padding:.55rem .8rem;
  border-radius:999px;
  border:1px solid rgba(14,17,16,.14);
  background:#fff;
  color:rgba(14,17,16,.92);
  font-weight:650;
}

/* MOBILE */
@media (max-width: 820px){

  /* header becomes: logo left, controls right */
  .header-inner{
    grid-template-columns: auto auto;
    align-items:center;
    gap:.9rem;
  }

  /* IMPORTANT: make hamburger visible */
  

  /* hide badge in top row on mobile */
  .header-right .lsoi-badge{
    display:none;
  }

  /* make right side a simple anchor point */
  .header-right{
  position: relative;     /* anchors dropdown */
  grid-column: 2;
  justify-self: stretch;  /* IMPORTANT: not auto */
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

  /* dropdown panel */
  .header-right .nav{
  display:none;
  position:absolute;
  top: calc(100% + .55rem);
  right: 0;
  left: auto;

  width: min(320px, calc(100vw - 2rem)); /* prevents off-screen */
  max-width: calc(100vw - 2rem);

    background: rgba(255,255,255,.98);
    border: 1px solid rgba(14,17,16,.12);
    border-radius: 16px;
    box-shadow: 0 18px 45px rgba(0,0,0,.10);
    padding: .55rem;
    z-index: 100;
  }
  .header-right .nav.is-open{ display:block;}

  .header-right .nav .nav-inner{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:.25rem;
    min-width:0;
    white-space:normal;
  }

  .header-right .nav a{
    display:block;
    width:100%;
    padding:.64rem .8rem;
    border-radius:12px;
  }
.nav-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.45rem;

    padding:.48rem .62rem;
    border-radius: 10px;                 /* not a circle/pill */
    border:1px solid rgba(14,17,16,.14);
    background:#fff;

    font-size:.82rem;                    /* smaller label */
    line-height:1;
    font-weight:650;
    letter-spacing:.02em;

    cursor:pointer;
  }
/* make sure the icon stays a sane size */
.nav-toggle svg{
    width: 26px;     /* LONGER LINES */
    height: 18px;
    flex: 0 0 26px;
    display:block;
  }
}
@media (max-width: 560px){
  .hero-inner{ padding: 0 1rem; max-width: 100%; }
  .hero-title{
  font-size: clamp(1.75rem, 6.2vw, 2.25rem);
  line-height: 1.12;
  letter-spacing: .01em; /* optional: slightly tighter */
}

/* Optional: tighten supporting text a bit */
.hero-subtitle{
  font-size: 1rem;
  line-height: 1.55;
}

/* Optional: kicker can be slightly smaller too */
.hero-kicker{
  font-size: .72rem;
  letter-spacing: .22em;
}
}

