/* Iron Reef — shared styles for the home, rodeo and diving pages.
   (The Eat for your Heart section has its own styles so it can stand alone.) */
:root{
  --cream:#f9f6f3; --cream-2:#f0e9e0;
  --navy:#012e4d; --navy-2:#0b3d63; --wave:#40607a; --sea:#2f6290;
  --tan:#a98262; --tan-dark:#8a6648; --tan-light:#d0c3b4;
  --ink:#1b2430; --muted:#5a6573;
  --display:"Holtwood One SC", Georgia, serif;
  --body:"Source Serif 4", Georgia, serif;
  --ui:"Work Sans", system-ui, sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--cream);color:var(--ink);font-family:var(--body);font-size:1.08rem;line-height:1.65}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.wrap{width:min(1120px,100% - 32px);margin-inline:auto}
section[id]{scroll-margin-top:72px}

/* ---------- Header ---------- */
header{position:sticky;top:0;z-index:10;background:rgba(249,246,243,.95);backdrop-filter:blur(8px);border-bottom:1px solid var(--tan-light)}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px;gap:16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--navy)}
.brand img{width:52px;height:45px;object-fit:contain}
.brand span{font-family:var(--display);font-size:1.2rem;letter-spacing:.04em}
nav ul{display:flex;gap:24px;list-style:none;font-family:var(--ui);font-weight:600;font-size:.84rem;letter-spacing:.1em;text-transform:uppercase}
nav a{text-decoration:none;color:var(--navy);padding:6px 0;border-bottom:2px solid transparent}
nav a:hover,nav a[aria-current]{border-color:var(--tan)}
.short{display:none}
@media (max-width:820px){ nav ul{gap:12px;font-size:.72rem;letter-spacing:.05em} .brand span{display:none} .full{display:none} .short{display:inline} nav .hide-sm{display:none} }

