/* ===== Seaview Foods — Unified Site CSS (2025-10-23 rev D) ===== */

:root{
  --navy:#0b3c5d;
  --navy-600:#0f3557;
  --gold:#e3b307;
  --gold-200:#f2d768;
  --page-bg:#f4f8fc;
  --ink:#15222c;
  --muted:#5b7083;
  --ring:rgba(9,56,94,.14);
  --shadow:0 1px 2px rgba(0,0,0,.04);

  /* layout constants */
  --header-h: 96px;       /* fixed header total height incl. divider */
  --footer-h: 48px;       /* fixed footer height */
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{height:100%}
body{
  margin:0; color:var(--ink); background:var(--page-bg);
  font:16px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,Inter,Arial,sans-serif;

  /* Keep content clear of fixed header & footer */
  padding-top: var(--header-h);
  padding-bottom: calc(var(--footer-h) + 12px);
}

img{max-width:100%;height:auto;display:block}

/* Main page container */
.container{max-width:1100px;margin:0 auto;padding:0 14px}

/* Header container slightly tighter left than content */
.container--header{max-width:1100px;margin:0 auto;padding:0 0}

/* Common inner content wrapper */
.wrap{max-width:1000px;margin:0 auto;padding:22px 14px}

a,button,.btn,input,select,textarea{outline-color:var(--gold)}
button,.btn{cursor:pointer}
.btn{display:inline-block;padding:.6rem .95rem;border-radius:12px;font-weight:700;text-decoration:none;border:1px solid transparent;transition:filter .15s}
.btn-primary{background:var(--gold);color:var(--navy);border-color:var(--gold)}
.btn-primary:hover{filter:brightness(.96)}
.card{background:#fff;border:1px solid var(--ring);border-radius:16px;box-shadow:var(--shadow);overflow:hidden}

/* ===== Header / Nav (now FIXED) ===== */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  background:#fff; border-bottom:1px solid var(--ring);
  box-shadow:0 2px 10px rgba(0,0,0,.04);
}
.header-top{background:var(--navy);color:#fff}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0}

/* Your chosen left shift for the brand */
.brand{display:flex;align-items:center;gap:10px;margin-left:-160px}
.brand img{width:48px;height:48px;object-fit:contain}
.brand-name,.tagline{color:#fff}
.brand-name{font-weight:800}
.tagline{font-size:.9rem}

/* Keep mobile tidy: reset the large negative margin on small screens */
@media (max-width:880px){
  .brand{ margin-left:0; }
}

.header-divider{height:4px;background:var(--gold)}

nav{display:flex;align-items:center;gap:10px}
nav a{color:#fff;text-decoration:none;font-weight:600;padding:8px 10px;border-radius:10px;border:1px solid transparent}
nav a:hover{background:rgba(255,255,255,.12)}
nav a.active,[aria-current="page"]{border-color:#fff}

/* mobile nav */
.nav-toggle{display:none;border:1px solid var(--ring);background:#fff;color:#0b3c5d;padding:8px 10px;border-radius:10px}
@media (max-width:880px){
  .header-inner{flex-wrap:wrap}
  .nav-toggle{display:inline-flex;align-items:center;gap:8px;margin-right:4px}
  nav{width:100%;order:3;flex-direction:column;align-items:flex-start;padding:8px 0;display:none}
  nav.open{display:flex}
  nav a{width:100%}
}

/* ===== Page headings ===== */
.page-title{margin:10px 0 6px;color:var(--navy-600)}
.page-sub{margin:0 0 20px;color:var(--muted)}

/* ===== About (founders) ===== */
.about-grid{display:grid;gap:22px;grid-template-columns:1.1fr .9fr;align-items:start}
@media (max-width:960px){.about-grid{grid-template-columns:1fr}}
.founders-figure img{
  border:none !important;               /* avoid double gold ring */
  width:clamp(300px,40vw,460px);
  margin:0 auto;
}
.founders-figure figcaption{margin-top:8px;color:var(--muted);text-align:center}

/* ===== Catering ===== */
.cater-wrap{display:grid;gap:18px;grid-template-columns:1.2fr .8fr}
@media (max-width:980px){.cater-wrap{grid-template-columns:1fr}}
.cater-tiles{display:grid;gap:14px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:720px){.cater-tiles{grid-template-columns:1fr}}
.cater-card{background:#fff;border:1px solid var(--ring);border-radius:16px;padding:14px}
.cater-card h3{margin:6px 0 6px;color:var(--navy-600)}
.cater-note{margin:10px 0 0}
.field-row{display:grid;gap:12px;grid-template-columns:1fr 1fr}
@media (max-width:720px){.field-row{grid-template-columns:1fr}}
.form-card{background:#fff;border:1px solid var(--ring);border-radius:16px;padding:16px}
label{font-weight:700;color:var(--navy-600);display:block;margin:.35rem 0 .2rem}
input,select,textarea{width:100%;padding:.6rem .7rem;border:1px solid #cfd8e3;border-radius:10px;font:inherit}

/* ===== Gallery ===== */
.gallery-grid{display:grid;gap:12px;grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:980px){.gallery-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.gallery-grid{grid-template-columns:1fr}}
.gallery-item{position:relative;overflow:hidden;border-radius:14px;border:1px solid var(--ring);background:#fff}
.gallery-item img{width:100%;height:220px;object-fit:cover;display:block}
/* hover captions only */
.gallery-item .cap{position:absolute;left:0;right:0;bottom:0;padding:8px 10px;background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.55) 100%);color:#fff;font-weight:700;font-size:.95rem;opacity:0;transform:translateY(6px);transition:opacity .15s,transform .15s;pointer-events:none}
.gallery-item:hover .cap{opacity:1;transform:translateY(0)}

/* ===== Events ===== */
.events-grid{display:grid;gap:16px;grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:980px){.events-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.events-grid{grid-template-columns:1fr}}
.event-card .media{overflow:hidden;background:#fff}
.event-card .media img{width:100%;height:auto;object-fit:contain;display:block;background:#fff}
.event-card .body{padding:14px}
.event-meta{color:var(--muted);font-size:.92rem;margin:0 0 6px}
.price-tag{display:inline-block;background:var(--gold);color:var(--navy);font-weight:800;padding:4px 8px;border-radius:999px;margin:0 0 8px}

/* ===== Contact ===== */
.contact-wrap{display:grid;gap:18px;grid-template-columns:1.1fr .9fr}
@media (max-width:980px){.contact-wrap{grid-template-columns:1fr}}
.contact-card{padding:16px}
.contact-list{list-style:none;padding:0;margin:8px 0 0}
.contact-list li{margin:4px 0}
.hours-table{width:100%;border-collapse:separate;border-spacing:0 6px}
.hours-table td{background:#fff;padding:8px 10px;border:1px solid var(--ring)}
.hours-table tr:nth-child(odd) td{background:#f9fbfe}

/* ===== Footer (fixed, slim) ===== */
.site-footer{
  position:fixed !important; left:0; right:0; bottom:0; z-index:998;
  height:var(--footer-h); background:var(--gold-200); color:var(--navy);
  border-top:3px solid var(--navy);
}
.footer-inner{
  max-width:1100px; margin:0 auto; height:100%;
  padding:6px 10px; text-align:center; font-size:.9rem; line-height:1.25;

  display:flex; flex-direction:column; align-items:center; justify-content:center;
}
.footer-social a{color:var(--navy);text-decoration:none}
.footer-social a:hover{text-decoration:underline}