/* =========================================================
   DESIGN TOKENS
   ========================================================= */
:root{
  --wrap: 1400px;
  --gutter: 18px;

  --vsk-dark: #002540;
  --vsk-light: #CFEAF7;

  /* Card system (from base.css) */
  --card: #fff;
  --card-pad: 1.25rem 1.5rem 1.5rem;

  --bg: #ffffff;
  --surface: #ffffff;
  --surface-soft: #f7f8fa;
  --surface-tint: rgba(207,234,247,.22);

  --text: var(--vsk-dark);
  --muted: rgba(0,59,92,.68);
  --border: rgba(0,0,0,.10);

  --radius: 18px;
  --radius-sm: 14px;
  --radius-pill: 999px;

  --shadow: 0 16px 42px rgba(0,0,0,.08);
  --shadow-hover: 0 22px 55px rgba(0,0,0,.12);
  --card-shadow: 0 10px 24px rgba(0,0,0,.06);

  --space-xs: .75rem;
  --space-sm: 1rem;
  --space-md: 1.25rem;
  --space-lg: 1.75rem;
  --space-xl: 2.5rem;

  --link: #005f8f;
  --link-hover: #007fb0;
  --ring: 0 0 0 4px rgba(0,159,219,.12);

  --font-ui: "Nunito", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

/* =========================================================
   RESET / BASE
   ========================================================= */
*,
*::before,
*::after{
  box-sizing: border-box;
}

html, body{
  margin: 0;
  padding: 0;
  min-height: 100%;
  overflow-x: hidden;
}

body{
  font-family: var(--font-ui);
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img{
  display: block;
  max-width: 100%;
}

a{
  color: var(--link);
}

a:hover{
  color: var(--link-hover);
}

h1,h2,h3{
  margin-top: 0;
  letter-spacing: -0.02em;
}

p{
  margin-top: 0;
}

button,
input,
textarea,
select{
  font: inherit;
}

/* =========================================================
   GLOBAL LAYOUT
   ========================================================= */
.page-main{
  flex: 1;
  margin: 1.5rem 0 1rem;
  padding: 0 16px;
  box-sizing: border-box;
}
@media (min-width: 701px){
  .page-main{
    padding: 0;
  }
}

.page-main > *{
  max-width: var(--wrap);
  margin-left: auto;
  margin-right: auto;
}

.page-main > * + *{
  margin-top: 1rem;
}

.section__inner,
.layout-wrap{
  width: 100%;
  max-width: var(--wrap);
  margin: 0 auto;
  padding-left: var(--gutter);
  padding-right: var(--gutter);
}

.page-section,
.section--content{
  padding-top: 24px;
  padding-bottom: 18px;
}

.page-bleed{
  max-width: 1600px;
}

.stack{
  display: grid;
  gap: var(--space-md);
}

/* =========================================================
   BUTTONS / PILLS
   ========================================================= */
.btn{
  width: fit-content;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  padding: 10px 14px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.14);
  background: #A9DBF6;
  border-color: #5CB3E6;
  cursor: pointer;
  text-decoration: none;
  color: var(--vsk-dark);
  font-size: 15px;
  font-weight: 600;
  transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
}

.btn:hover{
  background: #5CB3E6;
}

.btn--ghost{
  background: transparent;
}

.btn--ghost:hover{
  background: rgba(92,179,230,0.20);
}

.btn--primary{
  background: #A9DBF6;
  border-color: #5CB3E6;
}

.pill,
.trust-pill,
.archive-badge{
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: var(--radius-pill);
  border: 1px solid rgba(0,0,0,.10);
  background: #fff;
  font-size: 12px;
  font-weight: 800;
}

.footer-bug{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgba(255,255,255,0.65);
  text-decoration: none;
  font-size: 13px;
}

.footer-bug:hover{
  color: #fff;
}

.bug-icon{
  width: 14px;
  height: 14px;
  fill: currentColor;
}

.season-toggle{
  display: inline-flex;
  gap: 6px;
  padding: 4px;
  background: rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 999px;
}

.season-toggle__btn{
  appearance: none;
  border: 0;
  background: transparent;
  color: rgba(0,59,92,0.68);

  border-radius: 999px;
  padding: 10px 16px;
  min-height: 38px;

  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;

  transition: background 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.season-toggle__btn:hover{
  background: rgba(255,255,255,0.7);
  color: rgba(0,59,92,0.85);
}

.season-toggle__btn.is-active,
.season-toggle__btn[aria-pressed="true"]{
  background: #fff;
  color: var(--vsk-dark);
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.post-card--page .post-card__body{
  padding-top: 0.9rem;
}
/* =========================================================
   COMMON CARD SYSTEM
   ========================================================= */
.page-card,
.post-card,
.archive-card,
.meeting-card,
.surface-card{
  width: 100%;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
}
/* Meeting-card: pad text elements, let slider stay full-width */
.meeting-card > .meeting-breadcrumb,
.meeting-card > .meeting-title,
.meeting-card > .meeting-meta{
  padding-left: 1.45rem;
  padding-right: 1.45rem;
}
.meeting-card > .meeting-breadcrumb{ padding-top: 1.25rem; }
.meeting-card > .meeting-title{ padding-top: .3rem; }
.meeting-card > .meeting-intro{
  padding: .85rem 1.45rem 1.5rem;
}
.meeting-card .meeting-breadcrumb,
.meeting-card .meeting-title,
.meeting-card .meeting-meta,
.meeting-card .meeting-intro p{
  color: var(--vsk-dark);
}
.meeting-card .meeting-title{
  font-weight: 800;
  font-size: clamp(22px, 2.8vw, 32px);
}
.meeting-card .meeting-meta{
  font-size: 13px;
  opacity: .72;
  margin: 0;
}

/* Rich typography inside meeting-card content */
.meeting-card .meeting-intro h2,
.meeting-card .meeting-intro h3{
  font-size: 15px;
  font-weight: 800;
  color: var(--vsk-dark);
  margin: 1.25rem 0 .4rem;
  padding-bottom: .35rem;
  border-bottom: 2px solid rgba(0,59,92,.10);
}
.meeting-card .meeting-intro h3:first-child{
  margin-top: .5rem;
}
.meeting-card .meeting-intro ul,
.meeting-card .meeting-intro ol{
  margin: .4rem 0 .9rem 1.1rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .35rem;
}
.meeting-card .meeting-intro ul li,
.meeting-card .meeting-intro ol li{
  font-size: 14px;
  color: var(--vsk-dark);
  line-height: 1.55;
  padding-left: .25rem;
}
.meeting-card .meeting-intro ul{
  list-style: disc;
}
.meeting-card .meeting-intro ol{
  list-style: decimal;
}
.meeting-card .meeting-intro a:not(.btn){
  color: var(--link);
  font-weight: 600;
  text-decoration: none;
}
.meeting-card .meeting-intro a:not(.btn):hover{
  text-decoration: underline;
}
.meeting-card .meeting-intro p{
  font-size: 14.5px;
  line-height: 1.65;
  margin: 0 0 .75rem;
}
.meeting-card .meeting-intro p:last-child{
  margin-bottom: 0;
}

.post-card--page .post-card__title{
  font-size: 28px;
  line-height: 1.15;
  margin-bottom: 4px;
}

.post-card,
.archive-item,
.board-card,
.org-box,
.member-panel,
.news-card,
.meeting-card,
.meeting-block,
.panel{
  background: #fff;
  border: 1px solid rgba(0,59,92,.12);
  border-radius: 16px;
  box-shadow: var(--card-shadow);
}

.post-card:hover,
.archive-item:hover,
.board-card:hover,
.news-card:hover{
  transform: translateY(-3px);
  box-shadow: var(--shadow-hover);
}

.page-card__head,
.post-card__head,
.archive-card__head,
.surface-card__head{
  padding: 1.35rem 1.45rem 1.1rem;
  border-bottom: 1px solid rgba(0,59,92,.08);
}

.page-card__body,
.post-card__body,
.page-card > .page-body,
.surface-card__body{
  padding: 1.25rem 1.45rem 1.45rem;
}

.page-title,
.post-card__title,
.archive-card__title,
.surface-card__title{
  margin: 0 0 .35rem;
  font-size: clamp(22px, 2.8vw, 32px);  /* consistent across all inner pages */
  line-height: 1.1;
  font-weight: 800;
  color: var(--vsk-dark);
}

.page-kicker,
.archive-controls__label,
.meeting-breadcrumb,
.org-breadcrumb,
.member-kicker{
  margin: 0 0 .4rem;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(0,59,92,.52);
  font-weight: 800;
}

.page-meta,
.post-card__meta,
.archive-card__intro,
.meeting-meta,
.org-intro,
.member-lead,
.meeting-intro{
  color: var(--muted);
}

.note-box,
.member-note{
  margin-top: 1rem;
  padding: 10px 14px;
  border-left: 3px solid var(--vsk-dark);
  border-radius: 0 8px 8px 0;
  background: rgba(0,59,92,.04);
  font-size: 13px;
  color: var(--vsk-dark);
  line-height: 1.5;
}

/* =========================================================
   COMMON GRIDS
   ========================================================= */
.maincontent,
.content-grid{
  display: grid;
  gap: 16px;
  align-items: start;
}

.maincontent{
  grid-template-columns: repeat(2, minmax(0,1fr));
}

.content-grid--2{
  grid-template-columns: repeat(2, minmax(0,1fr));
}

.content-grid--3{
  grid-template-columns: repeat(3, minmax(0,1fr));
}

/* =========================================================
   NEWS / POST CARDS
   ========================================================= */
.news-grid{
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 1.5rem;
  align-items: start;
}

/* 3 small cards stacked vertically in the right column */
.news-row{
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(3, 1fr);
  gap: 1rem;
  align-self: stretch;
}

.news-card{
  display: grid;
  grid-template-columns: 1fr 320px;
  align-items: stretch;
  transition: transform 160ms ease, box-shadow 160ms ease;
  overflow: hidden;
}

.news-card__body{
  padding: 1.05rem 1.1rem 1rem;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.news-card__head{
  margin-bottom: .6rem;
}

.news-card__actions{
  margin-top: auto;
  display: flex;
  gap: .6rem;
  flex-wrap: wrap;
}

.news-card__image{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
  display: block;
}

.news-card__title{
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.15;
}

.news-card__meta{
  margin: .35rem 0 0;
  font-size: 12px;
  color: rgba(0,59,92,.55);
}

.news-card__text{
  margin: 0 0 .9rem;
  color: rgba(0,59,92,.78);
  line-height: 1.55;
  font-size: 14px;
}

.news-card--featured{
  grid-column: 1;
  grid-row: 1;
  grid-template-columns: 1fr 42%;
  min-height: 380px;
}

.news-row{
  grid-column: 2;
  grid-row: 1;
}

.news-card--small{
  grid-template-columns: 1fr 36%;
  min-height: 0;
}

.news-card--small .news-card__text{
  display: none;
}

/* =========================================================
   PRICE LIST
   ========================================================= */
.price-list{
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(0,59,92,.12);
  border-radius: 12px;
  overflow: hidden;
  margin: .75rem 0 1rem;
}
.price-item{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .85rem 1.1rem;
  background: #fff;
}
.price-item + .price-item{
  border-top: 1px solid rgba(0,59,92,.07);
}
.price-item__label{
  font-size: 14px;
  font-weight: 600;
  color: var(--vsk-dark);
  line-height: 1.4;
}
.price-item__label .muted{
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: rgba(0,59,92,.55);
  margin-top: 1px;
}
.price-item__value{
  font-size: 17px;
  font-weight: 800;
  color: var(--vsk-dark);
  white-space: nowrap;
  flex-shrink: 0;
}

/* =========================================================
   GENERIC CONTENT PANELS
   ========================================================= */
.panel{
  padding: 1rem;
  min-width: 0;
}

.panel--soft{
  background: var(--surface-tint);
}

.org-box,
.member-panel,
.meeting-block{
  padding: 1.1rem 1.2rem;
}

.org-box h2,
.org-box h3,
.member-h2,
.meeting-block__title{
  margin: 0 0 .55rem;
  font-size: 16px;
  font-weight: 800;
}

.member-h2,
.org-box h2,
.org-box h3,
.meeting-block__title{
  color: var(--vsk-dark);
}
.org-box p,
.meeting-help p{
  color: rgba(0,59,92,.75);
  line-height: 1.55;
}
.member-contact{
  margin: .75rem 0 0;
  padding: 0;
  font-size: 13px;
  color: rgba(0,59,92,.72);
  line-height: 1.5;
  background: none;
  border: none;
  border-radius: 0;
}
.member-contact a{
  color: var(--vsk-dark);
  font-weight: 700;
  text-decoration: none;
}
.member-contact a:hover{ text-decoration: underline; }

/* =========================================================
   TABLES
   ========================================================= */
.training-table-wrapper{
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.training-header{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
}

.training-table{
  width: 100%;
  border-collapse: collapse;
  min-width: 640px;
}

.training-table th,
.training-table td{
  padding: 12px;
  border-bottom: 1px solid rgba(0,0,0,.08);
  vertical-align: top;
  font-size: 14px;
}

.training-table th{
  text-align: left;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(0,59,92,.60);
  background: rgba(207,234,247,.35);
}

.training-table tbody tr:hover td{
  background: rgba(0,159,219,.06);
}

.training-table a{
  color: var(--vsk-dark);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* =========================================================
   FORMS
   ========================================================= */
.bug-form,
.contact-form,
.archive-controls{
  display: grid;
  gap: 1rem;
}

.contact-form{
  max-width: 560px;
}

.bug-form label,
.contact-form label,
.archive-controls__field{
  display: grid;
  gap: .4rem;
}

.bug-form input[type="email"],
.bug-form textarea,
.contact-form input,
.contact-form textarea,
.archive-controls__select,
.archive-controls__input{
  width: 100%;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.14);
  background: #fff;
  padding: .85rem .95rem;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}

.bug-form textarea,
.contact-form textarea{
  resize: vertical;
  min-height: 140px;
  line-height: 1.45;
}

.bug-form input:focus,
.bug-form textarea:focus,
.contact-form input:focus,
.contact-form textarea:focus,
.archive-controls__select:focus,
.archive-controls__input:focus{
  border-color: rgba(0,59,92,.35);
  box-shadow: var(--ring);
}

.bug-form button[type="submit"],
.contact-form button[type="submit"],
.submit{
  justify-self: start;
  border: 0;
  border-radius: 12px;
  padding: .8rem 1rem;
  font-weight: 700;
  cursor: pointer;
  background: #111;
  color: #fff;
  box-shadow: 0 10px 20px rgba(0,0,0,.10);
}

.status{
  margin: 0;
  padding: 14px 16px;
  border-radius: 12px;
  background: rgba(16,185,129,.10);
  border: 1px solid rgba(16,185,129,.18);
}

.error{
  margin: 0;
  color: #b42318;
  font-size: 13px;
}

/* =========================================================
   SLIDERS / MEDIA FRAMES
   ========================================================= */
.slider,
.hero-slider,
.gear-slider,
.gear-slider1,
.media-frame{
  width: 100%;
  display: block;
  border-radius: var(--radius);
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(0,59,92,.12);
  box-shadow: var(--shadow);
}

/* Static single-image slider used on news/article pages */
.slider__track{
  display: flex;
  width: 100%;
  line-height: 0;
}
.slider__slide img{
  width: 100%;
  display: block;
  height: auto;
  max-height: 70vh;
  object-fit: contain;
  object-position: center;
  background: #f3f6f8;
}


.slider__slide img{
  width: 100%;
  display: block;
  height: clamp(240px, 40vw, 520px);
  object-fit: cover;
  object-position: center;
}

.post-card__body img,
.slider__slide img{
  margin-left: 12px;
  margin-right: 12px;
  width: calc(100% - 24px);
  border-radius: 12px;
}

.hero-slider__viewport,
.gear-slider__viewport,
.gear-slider1__viewport{
  overflow: hidden;
  line-height: 0;
}

.hero-slider__track,
.gear-slider__track,
.gear-slider1__track{
  display: flex;
  width: 100%;
  transform: translate3d(0,0,0);
  will-change: transform;
}

.hero-slider__slide,
.gear-slider__slide,
.gear-slider1__slide{
  flex: 0 0 100%;
  min-width: 100%;
  line-height: 0;
}

.hero-slider__slide img,
.gear-slider__slide img,
.gear-slider1__slide img{
  width: 100%;
  display: block;
  object-fit: cover;
}

.hero-slider__slide img{
  height: clamp(260px, 42vw, 560px);
}

.gear-slider__slide img{
  height: clamp(240px, 34vw, 520px);
  object-fit: contain;
}

.gear-slider1__slide img{
  height: clamp(240px, 38vw, 520px);
}

.hero-slider__dots,
.gear-slider__dots,
.gear-slider1__dots{
  display: flex;
  justify-content: center;
  gap: 8px;
  padding: 12px 12px 14px;
  background: #fff;
  border-top: 1px solid rgba(0,0,0,.06);
}

.hero-slider__dot,
.gear-slider__dot,
.gear-slider1__dot{
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: rgba(0,0,0,.18);
  border: 0;
  padding: 0;
}

.hero-slider__dot.active,
.gear-slider__dot.is-active,
.gear-slider1__dot.is-active{
  background: rgba(0,59,92,.65);
}

/* =========================================================
   ARCHIVE
   ========================================================= */
.archive-controls{
  display:flex;
  gap:12px;
  align-items:flex-end;
  flex-wrap:wrap;
}

.archive-controls__field{
  min-width:160px;
}

.archive-controls__field--grow{
  flex:1;
  min-width:220px;
}

.archive-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:14px;
  padding:1rem 1.35rem 1.35rem;
}

.archive-item{
  display:flex;
  flex-direction:column;
  min-height:200px;
  transition:transform 160ms ease, box-shadow 160ms ease;
}

.archive-thumb img{
  width:100%;
  height:190px;
  object-fit:cover;
}

.archive-item__meta{
  padding:12px 14px 0;
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}

.archive-item__title{
  padding:8px 14px 0;
  margin:0;
  font-size:16px;
  font-weight:800;
  color: var(--vsk-dark);
}

.archive-item__excerpt{
  padding:10px 14px 0;
  margin:0;
  color:rgba(0,59,92,.70);
  font-size:14px;
  line-height:1.45;
}

.archive-item__actions{
  margin-top:auto;
  padding:12px 14px 14px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.archive-item__fulltext{
  padding: 16px 14px 18px;
  border-top: 1px solid rgba(0,59,92,.08);
  font-size: 14px;
  line-height: 1.65;
  color: var(--vsk-dark);
}
.archive-item__fulltext p{
  margin: 0 0 .85em;
}
.archive-item__fulltext p:last-child{
  margin-bottom: 0;
}
.archive-gallery{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 8px;
  margin-bottom: 14px;
}
.archive-gallery img{
  width: 100%;
  height: 110px;
  object-fit: cover;
  border-radius: 8px;
}

.archive-empty,
.archive-pager{
  padding: .5rem 1.35rem 1.35rem;
}
.archive-pager{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.archive-pager button,
.archive-pager .pager-btn{
  appearance: none;
  border: 1px solid rgba(0,59,92,.18);
  border-radius: 8px;
  background: #fff;
  color: var(--vsk-dark);
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  padding: 6px 14px;
  min-width: 36px;
  cursor: pointer;
  transition: background 140ms ease, border-color 140ms ease, color 140ms ease;
}
.archive-pager button:hover,
.archive-pager .pager-btn:hover{
  background: var(--vsk-dark);
  color: #fff;
  border-color: var(--vsk-dark);
}
.archive-pager button.is-active,
.archive-pager button[aria-current],
.archive-pager .pager-btn.is-active{
  background: var(--vsk-dark);
  color: #fff;
  border-color: var(--vsk-dark);
}

/* =========================================================
   SPONSORS
   ========================================================= */
.section--sponsors{
  width:100%;
  grid-column:1 / -1;
}

.section--sponsors .sponsors,
.section--sponsors .sponsors__inner{
  width:100%;
  max-width:none;
  margin:0;
}

.section--sponsors .sponsors__inner{
  box-sizing:border-box;
  border-radius:var(--radius);
  border:1px solid rgba(0,59,92,.12);
  background:#fff;
  box-shadow:var(--shadow);
  padding:clamp(18px,2.2vw,28px);
  position:relative;
  overflow:hidden;
}

.section--sponsors .sponsors__inner::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height:4px;
  background:linear-gradient(90deg,var(--vsk-dark),var(--vsk-light));
  opacity:.75;
}

/* (consolidated below in VISUAL POLISH) */

.sponsors-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:14px;
  margin:0 0 14px;
}

/* Simplicity: full-row span on desktop, same width as the 3-col row below */
.sponsors-grid .sponsor--simplicity{
  grid-column: 1 / -1;
}

.sponsor{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:84px;
  padding:16px 18px;
  border-radius:16px;
  background:#fff;
  border:1px solid rgba(0,59,92,.12);
  box-shadow:0 10px 26px rgba(0,0,0,.06);
  text-decoration:none;
  transition:transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.sponsor:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 40px rgba(0,0,0,.10);
  border-color:rgba(0,59,92,0.18);
}

.section--sponsors .sponsors__title,
.section--sponsors h2,
.section--sponsors h3{
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0 0 28px;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--vsk-dark);
  white-space: nowrap;
}
.section--sponsors .sponsors__title::before,
.section--sponsors .sponsors__title::after,
.section--sponsors h2::before,
.section--sponsors h2::after{
  content: "";
  flex: 1;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(0,59,92,.30), transparent);
}

.sponsor img{
  width:100%;
  max-width:260px;
  height:54px;
  object-fit:contain;
}

.sponsors__note{
  margin:16px 0 0;
  padding-top:14px;
  border-top:1px solid rgba(0,0,0,.08);
  color:rgba(0,59,92,.70);
  font-size:14px;
  text-align:center;
}

/* =========================================================
   PAGE-SPECIFIC LITE OVERRIDES
   ========================================================= */

.page-training .post-card__more,
.page-training .post-card--strava .post-card__more{
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

.page-training .post-card--strava iframe{
  width: 100% !important;
  border: 0 !important;
  display: block !important;
}

.page-training .post-card--page .post-card__title{
  font-size: clamp(22px, 2.8vw, 32px);
  line-height: 1.1;
  margin-bottom: 6px;
}

.page-training .post-card--page .post-card__head{
  position: relative;
  padding: 1.35rem 1.45rem 1.2rem;
  min-height: 165px;
}

.page-training .season-toggle{
  position: absolute;
  top: 1.2rem;
  right: 1.45rem;
  z-index: 3;

  display: inline-flex;
  gap: 8px;
  padding: 4px;
  margin: 0;

  background: rgba(255,255,255,0.88);
  border: 1px solid rgba(0,0,0,0.10);
  border-radius: 999px;
  box-shadow: 0 4px 14px rgba(0,0,0,0.06);
}

.page-training .post-card--page{
  overflow: visible;
}

.page-training .season-toggle__btn{
  appearance: none;
  border: 0;
  background: transparent;
  color: rgba(0,59,92,0.68);

  border-radius: 999px;
  padding: 9px 14px;
  min-height: 36px;

  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;

  transition: background 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.page-training .maincontent{
  gap: 28px;
  margin-top: 22px;
}

.page-training .season-toggle__btn:hover{
  background: rgba(255,255,255,0.7);
  color: rgba(0,59,92,0.85);
}

.page-training .season-toggle__btn.is-active,
.page-training .season-toggle__btn[aria-pressed="true"]{
  background: #fff;
  color: var(--vsk-dark);
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.page-training .post-card--page{
  margin-bottom: 34px;
}

.page-training .maincontent{
  gap: 28px;
  margin-top: 22px;
}

.page-training .post-card--page .post-card__head{
  position: relative;
  padding: 1.35rem 1.45rem 1.15rem;
  min-height: 128px;
}

.page-training .post-card--page .post-card__title{
  font-size: clamp(22px, 2.8vw, 32px);
  line-height: 1.08;
  margin-bottom: 6px;
  color: var(--vsk-dark);
}

.page-training .season-toggle{
  position: absolute;
  top: 1.2rem;
  right: 1.45rem;
  z-index: 3;

  display: inline-flex;
  gap: 8px;
  padding: 4px;
  margin: 0;

  background: rgba(255,255,255,0.94);
  border: 1px solid rgba(0,0,0,0.10);
  border-radius: 999px;
  box-shadow: 0 4px 14px rgba(0,0,0,0.06);
}

.page-training .season-toggle__btn{
  appearance: none;
  border: 0;
  background: transparent;
  color: rgba(0,59,92,0.68);
  border-radius: 999px;
  padding: 9px 14px;
  min-height: 36px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  transition: background 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.page-training .season-toggle__btn:hover{
  background: rgba(255,255,255,0.7);
  color: rgba(0,59,92,0.85);
}

.page-training .season-toggle__btn.is-active,
.page-training .season-toggle__btn.active,
.page-training .season-toggle__btn[aria-pressed="true"]{
  background: #fff;
  color: var(--vsk-dark);
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

@media (max-width: 700px){
  .page-training .post-card--page .post-card__head{
    min-height: auto;
    padding: 1.05rem 1.05rem .95rem;
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .page-training .season-toggle{
    position: static;
    align-self: flex-start;
    order: 2;
  }

  .page-training .post-card--page .post-card__meta{
    max-width: none;
  }

  .page-training .maincontent{
    gap: 18px;
    margin-top: 18px;
  }
}

/* Styret */
.page--styret .board-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:14px;
  margin-top:1rem;
}

.page--styret .board-card{
  width:100%;
  display:flex;
  flex-direction:column;
  padding:14px 14px 12px;
}
.board-card__name{
  margin: 0 0 2px;
  font-size: 16px;
  font-weight: 800;
  color: var(--vsk-dark);
}
.board-card__role{
  font-size: 13px;
  font-weight: 600;
  color: rgba(0,59,92,.65);
  margin: 0;
}
.board-link{
  font-size: 13px;
  font-weight: 600;
  color: var(--vsk-dark);
  text-decoration: none;
}
.board-link:hover{
  text-decoration: underline;
}
.board-dot{
  color: rgba(0,59,92,.35);
}

.page--styret .board-card__contact{
  margin-top:auto;
  padding-top:10px;
  border-top:1px solid rgba(0,59,92,.08);
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

/* Møter */
.page--moter .meeting-head,
.page--arsmote .meeting-head{
  padding: 1.35rem 1.45rem 1.1rem;
}
.page--moter .meeting-head p,
.page--moter .meeting-head h1,
.page--arsmote .meeting-head p,
.page--arsmote .meeting-head h1{
  color: var(--vsk-dark);
}
.page--moter .meeting-list{
  padding: 1.25rem 1.9rem 1.6rem;
  display: grid;
  gap: 18px;
}

.page--moter .meeting-year{
  margin: 0;
  border-bottom: 1px;
}

.page--moter .meeting-year{
  margin: 0;
  border-bottom: 1px solid rgba(0,59,92,.08);
  background: rgba(255,255,255,.80);
}

.page--moter .meeting-year:last-child{
  border-bottom: 0;
}

.page--moter .meeting-year__summary{
  list-style: none;
  cursor: pointer;
  padding: 14px 16px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
  user-select: none;
}

.page--moter .meeting-year__summary::-webkit-details-marker{
  display: none;
}

.page--moter .meeting-year__summary::after{
  content: "▾";
  font-size: 14px;
  opacity: .7;
  transition: transform 180ms ease, opacity 180ms ease;
}

.page--moter details[open] > .meeting-year__summary::after{
  transform: rotate(180deg);
  opacity: 1;
}

.page--moter .meeting-year__title{
  font-weight: 750;
  color: rgba(0,59,92,.86);
}

.page--moter .meeting-year__hint{
  font-size: 13px;
  color: rgba(0,59,92,.55);
  white-space: nowrap;
}

.page--moter .meeting-year__summary:hover{
  background: rgba(0,159,219,.06);
}

.page--moter .meeting-files{
  margin: 0;
  padding: 0 16px 14px 16px;
  list-style: none;
  display: grid;
  gap: 10px;
}

.page--moter .meeting-files li{
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(0,59,92,.12);
  background: #fff;
  box-shadow: 0 1px 0 rgba(0,0,0,.02);
}

.page--moter .file-link{
  color: var(--vsk-dark);
  font-weight: 700;
  text-decoration: none;
}

.page--moter .file-link:hover{
  text-decoration: underline;
}

.page--moter .meeting-help{
  padding: 0 1.9rem 1.7rem;
  border-top: 1px solid rgba(0,0,0,.06);
}

.page--moter .meeting-help p{
  margin: 0;
  color: rgba(0,59,92,.65);
  font-size: 14px;
}

/* Lovnorm */
.page--lovnorm .page-card{
  width: 100%;
  max-width: none;
}
.page--lovnorm .page-card__head,
.page--lovnorm .page-card > header{
  padding: 1.35rem 1.45rem 1.1rem;
}
.page--lovnorm .page-card > .page-body{
  padding: 1.1rem 1.45rem 1.6rem;
}

.page--lovnorm .doc-box{
  margin-top: 1.1rem;
  border-radius: 16px;
  border: 1px solid rgba(0,59,92,.12);
  background: var(--surface-tint);
  box-shadow: var(--card-shadow);
  overflow: hidden;
}

.page--lovnorm .doc-box__head{
  padding: 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  border-bottom: 1px solid rgba(0,59,92,.08);
  background: rgba(255,255,255,.55);
}

.page--lovnorm .doc-box__title{
  margin: 0;
  font-size: 16px;
  font-weight: 800;
}

.page--lovnorm .pdf-embed iframe{
  width: 100%;
  height: min(72vh, 760px);
  display: block;
  border: 0;
  background: #fff;
}

.page--lovnorm .doc-box__fallback{
  margin: 0;
  padding: .85rem 1rem 1rem;
  font-size: 13px;
  color: rgba(0,59,92,.60);
  border-top: 1px solid rgba(0,0,0,.06);
  background: rgba(255,255,255,.55);
}

/* Grasrot */
.page--grasrot .org-head,
.page--grasrot .org-top{
  padding: 1.35rem 1.45rem 1.1rem;
  color: var(--vsk-dark);
}
.page--grasrot .org-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
  align-items: stretch;
  padding: 0 1.45rem 1.45rem;
}

.page--grasrot .org-box{
  height: 100%;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.page--grasrot .org-box > :last-child{
  margin-top: auto;
}

.page--grasrot .org-tags{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: .85rem;
}

.page--grasrot .org-tags span{
  font-size: 12px;
  font-weight: 800;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.10);
  background: #fff;
}

.page--grasrot .grasrot-iframe{
  margin-top: .35rem;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.10);
}

.page--grasrot .grasrot-iframe iframe{
  display: block;
  width: 100%;
  border: 0;
}

/* Bli medlem */
.page--bli-medlem .member-grid{
  display: grid;
  grid-template-columns: 1.15fr .95fr;
  gap: 14px;
  align-items: stretch;
  margin-top: 1.1rem;
}

.page--bli-medlem .price-row{
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: .85rem .9rem;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 14px;
  background: rgba(0,0,0,.02);
  margin: .65rem 0;
}

.page--bli-medlem .price{
  font-weight: 800;
  white-space: nowrap;
}

/* Klubbhistorie */
.page-klubbhistorie .page-card{
  width: 100%;
  max-width: none;
}
.page-klubbhistorie .page-body,
.page--lovnorm .page-body,
.page--grasrot .page-body{
  padding: 1.35rem 1.45rem 1.6rem;
  color: var(--vsk-dark);
}
.page-body h2, .page-body h3, .page-body h4{
  color: var(--vsk-dark);
}
.page-body p, .page-body li{
  color: rgba(0,59,92,.82);
}
.page-klubbhistorie .page-body p{
  margin: 0 0 .85rem;
  line-height: 1.7;
  max-width: 82ch;
}

.page-klubbhistorie .list{
  margin: .35rem 0 1rem;
  padding-left: 1.2rem;
  max-width: 70ch;
}

.page-klubbhistorie .list li{
  margin: .25rem 0;
  line-height: 1.55;
}

/* Mobile */
@media (max-width: 1100px){
  .news-grid{
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }
  /* Reset explicit placements set for wide layout */
  .news-card--featured{
    grid-column: auto;
    grid-row: auto;
  }
  .news-row{
    grid-column: auto;
    grid-row: auto;
    grid-template-columns: repeat(3, minmax(0,1fr));
    grid-template-rows: auto;
    gap: 1rem;
  }

  .archive-grid,
  .page--styret .board-grid,
  .page--grasrot .org-grid{
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}

@media (max-width: 900px){
  .maincontent,
  .news-card,
  .news-card--featured,
  .news-card--small,
  .page--bli-medlem .member-grid{
    grid-template-columns: 1fr;
  }

  .news-card__image{
    height: 240px;
    border-radius: 0;
  }

  .news-card--featured .news-card__image{
    height: 300px;
  }

  .training-table{
    min-width: 0;
  }

  .training-table thead{
    display: none;
  }

  .training-table,
  .training-table tbody,
  .training-table tr,
  .training-table td{
    display: block;
    width: 100%;
  }

  .training-table tr{
    padding: 10px 10px 2px;
    border-bottom: 1px solid rgba(0,0,0,.08);
  }

  .training-table td{
    padding: 10px 8px;
    border-bottom: 1px solid rgba(0,0,0,.08);
  }

  .training-table td::before{
    content: attr(data-label);
    display: block;
    font-size: 11px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: rgba(0,59,92,.55);
    margin-bottom: 4px;
  }
}

@media (max-width: 700px){
  .layout-wrap,
  .section__inner{
    padding-left: 14px;
    padding-right: 14px;
  }

  .page-section,
  .section--content{
    padding-top: 14px;
    padding-bottom: 18px;
  }

  .page-card__head,
  .post-card__head,
  .archive-card__head,
  .surface-card__head{
    padding: 1.05rem 1.05rem .85rem;
  }

  .page-card__body,
  .post-card__body,
  .surface-card__body{
    padding: 1rem 1.05rem 1.05rem;
  }

  .sponsors-grid{
    grid-template-columns: repeat(2, minmax(0,1fr));
  }

  /* Simplicity flows as normal 2-col item on mobile */
  .sponsors-grid .sponsor--simplicity{
    grid-column: auto;
    max-width: none;
    margin: 0;
  }

  .content-grid--2,
  .content-grid--3,
  .news-row,
  .archive-grid,
  .page--styret .board-grid,
  .page--grasrot .org-grid{
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }

  .page--moter .meeting-list{
    padding: 1rem 1.05rem 1.1rem;
    gap: 14px;
  }

  .page--moter .meeting-year__summary{
    padding: 12px 12px;
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .page--moter .meeting-year__hint{
    white-space: normal;
  }

  .page--moter .meeting-files{
    padding: 0 12px 12px 12px;
  }

  .page--moter .meeting-help{
    padding: 0 1.05rem 1.15rem;
  }

  .page--lovnorm .pdf-embed iframe{
    height: 62vh;
  }

  .bug-form button[type="submit"],
  .contact-form button[type="submit"]{
    width: 100%;
    justify-self: stretch;
    text-align: center;
  }
}

/* =========================================================
   VISUAL POLISH
   ========================================================= */

/* Featured card glow — adds a subtle brand-coloured aura */
.card--glow{
  box-shadow:
    var(--shadow),
    0 0 0 1.5px rgba(0,159,219,0.10),
    0 0 32px rgba(0,159,219,0.07);
  transition: transform 160ms ease, box-shadow 160ms ease;
}
.card--glow:hover{
  transform: translateY(-3px);
  box-shadow:
    var(--shadow-hover),
    0 0 0 2px rgba(0,159,219,0.16),
    0 0 48px rgba(0,159,219,0.10);
}

/* Submit / form buttons — brand blue instead of stark black */
.bug-form button[type="submit"],
.contact-form button[type="submit"],
.submit{
  background: var(--vsk-dark);
  transition: background 160ms ease, box-shadow 160ms ease;
}
.bug-form button[type="submit"]:hover,
.contact-form button[type="submit"]:hover,
.submit:hover{
  background: #005f8f;
  box-shadow: 0 12px 24px rgba(0,59,92,0.22);
}

/* Section spacing — a little more breathing room */
.page-section,
.section--content{
  padding-top: 32px;
  padding-bottom: 24px;
}

/* (news-grid gap set in layout definition above) */

/* Bli-med fineprint */
.fineprint{
  margin-top: 1.1rem;
  font-size: 12px;
  color: rgba(0,59,92,.55);
  line-height: 1.5;
}

/* Bli-medlem: space between CTA buttons */
.member-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 12px !important;
  margin-top: 1.25rem;
}

/* Smoother card transitions */
.post-card,
.archive-item,
.board-card,
.news-card{
  transition: transform 200ms ease, box-shadow 200ms ease;
}

/* Sponsor hover — slightly stronger lift */
.sponsor:hover{
  transform: translateY(-3px);
  box-shadow: 0 20px 44px rgba(0,0,0,0.12);
  border-color: rgba(0,59,92,0.20);
}





/* =========================================================
   SPANIA FACTS — compact info strip on the featured card
   ========================================================= */
.spania-facts{
  list-style: none;
  margin: .75rem 0 .5rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.spania-facts li{
  font-size: 13px;
  color: rgba(0,59,92,.80);
  line-height: 1.5;
  padding: 6px 10px;
  background: rgba(0,59,92,.05);
  border-left: 3px solid var(--vsk-dark);
  border-radius: 0 8px 8px 0;
}
.spania-facts a{
  color: var(--vsk-dark);
  font-weight: 700;
}
.spania-facts__label{
  display: inline-block;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--vsk-dark);
  margin-right: 6px;
  opacity: .75;
}

/* Sponsors: single column on very small screens */
@media (max-width: 480px){
  .sponsors-grid{
    grid-template-columns: 1fr;
  }
}

/* Archive placeholder image (no photo available) */
.archive-thumb--placeholder img{
  object-fit: fill;
  background: #e8f0f7;
}

.hero{
  position: relative;
  width: 100%;
  min-height: clamp(420px, 52vw, 700px);
  overflow: hidden;
  margin: 0;
}

.hero--fullbleed{
  width: 100%;
  margin: 0;
}

.hero__bg{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  z-index: 0;
  opacity: 0;
  transition: opacity 1s ease;
}

.hero__bg.is-active{
  opacity: 1;
}

.hero::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    90deg,
    rgba(0,37,64,0.80) 0%,
    rgba(0,37,64,0.52) 36%,
    rgba(0,37,64,0.20) 72%,
    rgba(0,37,64,0.06) 100%
  );
}

.hero__inner{
  position: relative;
  z-index: 2;
  min-height: inherit;
  width: 100%;
  max-width: min(720px, 56vw);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  text-align: left;
  padding: 0 clamp(24px, 6vw, 88px);
}

.hero__kicker{
  margin: 0 0 .8rem;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.hero__title{
  margin: 0 0 .9rem;
  color: #fff;
  font-size: clamp(34px, 5vw, 72px);
  line-height: 1.01;
  font-weight: 400;
  text-transform: uppercase;
  max-width: 10ch;
}

.hero__lead{
  margin: 0 0 1.4rem;
  color: rgba(255,255,255,.95);
  font-size: clamp(16px, 1.4vw, 22px);
  line-height: 1.45;
  max-width: 28ch;
}

.hero__actions{
  display: flex;
  gap: .8rem;
  flex-wrap: wrap;
}

.hero .btn--ghost{
  color: #fff;
  border-color: rgba(255,255,255,.6);
  background: transparent;
}

.hero .btn--ghost:hover{
  background: rgba(255,255,255,.14);
}

.hero .btn:not(.btn--ghost){
  background: #fff;
  color: var(--vsk-dark);
  border-color: #fff;
  font-weight: 700;
}

.hero .btn:not(.btn--ghost):hover{
  background: rgba(255,255,255,.92);
}

@media (max-width: 900px){

  .hero{
    min-height: clamp(420px, 72svh, 640px);
  }

  .hero::before{
    background: linear-gradient(
      180deg,
      rgba(0,37,64,0.16) 0%,
      rgba(0,37,64,0.34) 35%,
      rgba(0,37,64,0.74) 100%
    );
  }

  .hero__inner{
    max-width: none;

    /* SAME alignment as desktop */
    justify-content: center;
    align-items: center;

    text-align: center;

    /* equal breathing room top + bottom */
    padding: clamp(50px,8vw,80px) 15px;
  }

  .hero__kicker{
    font-size: 10px;
    letter-spacing: .14em;
    margin-bottom: .65rem;
  }

  .hero__title{
    max-width: none;
    white-space: nowrap;
    font-size: clamp(22px,6vw,34px);
    line-height: 1.05;
    margin-bottom: .75rem;
  }

  .hero__lead{
    max-width: none !important;
    white-space: nowrap;
    font-size: clamp(13px, 3.2vw, 17px);
    line-height: 1.3;
    margin: 0 0 1rem;
  }

  .hero__actions{
    width: 100%;
    flex-direction: column;
    align-items: center;
    gap: .65rem;
  }

  .hero__actions .btn{
    width: min(100%,280px);
    min-height: 46px;
    font-size: 14px;
  }

  .hero::after{
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;

    /* subtle blue wash */
    background: rgba(0,37,64,0.35);

    pointer-events: none;
  }


}


.header__logo{
  display: flex;
  align-items: center;
}

.header__logo img{
  height: 56px;
  width: auto;
  display: block;
}


@media (max-width: 900px) {

  .header__logo {
    display: flex;
    align-items: center;
  }

  .header__logo img {
    height: 40px;
    margin-bottom:7px;
    margin-top: 9px;
    width: auto;
    display: block;
  }

}

.post-card .slider,
.page-card .slider{
  background: transparent;
  border: 0;
  box-shadow: none;
  border-radius: 0;
}

.article-image{
  margin: 1.2rem 20px 1.8rem;
}

.article-image img{
  width: 850px;
  height: auto;
  display: block;
  border-radius: 18px;
}