/* ---------- Shared pieces ---------- */
.eyebrow{font-family:var(--ui);font-weight:600;font-size:.8rem;letter-spacing:.24em;text-transform:uppercase;color:var(--tan)}
.section-title{font-family:var(--display);font-size:clamp(1.9rem,4.4vw,3rem);line-height:1.12;margin:8px 0 16px;letter-spacing:.02em}
.lede{font-size:1.15rem;max-width:62ch}
.btns{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-block;font-family:var(--ui);font-weight:600;font-size:.88rem;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;padding:14px 24px;border-radius:3px;border:2px solid var(--navy);transition:.2s}
.btn.solid{background:var(--navy);color:var(--cream)}
.btn.solid:hover{background:var(--navy-2)}
.btn.line{color:var(--navy)}
.btn.line:hover{background:var(--navy);color:var(--cream)}
.btn.tan{background:var(--tan);border-color:var(--tan);color:#fff}
.btn.tan:hover{background:var(--tan-dark);border-color:var(--tan-dark)}
.btn.light{border-color:var(--cream);color:var(--cream)}
.btn.light:hover{background:var(--cream);color:var(--navy)}
.wave{display:block;width:100%;height:80px}

/* Page banner (rodeo + diving pages) */
.banner{padding:72px 0 64px}
.banner.rodeo{background:var(--tan);color:#fff}
.banner.dive{background:var(--navy);color:var(--cream)}
.banner .eyebrow{color:inherit;opacity:.85}
.banner h1{font-family:var(--display);font-size:clamp(2.1rem,5.5vw,3.6rem);line-height:1.08;letter-spacing:.02em;margin:10px 0 14px}
.banner p{max-width:62ch;font-size:1.15rem;opacity:.95}
.banner .btns{margin-top:28px}

/* Numbered offer cards */
.offer{margin-top:40px;display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
@media (max-width:760px){.offer{grid-template-columns:1fr}}
.offer-item{padding:28px 28px 30px;border-radius:4px;background:var(--cream-2);border:1px solid var(--tan-light)}
.offer-item .n{font-family:var(--ui);font-weight:600;color:var(--tan);letter-spacing:.2em;font-size:.78rem}
.offer-item h3{font-family:var(--body);font-weight:600;font-size:1.3rem;color:var(--navy);margin:4px 0 8px;line-height:1.25}
.offer-item p{color:var(--muted)}
.sec-cta{margin-top:44px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.sec-cta span{color:var(--muted)}

/* Light and dark section bands */
.band{padding:88px 0}
.band.light .section-title{color:var(--navy)}
.band.dark{background:var(--navy);color:var(--cream)}
.band.dark .lede{color:#d4dde7}
.band.dark .offer-item{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)}
.band.dark .offer-item h3{color:var(--cream)}
.band.dark .offer-item p{color:#c3cfdb}
.band.dark .sec-cta span{color:#c3cfdb}

/* Contact */
.contact{padding:88px 0;text-align:center;background:var(--cream-2);border-top:1px solid var(--tan-light)}
.contact .section-title{color:var(--navy)}
.contact p{color:var(--muted);max-width:54ch;margin:0 auto 28px}
.contact .btns{justify-content:center}
.contact-lines{display:flex;gap:28px;justify-content:center;flex-wrap:wrap;margin-top:30px;font-family:var(--ui);font-weight:500}
.contact-lines a{color:var(--navy);text-decoration:none;border-bottom:1px solid var(--tan-light)}
.contact-lines a:hover{border-color:var(--navy)}
.contact-lines span{color:var(--navy)}

/* Footer */
footer{background:var(--navy);color:#b9c6d3;padding:32px 0;font-family:var(--ui);font-size:.85rem}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center}
footer .star{color:var(--tan);margin-inline:8px}
footer a,footer nav a{color:#b9c6d3;text-decoration:none;padding:0;border-bottom:1px solid rgba(185,198,211,.4)}
footer nav a:hover{color:#fff;border-color:#fff}
footer nav{display:flex;gap:18px;flex-wrap:wrap}

/* Eat for your Heart link: last in the menu, with its own heart-beet mark */
nav li.efyh-link{padding-left:22px;border-left:1px solid var(--tan-light)}
nav li.efyh-link a{display:inline-flex;align-items:center;gap:7px;color:#9B1B42}
nav li.efyh-link a:hover,nav li.efyh-link a[aria-current]{border-color:#C2385F}
nav li.efyh-link img{width:17px;height:20px;flex:none}
@media (max-width:820px){ nav li.efyh-link{padding-left:10px} nav li.efyh-link a{gap:4px} nav li.efyh-link img{width:14px;height:16px} }
nav ul{align-items:center}

/* ---------- Accessibility ---------- */
:root{--tan-text:#7d5c3f;--tan-on-dark:#d4b896}
.eyebrow,.offer-item .n{color:var(--tan-text)}
.banner.rodeo,.path.rodeo{background:var(--tan-dark)}
.banner .eyebrow,.path .eyebrow{opacity:1}
.banner p,.path p{opacity:1}
.btn.tan{background:var(--tan-dark);border-color:var(--tan-dark)}
.btn.tan:hover{background:#6f5034;border-color:#6f5034}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--navy);color:#fff;font:600 .9rem var(--ui);padding:10px 16px;border-radius:4px;text-decoration:none}
.skip:focus{top:12px}
:focus-visible{outline:3px solid #2f6290;outline-offset:3px}
.dark :focus-visible,.path.dive:focus-visible,footer :focus-visible,.intro :focus-visible{outline-color:#f9f6f3}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none !important;animation:none !important}}
.dark .eyebrow{color:var(--tan-on-dark)}

/* Shop strip (gear cards linking to the store) */
.gear{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:32px}
@media (max-width:900px){.gear{grid-template-columns:repeat(2,1fr)}}
.gear a{display:flex;flex-direction:column;background:#fff;border:1px solid var(--tan-light);border-radius:4px;text-decoration:none;overflow:hidden;transition:.2s}
.gear a:hover{border-color:var(--tan);transform:translateY(-2px)}
.gear img{aspect-ratio:1;object-fit:cover;width:100%;background:var(--cream-2)}
.gear b{font-family:var(--body);font-weight:600;color:var(--navy);padding:12px 14px 2px;line-height:1.3}
.gear span{font-family:var(--ui);font-size:.82rem;color:var(--muted);padding:0 14px 14px}
