/* Princeton Apiaries — static rebuild
   Matches the original: dark charcoal theme, white text, teal links,
   per-page background colors, full-bleed heros, multi-column layouts. */

:root{
  --dark:      #20272b;   /* main dark bg, header, footer, title bands */
  --on-dark:   #e9e9e9;   /* body text on dark */
  --on-dark-2: #c3cacd;   /* secondary text on dark */
  --accent:    #7db1d6;   /* teal-blue links + current nav on dark */
  --link-light:#2f6f9e;   /* link color on light backgrounds (readable) */
  --paper:     #e8e4da;   /* warm greige page background */
  --on-paper:  #262b2d;
  --white:     #ffffff;
  --on-white:  #1f2325;
  --rule-dark: rgba(255,255,255,.16);
  --rule-light:rgba(0,0,0,.14);
  --wrap:      1120px;    /* outer max width */
  --col:       720px;     /* text column max width */
}

*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--dark);
  color:var(--on-dark);
  font-family:"Source Sans 3", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  font-size:1.06rem;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; height:auto; display:block; }
h1,h2,h3,h4{ font-family:"Montserrat", system-ui, sans-serif; font-weight:700; line-height:1.15; }

.skip{ position:absolute; left:-999px; top:0; background:#000; color:#fff; padding:.6rem 1rem; z-index:200; }
.skip:focus{ left:0; }

.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:24px; }
.col{ max-width:var(--col); margin-inline:auto; }

/* ---------------------------------------------------------------- header */
.site-header{ background:var(--dark); }
.header-inner{
  display:flex; align-items:center; justify-content:space-between; gap:1.5rem;
  padding-block:1.05rem;
}
.brand{
  font-family:"Montserrat", sans-serif; font-weight:700; font-size:1.5rem;
  color:#fff; text-decoration:none; white-space:nowrap; letter-spacing:.2px;
}
.site-nav ul{
  list-style:none; margin:0; padding:0;
  display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.35rem 1.05rem;
  max-width:660px;
}
.site-nav a{
  color:#fff; text-decoration:none;
  font-family:"Montserrat", sans-serif; font-weight:600; font-size:.83rem;
  letter-spacing:.2px; white-space:nowrap;
}
.site-nav a:hover{ color:var(--accent); }
.site-nav a.current{ color:var(--accent); }

