/* Rib Rodeo -- design system.

   Gold, white and silver. The reference is a trophy buckle and an engraved
   plate: metals on paper, not a country-western pastiche. No rope borders, no
   wood grain, no distressed textures, no barn wood. No shadows and no rounded
   corners anywhere on the site. */

:root{
  --paper:#FFFFFF;        /* plate faces, cards */
  --white:#FBFAF8;        /* page ground, very slightly warm */
  --ink:#1A1C1E;          /* body text */
  --ink-soft:#4E5459;     /* secondary text */
  --silver:#8B9096;       /* labels, eyebrows, metadata */
  --silver-line:#D9DDE0;  /* hairline rules, grid gaps */
  --silver-pale:#F0F2F3;  /* alternate section ground */
  --gold:#A8842A;         /* accent + text-safe gold */
  --gold-lt:#D4AF4F;      /* LARGE DISPLAY ONLY - fails AA at body size */
  --gold-pale:#F7F1DF;    /* plate inner border, highlight rows */

  /* Text-safe pairs. The spec's --gold measures 3.36:1 on --white and --silver
     3.08:1, both under the 4.5:1 that WCAG AA requires for normal text, so the
     spec's own "test every gold pairing before shipping" rule forces these.
     --gold and --silver keep every non-text job: hairlines, fills, dots, and
     display type at 24px and over, where 3:1 is the bar and they clear it. */
  --gold-ink:#866A22;     /* gold as small text  -- 4.54:1 on --white */
  --silver-ink:#6B6F74;   /* silver as small text -- 4.50:1 on --white */

  /* The Women's Open's colour -- the banner, its page, and nowhere else. The
     one exception to the one-accent rule, at Fletcher's request. Measured:
     --pink-deep on --pink-ground 5.04:1, white on --pink-deep 6.77:1, --ink on
     --pink-ground 12.7:1, --pink ribbon on --pink-ground 3.26:1 (graphic). */
  --pink-ground:#F9D5E2;
  --pink:#D93A72;         /* the ribbon */
  --pink-deep:#AD1F55;    /* pink as text, and the button */
  --pink-line:#EDB0C6;    /* hairlines on the pink ground */

  --hero-image:none;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--white);color:var(--ink);
  font-family:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-weight:300;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
