/* ============================================================
   ROGGENBUCK LANDSCAPE & DESIGN CO. — BASE
   Foundation tokens, typography, buttons, chips, layout helpers.
   Mirrors design/tokens/colors_and_type.css for the mockup parity.
   Patterns layer on top via patterns.css.
   ============================================================ */

:root{
  /* Palette */
  --forest:#1F3E29;
  --forest-700:#172f1f;
  --forest-900:#0f1f14;
  --moss:#376B51;
  --olive:#8CA446;
  --olive-600:#76903a;
  --sage:#A7BD6F;
  --marigold:#EA520F;
  --marigold-600:#cf440b;
  --marigold-700:#b53a08;
  --gold:#F4CF5A;
  --sky:#5B8FB0;

  /* Warm neutrals */
  --cream:#FAF4E8;
  --paper:#FFFDF8;
  --sand:#E6DCC6;
  --taupe:#A99B7E;
  --bark:#6B5E48;
  --ink:#1E1810;
  --cream-on-dark:#F3EAD6;

  /* Type */
  --display:"Fraunces","Zilla Slab",Georgia,serif;
  --body:"Source Sans 3",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

  /* Radii */
  --r-card:16px;
  --r-pill:999px;
  --r-chip:999px;

  /* Shadows — warm-tinted */
  --shadow-sm:0 1px 2px rgba(30,24,16,.06), 0 2px 6px rgba(30,24,16,.05);
  --shadow-md:0 4px 14px rgba(30,24,16,.08), 0 2px 6px rgba(30,24,16,.05);
  --shadow-lg:0 18px 48px rgba(30,24,16,.16), 0 6px 16px rgba(30,24,16,.08);

  /* Layout */
  --container:1200px;
  --reading:720px;

  /* Motion */
  --ease:cubic-bezier(.22,.61,.36,1);
  --dur:180ms;
}

/* ============================================================
   GLOBAL RESET-ISH
   ============================================================ */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--body);
  font-size:17px;
  line-height:1.6;
  color:var(--ink);
  background:var(--cream);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block;height:auto;}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;margin:0;color:var(--forest);letter-spacing:-.012em;}
/* Tune Fraunces optical sizing per heading level (graceful no-op for Zilla Slab fallback). */
h1{line-height:1.0;font-variation-settings:"opsz" 144;font-weight:600;}
h2{line-height:1.04;font-variation-settings:"opsz" 108;font-weight:600;}
h3{line-height:1.12;font-variation-settings:"opsz" 40;font-weight:600;}
h4{line-height:1.15;font-variation-settings:"opsz" 24;font-weight:600;}
/* Raise specificity so the display font wins over any parent-theme override. */
html h1,html h2,html h3,html h4,
body h1,body h2,body h3,body h4{font-family:var(--display) !important;}
/* Blocksy main.min.css loads AFTER child-theme CSS and sets
   line-height:var(--theme-line-height) (=1.65) on h1–h6 via a
   bare element selector — same specificity 0,0,1, so it wins on
   cascade order.  The fix: raise our specificity by one level so
   these rules beat Blocksy's rule regardless of load order. */
html h1{line-height:1.0;}
html h2{line-height:1.04;}
html h3{line-height:1.12;}
html h4{line-height:1.15;}
p{margin:0;text-wrap:pretty;}
a{color:var(--marigold);text-decoration:none;}
a:hover{color:var(--marigold-700);}
button{font-family:inherit;cursor:pointer;}

/* Focus — 3px forest ring (a11y) */
a:focus-visible,button:focus-visible,summary:focus-visible,
input:focus-visible,textarea:focus-visible,select:focus-visible,
[tabindex]:focus-visible{
  outline:3px solid var(--forest);
  outline-offset:2px;
  border-radius:4px;
}

/* ============================================================
   LAYOUT HELPERS
   ============================================================ */
.roggenbuck-container{
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:20px;
}
.roggenbuck-section{padding-block:56px;}
.roggenbuck-eyebrow{
  font-family:var(--body);
  font-weight:700;
  font-size:13px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--marigold);
  margin:0 0 12px;
}
.roggenbuck-section__head{max-width:640px;margin-bottom:32px;}
.roggenbuck-section__head h2{font-size:clamp(1.75rem,5vw,2.4rem);}
.roggenbuck-section__head p{color:var(--bark);font-size:19px;margin-top:14px;}

/* ============================================================
   BUTTONS — 56px tall pill on mobile
   ============================================================ */