.nav-toggle{
  display:none; width:44px; height:40px; border:1px solid var(--rule-dark);
  border-radius:8px; background:transparent; cursor:pointer;
  flex-direction:column; justify-content:center; align-items:center; gap:4px;
}
.nav-toggle-bar{ width:20px; height:2px; background:#fff; border-radius:2px; transition:.25s; }
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

/* ---------------------------------------------------------------- title band (interior pages) */
.title-band{ background:var(--dark); color:var(--on-dark); padding:2.1rem 0 2.5rem; }
.title-band .rule{ height:1px; background:var(--rule-dark); max-width:var(--wrap); }
.page-title{ text-align:center; font-size:clamp(1.6rem,3.6vw,2rem); margin:1.3rem 0; }

/* ---------------------------------------------------------------- page body / themes */
.page-body{ background:var(--dark); color:var(--on-dark); }
body.theme-paper .page-body{ background:var(--paper); color:var(--on-paper); }
body.theme-white .page-body{ background:var(--white); color:var(--on-white); }

.page-body a{ color:var(--accent); text-underline-offset:2px; }
.page-body a:hover{ text-decoration:underline; }
body.theme-paper .page-body a,
body.theme-white .page-body a{ color:var(--link-light); }

.content{ padding-block:2.4rem 3rem; }
.content .wrap{ }
.prose p{ margin:0 0 1.3rem; }
.prose .just{ text-align:justify; }
.prose h2{ font-size:clamp(1.4rem,3vw,1.8rem); margin:2rem 0 1rem; }
.prose h3{ font-size:1.28rem; margin:2rem 0 .7rem; }
.prose h4{ font-size:1.06rem; margin:1.8rem 0 .6rem; }
.caps{ text-transform:uppercase; letter-spacing:.02em; }
.bold-line{ font-weight:700; }
.center{ text-align:center; }

/* ---------------------------------------------------------------- hero (full-bleed image + overlaid title) */
.hero{
  position:relative; width:100%; overflow:hidden;
  background:#d8a441;                 /* warm honey fallback behind the photo */
  min-height:clamp(300px, 42vw, 520px);
}
.hero > img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero-title{
  position:absolute; z-index:2; margin:0;
  font-family:"Montserrat", sans-serif; font-weight:700; color:#1d2427;
  /* strengthened white halo: keeps the near-black title legible over any photo,
     including dark or busy areas, without changing the text color */
  text-shadow:
    0 0 4px rgba(255,255,255,.92),
    0 0 14px rgba(255,255,255,.78),
    0 1px 24px rgba(255,255,255,.6);
}
.hero--home .hero-title{
  left:50%; top:52%; transform:translate(-50%,-50%);
  width:92%; text-align:center; font-size:clamp(1.7rem,4.6vw,3rem);
}
.hero--vsh .hero-title{
  left:5%; bottom:7%; font-size:clamp(1.6rem,4.4vw,2.6rem);
}

/* ---------------------------------------------------------------- images */
figure{ margin:0; }
.imgc{ max-width:var(--col); margin:2rem auto; }     /* centered medium image */
.imgc.wide{ max-width:900px; }
.imgc img{ width:100%; }
figcaption{ margin-top:.5rem; font-size:.92rem; color:inherit; opacity:.85; }

/* two-column blocks (Hosting, Honey for Sale) */
.two-col{
  max-width:1000px; margin:1.6rem auto;
  display:grid; grid-template-columns:1fr 1fr; gap:1.4rem 2.4rem; align-items:start;
}
.two-col .cell > *:first-child{ margin-top:0; }
.two-col p{ margin:0 0 1rem; }
.two-col img{ width:100%; }
.two-col .stack > * + *{ margin-top:1.2rem; }

/* float layout (VSH, Phunny) */
.floatwrap::after{ content:""; display:table; clear:both; }
.float-left{ float:left; width:min(46%,360px); margin:.2rem 1.7rem 1rem 0; }
.float-left img{ width:100%; }

/* three-up captioned row (Phunny "hand picked/processed/packed") */
.three-up{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.3rem; margin:1.8rem 0; }
.three-up img{ width:100%; aspect-ratio:4/3; object-fit:cover; }
.three-up figcaption{ margin-top:.5rem; font-size:.95rem; }

/* pricing list (Honey for Sale) */
.pricing p{ margin:0 0 1rem; }
.pricing .price{ font-weight:700; }
.pricing .avail{ font-weight:400; }
.shout{ font-weight:700; }

/* contact */
.contact-lines{ margin:.5rem 0 0; }
.contact-lines p{ margin:.15rem 0; }

/* ---------------------------------------------------------------- footer */
.site-footer{ background:var(--dark); color:var(--on-dark); }
.footer-inner{
  display:flex; align-items:flex-start; justify-content:space-between; gap:1.5rem 2rem;
  flex-wrap:wrap; padding-block:2rem 2.4rem;
}
.footer-brand{ font-family:"Montserrat", sans-serif; font-weight:700; font-size:1.02rem; color:#fff; }
.footer-brand small{ display:block; font-weight:400; font-size:.82rem; color:var(--on-dark-2); margin-top:.25rem; font-family:"Source Sans 3",sans-serif; }
.footer-nav ul{
  list-style:none; margin:0; padding:0;
  display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.35rem 1rem; max-width:560px;
}
.footer-nav a{ color:#fff; text-decoration:none; font-family:"Montserrat",sans-serif; font-weight:600; font-size:.8rem; white-space:nowrap; }
.footer-nav a:hover, .footer-nav a.current{ color:var(--accent); }

/* ---------------------------------------------------------------- responsive */
@media (max-width:860px){
  .header-inner{ position:relative; }
  .nav-toggle{ display:flex; }
  .site-nav{
    position:absolute; right:0; left:0; top:100%; z-index:50;
    background:var(--dark); max-height:0; overflow:hidden; transition:max-height .3s ease;
  }
  .site-nav.open{ max-height:80vh; border-top:1px solid var(--rule-dark); }
  .site-nav ul{ flex-direction:column; align-items:flex-start; justify-content:flex-start; gap:0; padding:.4rem 24px 1rem; max-width:none; }
  .site-nav a{ display:block; padding:.7rem 0; font-size:1rem; }
}
@media (max-width:760px){
  .two-col{ grid-template-columns:1fr; }
}
@media (max-width:640px){
  .float-left{ float:none; width:100%; margin:0 0 1.2rem; }
  .three-up{ grid-template-columns:1fr; }
  .three-up img{ aspect-ratio:16/9; }
}
@media (prefers-reduced-motion:reduce){
  *{ transition:none !important; scroll-behavior:auto !important; }
}
a:focus-visible, button:focus-visible{ outline:3px solid var(--accent); outline-offset:2px; }