/* ============ CONFIG NOTE ============
     Every "Go to" button below points to the club's Clubforce hub.
     If Clubforce gives you a direct link for a specific service
     (e.g. a membership sign-up page), just replace that one href
     in the HTML further down — search for data-service="...".
     ======================================= */

  :root{
    --ink:        #0E2447;
    --blue:       #1B3E73;
    --blue-light: #3E6DB5;
    --stone:      #9DA1A6;
    --paper:      #F2F4EF;
    --white:      #FFFFFF;
    --maroon:     #C9A227;
    --maroon-light: #C9A227;
    --line:       rgba(14,36,71,0.14);
    --max: 1120px;
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth; scroll-padding-top:96px;}
  body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:'Inter',sans-serif;
    font-size:16px;
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,.display{
    font-family:'Oswald',sans-serif;
    font-weight:600;
    line-height:1.05;
    margin:0;
    letter-spacing:0.2px;
  }
  a{color:inherit;text-decoration:none;}
  img{max-width:100%;display:block;}
  .wrap{max-width:var(--max);margin:0 auto;padding:0 24px;}
  .visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}

  @media (prefers-reduced-motion: reduce){
    *{animation:none !important; transition:none !important;}
  }

  /* ---------- Header ---------- */
  header{
    position:sticky; top:0; z-index:50;
    background:var(--ink);
    border-bottom:3px solid var(--maroon);
  }
  .nav{
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 24px;
    max-width:var(--max); margin:0 auto;
  }
  .brand{display:flex; align-items:center; gap:12px;}
  .crest{width:44px;height:auto;flex-shrink:0;}
  .brand-text{color:var(--white);}
  .brand-text .name{font-family:'Oswald',sans-serif;font-weight:600;font-size:1.15rem;letter-spacing:0.4px;}
  .brand-text .sub{font-size:0.72rem;color:rgba(255,255,255,0.65);}
  nav.links{display:flex; gap:28px;}
  nav.links a{
    color:rgba(255,255,255,0.85);
    font-size:0.94rem;
    padding:6px 2px;
    border-bottom:2px solid transparent;
  }
  nav.links a:hover{border-bottom-color:var(--maroon); color:var(--white);}
  .nav-cta{
    background:var(--maroon); color:var(--ink); font-weight:600;
    padding:9px 18px; font-size:0.9rem; border-radius:2px;
  }
  .nav-cta:hover{background:#dab53a;}
  .menu-btn{display:none; background:none; border:0; color:var(--white); font-size:1.6rem; cursor:pointer;}

  @media (max-width:860px){
    nav.links{
      position:absolute; top:100%; left:0; right:0;
      background:var(--ink); flex-direction:column; gap:0;
      max-height:0; overflow:hidden; transition:max-height 0.25s ease;
      border-bottom:3px solid var(--maroon);
    }
    nav.links.open{max-height:420px;}
    nav.links a{padding:14px 24px; border-bottom:1px solid rgba(255,255,255,0.08);}
    .nav-cta{margin:14px 24px 18px;}
    .menu-btn{display:block;}
  }

  /* ---------- Hero ---------- */
  .hero{
    position:relative;
    background:var(--ink);
    color:var(--white);
    overflow:hidden;
  }
  .hero .wrap{
    position:relative;
    display:grid;
    grid-template-columns:1.15fr 0.85fr;
    align-items:center;
    gap:40px;
    padding:76px 24px 88px;
    z-index:2;
  }
  .hero-eyebrow{
    color:var(--maroon-light);
    font-size:0.92rem;
    font-weight:500;
    margin-bottom:14px;
  }
  .hero h1{
    font-size:clamp(2.6rem, 5.4vw, 4.3rem);
    text-transform:uppercase;
    color:var(--white);
  }
  .hero h1 span{display:block; color:var(--blue-light);}
  .hero p.lede{
    margin-top:20px;
    max-width:46ch;
    color:rgba(255,255,255,0.82);
    font-size:1.08rem;
  }
  .hero p.motto{
    margin-top:12px;
    max-width:46ch;
    color:var(--maroon-light);
    font-size:0.92rem;
    font-style:italic;
  }
  .hero-actions{display:flex; gap:14px; margin-top:32px; flex-wrap:wrap;}
  .btn{
    display:inline-flex; align-items:center; gap:8px;
    padding:13px 24px; font-size:0.96rem; font-weight:600;
    border-radius:2px; border:2px solid transparent; cursor:pointer;
  }
  .btn-primary{background:var(--maroon); color:var(--ink);}
  .btn-primary:hover{background:#dab53a;}
  .btn-ghost{border-color:rgba(255,255,255,0.5); color:var(--white);}
  .btn-ghost:hover{border-color:var(--white); background:rgba(255,255,255,0.08);}

  .hero-art{
    position:relative; width:100%; max-width:340px; margin:0 auto;
    opacity:0; transform:translateY(14px); animation:riseIn 0.7s ease 0.15s forwards;
  }
  .hoop-bg{width:100%; display:block;}
  .hero-crest{
    position:absolute; top:50%; left:50%;
    transform:translate(-50%,-50%);
    width:62%;
    filter:drop-shadow(0 10px 26px rgba(0,0,0,0.45));
  }
  .hero h1, .hero p.lede, .hero p.motto, .hero-actions{opacity:0; transform:translateY(14px); animation:riseIn 0.6s ease forwards;}
  .hero h1{animation-delay:0.05s;}
  .hero p.lede{animation-delay:0.18s;}
  .hero p.motto{animation-delay:0.26s;}
  .hero-actions{animation-delay:0.3s;}
  @keyframes riseIn{to{opacity:1; transform:translateY(0);}}

  @media (max-width:860px){
    .hero .wrap{grid-template-columns:1fr; padding-top:52px;}
    .hero-art{max-width:220px; margin-top:20px;}
  }

  /* ---------- Section scaffolding ---------- */
  section{padding:76px 0;}
  .section-head{max-width:640px; margin-bottom:44px;}
  .section-head h2{font-size:clamp(1.7rem,3vw,2.3rem); text-transform:uppercase;}
  .section-head p{margin-top:12px; color:rgba(14,36,71,0.72); font-size:1.02rem;}
  .rule{height:1px; background:var(--line); border:0; margin:0;}

  /* ---------- Services hub ---------- */
  .hub{background:var(--white);}
  .service-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:1px;
    background:var(--line);
    border:1px solid var(--line);
  }
  @media (max-width:860px){ .service-grid{grid-template-columns:repeat(2,1fr);} }
  @media (max-width:560px){ .service-grid{grid-template-columns:1fr;} }

  .service-tile{
    background:var(--white);
    padding:30px 26px 26px;
    display:flex; flex-direction:column; gap:14px;
    border-top:4px solid var(--blue);
    transition:background 0.18s ease;
  }
  .service-tile:hover{background:var(--paper);}
  .service-tile .icon{
    width:40px; height:40px; color:var(--blue);
  }
  .service-tile h3{font-size:1.15rem; text-transform:uppercase;}
  .service-tile p{font-size:0.94rem; color:rgba(14,36,71,0.7); flex-grow:1;}
  .service-tile .go{
    display:inline-flex; align-items:center; gap:6px;
    font-family:'Oswald',sans-serif; font-weight:600; font-size:0.9rem;
    color:var(--blue); margin-top:4px;
  }
  .service-tile .go svg{width:14px; height:14px; transition:transform 0.15s ease;}
  .service-tile:hover .go svg{transform:translateX(4px);}

  .hub-note{
    margin-top:22px; font-size:0.88rem; color:rgba(14,36,71,0.55);
  }

  /* ---------- About ---------- */
  .about{background:var(--paper);}
  .about .wrap{display:grid; grid-template-columns:1.3fr 0.9fr; gap:56px;}
  @media (max-width:860px){ .about .wrap{grid-template-columns:1fr; gap:36px;} }
  .about h2{font-size:clamp(1.7rem,3vw,2.3rem); text-transform:uppercase;}
  .about p{margin-top:16px; color:rgba(14,36,71,0.78); max-width:62ch;}
  .facts{background:var(--white); border:1px solid var(--line); padding:28px;}
  .facts dl{margin:0;}
  .facts .row{display:flex; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid var(--line);}
  .facts .row:last-child{border-bottom:0;}
  .facts dt{color:rgba(14,36,71,0.6); font-size:0.9rem;}
  .facts dd{margin:0; font-weight:600; text-align:right;}

  /* ---------- Facebook feed ---------- */
  .facebook{background:var(--paper);}
  .fb-embed-wrap{
    max-width:500px;
    overflow:hidden;
    background:var(--white);
    border:1px solid var(--line);
  }
  .fb-page, .fb-page iframe, .fb-page span{
    width:100% !important;
  }

  /* ---------- Contact / footer ---------- */
  .contact{background:var(--ink); color:var(--white);}
  .contact .wrap{display:grid; grid-template-columns:1.2fr 1fr; gap:48px;}
  @media (max-width:860px){ .contact .wrap{grid-template-columns:1fr;} }
  .contact h2{color:var(--white); text-transform:uppercase; font-size:clamp(1.6rem,3vw,2.1rem);}
  .contact p{color:rgba(255,255,255,0.75); margin-top:14px; max-width:50ch;}
  .contact-list{margin-top:24px; display:flex; flex-direction:column; gap:10px;}
  .contact-list a{color:var(--white); border-bottom:1px solid rgba(255,255,255,0.25); padding-bottom:2px; width:fit-content;}
  .contact-list a:hover{border-color:var(--maroon-light); color:var(--maroon-light);}
  .contact-list .contact-label{
    font-size:0.8rem; text-transform:uppercase; letter-spacing:0.4px;
    color:rgba(255,255,255,0.5); margin-top:6px;
  }
  .map-embed{
    margin-top:20px;
    border:1px solid rgba(255,255,255,0.18);
    border-radius:2px;
    overflow:hidden;
    line-height:0;
  }

  footer{background:var(--ink); border-top:1px solid rgba(255,255,255,0.14); padding:26px 0;}
  footer .wrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;}
  .footer-brand{display:flex; align-items:center; gap:12px;}
  footer p{color:rgba(255,255,255,0.5); font-size:0.82rem; margin:0;}
  footer a{color:rgba(255,255,255,0.6);}
  footer a:hover{color:var(--maroon-light);}

  /* ---------- Sponsors page ---------- */
  .sponsors-hero{background:var(--ink); color:var(--white); padding:76px 0 56px;}
  .sponsors-hero .hero-eyebrow{color:var(--gold); font-size:0.92rem; font-weight:500; margin-bottom:14px;}
  .sponsors-hero h1{
    font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase;
    font-size:clamp(2.2rem,4.6vw,3.2rem); color:var(--white); margin:0;
  }
  .sponsors-hero .lede{margin-top:18px; max-width:64ch; color:rgba(255,255,255,0.82); font-size:1.04rem;}

  .sponsors-grid-section{background:var(--white); padding:64px 0 76px;}
  .sponsor-row{display:grid; gap:20px; margin-bottom:20px;}
  .sponsor-row-large{grid-template-columns:repeat(2,1fr);}
  .sponsor-row-medium{grid-template-columns:repeat(4,1fr);}
  .sponsor-row-small{grid-template-columns:repeat(5,1fr);}

  .sponsor-tile{
    background:var(--paper);
    border:1px solid var(--line);
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:10px; text-align:center;
    transition:border-color 0.15s ease, background 0.15s ease;
  }
  .sponsor-tile:hover{border-color:var(--blue); background:var(--white);}
  .sponsor-tile.large{aspect-ratio:16/7; padding:24px;}
  .sponsor-tile.medium{aspect-ratio:4/3; padding:18px;}
  .sponsor-tile.small{aspect-ratio:1/1; padding:12px;}

  .sponsor-logo-placeholder{color:rgba(14,36,71,0.28);}
  .sponsor-tile.large .sponsor-logo-placeholder svg{width:56px; height:56px;}
  .sponsor-tile.medium .sponsor-logo-placeholder svg{width:38px; height:38px;}
  .sponsor-tile.small .sponsor-logo-placeholder svg{width:26px; height:26px;}

  .sponsor-label{
    font-family:'Oswald',sans-serif; font-weight:500; text-transform:uppercase;
    letter-spacing:0.4px; color:rgba(14,36,71,0.45); margin:0;
  }
  .sponsor-tile.large .sponsor-label{font-size:0.9rem;}
  .sponsor-tile.medium .sponsor-label{font-size:0.78rem;}
  .sponsor-tile.small .sponsor-label{font-size:0.66rem;}

  .sponsors-note{
    margin-top:32px; font-size:0.94rem; color:rgba(14,36,71,0.7); text-align:center;
  }
  .sponsors-note a{color:var(--blue); border-bottom:1px solid currentColor;}

  @media (max-width:860px){
    .sponsor-row-large{grid-template-columns:1fr;}
    .sponsor-row-medium{grid-template-columns:repeat(2,1fr);}
    .sponsor-row-small{grid-template-columns:repeat(2,1fr);}
  }
  @media (max-width:480px){
    .sponsor-row-medium{grid-template-columns:1fr 1fr;}
    .sponsor-row-small{grid-template-columns:1fr 1fr;}
  }

  /* ---------- Committee / org chart page ---------- */
  .committee-hero{background:var(--ink); color:var(--white); padding:76px 0 20px;}
  .committee-hero .hero-eyebrow{color:var(--maroon-light); font-size:0.92rem; font-weight:500; margin-bottom:14px;}
  .committee-hero h1{
    font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase;
    font-size:clamp(2.2rem,4.6vw,3.2rem); color:var(--white); margin:0;
  }
  .committee-hero .lede{margin-top:18px; max-width:64ch; color:rgba(255,255,255,0.82); font-size:1.04rem;}

  .committee-grid-section{background:var(--white); padding:16px 0 76px;}

  .committee-table-wrap{
    border:1px solid var(--line);
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }

  .committee-table{
    width:100%;
    border-collapse:collapse;
    background:var(--paper);
  }

  .committee-table thead tr{
    background:var(--ink);
    border-left:4px solid var(--maroon);
  }
  .committee-table th{
    text-align:left;
    padding:14px 20px;
    font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase;
    letter-spacing:0.4px; font-size:0.82rem; color:rgba(255,255,255,0.75);
    white-space:nowrap;
  }

  .committee-table tbody tr{
    border-left:4px solid var(--blue);
    border-bottom:1px solid var(--line);
    transition:background 0.15s ease, border-left-color 0.15s ease;
  }
  .committee-table tbody tr:nth-child(even){background:var(--white);}
  .committee-table tbody tr:last-child{border-bottom:0;}
  .committee-table tbody tr:hover{background:rgba(14,36,71,0.06); border-left-color:var(--maroon);}

  .committee-table td{
    text-align:left;
    padding:14px 20px;
    font-size:0.95rem;
    color:rgba(14,36,71,0.8);
    vertical-align:middle;
    border-right:1px solid var(--line);
  }
  .committee-table td:last-child{border-right:0;}
  .committee-table td:first-child{
    font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase;
    letter-spacing:0.3px; font-size:0.92rem; color:var(--ink);
  }

  @media (max-width:640px){
    .committee-table th, .committee-table td{padding:12px 14px; font-size:0.85rem;}
    .committee-table td:first-child{font-size:0.82rem;}
  }

  .committee-note{
    margin-top:36px; font-size:0.94rem; color:rgba(14,36,71,0.7); text-align:center;
  }
  .committee-note a{color:var(--blue); border-bottom:1px solid currentColor;}

  .volunteer-callout{
    margin-top:36px;
    background:var(--ink);
    border-left:4px solid var(--maroon);
    padding:24px 28px;
    text-align:center;
  }
  .volunteer-callout p{
    margin:0; color:var(--white); font-size:1.05rem; font-weight:500;
  }
  .volunteer-callout a{
    color:var(--maroon-light); font-weight:700;
    border-bottom:1px solid currentColor; padding-bottom:1px;
  }
  .volunteer-callout a:hover{color:#dab53a;}

  /* ---------- Members area ---------- */
  .members-hero{background:var(--ink); color:var(--white); padding:76px 0 28px;}
  .members-hero .hero-eyebrow{color:var(--maroon-light); font-size:0.92rem; font-weight:500; margin-bottom:14px;}
  .members-hero h1{
    font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase;
    font-size:clamp(2.2rem,4.6vw,3.2rem); color:var(--white); margin:0;
  }
  .members-hero .lede{margin-top:18px; max-width:64ch; color:rgba(255,255,255,0.82); font-size:1.04rem;}

  .members-section{background:var(--white); padding:28px 0 76px; min-height:50vh;}
  .members-hero .wrap, .members-section .wrap{max-width:1360px;}

  .members-bar{
    display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap;
    border-bottom:1px solid var(--line); margin-bottom:24px;
  }
  .members-tabs{display:flex; gap:24px; flex-wrap:wrap;}
  .members-tabs a{
    padding:10px 2px; font-weight:600; font-size:0.94rem; color:rgba(14,36,71,0.6);
    border-bottom:3px solid transparent; margin-bottom:-1px;
  }
  .members-tabs a:hover{color:var(--ink);}
  .members-tabs a.active{color:var(--ink); border-bottom-color:var(--maroon);}
  .members-signout{display:flex; align-items:center; gap:12px; margin:0; font-size:0.88rem; color:rgba(14,36,71,0.65);}

  .btn-small{
    font:inherit; font-size:0.84rem; font-weight:600; cursor:pointer;
    padding:6px 12px; border-radius:2px; border:1px solid var(--line);
    background:var(--white); color:var(--ink);
  }
  .btn-small:hover{border-color:var(--blue); color:var(--blue);}
  .btn-small.danger{color:#9b1c1c; border-color:rgba(155,28,28,0.35);}
  .btn-small.danger:hover{background:#9b1c1c; color:var(--white); border-color:#9b1c1c;}

  .members-flash{padding:12px 16px; margin-bottom:12px; border-left:4px solid var(--blue); background:var(--paper); font-size:0.94rem; word-break:break-word;}
  .members-flash.ok{border-left-color:#2e7d32;}
  .members-flash.err{border-left-color:#9b1c1c; background:#fbeeee;}

  .members-crumbs{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:14px; font-size:0.94rem;}
  .members-crumbs a{color:var(--blue); font-weight:600;}
  .members-crumbs a:hover{text-decoration:underline;}
  .members-crumbs span{color:rgba(14,36,71,0.35);}

  .members-table-wrap{border:1px solid var(--line); overflow-x:auto; -webkit-overflow-scrolling:touch; margin-bottom:28px;}
  .members-table{width:100%; border-collapse:collapse; background:var(--paper);}
  .members-table thead tr{background:var(--ink); border-left:4px solid var(--maroon);}
  .members-table th{
    text-align:left; padding:14px 20px; white-space:nowrap;
    font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase;
    letter-spacing:0.4px; font-size:0.82rem; color:rgba(255,255,255,0.75);
  }
  .members-table tbody tr{border-left:4px solid var(--blue); border-bottom:1px solid var(--line); transition:background 0.15s ease, border-left-color 0.15s ease;}
  .members-table tbody tr:nth-child(even){background:var(--white);}
  .members-table tbody tr:last-child{border-bottom:0;}
  .members-table tbody tr:hover{background:rgba(14,36,71,0.06); border-left-color:var(--maroon);}
  .members-table td{text-align:left; padding:12px 20px; font-size:0.94rem; color:rgba(14,36,71,0.8); vertical-align:middle;}
  .members-table th:first-child, .members-table td:first-child{width:55%;}
  .members-name{font-weight:600;}
  .members-name a{color:var(--ink); word-break:break-word; text-decoration:underline; text-decoration-color:rgba(14,36,71,0.3); text-underline-offset:3px;}
  .members-name a:hover{color:var(--blue); text-decoration-color:currentColor;}
  .members-name a.folder-link{color:var(--blue); font-weight:700;}
  .members-up{margin:0 0 12px; font-size:0.9rem;}
  .members-up a{color:var(--blue); font-weight:600;}
  .members-up a:hover{text-decoration:underline;}
  .members-where{margin:0 0 4px; font-size:0.9rem; color:rgba(14,36,71,0.75);}
  .members-empty{text-align:center !important; color:rgba(14,36,71,0.55) !important; padding:28px !important;}
  .members-actions{display:flex; gap:8px; flex-wrap:wrap;}
  .members-actions form{margin:0;}
  td.members-actions{display:table-cell;}
  td.members-actions form{display:inline-block; margin-right:6px;}

  .members-admin-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
  @media (max-width:860px){ .members-admin-grid{grid-template-columns:1fr;} }

  .members-card{background:var(--paper); border:1px solid var(--line); border-top:4px solid var(--blue); padding:24px 26px; margin-bottom:20px;}
  .members-card.narrow{max-width:460px;}
  .members-card h2{font-size:1.2rem; text-transform:uppercase; margin-bottom:14px;}
  .members-card label{display:block; font-size:0.88rem; font-weight:600; margin:14px 0 6px;}
  .members-card input[type=text], .members-card input[type=password], .members-card input[type=file], .members-card select{
    width:100%; font:inherit; font-size:0.96rem; padding:10px 12px;
    border:1px solid rgba(14,36,71,0.3); border-radius:2px; background:var(--white); color:var(--ink);
  }
  .members-card input:focus, .members-card select:focus{outline:2px solid var(--blue-light); outline-offset:1px;}
  .members-card .btn{margin-top:18px;}
  .members-help{margin:14px 0 0; font-size:0.84rem; color:rgba(14,36,71,0.6);}
  .members-help.strong{color:#9b1c1c; font-weight:600; font-size:0.92rem;}

  .members-inline-form{display:grid; grid-template-columns:1fr 1fr 1fr auto; gap:14px; align-items:end;}
  .members-inline-form .btn{margin-top:0;}
  @media (max-width:860px){ .members-inline-form{grid-template-columns:1fr;} }

  @media (max-width:640px){
    .members-table th, .members-table td{padding:10px 12px; font-size:0.85rem;}
  }

  /* ---------- Site map: open full size link ---------- */
  .sitemap-open{margin:10px 0 0; font-size:0.94rem;}
  .sitemap-open a{color:var(--blue); font-weight:600; border-bottom:1px solid currentColor; padding-bottom:1px;}
  .sitemap-open a:hover{color:var(--blue-light);}
