/* ==========================================================================
   The Founders Table — landing page (page-founders-table-template.php)
   All classes are ft- prefixed: the theme loads Bootstrap globally and the
   header itself uses .hero/.btn, so unprefixed names collide.
   ========================================================================== */

@font-face{
  font-family:'MADE TOMMY';
  src:url('../founders-table/MADETOMMY.woff2') format('woff2'),
      url('../founders-table/MADETOMMY.woff') format('woff');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'MADE TOMMY';
  src:url('../founders-table/MADETOMMY-Bold.woff2') format('woff2'),
      url('../founders-table/MADETOMMY-Bold.woff') format('woff');
  font-weight:700;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Trajan Pro 3';
  src:url('../founders-table/TrajanPro3-Regular.otf') format('opentype');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Trajan Pro 3';
  src:url('../founders-table/TrajanPro3-Bold.otf') format('opentype');
  font-weight:700;font-style:normal;font-display:swap;
}

.ft-page{
  --gold:#bd8b3d;       /* exact Figma gold */
  --gold-soft:#d3a75c;
  --gold-line:rgba(189,139,61,.5);
  --ink:#0a2430;        /* page base teal */
  --ink-2:#0c2733;      /* panels */
  --line:rgba(189,139,61,.3);
  --cream:#f4eddd;
  --muted:#a7b6bc;
  background:var(--ink);color:var(--cream);
  font-family:'MADE TOMMY','Poppins',system-ui,sans-serif;
  line-height:1.65;-webkit-font-smoothing:antialiased;
}
/* Bootstrap-reboot neutralizers, scoped to this page only */
.ft-page img{display:block;max-width:100%}
.ft-page p,.ft-page h1,.ft-page h2,.ft-page h4{margin:0}
.ft-page ul{padding-left:0;margin:0}
/* The theme sets font-family directly on elements (Raleway), which beats
   inheritance — so the body face must also be set on the elements. The
   Trajan classes below win via .ft-page-prefixed selectors (higher specificity). */
.ft-page p,.ft-page li,.ft-page h4,.ft-page a{font-family:'MADE TOMMY','Poppins',system-ui,sans-serif}

.ft-wrap{max-width:1264px;margin:0 auto;padding:0 32px} /* 1200px content column */
.ft-gold{color:var(--gold)}

/* Trajan display faces (Cinzel fallback when Trajan Pro 3 is unavailable) */
.ft-page .ft-display{font-family:'Trajan Pro 3','Trajan Pro','TrajanPro3','Cinzel',serif;
     font-weight:400;letter-spacing:.03em;line-height:1.04;text-transform:uppercase}
.ft-page .ft-tjcaps{font-family:'Trajan Pro 3','Trajan Pro','TrajanPro3','Cinzel',serif;
     font-weight:400;font-variant-caps:small-caps;font-feature-settings:"smcp" 1;letter-spacing:.045em}

