/*
Theme Name: BB Competition
Theme URI: https://bbcomp.tech.uci.edu
Description: Custom theme for the Beall & Butterworth Competition at UC Irvine. UCI brand colors, Arial with self-hosted Roboto Slab accents, WCAG 2.1 AA.
Version: 1.4.0
Author: Beall & Butterworth Competition
Author URI: https://bbcomp.tech.uci.edu
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bbcomp
*/

/* Roboto Slab (SIL Open Font License 1.1, see fonts/OFL-LICENSE.txt). Headings accents only, per brand.uci.edu. */
@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/roboto-slab-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/roboto-slab-latin-700-normal.woff2') format('woff2')}

:root{--navy:#1B3D6D;--navy-dark:#002244;--blue:#255799;--gold:#FECC07;--gold-deep:#F0AB00;--teal:#00B0CA;--teal-tint:#EAF6F8;--ink:#1A1D21;--gray:#555759;--gray-light:#C6BEB5;--paper:#FFFFFF;--paper-alt:#F5F3F1;--line:#DDD7CE;--radius:3px;--wrap:1120px}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;font-family:Arial,Helvetica,sans-serif;font-size:1.0625rem;line-height:1.65;color:var(--ink);background:var(--paper)}
h1,h2,h3,h4{font-family:Arial,Helvetica,sans-serif;font-weight:700;color:var(--navy-dark);line-height:1.2;margin:0 0 .5em}
h1{font-size:clamp(2rem,4.5vw,3.25rem)}h2{font-size:clamp(1.55rem,3vw,2.15rem)}h3{font-size:1.25rem}
p{margin:0 0 1em}
img{max-width:100%;height:auto}
a{color:var(--blue);text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
main:focus{outline:none}
:focus-visible{outline:3px solid var(--navy-dark);outline-offset:3px;box-shadow:0 0 0 6px var(--gold)}
.site-header :focus-visible,.hero :focus-visible,.page-hero :focus-visible,.newsletter :focus-visible,.site-footer :focus-visible{outline-color:var(--gold);box-shadow:0 0 0 6px var(--navy-dark)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 1.5rem}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--gold);color:var(--navy-dark);padding:.75rem 1.25rem;font-weight:700;z-index:100}
.skip-link:focus{left:1rem;top:1rem}
.kicker{font-family:'Roboto Slab',Georgia,serif;font-size:1rem;font-weight:500;letter-spacing:.02em;margin:0 0 .75rem}
.screen-reader-text,.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ── Header (white UCI wordmark sits on UCI Dark Blue) ── */
.site-header{background:var(--navy-dark);color:#fff}
.brand-row{display:flex;align-items:center;gap:1.25rem;padding:1.1rem 0 .6rem;flex-wrap:wrap}
.brand-row a.brand{display:flex;align-items:center;gap:1.25rem;text-decoration:none;color:#fff;flex-wrap:wrap}
.brand-row img{height:34px;width:auto;display:block}
.lockup{border-left:1px solid var(--gray-light);padding-left:1.25rem;line-height:1.15}
.lockup strong{display:block;font-size:1.15rem;color:#fff}
.lockup span{font-size:.8rem;color:#fff;font-weight:500;letter-spacing:.06em;text-transform:uppercase}
.nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0 1.75rem}
.nav a,.nav button{font:600 .95rem Arial,Helvetica,sans-serif;color:#fff;text-decoration:none;background:none;border:0;border-bottom:2px solid transparent;padding:.7rem 0;cursor:pointer;display:inline-block}
.nav a:hover,.nav button:hover{border-bottom-color:var(--gold)}
.nav a[aria-current="page"]{border-bottom-color:var(--gold)}
.has-sub{position:relative}
.nav .sub{display:none;position:absolute;top:100%;left:0;background:var(--paper);border:1px solid var(--line);border-top:2px solid var(--gold);min-width:9rem;padding:.5rem 1rem;z-index:20;columns:2;column-gap:1.5rem;gap:0}
.nav .sub.open{display:block}
.nav .sub li{list-style:none}
.nav .sub a{color:var(--navy-dark);padding:.3rem 0;font-weight:500}
.nav .sub a:hover{color:var(--blue)}
.nav .sub :focus-visible{outline-color:var(--navy-dark);box-shadow:0 0 0 6px var(--gold)}

/* ── Buttons ── */
.btn{display:inline-block;font:700 1rem Arial,Helvetica,sans-serif;background:var(--gold);color:var(--navy-dark);border:2px solid var(--gold);border-radius:var(--radius);padding:.8rem 1.6rem;text-decoration:none;cursor:pointer;transition:background .15s}
.btn:hover,.btn:active{background:var(--gold-deep);border-color:var(--gold-deep);color:var(--navy-dark)}
.btn-outline{background:transparent;color:#fff;border-color:#fff}
.btn-outline:hover{background:#fff;border-color:#fff;color:var(--navy-dark)}
.btn-dark{background:var(--navy-dark);border-color:var(--navy-dark);color:#fff}
.btn-dark:hover{background:var(--navy);border-color:var(--navy);color:#fff}

/* ── Hero ── */
.hero{background:var(--navy);color:#fff;padding:4.5rem 0 0}
.hero h1{color:#fff;max-width:20ch}
.hero .kicker{color:var(--gold)}
.hero p.lede{font-size:1.2rem;max-width:56ch;color:#fff}
.hero .actions{display:flex;gap:1rem;flex-wrap:wrap;margin:1.75rem 0 3.5rem}
.prize-strip{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--blue);margin:0;padding:0;list-style:none}
.prize-strip li{padding:1.5rem 1rem 1.75rem 0}
.prize-strip li+li{padding-left:1.5rem;border-left:1px solid var(--blue)}
.prize-amount{font-family:'Roboto Slab',Georgia,serif;font-weight:700;font-size:clamp(1.8rem,4vw,2.75rem);color:var(--gold);display:block;line-height:1.1}
.prize-label{font-size:.9rem;font-weight:600;color:#fff;letter-spacing:.04em;text-transform:uppercase}

/* ── Sections ── */
section{padding:4.5rem 0}
.alt{background:var(--paper-alt)}
.section-head{max-width:60ch;margin-bottom:2.5rem}
.section-head .kicker{color:var(--blue)}
.lead{font-size:1.15rem;max-width:62ch}
.two-col{display:grid;grid-template-columns:1fr 1fr}
.two-col>div{padding:0 2.5rem}
.two-col>div:first-child{padding-left:0;border-right:1px solid var(--line)}
.two-col>div:last-child{padding-right:0}
.gold-list{list-style:none;padding:0;margin:1rem 0 0}
.gold-list li{position:relative;padding-left:1.4rem;margin-bottom:.5rem}
.gold-list li::before{content:"";position:absolute;left:0;top:.7em;width:.55rem;height:.55rem;background:var(--gold);border:1px solid var(--navy-dark)}
.sub-heading{font-size:1.4rem;padding-bottom:.75rem;border-bottom:2px solid var(--navy-dark);margin:2.5rem 0 0}

/* Stats */
.stats{background:var(--paper-alt);border-bottom:1px solid var(--line)}
.stats ul{list-style:none;margin:0 auto;padding:2rem 1.5rem;max-width:var(--wrap);display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.stat-num{font-family:'Roboto Slab',Georgia,serif;font-weight:700;font-size:clamp(1.8rem,3.5vw,2.5rem);color:var(--blue);display:block;line-height:1.1}
.stat-label{font-size:.9rem;font-weight:600;color:var(--gray);letter-spacing:.04em;text-transform:uppercase}

/* Stages */
.stage-list{list-style:none;counter-reset:stage;margin:0;padding:0}
.stage-list li{counter-increment:stage;display:grid;grid-template-columns:3.5rem 12rem 1fr;gap:1rem;padding:1.1rem 0;border-bottom:1px solid var(--line);align-items:baseline}
.stage-list li::before{content:counter(stage);font-family:'Roboto Slab',Georgia,serif;font-weight:700;font-size:1.8rem;color:var(--blue);line-height:1}
.stage-name{font-weight:700;color:var(--navy-dark)}

/* Table (rubric) */
.table-scroll{overflow-x:auto;margin-top:1.5rem}
.table-scroll:focus-visible{outline:3px solid var(--navy-dark);outline-offset:3px}
.rubric-table{width:100%;border-collapse:collapse;min-width:34rem}
.rubric-table caption{text-align:left;font-weight:700;font-size:1.4rem;color:var(--navy-dark);padding-bottom:.75rem;border-bottom:2px solid var(--navy-dark)}
.rubric-table th,.rubric-table td{text-align:left;padding:1rem 1rem 1rem 0;border-bottom:1px solid var(--line);vertical-align:top}
.rubric-table thead th{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gray);font-weight:600}
.rubric-table tbody th{font-weight:700;color:var(--navy-dark)}

/* Awards */
.award-grid{list-style:none;margin:1.25rem 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1rem}
.award-card{background:var(--paper);border:1px solid var(--line);border-top:4px solid var(--gold);padding:1.25rem}
.award-card-podium{border-top-color:var(--navy-dark)}
.award-amount{display:block;font-family:'Roboto Slab',Georgia,serif;font-weight:700;font-size:1.7rem;color:var(--blue);line-height:1.1}
.award-name{display:block;font-weight:700;color:var(--navy-dark);margin:.35rem 0}
.award-desc{display:block;font-size:.95rem;color:var(--gray)}
.award-rules{margin:1.75rem 0 0;padding-left:1.2rem}
.award-rules li{margin-bottom:.4rem}

/* Winners */
.track{margin-bottom:3.5rem}
.track>h3{font-size:1.4rem;padding-bottom:.75rem;border-bottom:2px solid var(--navy-dark);margin-bottom:0}
.track>h3 small{display:block;font:500 .9rem Arial,Helvetica,sans-serif;color:var(--gray);margin-top:.25rem}
.winners-list{list-style:none;margin:0;padding:0}
.winner{display:grid;grid-template-columns:5.5rem 1fr;gap:1rem 1.5rem;padding:1.75rem 0;border-bottom:1px solid var(--line)}
.rank{font-family:'Roboto Slab',Georgia,serif;font-weight:700;font-size:3.5rem;line-height:1;color:var(--blue)}
.rank span{display:block;font:600 .75rem Arial,Helvetica,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--gray);margin-top:.35rem}
.winner h4{font-size:1.4rem;margin-bottom:.25rem}
.members{color:var(--gray);font-size:.95rem;margin-bottom:.6rem}
.winner.intl{background:var(--teal-tint);border-left:6px solid var(--teal);padding-left:1.5rem}
.winner-tag{display:inline-block;font:700 .75rem Arial,Helvetica,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--navy-dark);margin-bottom:.4rem}
.winners-note{margin-top:2rem}

/* Timeline (schedule) */
.timeline{list-style:none;margin:0;padding:0;border-left:2px solid var(--navy-dark)}
.timeline li{position:relative;padding:0 0 1.5rem 1.5rem}
.timeline li::before{content:"";position:absolute;left:-.55rem;top:.35rem;width:.9rem;height:.9rem;background:var(--gold);border:2px solid var(--navy-dark)}
.timeline-date{font-family:'Roboto Slab',Georgia,serif;font-weight:500;color:var(--blue);display:block}
.timeline-event{font-weight:700;color:var(--navy-dark);display:block}
.timeline-detail{font-size:.95rem;color:var(--gray);display:block}

/* Sprints */
.sprint-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1rem}
.sprint-card{background:var(--paper);border:1px solid var(--line);border-left:6px solid var(--teal);padding:1.25rem}
.sprint-badge{display:block;font:700 .75rem Arial,Helvetica,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);margin-bottom:.35rem}
.sprint-title{display:block;font-weight:700;color:var(--navy-dark);font-size:1.1rem}
.sprint-what{display:block;font-size:.95rem;margin:.35rem 0}
.sprint-meta{display:block;font-size:.85rem;color:var(--gray)}
.sprint-note{margin-top:1.75rem}

/* FAQ */
details{border-bottom:1px solid var(--line)}
details:first-of-type{border-top:1px solid var(--line)}
summary{list-style:none;cursor:pointer;font-weight:700;color:var(--navy-dark);padding:1.15rem 3rem 1.15rem 0;position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:.5rem;top:.8rem;font:700 1.6rem 'Roboto Slab',Georgia,serif;color:var(--blue)}
details[open] summary::after{content:"\2013"}
details .answer{padding:0 3rem 1.25rem 0}

/* Newsletter (MailOptin form restyled) */
.newsletter{background:var(--navy);color:#fff;padding:3.5rem 0}
.newsletter h2{color:#fff}
.newsletter p{color:#fff}
.newsletter-embed{margin-top:1.25rem;max-width:40rem}
.newsletter-embed .mo-optin-form-wrapper,.newsletter-embed .mo-optin-form-container{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;width:100%!important;max-width:none!important}
.newsletter-embed form{display:flex;gap:.75rem;flex-wrap:wrap}
.newsletter-embed label{display:block;font-weight:600;margin-bottom:.35rem;color:#fff}
.newsletter-embed input[type=email],.newsletter-embed input[type=text]{width:100%;font:1rem Arial,Helvetica,sans-serif;padding:.8rem 1rem;border:2px solid var(--gold);border-radius:var(--radius);background:#fff;color:var(--ink)}
.newsletter-embed input[type=submit],.newsletter-embed button[type=submit]{font:700 1rem Arial,Helvetica,sans-serif;background:var(--gold);color:var(--navy-dark);border:2px solid var(--gold);border-radius:var(--radius);padding:.8rem 1.6rem;cursor:pointer}
.newsletter-embed input[type=submit]:hover,.newsletter-embed button[type=submit]:hover{background:var(--gold-deep);border-color:var(--gold-deep)}
.newsletter-embed a{color:#fff}
.newsletter .fine{font-size:.875rem;margin-top:.75rem}

/* ── Footer ── */
.site-footer{background:var(--navy-dark);color:#fff;padding:3.5rem 0 2rem;position:relative;overflow:hidden}
.site-footer .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;position:relative}
.footer-heading{font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin-bottom:.5rem}
.site-footer a{color:#fff}
.site-footer p{color:var(--gray-light)}
.copy{border-top:1px solid var(--navy);margin-top:2.5rem;padding-top:1.25rem;font-size:.85rem;color:var(--gray-light);position:relative}
.anteater{position:absolute;right:-2rem;bottom:-1rem;height:280px;opacity:.06;pointer-events:none}

/* ── Inner pages ── */
.page-hero{background:var(--navy);color:#fff;padding:3.5rem 0}
.page-hero h1{color:#fff;margin:0}
.page-hero .kicker{color:var(--gold)}
.page-body{padding:3rem 0 4.5rem}
.page-body .wrap{max-width:60rem}
.entry-content{font-size:1.0625rem}
.entry-content img{max-width:100%;height:auto}
.entry-content ul,.entry-content ol{margin:0 0 1.2em 1.4rem;padding:0}
.entry-content li{margin-bottom:.45rem}
.entry-content h2,.entry-content .bb-h{font-size:1.75rem;margin:2.5rem 0 1rem;padding-bottom:.5rem;border-bottom:2px solid var(--navy-dark)}
.entry-content h3,.entry-content .bb-h3{font-size:1.15rem;margin:1.75rem 0 .6rem;color:var(--blue)}
.entry-content .bb-sub{color:var(--gray);font-size:.95rem}
.entry-content .bb-note{color:var(--gray);font-size:.95rem;border-left:6px solid var(--gold);background:var(--paper-alt);padding:1rem 1.25rem}
.bb-results{display:grid;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));gap:1rem}
.bb-result{background:var(--paper);border:1px solid var(--line);border-top:4px solid var(--gold);padding:1.25rem}
.entry-content .bb-result h3{font-size:1.2rem;margin:.5rem 0;color:var(--navy-dark)}
.bb-result p{font-size:.95rem;color:var(--ink);margin-bottom:.6rem}
.bb-result .bb-team{font-size:.9rem;color:var(--gray)}
.bb-place{display:inline-block;font:700 .75rem Arial,Helvetica,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--navy-dark);background:var(--teal-tint);border-left:4px solid var(--teal);padding:.25rem .6rem}
.bb-table{width:100%;border-collapse:collapse;margin-bottom:1rem}
.bb-table th,.bb-table td{text-align:left;padding:.8rem 1rem .8rem 0;border-bottom:1px solid var(--line);vertical-align:top;overflow-wrap:anywhere}
.bb-table thead th{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gray);font-weight:600;border-bottom:2px solid var(--navy-dark)}
.bb-table td:first-child,.bb-table tbody th{font-weight:700;color:var(--navy-dark);width:28%}
.bb-people{display:grid;grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));gap:.75rem}
.bb-person{background:var(--paper-alt);border-left:6px solid var(--gold);padding:.9rem 1.1rem}
.bb-person strong{display:block;color:var(--navy-dark)}
.bb-person span{display:block;font-size:.9rem;color:var(--gray);line-height:1.5;margin-top:.15rem}
.bb-sponsor{display:grid;grid-template-columns:180px 1fr;gap:2rem;align-items:start;margin-bottom:1.5rem}
.bb-sponsor-img{width:180px;height:auto}
.entry-content .bb-sponsor .bb-h{margin-top:0}
.callout{border-left:6px solid var(--gold);background:var(--paper-alt);padding:1.5rem 1.75rem;margin:0 0 2rem}
.callout .kicker{color:var(--blue);margin-bottom:.25rem}

/* Elementor pages keep Elementor's layout; theme just supplies the brand tokens */
.elementor-page .page-body{padding:0}
.elementor-page .page-body .wrap{max-width:none;padding:0}

/* 404 */
.notfound{text-align:left}

@media(max-width:820px){
  .prize-strip,.site-footer .grid,.two-col{grid-template-columns:1fr}
  .prize-strip li+li{padding-left:0;border-left:0;border-top:1px solid var(--blue)}
  .two-col>div{padding:1.5rem 0;border:0!important}
  .stats ul{grid-template-columns:repeat(2,1fr)}
  .stage-list li{grid-template-columns:2.5rem 1fr}
  .stage-text{grid-column:2}
  .winner{grid-template-columns:3.5rem 1fr}
  .rank{font-size:2.5rem}
  .nav .sub{position:static;columns:1;border:0;border-top:2px solid var(--gold)}
  .bb-sponsor{grid-template-columns:1fr;gap:1rem}
  .bb-table td:first-child,.bb-table tbody th{width:auto}
  .lockup{border-left:0;padding-left:0}
}
@media(max-width:560px){
  .section-head,.lead{max-width:none}
  section{padding:3rem 0}
  .hero{padding-top:3rem}
  .bb-table th,.bb-table td{padding:.6rem .4rem .6rem 0;font-size:.9rem}
  .anteater{height:200px}
}
@media(forced-colors:active){.btn{border:2px solid ButtonText}.winner.intl{border-left-color:Highlight}.award-card,.sprint-card{border:1px solid CanvasText}}