img{max-width:100%;display:block}
.wrap{max-width:1120px;margin:0 auto;padding:0 28px}
.narrow{max-width:780px}
[id]{scroll-margin-top:74px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:28px;top:10px;z-index:99;background:var(--ink);color:#fff;padding:10px 16px;font-size:11px;letter-spacing:.16em;text-transform:uppercase}

/* ---------------- unconfirmed values ----------------
   Anything not yet confirmed renders here, visibly bracketed. It is never
   replaced with a plausible-looking invention. */
.ph{
  font-style:normal;color:var(--ink-soft);
  background:var(--gold-pale);border-bottom:1px dashed var(--gold);
  padding:1px 5px;white-space:normal;
}
.hero .ph,.plate .ph{background:rgba(212,175,79,.16);color:inherit;border-bottom-color:var(--gold-lt)}

/* ---------------- top bar ---------------- */
.topbar{
  position:sticky;top:0;z-index:60;background:rgba(251,250,248,.95);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--silver-line);
}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:58px;gap:16px}
.mark{font-size:13px;letter-spacing:.24em;text-transform:uppercase;font-weight:700;color:var(--gold-ink)}
.topnav{display:flex;align-items:center;gap:26px}
.topnav a{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
.topnav a:hover,.topnav a[aria-current="page"]{color:var(--gold-ink)}
.topnav .cta{border:1px solid var(--gold);color:var(--gold-ink);padding:9px 18px;font-weight:500;transition:background .18s,color .18s}
.topnav .cta:hover{background:var(--gold-ink);color:#fff}

/* ---------------- hero ---------------- */
.hero{
  position:relative;min-height:min(76vh,640px);display:flex;align-items:flex-end;
  background:
    linear-gradient(180deg,rgba(20,18,14,.30) 0%,rgba(20,18,14,.72) 62%,rgba(20,18,14,.92) 100%),
    var(--hero-image) center/cover no-repeat,
    linear-gradient(140deg,#3A3128,#191512 60%,#241D16);
  color:#fff;
}
.hero .wrap{padding-top:80px;padding-bottom:52px;width:100%}
.kicker{font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-lt);margin-bottom:20px}
.hero h1{
  font-family:'Playfair Display',Georgia,serif;font-weight:900;
  font-size:clamp(50px,11vw,124px);line-height:.86;letter-spacing:-.03em;margin-bottom:22px;
}
.hero p{
  font-family:'Playfair Display',Georgia,serif;font-size:clamp(18px,2.3vw,26px);
  line-height:1.42;max-width:20em;color:rgba(255,255,255,.90);
}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.imgnote{
  position:absolute;top:70px;right:28px;z-index:2;font-size:9px;letter-spacing:.18em;
  text-transform:uppercase;color:rgba(255,255,255,.78);
  border:1px dashed rgba(255,255,255,.35);padding:5px 9px;
}

/* page head, for interior pages with no photograph */
.phead{background:var(--silver-pale);border-bottom:1px solid var(--silver-line);padding:66px 0 58px}
.phead h1{
  font-family:'Playfair Display',Georgia,serif;font-weight:900;
  font-size:clamp(36px,7vw,72px);line-height:.98;letter-spacing:-.028em;
}
.phead h1 em{font-style:italic;color:var(--gold)}

/* ---------------- buttons ---------------- */
.btn{
  font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;
  padding:15px 28px;border:1px solid var(--gold);color:var(--gold-ink);background:transparent;
  transition:background .18s,color .18s,border-color .18s;display:inline-block;
  cursor:pointer;font-family:inherit;
}
.btn:hover{background:var(--gold-ink);color:#fff}
.btn-solid{background:var(--gold-ink);color:#fff;border-color:var(--gold-ink)}
.btn-solid:hover{background:var(--gold-lt);border-color:var(--gold-lt);color:var(--ink)}
.btn-light{border-color:rgba(255,255,255,.55);color:#fff}
.btn-light:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn-quiet{border-color:var(--silver-line);color:var(--ink-soft)}
.btn-quiet:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.btn[aria-disabled="true"]{border-style:dashed;color:var(--silver-ink);cursor:default}
.btn[aria-disabled="true"]:hover{background:transparent;color:var(--silver-ink);border-color:var(--silver-line)}

/* ---------------- sections ---------------- */
section{padding:96px 0}
.rule{border-top:1px solid var(--silver-line)}
.sec-label{font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--silver-ink);margin-bottom:30px}
h2{
  font-family:'Playfair Display',Georgia,serif;font-weight:700;
  font-size:clamp(32px,5.2vw,60px);line-height:1.06;letter-spacing:-.022em;margin-bottom:26px;
}
h2 em{font-style:italic;color:var(--gold)}
h3{font-family:'Playfair Display',Georgia,serif;font-size:26px;font-weight:700}
.body{font-size:15px;line-height:1.85;color:var(--ink-soft);max-width:38em}
.body + .body{margin-top:18px}
.body strong{color:var(--ink);font-weight:500}
.lede{font-size:16px}
.inline-link{color:var(--gold-ink);border-bottom:1px solid var(--gold-pale)}
.inline-link:hover{border-bottom-color:var(--gold)}

/* ---------------- the plate ---------------- */
.plate{margin:44px auto 0;max-width:660px;background:var(--paper);border:1px solid var(--silver-line);padding:5px}
.plate-inner{border:1px solid var(--gold-pale)}
.plate-top{text-align:center;padding:26px 24px 0}
.plate-eyebrow{font-size:10px;letter-spacing:.34em;text-transform:uppercase;color:var(--silver-ink)}
.amount{
  font-family:'JetBrains Mono',ui-monospace,monospace;font-weight:700;
  font-size:clamp(46px,10vw,92px);line-height:1.05;color:var(--gold);
  letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin:14px 0 6px;
}
.amount.pending{font-size:clamp(15px,3.2vw,22px);font-weight:400;line-height:1.6;color:var(--ink-soft);letter-spacing:0;padding:10px 0}
.amount.pending .ph{background:var(--gold-pale)}
.plate-sub{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--silver-ink);padding-bottom:24px}
.plate-rows{border-top:1px solid var(--silver-line)}
.prow{
  display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:baseline;
  padding:16px 26px;border-bottom:1px solid var(--silver-pale);
}
.prow:last-child{border-bottom:none}
.prow-k{
  font-family:'Playfair Display',Georgia,serif;font-size:26px;font-weight:900;
  color:var(--gold);line-height:1;min-width:2.6em;
}
.prow-t{font-size:12px;letter-spacing:.06em;color:var(--ink-soft);line-height:1.7}
.prow-t b{color:var(--ink);font-weight:500;display:block;margin-bottom:3px}

/* ---------------- the Women's Open ----------------
   Small banner: ribbon, one big line, one small line, one link. */
.ribbon{flex:none;display:block;width:38px;height:62px}
.ribbon path{fill:none;stroke-width:10}
.ribbon .strand{stroke:var(--pink)}
.ribbon .gap{stroke:var(--pink-ground);stroke-width:16}
.ribbon-lg{width:54px;height:88px}

.cause{background:var(--pink-ground);border-top:1px solid var(--pink-line);border-bottom:1px solid var(--pink-line);padding:30px 0}
.cause-row{display:flex;align-items:center;gap:24px}
.cause-text{flex:1;min-width:0}
.cause-title{
  font-family:'Playfair Display',Georgia,serif;font-weight:900;
  font-size:clamp(28px,4.4vw,46px);line-height:1.02;letter-spacing:-.022em;
  color:var(--pink-deep);margin:0;
}
.cause-line{font-size:14px;line-height:1.7;color:var(--ink);margin-top:8px}
.cause-btn{flex:none;background:var(--pink-deep);border-color:var(--pink-deep);color:#fff}
.cause-btn:hover{background:var(--ink);border-color:var(--ink);color:#fff}

/* The explainer page, /womens-open */
.phead-pink{background:var(--pink-ground);border-bottom-color:var(--pink-line)}
.phead-pink .sec-label{color:var(--pink-deep);margin-bottom:18px}
.phead-row{display:flex;align-items:center;gap:30px}
.phead-pink .phead-sub{font-family:'Playfair Display',Georgia,serif;font-weight:700;font-size:clamp(20px,2.6vw,28px);color:var(--pink-deep);margin-top:14px}
.pinkpage h2 em{color:var(--pink-deep)}
.pinkpage .btn-solid{background:var(--pink-deep);border-color:var(--pink-deep);color:#fff}
.pinkpage .btn-solid:hover{background:var(--ink);border-color:var(--ink);color:#fff}

/* ---------------- grids & cards ---------------- */
.grid2,.grid3,.grid4{display:grid;gap:1px;background:var(--silver-line);margin-top:40px}
.grid2{grid-template-columns:repeat(2,1fr)}
.grid3{grid-template-columns:repeat(3,1fr)}
.grid4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--white);padding:32px 26px}
.card h3{margin-bottom:12px}
.card .tag{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:14px}
.card p{font-size:13px;line-height:1.8;color:var(--ink-soft)}
.card p + p{margin-top:14px}
.card .act{margin-top:22px}
.card.center{text-align:center}
.card.center h3{font-size:24px;margin-bottom:8px}
.card.center p{font-size:12px}
.card.muted{background:var(--silver-pale)}

.fact{background:var(--white);padding:30px 26px}
.fact dt{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--silver-ink);margin-bottom:12px}
.fact dd{font-size:14px;line-height:1.75;color:var(--ink-soft)}
.fact dd strong{color:var(--ink);font-weight:500}

.pc{background:var(--white);padding:34px 28px}
.pc .amt{font-family:'Playfair Display',Georgia,serif;font-size:44px;font-weight:900;color:var(--gold);line-height:1;margin-bottom:12px}
.pc .amt .ph{font-family:'JetBrains Mono',monospace;font-size:18px;font-weight:400}
.pc .lbl{font-size:11px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:10px}
.pc p{font-size:13px;line-height:1.75;color:var(--ink-soft)}

/* ---------------- tables ---------------- */
.tbl{width:100%;border-collapse:collapse;margin-top:36px;font-size:13px}
.tbl caption{text-align:left;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--silver-ink);padding-bottom:14px}
.tbl th,.tbl td{text-align:left;padding:16px 18px;border-bottom:1px solid var(--silver-line);vertical-align:top}
.tbl thead th{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--silver-ink);font-weight:400;border-bottom-color:var(--ink)}
.tbl td.num{font-variant-numeric:tabular-nums;text-align:right;color:var(--ink);font-weight:500}
.tbl td.strong{color:var(--ink);font-weight:500}
.tbl tbody tr:last-child td{border-bottom:1px solid var(--silver-line)}
.tbl .sub{display:block;color:var(--silver-ink);font-size:11px;margin-top:4px}
.empty{border:1px dashed var(--silver-line);padding:34px 26px;text-align:center;color:var(--ink-soft);font-size:13px;margin-top:36px}

/* ---------------- notes & rules ---------------- */
.note{border-left:2px solid var(--gold);padding:4px 0 4px 20px;margin-top:32px;max-width:38em}
.note h3{font-size:20px;margin-bottom:10px}
.note p{font-size:14px;line-height:1.8;color:var(--ink-soft)}
.stack{margin-top:36px}
.stack .item{border-top:1px solid var(--silver-line);padding:22px 0}
.stack .item:last-child{border-bottom:1px solid var(--silver-line)}
.stack .item b{display:block;font-weight:500;color:var(--ink);font-size:14px;margin-bottom:6px}
.stack .item p{font-size:13px;line-height:1.8;color:var(--ink-soft);max-width:42em}

/* status dots for "what's open right now" */
.stat{display:flex;align-items:baseline;gap:12px}
.dot{width:7px;height:7px;flex:none;background:var(--silver-line);transform:translateY(-1px)}
.dot.open{background:var(--gold)}
.dot.shut{background:var(--silver)}

/* ---------------- organizer ---------------- */
.org{background:var(--silver-pale);border-top:1px solid var(--silver-line);border-bottom:1px solid var(--silver-line)}
.org .wrap{padding-top:60px;padding-bottom:60px}
.org-name{font-family:'Playfair Display',Georgia,serif;font-size:clamp(26px,4vw,40px);font-weight:700;margin-bottom:16px}
.org-roles{font-size:13px;line-height:2;color:var(--ink-soft)}
.org-roles b{color:var(--ink);font-weight:500}

/* ---------------- footer ---------------- */
footer{padding:56px 0 68px}
.fgrid{display:flex;flex-wrap:wrap;gap:36px;justify-content:space-between;align-items:flex-start}
.fnav{display:flex;flex-wrap:wrap;gap:22px;max-width:620px}
.fnav a{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
.fnav a:hover{color:var(--gold-ink)}
.fmeta{font-size:11px;letter-spacing:.1em;color:var(--silver-ink);line-height:2.1;text-align:right}

/* ---------------- login ---------------- */
.gate{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:40px 28px;
  background:linear-gradient(140deg,#3A3128,#191512 60%,#241D16);color:#fff}
.gate-box{width:100%;max-width:420px;background:var(--paper);color:var(--ink);border:1px solid var(--silver-line);padding:5px}
.gate-in{border:1px solid var(--gold-pale);padding:38px 32px}
.gate h1{font-family:'Playfair Display',Georgia,serif;font-size:40px;font-weight:900;line-height:.9;letter-spacing:-.03em;margin-bottom:8px}
.gate .sub{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--silver-ink);margin-bottom:28px}
.gate label{display:block;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--silver-ink);margin-bottom:10px}
.gate input{width:100%;font-family:inherit;font-size:15px;padding:14px 16px;border:1px solid var(--silver-line);background:var(--white);color:var(--ink)}
.gate input:focus{outline:2px solid var(--gold);outline-offset:0}
.gate .btn{width:100%;margin-top:18px;text-align:center}
.gate .err{font-size:12px;color:#8C2F2F;margin-top:14px;line-height:1.6}

/* ---------------- gate card (print) ---------------- */
.gcard{max-width:760px;margin:0 auto;padding:36px 28px 80px}
.gcard h1{font-family:'Playfair Display',Georgia,serif;font-size:34px;font-weight:900;letter-spacing:-.02em}
.gcard .gsub{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--silver-ink);margin:6px 0 26px}
.gcard section{padding:0;margin-top:26px}
.gcard .row{display:grid;grid-template-columns:190px 1fr;gap:16px;border-top:1px solid var(--silver-line);padding:14px 0;font-size:13px;line-height:1.7}
.gcard .row dt{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--silver-ink)}
.gcard .row dd{color:var(--ink-soft)}
.printbar{margin-top:34px}
@media print{
  .topbar,.printbar,footer{display:none!important}
  body{background:#fff}
  .gcard{padding:0;max-width:none}
  .ph{background:none;border-bottom:1px solid #999}
  a{color:#000}
}

/* ---------------- motion ---------------- */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s cubic-bezier(.16,1,.3,1)}
.reveal.in{opacity:1;transform:none}

@media(max-width:860px){.grid4,.grid3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){
  section{padding:66px 0}
  .grid2,.grid3,.grid4{grid-template-columns:1fr}
  .topnav a:not(.cta){display:none}
  .fmeta{text-align:left}
  .imgnote{display:none}
  .prow{grid-template-columns:1fr;gap:8px}
  .gcard .row{grid-template-columns:1fr;gap:4px}
  .cause{padding:26px 0}
  .cause-row{flex-wrap:wrap;gap:16px 18px}
  .cause .ribbon{width:30px;height:49px}
  .cause-btn{width:100%;text-align:center}
  .phead-row{gap:18px;align-items:flex-start}
  .ribbon-lg{width:36px;height:59px}
  .tbl th,.tbl td{padding:13px 10px}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none}
}