/* Gold CTA */
.ft-btn{display:inline-flex;align-items:center;justify-content:center;color:#fff;
     background:linear-gradient(180deg,#d8ae56 0%,#c39331 100%);
     font-weight:400;font-size:17px;letter-spacing:.1em;text-transform:uppercase;
     padding:18px 42px;border-radius:2px;text-decoration:none;border:1px solid rgba(242,224,172,.6);
     box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 8px 20px rgba(0,0,0,.3);
     transition:filter .15s,transform .05s}
.ft-btn:hover{filter:brightness(1.06);color:#fff}
.ft-btn:active{transform:translateY(1px)}

/* ---------- HERO ---------- */
.ft-hero{position:relative;overflow:hidden;border-top:7px solid var(--gold);background:var(--ink)}
/* gradient fading down below the thick gold top border (Figma: #050505 -> transparent) */
.ft-hero::before{content:"";position:absolute;top:0;left:0;right:0;height:70px;z-index:2;pointer-events:none;
     background:linear-gradient(180deg,#050505 0%,rgba(0,0,0,0) 100%)}
/* Figma gradient just above the first divider: #002835 transparent -> solid */
.ft-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:210px;z-index:2;pointer-events:none;
     background:linear-gradient(180deg,rgba(0,40,53,0) 0%,rgba(0,40,53,1) 100%)}
/* Rectangle 211 backdrop — its sky-light is baked in; light overlay (user-tuned) */
.ft-hero__bg{position:absolute;z-index:1;top:0;right:0;bottom:0;left:0;pointer-events:none;
     background:linear-gradient(90deg,rgba(8,26,35,.1) 0%,rgba(8,26,35,.1) 40%,rgba(8,26,35,.12) 100%),
                url('../founders-table/hero-bg.jpg') center center/cover no-repeat}
/* Rectangle 214 — gold rays (Figma-tuned placement) */
.ft-hero__rays{position:absolute;z-index:2;left:20%;width:70%;height:auto;pointer-events:none}
.ft-hero__inner{position:relative;z-index:4;display:flex;align-items:flex-end;gap:28px;overflow:visible;
     min-height:716px;max-width:1264px;margin:0 auto;padding:84px 32px 0}
.ft-hero__text{flex:0 0 auto;max-width:512px;align-self:flex-start;position:relative;z-index:4}
.ft-hero h1{font-size:clamp(3.2rem,5vw,6rem);line-height:.875;letter-spacing:0;margin-bottom:1.3rem;
     text-shadow:0 4px 16px rgba(0,0,0,.55)}
.ft-hero h1 .ft-thin{color:#fff}
.ft-page .ft-kicker{font-family:'MADE TOMMY','Poppins',sans-serif;font-weight:400;letter-spacing:0;font-size:36px;
     text-transform:uppercase;margin-bottom:1.15rem;color:var(--cream);line-height:34px}
.ft-kicker strong{color:var(--gold);font-weight:400}
.ft-page .ft-hero__body{color:var(--muted);font-size:17px;max-width:440px;margin-bottom:2rem}
/* Maxwell — flows with the content, bottom-flush to the divider */
.ft-hero__portrait{position:relative;z-index:3;flex:0 0 auto;align-self:flex-end;height:648px;width:auto;
     max-width:none;object-fit:contain;display:block}

/* ---------- EVENT DETAILS BAR ---------- */
/* Figma glow: #002835(0) -> #003C4F(50%) -> #002835(0); fixed-width band, centered */
.ft-facts{position:relative;
     background:linear-gradient(90deg,rgba(0,40,53,0) 0%,#003c4f 50%,rgba(0,40,53,0) 100%) center/min(400px,74%) 100% no-repeat,var(--ink)}
.ft-facts::before,.ft-facts::after{content:"";position:absolute;left:50%;transform:translateX(-50%);
     width:min(1200px,92%);height:4px;z-index:2;pointer-events:none;
     background:linear-gradient(90deg,transparent 0%,rgba(189,139,61,.12) 14%,var(--gold) 50%,rgba(189,139,61,.12) 86%,transparent 100%)}
.ft-facts::before{top:0}
.ft-facts::after{bottom:0}
.ft-facts__grid{display:grid;grid-template-columns:repeat(3,1fr);text-align:center}
.ft-fact{position:relative;display:flex;flex-direction:column;align-items:center;gap:.85rem;padding:36px 20px}
.ft-fact + .ft-fact::before{content:"";position:absolute;left:0;top:16%;bottom:16%;width:2px;
     background:linear-gradient(180deg,transparent 0%,var(--gold) 26%,var(--gold) 74%,transparent 100%)}
.ft-fact img{width:36px;height:36px;opacity:.95}
.ft-fact span{font-family:'Trajan Pro 3','Trajan Pro','TrajanPro3','Cinzel',serif;font-weight:400;
     font-variant-caps:small-caps;font-feature-settings:"smcp" 1;letter-spacing:.02em;
     font-size:.95rem;color:var(--cream);white-space:nowrap}

/* ---------- COMMISSIONING ---------- */
.ft-commission{padding:74px 0 60px}
.ft-commission__grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:56px;align-items:start}
.ft-commission__img{position:relative;width:min(398px,100%)}
.ft-commission__img img{position:relative;z-index:1;width:100%;aspect-ratio:398/529;object-fit:cover;display:block}
/* white frame: 2px, top + left only, inset INSIDE the image */
.ft-commission__img::before{content:"";position:absolute;z-index:2;top:18px;left:18px;right:72px;bottom:55px;
     border-top:2px solid #fff;border-left:2px solid #fff}
/* gold frame: 6px, bottom + right only, hanging just OUTSIDE the image's bottom-right corner */
.ft-commission__img::after{content:"";position:absolute;z-index:2;top:122px;left:215px;right:-24px;bottom:-22px;
     border-bottom:6px solid var(--gold);border-right:6px solid var(--gold)}
.ft-commission h2{font-size:clamp(1.5rem,1.5vw + 1.05rem,2.15rem);color:var(--gold);
     line-height:1.24;margin-bottom:1.3rem}
.ft-rule-gold{height:1px;background:var(--gold);width:100%;max-width:330px;margin:0 0 1.7rem;opacity:.85}
.ft-commission p{color:var(--cream);font-size:.92rem;margin-bottom:1.15rem;opacity:.86}
.ft-commission p strong{color:var(--cream);font-weight:700;opacity:1}
.ft-commission .ft-btn{margin-top:.7rem}

/* ---------- PATRONS ---------- */
.ft-patrons{padding:24px 0 74px}
.ft-patrons__box{position:relative;overflow:hidden;background:var(--ink-2);border:0;border-radius:0;
     padding:44px 29px 52px;box-shadow:0 26px 60px rgba(0,0,0,.45),0 2px 0 rgba(255,255,255,.03) inset}
/* intro container: shadowed box, no gold border (per Figma) */
.ft-patrons__intro{background:rgba(255,255,255,.02);padding:24px 33px;margin-bottom:38px;
     box-shadow:0 12px 26px rgba(0,0,0,.38)}
.ft-patrons__intro p{color:var(--gold-soft);text-align:left;line-height:1.16;
     font-size:27px;letter-spacing:0}
.ft-patrons__box h4{font-weight:700;font-size:24px;margin:0 0 1.4rem 31px;color:#fff}
.ft-page .ft-benefits{list-style:none;max-width:720px;position:relative;z-index:2;margin-left:71px}
.ft-benefits > li{position:relative;padding-left:26px;margin-bottom:14px;color:var(--gold-soft);
     font-size:20px;line-height:1.45}
.ft-benefits > li::before{content:"";position:absolute;left:2px;top:10px;width:9px;height:9px;
     background:#fff;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.ft-benefits ul{list-style:none;margin:14px 0 6px 20px}
.ft-benefits ul li{position:relative;padding-left:20px;margin-bottom:10px;color:var(--gold-soft);
     font-size:20px;line-height:1.45}
.ft-benefits ul li::before{content:"–";position:absolute;left:0;color:var(--gold-soft)}
.ft-seal{position:absolute;right:16px;bottom:24px;width:392px;height:392px;opacity:1;
     pointer-events:none;z-index:1}

/* ---------- CLOSING ---------- */
.ft-closing{padding:0 0 52px;text-align:center;background:var(--ink)}
/* each content sits in a band bounded by two dividers; the glow fills only its band */
.ft-closing__band{padding:48px 0}
.ft-closing__band--glow{background:linear-gradient(90deg,rgba(0,40,53,0),#003c4f 50%,rgba(0,40,53,0)) center/min(400px,74%) 100% no-repeat}
.ft-rule{height:4px;width:100%;margin:0 auto;
     background:linear-gradient(90deg,transparent 0%,rgba(189,139,61,.14) 14%,var(--gold) 50%,rgba(189,139,61,.14) 86%,transparent 100%)}
.ft-closing h2{color:var(--cream);font-size:clamp(1.25rem,.9vw + 1rem,1.62rem);letter-spacing:.03em;
     line-height:1.34;max-width:1080px;margin:0 auto}
.ft-closing__details{display:flex;flex-direction:column;align-items:center;gap:26px}
.ft-closing__details p{font-size:.9rem;color:var(--muted);line-height:1.7}
.ft-closing__details strong{color:var(--cream);font-weight:700;display:block;margin-bottom:.25rem}

/* ---------- RESPONSIVE ---------- */
/* Below ~1240px the side-by-side hero starts clipping Maxwell: stack text over him */
@media (max-width:1240px){
  .ft-hero__inner{flex-direction:column;align-items:stretch;gap:0;min-height:0;padding:74px 30px 0}
  .ft-hero__text{max-width:none;align-self:stretch}
  .ft-hero h1{font-size:clamp(2.9rem,7.4vw,4.6rem);line-height:.94}
  .ft-page .ft-kicker{font-size:clamp(1.35rem,3.9vw,2rem);line-height:1.2}
  .ft-page .ft-hero__body{font-size:16px;max-width:560px}
  .ft-hero__portrait{height:auto;max-height:none;width:auto;max-width:min(94%,470px);
       align-self:center;margin-top:6px}
  .ft-hero__bg{background:linear-gradient(180deg,rgba(8,26,35,.5) 0%,rgba(8,26,35,.3) 42%,rgba(8,26,35,.72) 100%),
       url('../founders-table/hero-bg.jpg') center/cover no-repeat}
  .ft-hero__rays{display:none}
  .ft-commission{padding:58px 0 50px}
  .ft-commission__grid{grid-template-columns:1fr;gap:32px}
  .ft-patrons__intro p{font-size:clamp(16px,2vw,27px)}
  .ft-commission h2{font-size:clamp(1.5rem,4.2vw,2.05rem)}
  .ft-commission__img{max-width:470px}
}
@media (max-width:820px){
  .ft-facts__grid{grid-template-columns:1fr}
  .ft-fact{padding:24px 20px}
  .ft-fact span{white-space:normal}
  .ft-fact + .ft-fact::before{display:none}
  .ft-fact + .ft-fact{border-top:1px solid var(--gold-line)}
  .ft-facts::before,.ft-facts::after{width:84%}
  .ft-patrons{padding:16px 0 56px}
  .ft-patrons__box{padding:30px 24px 36px}
  .ft-patrons__intro{padding:16px 18px;margin-bottom:1.8rem}
  .ft-patrons__intro p{font-size:21px}
  .ft-patrons__box h4{font-size:20px;margin-left:0}
  .ft-page .ft-benefits{margin-left:12px}
  .ft-benefits > li,.ft-benefits ul li{font-size:17px}
  .ft-seal{width:260px;height:260px;right:8px}
  .ft-closing__band{padding:36px 0}
  .ft-closing__details{gap:34px}
}
@media (max-width:520px){
  .ft-wrap{padding:0 20px}
  .ft-hero__inner{padding:60px 20px 0}
  .ft-hero h1{font-size:clamp(2.5rem,10.5vw,3.6rem)}
  .ft-page .ft-kicker{font-size:clamp(1.15rem,5.4vw,1.6rem)}
  .ft-page .ft-hero__body{font-size:15px}
  .ft-btn{font-size:15px;letter-spacing:.08em;padding:15px 30px}
  .ft-commission__img::before{top:12px;left:12px;right:48px;bottom:40px}
  .ft-commission__img::after{top:90px;left:150px;right:-14px;bottom:-14px;border-width:4px}
  .ft-benefits > li,.ft-benefits ul li{font-size:15px}
  .ft-patrons__intro p{font-size:18px}
  .ft-closing__details{flex-direction:column;gap:22px}
}