/* The useful links are a quiet, structured nautical directory, intentionally
   unlike the eight large "Important Directions" cards above. */
.resource-section.container {
  position:relative;
  margin-top:36px;
  margin-bottom:48px;
  padding:32px 33px 31px;
  overflow:hidden;
  border:1px solid #d3e8f0;
  border-radius:25px;
  background:
    radial-gradient(circle at 98% 6%,#abd8e73d 0 135px,transparent 136px),
    linear-gradient(132deg,#e8f5fb 0%,#f4fbfe 54%,#f9fcff 100%);
  box-shadow:0 10px 29px #12577b0e;
}
.resource-section .section-heading {position:relative;margin-bottom:17px;z-index:1}
.resource-section .resource-kicker {
  margin:0 0 5px;
  font-size:10px;line-height:1.4;letter-spacing:.17em;
  color:#ac7a3f;font-weight:800;text-transform:uppercase;
}
.resource-section .resource-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  counter-reset:resources;
  column-gap:25px;
  row-gap:0;
}
.resource-section .resource-grid>.resource-card {
  display:grid;
  grid-template-columns:37px minmax(0,1fr) 29px;
  align-items:center;
  column-gap:13px;
  row-gap:0;
  min-height:68px;
  height:auto;
  padding:9px 3px;
  margin:0;
  border:0;
  border-bottom:1px solid #cce3ed;
  border-radius:0;
  color:#184565;
  background:transparent;
  box-shadow:none;
  text-align:left;
  transform:none;
  counter-increment:resources;
  transition:background .18s ease;
}
.resource-section .resource-grid>.resource-card::before {
  content:counter(resources,decimal-leading-zero);
  display:grid;place-items:center;
  grid-column:1;grid-row:1;
  width:37px;height:37px;
  border-radius:50%;
  border:1px solid #b7d7e6;
  background:#fff;
  color:#a87539;
  font:700 12px/1 "Trebuchet MS",Arial,sans-serif;
}
.resource-section .resource-grid>.resource-card:hover {
  background:#fff9;
  box-shadow:none;
  border-bottom-color:#91c0d5;
  transform:none;
}
.resource-section .resource-grid>.resource-card>span:not(.external) {
  display:block;grid-column:2;grid-row:1;
  margin:0;padding:0;
  max-width:100%;
  font-size:14px;line-height:1.34;font-weight:700;
  color:#174a6c;overflow-wrap:anywhere;text-align:left;
}
.resource-section .resource-grid>.resource-card>.external{
  position:static;
  grid-column:3;grid-row:1;
  width:27px;height:27px;
  display:grid;place-items:center;
  border-radius:50%;
  border:1px solid #c2deea;
  background:#fff9;
  font-size:14px;color:#257b9f;
  box-shadow:none;
}
.resource-section .resource-grid>.resource-card:last-child:nth-child(odd) {
  grid-column:1/-1;
}
.resource-section .resource-grid>.resource-card:last-child:nth-child(odd)>span:not(.external) {
  max-width:65ch;
}
.resource-section .more-resources {
  margin-top:22px;
  background:#fff9;
  border:1px solid #d3e6ee;
  border-radius:13px;
}
.resource-section .more-resources summary {
  color:#174b6f;
  font-size:14px;
  font-weight:750;
}
.resource-section .more-resources__grid>a {
  min-height:52px;
  box-shadow:none;
}
.resource-section .more-resources__grid>a:hover {
  border-color:#96c5d8;
}
@media(max-width:740px) {
  .resource-section.container {padding:25px 18px 23px;margin-top:26px;margin-bottom:30px;border-radius:20px}
  .resource-section .resource-grid {grid-template-columns:1fr;gap:0}
  .resource-section .resource-grid>.resource-card {grid-column:1;min-height:64px;grid-template-columns:34px minmax(0,1fr) 27px;column-gap:11px;padding:9px 0}
  .resource-section .resource-grid>.resource-card::before{width:34px;height:34px;font-size:11px}
  .resource-section .resource-grid>.resource-card>span:not(.external){font-size:13px}
  .resource-section .resource-grid>.resource-card:last-child:nth-child(odd) {grid-column:1}
  .resource-section .more-resources{margin-top:17px}
}
@media(max-width:380px) {
  .resource-section.container {padding:22px 12px 19px}
  .resource-section .resource-grid>.resource-card {grid-template-columns:29px minmax(0,1fr) 23px;column-gap:8px}
  .resource-section .resource-grid>.resource-card::before {width:29px;height:29px;font-size:10px}
  .resource-section .resource-grid>.resource-card>.external {width:23px;height:23px;font-size:12px}
}
body.accessible .resource-section.container {background:#fff!important;border:2px solid #000!important}
body.accessible .resource-section .resource-grid>.resource-card::before {background:#fff!important;color:#000!important;border:2px solid #000!important}
@media(prefers-reduced-motion:reduce){.resource-section .resource-grid>.resource-card{transition:none}}

/* Place the nautical directory eyebrow above its title; on phones, avoid cramped lines. */
.resource-section .section-heading__left{
  display:grid;
  grid-template-columns:auto auto;
  grid-template-rows:auto auto;
  align-items:center;
  column-gap:17px;
  row-gap:0;
}
.resource-section .resource-kicker{grid-column:1/-1;grid-row:1;margin:0 0 4px}
.resource-section .section-heading h2{grid-column:1;grid-row:2}
.resource-section .section-heading .flourish{grid-column:2;grid-row:2}
@media(max-width:640px){
  .resource-section .section-heading{display:block}
  .resource-section .section-heading__left{display:flex;flex-wrap:wrap;gap:0 6px}
  .resource-section .resource-kicker{flex-basis:100%;margin-bottom:5px}
  .resource-section .section-heading h2{font-size:clamp(28px,8vw,35px)}
  .resource-section .section-heading .flourish{display:none}
  .resource-section .section-more{display:inline-flex;margin-top:7px}
}
/* The link already includes an arrow in the markup; no second arrow. */
.resource-section .more-resources__grid>a::after{content:none}


/* 10 October: all links (both immediately visible and unfolded) use precisely
   the same typographic maritime directory treatment, without row numbers. */
.resource-section .resource-grid,
.resource-section .more-resources__grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:25px;
  row-gap:0;
  counter-reset:none;
}
.resource-section .more-resources {
  background:transparent;
  border:0;
  border-top:1px solid #cce3ed;
  border-radius:0;
  margin-top:17px;
}
.resource-section .more-resources summary {
  padding:16px 4px;
  font-size:14px;
  font-weight:750;
  color:#174b6f;
}
.resource-section .more-resources__grid {
  padding:0 !important;
  margin:0;
}
.resource-section :is(.resource-grid,.more-resources__grid)>a.resource-card {
  display:grid;
  grid-template-columns:minmax(0,1fr) 29px;
  grid-template-rows:auto;
  grid-column:auto;
  column-gap:12px;
  row-gap:0;
  align-items:center;
  justify-items:stretch;
  min-height:66px;
  height:auto;
  margin:0;
  padding:10px 3px !important;
  background:transparent !important;
  border:0 !important;
  border-bottom:1px solid #cce3ed !important;
  border-radius:0 !important;
  box-shadow:none !important;
  text-decoration:none;
  transform:none !important;
  text-align:left;
  color:#174a6c;
  font-size:14px;
  font-weight:700;
  line-height:1.35;
  transition:background .18s ease;
}
.resource-section :is(.resource-grid,.more-resources__grid)>a.resource-card::before,
.resource-section :is(.resource-grid,.more-resources__grid)>a.resource-card::after {
  display:none !important;
  content:none !important;
}
.resource-section :is(.resource-grid,.more-resources__grid)>a.resource-card:hover {
  background:#ffffff9c !important;
  border-bottom-color:#8bbbd1 !important;
  box-shadow:none !important;
}
.resource-section :is(.resource-grid,.more-resources__grid)>a.resource-card>span:not(.external) {
  display:block;
  grid-column:1;
  grid-row:1;
  position:static;
  margin:0;
  padding:0;
  max-width:100%;
  min-width:0;
  font-size:14px;
  line-height:1.35;
  color:#174a6c;
  font-weight:700;
  overflow-wrap:anywhere;
}
.resource-section :is(.resource-grid,.more-resources__grid)>a.resource-card>.external {
  display:grid;
  grid-column:2;
  grid-row:1;
  position:static;
  place-items:center;
  width:27px;
  height:27px;
  margin:0;
  padding:0;
  border-radius:50%;
  border:1px solid #c2deea;
  background:#ffffffaa;
  color:#257b9f;
  font-size:14px;
  font-weight:400;
  box-shadow:none;
}
.resource-section :is(.resource-grid,.more-resources__grid)>a.resource-card:last-child:nth-child(odd) {
  grid-column:1/-1;
}
@media(max-width:740px) {
 .resource-section .resource-grid,
 .resource-section .more-resources__grid {
   grid-template-columns:1fr;
   column-gap:0;
 }
 .resource-section :is(.resource-grid,.more-resources__grid)>a.resource-card {
   grid-column:1;
   grid-template-columns:minmax(0,1fr) 27px;
   min-height:62px;
   padding:9px 0 !important;
 }
 .resource-section :is(.resource-grid,.more-resources__grid)>a.resource-card>span:not(.external) {
   font-size:13px;
 }
 .resource-section :is(.resource-grid,.more-resources__grid)>a.resource-card:last-child:nth-child(odd){
   grid-column:1;
 }
}
@media(max-width:380px) {
 .resource-section :is(.resource-grid,.more-resources__grid)>a.resource-card {
   grid-template-columns:minmax(0,1fr) 23px;
   column-gap:8px;
 }
 .resource-section :is(.resource-grid,.more-resources__grid)>a.resource-card>.external {
   width:23px;height:23px;font-size:12px;
 }
}
body.accessible .resource-section :is(.resource-grid,.more-resources__grid)>a.resource-card {
 background:#fff !important;color:#000 !important;border-bottom:2px solid #000 !important;
}
@media(prefers-reduced-motion:reduce){
 .resource-section :is(.resource-grid,.more-resources__grid)>a.resource-card {transition:none}
}