.roggenbuck-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:56px;padding:0 28px;
  border-radius:var(--r-pill);
  font-family:var(--body);font-weight:700;font-size:18px;
  border:2px solid transparent;
  transition:transform var(--dur) var(--ease),background var(--dur) var(--ease),box-shadow var(--dur) var(--ease),color var(--dur) var(--ease);
  text-align:center;line-height:1;touch-action:manipulation;white-space:nowrap;
  text-decoration:none;
}
.roggenbuck-btn .roggenbuck-ico{width:20px;height:20px;flex:none;}
/* Marigold button — darker marigold to clear WCAG AA contrast on cream/paper. */
.roggenbuck-btn--primary{background:var(--marigold-700);color:#fff;box-shadow:var(--shadow-sm);}
.roggenbuck-btn--primary:hover{background:var(--marigold-600);color:#fff;transform:translateY(-2px);box-shadow:var(--shadow-md);}
.roggenbuck-btn--outline{background:transparent;color:var(--forest);border-color:var(--forest);}
.roggenbuck-btn--outline:hover{background:var(--forest);color:var(--cream);transform:translateY(-2px);}
.roggenbuck-btn--outline-white{background:transparent;color:#fff;border-color:rgba(255,255,255,.7);}
.roggenbuck-btn--outline-white:hover{background:#fff;color:var(--forest);transform:translateY(-2px);}
.roggenbuck-btn--light{background:#fff;color:var(--marigold-700);}
.roggenbuck-btn--light:hover{background:var(--cream);color:var(--marigold-700);}
.roggenbuck-btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);}
.roggenbuck-btn--ghost:hover{background:rgba(255,255,255,.12);color:#fff;}
.roggenbuck-btn--block{display:flex;width:100%;}

/* ============================================================
   CHIPS
   ============================================================ */
.roggenbuck-chip{
  display:inline-flex;align-items:center;gap:7px;
  padding:7px 14px;border-radius:var(--r-chip);
  font-size:14px;font-weight:700;line-height:1;
  border:1px solid transparent;white-space:nowrap;
}
.roggenbuck-chip .roggenbuck-ico{width:15px;height:15px;}
.roggenbuck-chip--gold{background:var(--gold);color:#5c4a13;}
.roggenbuck-chip--forest{background:var(--forest);color:var(--cream-on-dark);}
.roggenbuck-chip--paper{background:var(--paper);color:var(--forest);border-color:var(--sand);box-shadow:var(--shadow-sm);}
.roggenbuck-chip--ghost{background:rgba(250,244,232,.12);color:#fff;border-color:rgba(255,255,255,.35);backdrop-filter:blur(4px);}

/* Lucide-style icon defaults */
.roggenbuck-ico{stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none;}

/* Placeholder treatment when a real photo isn't loaded yet */
.roggenbuck-ph{
  position:relative;
  background:
    repeating-linear-gradient(135deg,rgba(31,62,41,.07) 0 14px,rgba(31,62,41,.02) 14px 28px),
    var(--cream);
  display:flex;align-items:center;justify-content:center;
  color:var(--bark);
}
.roggenbuck-ph__label{
  font-family:var(--body);font-size:12px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--bark);
  background:var(--paper);border:1px solid var(--sand);border-radius:var(--r-pill);
  padding:6px 14px;box-shadow:var(--shadow-sm);text-align:center;max-width:80%;
}

/* ============================================================
   RESPONSIVE BREAKPOINTS
   ============================================================ */
@media(min-width:768px){
  .roggenbuck-container{padding-inline:32px;}
  .roggenbuck-section{padding-block:80px;}
}
@media(min-width:1024px){
  .roggenbuck-section{padding-block:104px;}
}

/* ============================================================
   PARENT THEME (Blocksy) NEUTRALIZATION
   We render our own header/footer via template parts.
   ============================================================ */
header#header,.ct-header,.ct-footer,#footer{display:none !important;}
.entry-header,.entry-meta,.ct-sidebar,.ct-cta{display:none !important;}
.ct-container,.ct-container-narrow{max-width:none !important;padding:0 !important;}
.entry-content,.entry-content>p:first-child{margin:0;max-width:none;}
body.single-project,body.single-testimonial,body.page,body.home,body.archive,body.blog{padding-top:0;}

@media(prefers-reduced-motion:reduce){
  *{transition-duration:1ms!important;animation-duration:1ms!important;}
  html{scroll-behavior:auto;}
}