/* Farm experiences (/farm-experiences/): builds on fair-guides.css, laid out like /orchard-tour/.
   The board in the hero is the homepage's farm-experience rows (.fx-tile) on a ticket card; the booking
   sheet itself is src/fair-experience-picker.css. Every row and time is a link that opens that sheet. */
.farm-page [hidden]{display:none!important}

/* Hero: heading and details on the left, the board on the right, over faint seed rows.
   The empty 1fr rows keep the left column centered; narrow screens stack heading, board, details. */
.fe-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,500px);grid-template-rows:1fr auto auto 1fr;grid-template-areas:". book" "head book" "more book" ". book";column-gap:clamp(40px,6vw,96px);align-items:center;padding:clamp(52px,6vw,92px) max(28px,6vw) clamp(64px,7vw,104px);background:radial-gradient(circle,rgba(23,45,70,.13) 0 1.4px,transparent 1.9px) 0 0/13px 30px,var(--paper)}
.fe-hero-head{grid-area:head;min-width:0;animation:feature-copy-in .7s .05s both}
.fe-hero-more{grid-area:more;min-width:0;animation:feature-copy-in .7s .05s both}
.fe-hero-head .guide-hand{margin-bottom:14px}
.fe-hero h1{max-width:7ch;margin:0 0 28px;font-size:clamp(68px,8vw,132px);line-height:.84}
.fe-hero .guide-lead{max-width:31ch;margin-bottom:26px}
.fe-hero-facts{display:flex;flex-wrap:wrap;gap:10px 26px;margin:0;padding:0;list-style:none;font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.fe-hero-facts li{display:flex;align-items:center;gap:10px}
.fe-hero-facts li::before{content:"";width:6px;height:6px;background:var(--brown)}

/* The board: a ticket card with a gold band and one row per experience */
.fe-board{grid-area:book;min-width:0;padding:0 clamp(22px,2.6vw,34px) 22px;background:#fff;border:1.5px solid var(--navy);box-shadow:12px 12px 0 rgba(23,45,70,.08);animation:feature-copy-in .7s .2s both}
.fe-board-band{margin:0 calc(-1 * clamp(22px,2.6vw,34px)) 6px;padding:12px clamp(22px,2.6vw,34px);color:var(--navy);background:var(--gold);font:500 11px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase}
.fe-list{margin:0;padding:0;list-style:none}
.fe-list li+li{border-top:1.5px dotted rgba(23,45,70,.5)}
.farm-page .fx-tile{display:grid;grid-template-columns:62px minmax(0,1fr) auto 34px;align-items:center;column-gap:14px;min-height:84px;padding:10px 2px;color:var(--navy);text-decoration:none;-webkit-tap-highlight-color:transparent}
.farm-page .fx-tile:hover{color:var(--navy)}
.farm-page .fx-tile:focus-visible{outline:3px solid var(--brown);outline-offset:2px}
.farm-page .fx-art{display:block;width:62px;height:62px;object-fit:contain;transition:translate .2s}
.farm-page .fx-tile:hover .fx-art{translate:0 -3px}
.farm-page .fx-copy{display:grid;gap:6px;min-width:0}
.farm-page .fx-name{font:400 clamp(25px,2.2vw,30px)/.92 var(--display);font-variation-settings:"opsz" 2;letter-spacing:-.005em;text-transform:uppercase}
.farm-page .fx-days{font:400 11.5px/1.35 var(--mono);letter-spacing:.02em}
.farm-page .fx-price{font:600 20px/1 var(--serif);letter-spacing:.012em;text-align:right;white-space:nowrap}
.farm-page .fx-price small{margin-right:2px;font:400 10.5px/1 var(--mono);letter-spacing:.04em}
.farm-page .fx-plus{position:relative;width:34px;height:34px;border:1.5px solid var(--navy);border-radius:50%;transition:background-color .16s,color .16s}
.farm-page .fx-plus::before,.farm-page .fx-plus::after{content:"";position:absolute;inset:50% auto auto 50%;width:13px;height:1.5px;background:currentColor;translate:-50% -50%}
.farm-page .fx-plus::after{rotate:90deg}
.farm-page .fx-tile:hover .fx-plus,.farm-page .fx-tile:focus-visible .fx-plus{color:var(--paper);background:var(--navy)}
.farm-page .fx-tile.is-full .fx-art,.farm-page .fx-tile.is-full .fx-copy,.farm-page .fx-tile.is-full .fx-plus{opacity:.55}
.fe-board-note{margin:14px 0 0;padding-top:14px;border-top:1.5px solid var(--navy);font-size:12px;line-height:1.6}

/* Pick your time: one entry per experience, ruled like the printed program's listings */
.fe-entries{border-bottom:2px solid var(--navy)}
.fe-entry{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,4.4fr) minmax(0,5fr);gap:20px clamp(28px,4vw,64px);align-items:start;padding:clamp(30px,3.6vw,48px) 0;border-top:2px solid var(--navy);scroll-margin-top:96px}
.fe-entry-head{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:18px}
.fe-entry-art{width:clamp(76px,7vw,104px);height:auto;filter:drop-shadow(0 8px 10px rgba(23,45,70,.12))}
.fe-entry-hand{margin:0 0 6px;color:var(--brown);font:400 24px/1 var(--hand)}
.guide-page main .fe-entry h3{margin:0;font:400 clamp(38px,3.6vw,56px)/.86 var(--display);font-variation-settings:"opsz" 2;text-transform:uppercase;letter-spacing:-.01em}
.fe-entry-copy{max-width:40ch;margin:0 0 16px;font:600 18px/1.45 var(--serif);letter-spacing:.012em;text-wrap:pretty}
.fe-facts{margin:0;padding:0;list-style:none;font-size:13px;line-height:1.55}
.fe-facts li{position:relative;padding:4px 0 4px 18px}
.fe-facts li::before{content:"";position:absolute;top:13px;left:0;width:6px;height:6px;background:var(--gold)}
.fe-more{display:inline-block;margin-top:12px;font-size:13px}
.fe-times-label{margin:0 0 6px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;opacity:.8}
.fe-times{margin:0;padding:0;list-style:none;border-top:1.5px solid var(--navy)}
.fe-times li{border-bottom:1.5px dotted rgba(23,45,70,.45)}
.fe-time{display:flex;align-items:center;gap:10px;min-height:52px;padding:6px 6px 6px 2px;color:var(--navy);text-decoration:none;transition:background-color .15s}
.farm-page .fe-time:hover{color:var(--navy);background:var(--paper)}
.fe-time:focus-visible{outline:2px solid var(--brown);outline-offset:2px}
.fe-day{flex:none;font-size:13px;letter-spacing:.02em}
.fe-day b{display:inline-block;min-width:3.2ch;font:400 22px/1 var(--display);font-variation-settings:"opsz" 2;text-transform:uppercase;letter-spacing:0}
.fe-time i{flex:1 1 12px;min-width:12px;border-bottom:2px dotted currentColor;opacity:.3;translate:0 -3px}
.fe-clock{flex:none;font:600 17px/1.2 var(--serif);letter-spacing:.012em;white-space:nowrap}
.fe-left{flex:none;padding:3px 7px;color:var(--brown);border:1.5px solid currentColor;font-size:10px;line-height:1.2;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.fe-time svg{flex:none;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;transition:translate .15s}
.fe-time:hover svg{translate:3px 0}
.fe-time.is-full .fe-day,.fe-time.is-full i,.fe-time.is-full .fe-clock,.fe-time.is-full svg{opacity:.45}
.fe-time.is-full .fe-left{color:#fff;background:var(--brown);border-color:var(--brown)}

/* Before you go */
.fe-know-grid{display:grid;grid-template-columns:minmax(0,400px) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start}
.fe-stamp{justify-self:start;animation:none}
.fe-stamp img{height:auto;aspect-ratio:4/3.4;object-position:center}
.fe-know .guide-qa{grid-template-columns:minmax(0,1fr)}
.fe-close .feature-button{margin-top:4px}

/* Wide screens: the art sits above the name, so the handwritten note has the column's width */
@media(min-width:1101px){
  .fe-entry-head{grid-template-columns:minmax(0,1fr);justify-items:start;gap:14px}
}
@media(max-width:1100px){
  .fe-entry{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"head times" "body times"}
  .fe-entry-head{grid-area:head}
  .fe-entry-body{grid-area:body}
  .fe-entry-times{grid-area:times}
}
@media(max-width:900px){
  .fe-hero{grid-template-columns:minmax(0,1fr);grid-template-rows:none;grid-template-areas:"head" "book" "more"}
  .fe-hero h1{max-width:none;margin-bottom:0}
  .fe-hero-head{margin-bottom:32px}
  .fe-hero-more{margin-top:44px}
  .fe-board{max-width:560px}
  .fe-know-grid{grid-template-columns:minmax(0,1fr)}
  .fe-stamp{max-width:420px}
}
@media(max-width:700px){
  .fe-hero{padding:26px 16px 44px;background-size:11px 26px,auto}
  .fe-hero-head{margin-bottom:22px}
  .fe-hero-head .guide-hand{display:none}
  .fe-hero h1{font-size:clamp(54px,16vw,84px)}
  .fe-hero .guide-lead{font-size:19px}
  .fe-hero-more{margin-top:36px}
  .fe-board{padding:0 14px 16px;box-shadow:8px 8px 0 rgba(23,45,70,.08)}
  .fe-board-band{margin:0 -14px 4px;padding:11px 14px;font-size:10.5px;letter-spacing:.12em}
  .farm-page .fx-tile{grid-template-columns:50px minmax(0,1fr) auto 30px;column-gap:11px;min-height:74px;padding:8px 0}
  .farm-page .fx-art{width:50px;height:50px}
  .farm-page .fx-name{font-size:24px}
  .farm-page .fx-price{font-size:18px}
  .farm-page .fx-plus{width:30px;height:30px}
  .fe-times-section{padding-inline:16px}
  .fe-entry{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "body" "times";gap:18px}
  .fe-entry-art{width:72px}
  .fe-entry-hand{font-size:21px}
  .fe-entry-copy{font-size:17px}
  .fe-time{gap:8px;min-height:50px}
  .fe-day{font-size:12px}
  .fe-clock{font-size:15.5px}
  .fe-stamp{max-width:320px}
}
@media(max-width:380px){
  .farm-page .fx-tile{grid-template-columns:42px minmax(0,1fr) auto 26px;column-gap:9px}
  .farm-page .fx-art{width:42px;height:42px}
  .farm-page .fx-name{font-size:21px}
  .farm-page .fx-plus{width:26px;height:26px}
  .fe-day{font-size:11px}
  .fe-day b{font-size:19px}
}
@media(prefers-reduced-motion:reduce){.fe-hero-head,.fe-hero-more,.fe-board{animation:none}.farm-page .fx-art,.fe-time,.fe-time svg{transition:none}}