/* ===== Our Story page — editorial system ===== */

  /* opening statement — full-bleed editorial line */
  .statement { padding:clamp(90px,12vw,150px) 0; background:#F9F7F1; }
  .statement .wrap { max-width:900px; }
  .statement p { font-family:'Fraunces',serif; font-weight:300; font-size:clamp(24px,4vw,40px); line-height:1.42; color:#1C130C; }
  .statement p b { font-weight:500; color:#8A6A18; }
  .statement .attribution { margin-top:36px; font-size:12.5px; letter-spacing:.08em; text-transform:uppercase; color:#9A8B6C; }

  /* origin — asymmetric photo/text with running index */
  .origin { padding:0 0 clamp(80px,10vw,130px); background:#F9F7F1; }
  .origin .row { display:grid; grid-template-columns:0.9fr 1.1fr; gap:0; align-items:stretch; }
  .origin .photo { position:relative; min-height:560px; background-size:cover; background-position:center; }
  .origin .photo .tag { position:absolute; left:28px; bottom:28px; background:#0A0A0A; color:#EFE7D3; font-size:11px; letter-spacing:.08em; text-transform:uppercase; padding:9px 16px; }
  .origin .copy { background:#F4EEDC; color:#5A4F3C; padding:clamp(48px,6vw,88px); display:flex; flex-direction:column; justify-content:center; border-left:3px solid #A6821D; }
  .origin .copy .idx { font-family:'Fraunces',serif; font-size:14px; color:#A6821D; margin-bottom:20px; }
  .origin .copy h2 { font-family:'Fraunces',serif; font-weight:400; font-size:clamp(26px,3.2vw,36px); color:#1C130C; line-height:1.22; margin-bottom:22px; }
  .origin .copy h2 i { font-style:normal; color:#1C130C; font-family:'Fraunces',serif; }
  .origin .copy p { font-family:'Cormorant Garamond',serif; font-size:18px; line-height:1.75; margin-bottom:16px; color:#5A4F3C; }
  .origin .copy p:last-of-type { margin-bottom:0; }

  /* timeline — vertical, alternating, with connecting rule */
  .timeline { padding:clamp(90px,11vw,140px) 0; background:#F4EEDC; position:relative; }
  .timeline .head { max-width:600px; margin-bottom:clamp(56px,8vw,88px); }
  .timeline .head h2 { font-family:'Fraunces',serif; font-weight:400; font-size:clamp(28px,3.6vw,40px); color:#1C130C; line-height:1.2; }
  .timeline .rail { position:relative; }
  .timeline .rail::before { content:''; position:absolute; left:20px; top:6px; bottom:6px; width:1px; background:linear-gradient(to bottom, #A6821D 0%, #D8CBA0 60%, transparent 100%); }
  .timeline .entry { position:relative; padding-left:64px; padding-bottom:56px; }
  .timeline .entry:last-child { padding-bottom:0; }
  .timeline .entry .dot { position:absolute; left:12px; top:4px; width:17px; height:17px; border-radius:50%; background:#F4EEDC; border:2px solid #A6821D; transition:background .3s ease, transform .3s ease; }
  .timeline .entry:hover .dot { background:#A6821D; transform:scale(1.15); }
  .timeline .entry .year { font-family:'Fraunces',serif; font-size:15px; color:#A6821D; letter-spacing:.03em; margin-bottom:8px; }
  .timeline .entry h3 { font-family:'Fraunces',serif; font-weight:500; font-size:clamp(19px,2.2vw,23px); color:#1C130C; margin-bottom:10px; }
  .timeline .entry p { font-size:15px; line-height:1.7; color:#5A4F3C; max-width:560px; }

  /* people — the cooperative, portrait-led grid */
  .people { padding:clamp(90px,11vw,140px) 0; background:#F9F7F1; }
  .people .head { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:clamp(48px,7vw,72px); flex-wrap:wrap; }
  .people .head h2 { font-family:'Fraunces',serif; font-weight:400; font-size:clamp(28px,3.6vw,40px); color:#1C130C; max-width:520px; line-height:1.2; }
  .people .head p { font-family:'Cormorant Garamond',serif; font-size:18px; color:#5A4F3C; max-width:380px; line-height:1.6; }
  .people .grid { display:grid; grid-template-columns:repeat(4,1fr); gap:2px; background:#E4D8BF; }
  .people .card { background:#F9F7F1; aspect-ratio:3/4; position:relative; overflow:hidden; }
  .people .card img, .people .card .ph { width:100%; height:100%; object-fit:cover; display:block; transition:transform .7s cubic-bezier(.25,.8,.25,1), filter .5s ease; filter:grayscale(45%); }
  .people .card:hover img, .people .card:hover .ph { transform:scale(1.06); filter:grayscale(0%); }
  .people .card .cap { position:absolute; left:0; right:0; bottom:0; padding:18px 16px; background:linear-gradient(to top, rgba(10,8,5,.85), transparent); color:#F6F0E2; opacity:0; transform:translateY(8px); transition:opacity .35s ease, transform .35s ease; }
  .people .card:hover .cap { opacity:1; transform:translateY(0); }
  .people .card .cap b { display:block; font-family:'Fraunces',serif; font-size:14.5px; font-weight:500; }
  .people .card .cap span { font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:#C9A23A; }

  /* values — numbered, editorial list not icon-boxes */
  .values { padding:clamp(90px,11vw,140px) 0; background:#F9F7F1; color:#5A4F3C; }
  .values .head { max-width:620px; margin-bottom:clamp(56px,8vw,88px); }
  .values .eyebrow { color:#A6821D; }
  .values .head h2 { font-family:'Fraunces',serif; font-weight:400; font-size:clamp(28px,3.6vw,40px); color:#1C130C; line-height:1.2; }
  .values .list { border-top:1px solid #E0D3AE; }
  .values .row { display:grid; grid-template-columns:120px 1fr 1.3fr; gap:32px; padding:34px 0; border-bottom:1px solid #E0D3AE; align-items:baseline; transition:padding-left .35s ease; }
  .values .row:hover { padding-left:12px; }
  .values .row .n { font-family:'Fraunces',serif; font-size:15px; color:#A6821D; }
  .values .row h3 { font-family:'Fraunces',serif; font-weight:500; font-size:clamp(19px,2.2vw,23px); color:#1C130C; }
  .values .row p { font-size:15px; line-height:1.7; color:#5A4F3C; }

  /* founder note — pull-quote style, signature */
  .founder { padding:clamp(90px,11vw,140px) 0; background:#F9F7F1; }
  .founder .wrap { display:grid; grid-template-columns:0.55fr 1fr; gap:clamp(40px,6vw,80px); align-items:center; }
  .founder .photo { aspect-ratio:4/5; background-size:cover; background-position:center; position:relative; }
  .founder .photo::after { content:''; position:absolute; inset:0; border:1px solid #1C130C; transform:translate(14px,14px); z-index:-1; }
  .founder .mark { font-family:'Fraunces',serif; font-size:64px; color:#D8CBA0; line-height:1; margin-bottom:8px; }
  .founder blockquote { font-family:'Fraunces',serif; font-weight:300; font-size:clamp(21px,2.8vw,29px); line-height:1.5; color:#1C130C; margin-bottom:28px; }
  .founder blockquote i { font-style:italic; color:#8A6A18; }
  .founder .who b { display:block; font-family:'Fraunces',serif; font-size:16px; color:#1C130C; }
  .founder .who span { font-size:12.5px; letter-spacing:.04em; text-transform:uppercase; color:#9A8B6C; }

  /* closing CTA distinct from homepage cta-band */
  .story-cta { padding:clamp(80px,10vw,120px) 0; background:#F4EEDC; text-align:center; }
  .story-cta .eyebrow { justify-content:center; display:flex; }
  .story-cta h2 { font-family:'Fraunces',serif; font-weight:400; font-size:clamp(28px,4vw,42px); color:#1C130C; max-width:640px; margin:0 auto 34px; line-height:1.22; }
  .story-cta h2 i { font-style:italic; color:#A6821D; font-family:'Cormorant Garamond',serif; }
  .story-cta .btns { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

  /* vision / mission / values triptych — premium light */
  .principles { background:#FFFFFF; padding:clamp(100px,12vw,150px) 0; position:relative; }
  .principles .head { max-width:620px; margin:0 auto clamp(64px,8vw,96px); text-align:center; }
  .principles .head .eyebrow { justify-content:center; display:flex; }
  .principles .head h2 { font-family:'Fraunces',serif; font-weight:400; font-size:clamp(28px,3.6vw,40px); color:#1C130C; line-height:1.22; }
  .principles .grid { display:grid; grid-template-columns:repeat(3,1fr); gap:0; position:relative; }
  .principles .grid::before { content:''; position:absolute; top:6px; bottom:6px; left:33.333%; width:1px; background:linear-gradient(to bottom, transparent, #E4D8BF 15%, #E4D8BF 85%, transparent); }
  .principles .grid::after { content:''; position:absolute; top:6px; bottom:6px; left:66.666%; width:1px; background:linear-gradient(to bottom, transparent, #E4D8BF 15%, #E4D8BF 85%, transparent); }
  .principles .card { padding:8px clamp(30px,4vw,52px); text-align:left; transition:transform .45s cubic-bezier(.25,.8,.25,1); }
  .principles .card:hover { transform:translateY(-6px); }
  .principles .card .num { font-family:'Cormorant Garamond',serif; font-style:italic; font-size:15px; color:#C9A23A; margin-bottom:26px; letter-spacing:.02em; }
  .principles .card .tag { font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:#A6821D; margin-bottom:16px; }
  .principles .card .rule { width:34px; height:1px; background:#D8CBA0; margin-bottom:22px; transition:width .45s cubic-bezier(.25,.8,.25,1); }
  .principles .card:hover .rule { width:56px; background:#A6821D; }
  .principles .card h3 { font-family:'Fraunces',serif; font-weight:400; font-size:clamp(20px,2.2vw,24px); color:#1C130C; line-height:1.32; margin-bottom:18px; }
  .principles .card p { font-family:'Cormorant Garamond',serif; font-size:17px; line-height:1.75; color:#5A4F3C; }

  /* slim stat strip under hero */
  .stat-strip { display:none; }

  /* ===== Story page responsive system ===== */

  /* tablet / narrow desktop */
  @media (max-width: 900px) {
    .origin .row { grid-template-columns:1fr; }
    .origin .photo { min-height:340px; }
    .founder .wrap { grid-template-columns:1fr; }
    .founder .photo { width:min(60vw, 340px); margin:0 auto; }
    .values .row { grid-template-columns:1fr; gap:8px; }
    .stat-strip .row { gap:22px 34px; }

    .principles { padding:clamp(70px,10vw,100px) 0; }
    .principles .head { margin-bottom:clamp(44px,7vw,64px); }
    .principles .grid { grid-template-columns:1fr; gap:44px; }
    .principles .grid::before, .principles .grid::after { display:none; }
    .principles .card { padding:0 8px 36px; border-bottom:1px solid #EFE7D3; text-align:center; }
    .principles .card:last-child { border-bottom:none; padding-bottom:0; }
    .principles .card .rule { margin-left:auto; margin-right:auto; }
    .principles .card p { max-width:440px; margin:0 auto; }

    .people .grid { grid-template-columns:repeat(3,1fr); }
  }

  /* tablet portrait / large phone */
  @media (max-width: 700px) {
    .people .grid { grid-template-columns:repeat(2,1fr); }
    .founder .wrap { text-align:center; }
    .founder .who { display:flex; flex-direction:column; align-items:center; }
  }

  @media (max-width: 600px) {
    .stat-strip .row { gap:16px 26px; padding:16px 0; }
    .timeline .entry { padding-left:52px; }
    .timeline .rail::before { left:16px; }
    .timeline .entry .dot { left:9px; width:14px; height:14px; }
    .statement p { font-size:26px; }

    .founder { padding:clamp(64px,10vw,100px) 0; }
    .founder .photo { width:min(78vw, 340px); }
    .founder .mark { font-size:48px; }
    .founder blockquote { font-size:clamp(19px,4.6vw,23px); }
    .founder .photo::after { transform:translate(10px,10px); }

    .principles .card .num { margin-bottom:18px; }
    .principles .card h3 { font-size:20px; }
    .principles .card p { font-size:16px; }
  }

  /* small phones */
  @media (max-width: 420px) {
    .people .grid { grid-template-columns:1fr 1fr; gap:1px; }
    .people .card { aspect-ratio:1/1; }
    .values .row .n { font-size:13px; }
    .values .row h3 { font-size:18px; }
    .values .row p { font-size:14px; }
  }