/*
Theme Name: FuturaBoard Network
Description: FuturaBoard Network site. Homepage plus Who we are and Contact Us templates, editable with ACF.
Version: 1.9
License: GNU General Public License v2 or later
Text Domain: futuraboard
*/

:root{
  --cream:#f5f4f0;
  --ink:#15130f;
  --navy:#22385a;
  --red:#b4291d;
  --gold:#e6b84c;
  --muted:#8a8577;
  --paper:var(--cream);
  --line:rgba(21,19,15,.16);
  --gold-text:#e3b15a;
  --peach:#f0c9a8;
  --rust:#a64225;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{background:var(--cream);color:var(--ink);font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
svg{max-width:100%;display:block}
.wrap{max-width:1280px;margin:0 auto;padding:0 32px}

/* nav */
header{position:sticky;top:0;background:var(--cream);border-bottom:1px solid var(--line);z-index:50}
.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 0}
.brand{font-weight:700;font-size:18px;letter-spacing:-.02em;line-height:1.1}
.brand span{display:block;font-weight:400;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.navlinks{display:flex;gap:22px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.navlinks a{color:var(--ink);text-decoration:none}
.navlinks a:hover,.navlinks .current-menu-item a{color:var(--red)}
.navlinks .nav-list{display:flex;gap:28px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.navlinks .nav-list li{margin:0}
.est{font-size:11px;letter-spacing:.2em;color:var(--muted);text-transform:uppercase}
@media(max-width:760px){.navlinks{display:none}}

.kicker{font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--red);margin-bottom:26px}
.sechead{display:flex;justify-content:space-between;align-items:baseline;gap:16px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid currentColor;padding-bottom:14px;margin-bottom:48px}

/* hero */
.hero{padding:110px 0 130px;border-bottom:1px solid #d8d1bf}
.hero h1{font-size:clamp(42px,7vw,88px);line-height:1.04;font-weight:700;letter-spacing:-.02em;max-width:22ch}
.hero p{margin-top:30px;font-size:19px;color:#4a463c;max-width:68ch}
.hero .meta{margin-top:90px;display:flex;gap:64px;flex-wrap:wrap;font-size:12px}
.hero .meta b{display:block;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:6px;font-weight:600}

/* about (red) */
.about{background:var(--red);color:#f7e9df;padding:100px 0}
.about .sechead{color:#f0c9a8;border-bottom-color:rgba(247,233,223,.45)}
.about h2{font-size:clamp(30px,4.6vw,54px);line-height:1.18;font-weight:700;max-width:none;margin-bottom:64px}
.principles-label{margin:0 0 12px;color:#e8c38a;font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:0;border-top:1px solid rgba(247,233,223,.45)}
.principle{padding:28px 40px 8px 0;border-right:1px solid rgba(247,233,223,.45)}
.principle + .principle{padding-left:36px}
.principle:last-child{border-right:none;padding-right:0}
.principle i{display:block;font-style:italic;font-family:Georgia,"Times New Roman",serif;color:#f0c9a8;margin-bottom:20px;font-size:16px}
.principle h3{font-size:28px;margin-bottom:12px;letter-spacing:-.03em}
.principle p{font-size:15px;color:#f0d8c9;max-width:26ch;line-height:1.5}
.about .foot{margin-top:56px;border-top:1px solid rgba(247,233,223,.45);padding-top:22px;font-size:15px;max-width:60ch}
@media(max-width:760px){
  .principles{grid-template-columns:1fr}
  .principle,.principle + .principle{padding:24px 0;border-right:none;border-bottom:1px solid rgba(247,233,223,.45)}
  .principle:last-child{border-bottom:none}
}

/* vision (navy) */
.vision{background:var(--navy);color:#e8e6df;padding:100px 0}
.vision .sechead{color:#c9c6bb;border-bottom-color:rgba(232,230,223,.25)}
.vision-title{margin:0 0 36px;font-size:clamp(42px,5vw,64px);letter-spacing:-.04em;color:#fff;font-weight:700}
.vision-row{display:grid;grid-template-columns:72px 1fr;gap:8px;align-items:start}
.vision .mark{font-size:90px;color:var(--gold);line-height:.4;font-family:Georgia,serif}
.vision-copy p{margin:0 0 1.15em;font-size:clamp(18px,1.7vw,22px);line-height:1.55;max-width:62ch}
.vision-copy .em{font-style:normal;font-weight:500;font-size:1.55em;line-height:1;letter-spacing:-.03em;color:#fff}
.vision blockquote{font-size:clamp(20px,2.6vw,30px);line-height:1.5;font-weight:400;max-width:62ch;margin-top:40px}
.vision blockquote b,.vision blockquote em{font-style:normal;font-weight:500;font-size:1.25em;color:#fff}
.vision .credit{margin-top:60px;border-top:1px solid rgba(232,230,223,.25);padding-top:20px;font-size:14px;color:#c9c6bb;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
.vision .credit .who{color:#c9c6bb}
.vision .credit .who b{font-weight:700;color:#fff}
.vision .credit .gold{color:var(--gold);text-align:right;max-width:30ch;line-height:1.45}

/* positioning (gold) */
.position{background:var(--gold);color:#241d08;padding:100px 0}
.position .sechead{color:rgba(36,29,8,.6);border-bottom-color:rgba(36,29,8,.35)}
.position h2{font-size:clamp(30px,4.4vw,50px);line-height:1.16;font-weight:700;max-width:32ch}
.position .body{margin-top:36px;max-width:88ch;font-size:16px;display:grid;gap:18px}
.shift-label{margin:48px 0 12px;color:var(--rust);font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.shift{margin-top:0;border-top:1px solid rgba(36,29,8,.35)}
.shift-row{display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:center;padding:16px 4px;border-bottom:1px solid rgba(36,29,8,.25);font-size:15px}
.shift-row .from{color:rgba(36,29,8,.65)}
.shift-row .arrow{color:var(--red);font-size:20px}
.shift-row .to{font-weight:700;text-align:left}
.position .footer{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;margin-top:70px;border-top:2px solid var(--red);padding-top:20px;font-size:22px;font-weight:700}
.position .footer span:last-child{color:var(--red)}

/* timeline */
.timeline{padding:110px 0 40px;border-bottom:none}
.timeline .sechead{color:var(--muted);border-bottom-color:#d8d1bf}
.timeline .title{font-size:clamp(36px,4.4vw,56px);letter-spacing:-.03em;font-weight:700;margin:0 0 16px}
.timeline .intro{max-width:86ch;font-size:17px;color:#4a463c;margin:0 0 60px}
.tl{border-top:1px solid #d8d1bf}
.tl-item{display:grid;grid-template-columns:180px 1fr;gap:48px;padding:30px 0;border-bottom:1px solid #eee7d6}
.tl-year{display:flex;align-items:center;gap:12px;font-size:34px;font-weight:700;letter-spacing:-.01em}
.tl-year::before{content:"";width:11px;height:11px;flex:0 0 11px;background:currentColor}
.tl-item h3{font-size:13px;letter-spacing:.22em;text-transform:uppercase;margin-bottom:10px}
.tl-item p{font-size:15px;color:#4a463c;max-width:none;font-weight:400}
.tl-item p b,.tl-item p strong{font-weight:500}
.tl-item.c-navy .tl-year,.tl-item.c-navy h3{color:var(--navy)}
.tl-item.c-gold .tl-year,.tl-item.c-gold h3{color:#c49a32}
.tl-item.c-red .tl-year,.tl-item.c-red h3,
.tl-item.futura .tl-year,.tl-item.futura h3{color:var(--red)}
.tl-item.c-green .tl-year,.tl-item.c-green h3{color:#2e5d43}
@media(max-width:760px){
  .tl-item{grid-template-columns:1fr;gap:6px}
  .tl-year{margin-bottom:10px}
}

/* record */
.record{padding:24px 0 100px;border-bottom:1px solid #d8d1bf}
.record .sechead{color:var(--muted);border-bottom-color:#d8d1bf;margin-bottom:0}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:none}
.stat{padding:34px 34px 40px 0;border-right:1px solid #d8d1bf}
.stat + .stat{padding-left:36px}
.stat:last-child{border-right:none}
.stat .num{font-size:clamp(44px,6vw,72px);font-weight:700;letter-spacing:-.02em}
.stat p{font-size:13px;color:#4a463c;max-width:24ch;margin-top:10px}
@media(max-width:760px){
  .stats{grid-template-columns:1fr}
  .stat,.stat + .stat{padding:24px 0;border-right:none;border-bottom:1px solid #d8d1bf}
  .stat:last-child{border-bottom:none}
}

/* core idea */
.core{padding:100px 0}
.core .sechead{color:var(--muted);border-bottom-color:#d8d1bf}
.core h2{font-size:clamp(30px,4.6vw,54px);line-height:1.12;font-weight:700;letter-spacing:-.01em;max-width:28ch;margin-bottom:48px}
.core h2 span{color:var(--red)}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:80px;margin-top:0;margin-bottom:48px;align-items:start}
.duo > div{display:grid;grid-template-rows:170px auto auto}
.duo svg{width:100%;max-width:none;height:170px;display:block;margin-bottom:0}
.duo h4{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin:22px 0 10px;font-weight:500}
.duo .sys-label{color:var(--red)}
.duo p{font-size:13px;color:#4a463c;max-width:none}
.quote{margin-top:0;border-top:2px solid var(--red);padding-top:50px}
.quote h3{font-size:clamp(24px,3.6vw,42px);font-weight:700;line-height:1.25;max-width:42ch}
.quote p{margin-top:24px;font-size:15px;color:#4a463c;max-width:78ch}
@media(max-width:760px){.duo{grid-template-columns:1fr;gap:48px}.duo > div{grid-template-rows:auto auto auto}.duo svg{height:auto}}

.thanks{margin-top:70px;border-top:1px solid #d8d1bf;padding-top:26px}
.thanks p{font-size:14px;color:var(--muted)}
.thanks strong{color:var(--ink)}

footer{padding:60px 0 80px;border-top:1px solid #d8d1bf}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;font-size:12px;color:var(--muted)}

@media(max-width:760px){
  .hero .meta,.position .footer,.shift-row,.vision-row,.vision .credit{display:block}
  .shift-row .arrow{display:inline-block;margin:8px 0}
  .vision .gold{text-align:left;margin-top:16px}
  .position .footer span{display:block;margin-top:8px}
}

a.brand{color:inherit;text-decoration:none}

/* inner pages */
.page-main{padding:90px 0 110px;min-height:55vh}
.page-main h1{font-size:clamp(32px,4.4vw,52px);line-height:1.12;letter-spacing:-.03em;margin:0 0 28px}
.page-body{font-size:17px;color:#4a463c;max-width:72ch}
.page-body p{margin:0 0 1.1em}

.avatar{width:88px;height:88px;border-radius:50%;object-fit:cover;display:block;flex:0 0 88px;color:#c4bdb0}
.avatar-empty{width:88px;height:88px;display:grid;place-items:center}
.avatar-empty svg{width:88px;height:88px}
.avatar-initials{width:88px;height:88px;border-radius:50%;display:grid;place-items:center;background:#e4dfd4;color:#4a463c;font-weight:700;font-size:22px;letter-spacing:.06em;flex:0 0 88px;line-height:1}

header{background:rgba(245,244,240,.94);backdrop-filter:blur(8px)}
.navlinks.page-nav{text-transform:none;letter-spacing:0;font-size:14px;gap:28px;color:#4a443c}
.navlinks.page-nav a{color:#4a443c}
.navlinks.page-nav a:hover{color:var(--ink)}
body.page-template-page-who-we-are .est{display:none}
body.page-template-page-who-we-are footer{background:#1a1a1a;color:rgba(244,239,230,.7);border:none;padding:38px 0}
body.page-template-page-who-we-are footer .brand{color:#f4efe6}
body.page-template-page-who-we-are footer .brand span{color:#f4efe6}

.who-page{background:#f4f1ec}
.who-page .wrap{max-width:1180px}
.who-page h1,.who-page h2,.who-page h3{line-height:1.08;font-weight:500}
.who-hero{padding:96px 0 72px}
.who-hero h1{font-size:clamp(36px,5vw,64px);letter-spacing:-.03em;max-width:14ch;margin:22px 0 0;line-height:1.02}
.who-hero-row{display:flex;gap:48px;margin-top:26px;align-items:flex-start;flex-wrap:wrap}
.who-intro{max-width:640px;font-size:19px;line-height:1.6;color:#4a443c;margin:0;flex:2;min-width:280px}
.who-stat{border-left:1px solid rgba(26,26,26,.16);padding-left:28px;flex:none}
.who-stat .num{font-size:38px;font-weight:500;letter-spacing:-.02em;line-height:1}
.who-stat p{font-size:13px;color:#6f675c;margin-top:6px;max-width:140px;text-transform:none;letter-spacing:0}

.who-directors{background:#ede9e2;border-top:1px solid rgba(26,26,26,.1);padding:76px 0 84px}
.chapter-kicker{font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#6f675c;margin:0}
.who-directors h2{font-size:clamp(28px,3.4vw,38px);max-width:20ch;margin:16px 0 0;letter-spacing:-.025em}
.director-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px;margin-top:44px;background:rgba(26,26,26,.12)}
.director{background:#f4f1ec;padding:36px 38px 34px;border:none;display:flex;flex-direction:column}
.director-head{display:flex;gap:22px;align-items:flex-start}
.director .avatar,.director .avatar-initials{width:104px;height:104px;flex:0 0 104px;font-size:24px}
.dir-label{color:var(--red);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;margin:0 0 8px}
.director h3{font-size:27px;letter-spacing:-.02em;margin:0 0 4px;line-height:1.1}
.dir-title{color:#6f675c;margin-top:0;font-size:14px;line-height:1.45}
.dir-bio{max-width:none;color:#33302b;font-size:16px;margin-top:24px;line-height:1.62}

.who-upcoming{background:#efebe3;border-top:1px solid rgba(26,26,26,.1);padding:72px 0 80px}
.who-upcoming h2{font-size:clamp(28px,3.4vw,38px);letter-spacing:-.025em;margin:16px 0 0;max-width:18ch}
.upcoming-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;margin-top:40px;background:rgba(26,26,26,.12);border-top:1px solid rgba(26,26,26,.16)}
.upcoming-card{background:#efebe3;padding:28px 28px 26px;border:none;display:flex;flex-direction:column}
.upcoming-card .guest-bio{margin-top:auto;padding-top:18px}

.who-guests{background:#f4f1ec;border-top:1px solid rgba(26,26,26,.1);padding:80px 0 88px}
.who-guests .kicker{margin-bottom:0}
.guests-lead{display:flex;justify-content:space-between;align-items:flex-end;gap:48px;margin:16px 0 0}
.who-guests h2{font-size:clamp(28px,3.4vw,38px);max-width:18ch;margin:0;letter-spacing:-.025em}
.guests-intro{max-width:330px;color:#4a443c;margin:0;font-size:15.5px;line-height:1.6;flex:none}
.guest-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:44px;background:rgba(26,26,26,.12);border-top:1px solid rgba(26,26,26,.16)}
.guest{background:#f4f1ec;padding:28px 28px 26px;border:none;display:flex;flex-direction:column}
.guest-head{display:flex;gap:16px;align-items:flex-start}
.guest .avatar,.guest .avatar-empty,.guest .avatar-empty svg,.guest .avatar-initials,
.upcoming-card .avatar,.upcoming-card .avatar-initials{width:76px;height:76px;flex:0 0 76px;font-size:16px}
.guest h3{font-size:19px;margin:0 0 4px;letter-spacing:-.02em;line-height:1.15}
.guest-head p{color:#6f675c;font-size:12.5px;margin:0;line-height:1.4}
.guest-bio{font-size:14.5px;color:#33302b;margin-top:18px;line-height:1.6}

.who-coord{background:#1a1a1a;color:#f4efe6;padding:72px 0}
.coord-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);gap:48px 64px;align-items:center}
.coord-kicker{color:#c9a227;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;margin:0 0 16px}
.who-coord h2{font-size:clamp(28px,3.6vw,34px);letter-spacing:-.025em;line-height:1.1;margin:0 0 20px;color:#f4efe6;max-width:16ch;font-weight:500}
.who-coord p{color:rgba(244,239,230,.86);max-width:52ch;line-height:1.65;font-size:16.5px}
.coord-card{display:flex;gap:22px;align-items:center}
.coord-card .avatar,.coord-card .avatar-initials{width:96px;height:96px;flex:0 0 96px;font-size:22px;background:#3d3a34;color:#fff}
.coord-card h3{color:#f4efe6;margin:0;font-size:23px;line-height:1.1;letter-spacing:-.02em;font-weight:500}
.coord-card p{color:rgba(244,239,230,.66);text-transform:none;letter-spacing:0;font-size:14px;margin:4px 0 0;max-width:none}

.who-contact{background:#f4f1ec;padding:84px 0 96px}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px 72px;align-items:start}
.contact-copy{position:sticky;top:110px}
.contact-copy h2{font-size:clamp(32px,4vw,40px);letter-spacing:-.03em;max-width:14ch;margin:18px 0 0;line-height:1.06;font-weight:500}
.contact-copy > p{max-width:46ch;color:#4a443c;margin:22px 0 0;font-size:16.5px;line-height:1.65}
.contact-paths{margin-top:32px;border-top:1px solid rgba(26,26,26,.16);padding-top:22px;display:flex;flex-direction:column;gap:16px}
.contact-paths h3{font-size:14.5px;font-weight:600;margin:0 0 2px}
.contact-paths p{color:#6f675c;font-size:14px;line-height:1.5;margin:0}

.contact-form{background:#fff;border:1px solid rgba(26,26,26,.14);padding:38px 40px 34px;display:flex;flex-direction:column;gap:26px}
.form-heading{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#6f675c;margin:0 0 12px}
.form-label{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#6f675c}
.form-label em{font-weight:400;font-style:normal;letter-spacing:0;text-transform:none;color:#9a9287}
.form-field{display:flex;flex-direction:column;gap:7px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.checks{display:flex;flex-wrap:wrap;gap:10px}
.checks label{font-size:14.5px;letter-spacing:0;text-transform:none;color:var(--ink);display:inline-flex;align-items:center;gap:9px;border:1px solid rgba(26,26,26,.22);padding:10px 16px;cursor:pointer}
.checks input{accent-color:var(--red);width:15px;height:15px}
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form input[type="url"],
.contact-form select{width:100%;border:none;border-bottom:1px solid rgba(26,26,26,.28);background:transparent;padding:9px 0;font:inherit;color:var(--ink);font-size:16px}
.contact-form textarea{width:100%;border:1px solid rgba(26,26,26,.22);background:transparent;padding:12px 14px;font:inherit;min-height:110px;line-height:1.55;resize:vertical}
.g-recaptcha{margin-top:0}
.form-foot{display:flex;justify-content:space-between;align-items:center;gap:24px;border-top:1px solid rgba(26,26,26,.14);padding-top:22px;margin-top:0}
.form-foot p{font-size:13px;color:#6f675c;max-width:300px;line-height:1.5}
.contact-form button{background:var(--red);color:#f4efe6;border:none;padding:15px 34px;font:inherit;font-size:15px;font-weight:600;letter-spacing:.02em;text-transform:none;cursor:pointer}
.contact-form button:hover{background:#1a1a1a}
.form-note{padding:12px 14px;font-size:14px}
.form-note.success{background:#e8f0e4}
.form-note.error{background:#f7e4e0}

@media(max-width:980px){
  .director-grid,.upcoming-grid,.guest-grid{grid-template-columns:1fr 1fr}
  .contact-grid,.form-row{grid-template-columns:1fr}
  .contact-copy{position:static}
}
@media(max-width:760px){
  .navlinks{display:none}
  body.page-template-page-who-we-are .navlinks.page-nav{display:flex;gap:14px;font-size:13px;justify-content:flex-start}
  .who-stats,.guest-grid,.coord-grid,.contact-grid,.form-foot,.guests-lead,.director-grid,.upcoming-grid{grid-template-columns:1fr;display:block}
  .guests-lead{display:block}
  .who-guests h2{margin-bottom:16px}
  .guests-intro{max-width:none;margin-top:16px}
  .director-grid,.upcoming-grid,.guest-grid{display:grid;grid-template-columns:1fr;gap:2px}
  .contact-form{margin-top:0;padding:28px 22px}
  .who-stat{border-left:none;border-top:1px solid rgba(26,26,26,.16);padding:18px 0 0}
}