
/* Layout B - Full Width, Bold Desktop */
/* Reset */
*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;overflow-x:hidden;font-family:'Work Sans', Arial, sans-serif;color:#222;background:#fff}

/* Variables */
:root{--accent:#B18C65;--hero-height:48vh;--max-content:1200px;--btn-bg:#2b7a57;--coral:#FF746C;}

/* Hero */
header{background:url('hero_header.jpeg') center/cover no-repeat; background-size:cover; min-height:var(--hero-height); display:flex;align-items:center;justify-content:center;padding:0 20px;}
header .hero-inner{width:100%;max-width:var(--max-content);text-align:center;padding:40px 20px}
header h1{font-family:'Permanent Marker', cursive;font-size:4.2rem;line-height:1; color:#222;margin:0 0 18px; text-shadow: 0 4px 8px rgba(0,0,0,0.15);}

/* Buttons */
.hero-buttons{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin-top:18px}
.btn{background:var(--btn-bg);color:#fff;padding:12px 22px;border-radius:8px;display:inline-block;font-weight:600;text-decoration:none}

/* Sections */
.container{max-width:var(--max-content);margin:0 auto;padding:0 20px}
section{width:100%;padding:60px 0}
section h2{font-family:'Permanent Marker',cursive;font-size:2.8rem;margin-bottom:22px;color:#222;text-align:left;}

/* ABOUT section */
#about{background:var(--coral);color:#fff}
#about .about-text{max-width:900px;margin:0 auto;font-size:1.05rem;line-height:1.7;padding:20px}

/* SUPPORTERS - big, single row centered */
.supporters{background:#fff;padding:40px 0}
.supporter-grid{display:flex;justify-content:space-evenly;align-items:center;gap:40px;flex-wrap:nowrap;max-width:var(--max-content);margin:0 auto;padding:20px 40px}
.supporter-grid img{max-width:240px;height:auto;display:block;opacity:0.95;}

/* SPREAD THE WORD - 3-across gallery */
#spread{background:var(--accent);color:#fff;padding-bottom:80px}
#spread .columns-3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;max-width:var(--max-content);margin:0 auto;padding:20px}
.columns-3 .media-item{background:transparent;padding:10px;}

/* Responsive video */
.responsive-video{position:relative;padding-bottom:56.25%;height:0;overflow:hidden}
.responsive-video iframe{position:absolute;top:0;left:0;width:100%;height:100%}

/* Movember section adjustments - centered large logo */
#about-movember{background:#111;color:#fff;padding:80px 0}
#about-movember .movember-img{display:block;margin:20px auto 0 auto;max-width:360px;height:auto;}

/* Footer */
footer{background:#b7d8b7;padding:18px;text-align:center}

/* Desktop tweaks */
@media(min-width:1200px){
  header h1{font-size:5rem}
  .supporter-grid img{max-width:320px}
}

/* Tablet / Mobile */
@media(max-width:860px){
  header{min-height:42vh}
  header h1{font-size:3rem}
  .supporter-grid{flex-wrap:wrap;gap:20px;padding:20px}
  .supporter-grid img{max-width:180px;margin:10px}
  .columns-3{grid-template-columns:repeat(2,1fr)}
  section h2{text-align:center}
  header .hero-inner{padding-top:30px;padding-bottom:30px}
}
@media(max-width:480px){
  header h1{font-size:2.4rem}
  .columns-3{grid-template-columns:1fr}
  #about-movember .movember-img{max-width:260px}
  .supporter-grid img{max-width:140px}
  #about{padding:40px 0}
  section{padding:30px 0}
}



/* ====== Surgical fixes v2 ====== */
/* Supporter logos: centered single row on desktop */
.supporter-grid{display:flex;justify-content:center;align-items:center;gap:48px;flex-wrap:nowrap;overflow:visible;padding:40px 20px;max-width:1200px;margin:0 auto;}
.supporter-grid img{max-width:260px;height:auto;display:block;margin:0;object-fit:contain;}

/* Ensure supporter row wraps on small screens */
@media (max-width:860px){
  .supporter-grid{flex-wrap:wrap;gap:22px;padding:24px;}
  .supporter-grid img{max-width:180px;}
}

/* Spread The Word: force 3-across equal columns on desktop */
.columns-3{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;align-items:start;justify-items:center;max-width:1200px;margin:20px auto;padding:10px;}
.columns-3 .media-item{width:100%;max-width:380px;display:flex;align-items:flex-start;justify-content:center;}
.columns-3 .media-item img{width:100%;height:auto;border-radius:6px;}

/* Make iframe visible and responsive */
.responsive-video{position:relative;width:100%;padding-bottom:56.25%;height:0;overflow:visible!important;}
.responsive-video iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;display:block;}

/* Force video column same visual weight as posters */
.columns-3 .media-item.video-item{min-height:320px;display:flex;align-items:center;justify-content:center;}

/* Hero tuning: reduce font-size and padding to prevent overflow */
header{padding:40px 20px 20px 20px;min-height:36vh;background-position:center top;}
header h1{font-size:3.6rem;line-height:1;max-width:90%;text-align:center;padding:0;margin:0 auto}

/* Buttons placement tweak */
.hero-buttons{margin-top:14px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

/* Safety: remove any horizontal overflow caused by extreme paddings */
html,body{overflow-x:hidden;}
*{box-sizing:border-box;}
img{max-width:100%;height:auto;display:block;}
