/* The Farmyard: inner pages. Builds on styles.css */

/* Nav: current page + tighter spacing when the bar is full */
.nav a[aria-current="page"] { color: var(--barn); }
@media (min-width: 981px) and (max-width: 1220px) {
  .nav { gap: 20px; }
  .nav a:not(.btn) { font-size: .92rem; }
}

/* Page hero: one full-width photo with the heading over it. No illustration. */
.page-hero { position: relative; isolation: isolate; overflow: hidden; background: #1c1d12; color: var(--wool); text-align: center; min-height: clamp(520px, 82svh, 780px); display: grid; align-items: center; padding: clamp(130px, 11vw, 170px) 0 clamp(100px, 11vw, 160px); }
.ph-img { position: absolute; left: 0; top: -8%; width: 100%; height: 116%; object-fit: cover; z-index: -2; }
.page-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse 70% 62% at 50% 50%, rgba(20, 20, 14, .5), rgba(20, 20, 14, .26) 70%), linear-gradient(rgba(20, 20, 14, .18), rgba(20, 20, 14, .18)); }
.page-hero .tag-line { color: var(--wool); opacity: .92; }
.page-hero h1 { color: var(--wool); font-size: clamp(2.7rem, 6.4vw, 6.6rem); max-width: 14ch; margin-inline: auto; text-shadow: 0 2px 30px rgba(20, 20, 14, .35); }
.page-hero .hl { color: var(--wool); }
.page-hero .lead { max-width: 38rem; margin-bottom: 0; color: var(--wool); text-shadow: 0 1px 16px rgba(20, 20, 14, .5); }
.ph-curve { position: absolute; left: 0; bottom: -1px; width: 100%; height: clamp(40px, 6vw, 90px); fill: var(--wool); z-index: 1; }

/* Dark intro reused from the home page, with a wider photo option */
.statement-photo.wide { aspect-ratio: 1.12 / 1; --blob: 20% 22% 21% 24% / 24% 26% 23% 27%; }
.statement-photo.wide img { object-position: 50% 50%; }

.statement.solo { text-align: center; }
.statement.solo .statement-grid { display: block; max-width: 1000px; }
.statement.solo .big-words { max-width: 17ch; margin-inline: auto; font-size: clamp(2.4rem, 5.4vw, 5.4rem); }
.statement.solo .statement-text { max-width: 40rem; margin-inline: auto; }

/* Light versions, so each page opens on white and the green comes further down */
.statement.light { background: var(--wool); color: var(--ink); padding-top: clamp(60px, 8vw, 120px); }
.statement.light .mono { color: var(--barn); }
.statement.light .big-words { color: var(--pine); }
.statement.light .statement-text { color: rgba(42, 45, 23, .8); }
.statement.light .statement-photo .paper { background: var(--grass-far); }
.sec.dark { background: var(--pine); color: var(--wool); }
.sec.dark .sec-head h2, .sec.dark blockquote { color: var(--wool); }
.sec.dark .mono { color: var(--sun); }
.sec.dark .sec-head p:not(.mono) { color: rgba(254, 253, 251, .86); }
.rotator { margin: 0; font: 700 clamp(2.4rem, 6vw, 6.2rem)/1 var(--display); font-stretch: 80%; letter-spacing: -.035em; color: var(--wool); min-height: 2.1em; }
.rot-fixed { display: block; font-weight: 400; color: var(--grass-far); margin-bottom: .1em; }
.rot-word { display: inline-block; white-space: nowrap; transition: opacity .35s ease, transform .45s var(--ease); }
.rot-word.out { opacity: 0; transform: translateY(-.28em); }
.rot-word.pre { opacity: 0; transform: translateY(.28em); transition: none; }
.poem.dark { background: var(--pine); }
.poem.dark .mono { color: var(--sun); }
.poem.dark li { color: var(--wool); }
.poem.dark li span { color: var(--grass-far); }

.questions.sky { background: var(--sky); padding-top: clamp(90px, 11vw, 160px); }

/* Sections */
.sec { padding: clamp(90px, 11vw, 160px) 0; }
.sec.sky { background: var(--sky); }
.sec.butter { background: var(--butter); }
.sec.tight-top { padding-top: 0; }
.sec-head { max-width: 46rem; margin-bottom: clamp(36px, 5vw, 64px); }
.sec-head h2 { color: var(--pine); }
.sec-head p:not(.mono) { font-size: 1.12rem; margin: 1.4rem 0 0; max-width: 40rem; }
.sec-head.center { margin-inline: auto; text-align: center; }
.sec-head.center p:not(.mono) { margin-inline: auto; }
.center { text-align: center; }
.sec blockquote { margin: clamp(48px, 6vw, 90px) auto 0; max-width: 22em; text-align: center; font: 700 clamp(1.7rem, 3.4vw, 3.3rem)/1.04 var(--display); font-stretch: 80%; letter-spacing: -.03em; color: var(--pine); text-wrap: balance; }
.sec mark { background: none; color: inherit; box-shadow: inset 0 -.2em 0 var(--sun); }

/* Photo cards: tall rounded photo with a coloured label panel */
.pcards { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(14px, 1.8vw, 26px); align-items: stretch; }
.pcard { display: flex; flex-direction: column; border-radius: 48px 40px 44px 38px; overflow: hidden; background: var(--c, var(--grass)); color: var(--t, var(--pine)); transition: opacity .9s ease, transform .9s var(--ease), translate .5s var(--ease); }
.pcard:hover { translate: 0 -6px; }
.pcard figure { aspect-ratio: 1 / 1.08; overflow: hidden; }
.pcard img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.6s var(--ease); }
.pcard:hover img { transform: scale(1.05); }
.pcard-panel { position: relative; flex: 1; margin-top: -46px; padding: 28px 28px 32px; border-radius: 46px 46px 0 0; background: var(--c, var(--grass)); display: grid; grid-template-columns: 46px 1fr; gap: 16px; align-content: start; }
.pcard-panel .n { width: 46px; height: 46px; border-radius: 50%; background: var(--wool); color: var(--pine); display: grid; place-content: center; font: 500 .9rem/1 var(--mono); box-shadow: 0 8px 16px -8px rgba(42, 45, 23, .5); }
.pcard-panel h3 { font-size: clamp(1.35rem, 1.9vw, 1.8rem); padding-top: .35rem; }
.pcard-panel p { margin: .8rem 0 0; font-size: .98rem; line-height: 1.5; opacity: .92; }
.pcard-panel .mono { margin: 0 0 .5rem; opacity: 1; font-size: .74rem; }
.pcard.c1 { --c: var(--pond); } .pcard.c2 { --c: var(--grass); } .pcard.c3 { --c: var(--paddock); --t: var(--wool); }
.pcard.c4 { --c: var(--butter); } .pcard.c5 { --c: var(--grass-far); } .pcard.c6 { --c: var(--pine); --t: var(--wool); }
.pcard.plain .pcard-panel { grid-template-columns: 1fr; }
.pcards .pcard:nth-child(2) { transition-delay: .1s, .1s, 0s; } .pcards .pcard:nth-child(3) { transition-delay: .2s, .2s, 0s; }

/* Three spaces: a card with the detail underneath */
.space-cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(18px, 2.4vw, 36px); align-items: start; }
.space-col { display: flex; flex-direction: column; }
.space-text { padding: 26px 8px 0; }
.space-text p { font-size: 1rem; line-height: 1.6; color: rgba(42, 45, 23, .78); }

/* Food and nature: two photo cards beside the text, with what it builds as tags */
.food-split { display: grid; grid-template-columns: 1.12fr .88fr; gap: clamp(36px, 5.5vw, 90px); align-items: center; }
.pcards.two { grid-template-columns: 1fr 1fr; }
.pcards.two .pcard figure { aspect-ratio: 1 / 1.3; }
.pcards.two .pcard-panel { align-items: center; padding: 24px 24px 28px; }
.pcards.two .pcard-panel h3 { padding-top: 0; font-size: clamp(1.2rem, 1.6vw, 1.5rem); }
.chips-lead { font: 700 clamp(1.3rem, 1.9vw, 1.7rem)/1.1 var(--display); font-stretch: 84%; letter-spacing: -.02em; color: var(--pine); margin: 2rem 0 1rem; }
.chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.chips li { display: inline-flex; align-items: center; gap: 10px; padding: .7rem 1.15rem .75rem 1rem; border-radius: 999px; background: #fff; border: 1px solid rgba(42, 45, 23, .08); box-shadow: 0 12px 22px -16px rgba(51, 55, 27, .5); font-weight: 600; color: var(--pine); }
.chips li::before { content: ''; width: 12px; height: 12px; border-radius: 50%; background: var(--sun); flex: none; }
.chips li:nth-child(2)::before { background: var(--pond); } .chips li:nth-child(3)::before { background: var(--grass); } .chips li:nth-child(4)::before { background: var(--barn); }

/* Split: organic photo beside text */
.split { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(40px, 6vw, 100px); align-items: center; }
.split.flip .split-visual { order: 2; }
.split.flip { grid-template-columns: 1.15fr .85fr; }
.split-copy h2 { color: var(--pine); margin-bottom: 1.6rem; }
.split-copy p:not(.mono) { font-size: 1.1rem; max-width: 34rem; }
.split-visual .blob-photo.soft { aspect-ratio: 1 / 1.16; }
.blob-photo.tone-sun .paper { background: var(--sun); opacity: .6; }
.blob-photo.tone-red .paper { background: var(--barn); opacity: .5; }
.blob-photo.tone-deep .paper { background: var(--paddock); opacity: .8; }

/* Bigger soft cards (learning priorities) */
.pills.big { grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 0; }
.pills.big li { display: block; padding: 28px 28px 32px; }
.pills.big .n { margin-bottom: 22px; }
.pills.big h3 { font-size: 1.42rem; line-height: 1.08; }
.pills.big p { font-size: 1rem; margin-top: .8rem; line-height: 1.55; }

/* Learning might look like */
.looks { background: var(--pine); color: var(--wool); padding: clamp(90px, 11vw, 160px) 0; }
.looks .mono { color: var(--sun); }
.looks h2 { margin-bottom: clamp(30px, 4vw, 56px); }
.looks-list { list-style: none; margin: 0; padding: 0; }
.looks-list li { display: grid; grid-template-columns: 1fr 70px 1.5fr; align-items: center; gap: 24px; padding: 24px 0; border-top: 1px solid rgba(254, 253, 251, .22); }
.looks-list li:last-child { border-bottom: 1px solid rgba(254, 253, 251, .22); }
.looks-list h3 { font-size: clamp(1.5rem, 2.6vw, 2.4rem); }
.looks-list .arr { height: 2px; background: var(--sun); position: relative; transform-origin: left; }
.looks-list .arr::after { content: ''; position: absolute; right: 0; top: 50%; width: 9px; height: 9px; border-top: 2px solid var(--sun); border-right: 2px solid var(--sun); transform: translateY(-50%) rotate(45deg); }
.js .looks-list li.reveal .arr { scale: 0 1; transition: scale .9s var(--ease) .25s; }
.js .looks-list li.reveal.in .arr { scale: 1 1; }
.looks-list p { margin: 0; font-size: 1.1rem; color: rgba(254, 253, 251, .86); }

/* Values: one organic photo beside five names that open one at a time */
.values-sec { padding-top: clamp(60px, 8vw, 120px); }
.values-split { display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(40px, 6vw, 100px); align-items: start; }
.values-visual { position: sticky; top: 120px; }
.values-visual .blob-photo { aspect-ratio: 1 / 1.2; }
.values-copy h2 { color: var(--pine); margin-bottom: clamp(24px, 3vw, 40px); }
.v-list details { border-bottom: 1.5px solid rgba(42, 45, 23, .18); }
.v-list details:first-child { border-top: 1.5px solid rgba(42, 45, 23, .18); }
.v-list summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 46px 1fr 38px; gap: 20px; align-items: center; padding: 22px 0; }
.v-list summary::-webkit-details-marker { display: none; }
.v-list summary::after { content: '+'; width: 38px; height: 38px; border-radius: 50%; background: var(--sun); color: var(--pine); display: grid; place-content: center; font: 500 1.5rem/1 var(--sans); transition: rotate .4s var(--ease), background .3s, color .3s; }
.v-list details[open] summary::after { rotate: 45deg; background: var(--barn); color: var(--wool); }
.v-list .n { width: 46px; height: 46px; border-radius: 50%; display: grid; place-content: center; font: 500 .9rem/1 var(--mono); background: var(--pond); color: var(--pine); transition: scale .4s var(--ease); }
.v-list details:nth-child(2) .n { background: var(--butter); } .v-list details:nth-child(3) .n { background: var(--grass-far); }
.v-list details:nth-child(4) .n { background: var(--paddock); color: var(--wool); } .v-list details:nth-child(5) .n { background: var(--wheat); }
.v-list details[open] .n { scale: 1.12; }
.v-name { display: flex; flex-direction: column; gap: 8px; }
.v-reo { font: 700 clamp(1.7rem, 2.9vw, 2.7rem)/1 var(--display); font-stretch: 80%; letter-spacing: -.03em; color: rgba(51, 55, 27, .5); transition: color .4s; }
.v-list summary:hover .v-reo, .v-list details[open] .v-reo { color: var(--pine); }
.v-name .mono { margin: 0; color: var(--barn); }
.v-list details > p { margin: 0; padding: 0 58px 28px 66px; font-size: 1.1rem; line-height: 1.6; max-width: 44rem; }

/* Seasons */
.seasons { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 940px; margin: 0 auto clamp(30px, 4vw, 48px); }
.season { padding: clamp(28px, 3.4vw, 44px); text-align: left; color: var(--pine); }
.season .mono { margin-bottom: clamp(40px, 6vw, 90px); }
.season h3 { font-size: clamp(2rem, 3.6vw, 3.4rem); }
.season.s-a { background: var(--pond); border-radius: 70px 34px 34px 34px; }
.season.s-b { background: var(--wheat); border-radius: 34px 34px 70px 34px; }
.seasons-note { max-width: 40rem; margin: 0 auto; text-align: center; font-size: 1.12rem; }

/* A place to */
.poem { background: var(--butter); text-align: center; padding: clamp(90px, 11vw, 160px) 0; }
.poem .mono { margin-bottom: clamp(1.4rem, 2.2vw, 2.2rem); }
.poem ul { list-style: none; margin: 0; padding: 0; }
.poem li { font: 700 clamp(1.5rem, 3.3vw, 2.9rem)/1.28 var(--display); font-stretch: 80%; letter-spacing: -.03em; color: var(--pine); }
.poem li span { font-weight: 400; color: var(--paddock); }

/* Closing panel with a small farmscape */
.cta-farm { padding-top: 0; }
.sec + .cta-farm, .poem + .cta-farm, .looks + .cta-farm { padding-top: clamp(90px, 11vw, 160px); }
.sec:not(.sky):not(.butter):not(.dark) + .cta-farm { padding-top: 0; }
.cta-panel { position: relative; overflow: hidden; border-radius: 70px 56px 64px 52px / 56px 64px 52px 70px; background: var(--sky); text-align: center; padding-top: clamp(56px, 6vw, 96px); }
.cta-panel .mono { color: var(--barn); }
.cta-panel h2 { color: var(--pine); max-width: 13ch; margin: 0 auto 1.3rem; }
.cta-panel > p:not(.mono) { max-width: 36rem; margin-inline: auto; font-size: 1.12rem; padding-inline: 20px; }
.cta-panel .btn-row { justify-content: center; margin-top: 1.8rem; padding-inline: 20px; }
.cta-panel .scene { height: clamp(160px, 20vw, 280px); margin-top: clamp(16px, 2.4vw, 36px); }
.cta-panel .barn-art { width: 12%; left: 19%; bottom: 15%; }
.cta-panel .silo-art { width: 3.4%; left: 32%; bottom: 17%; }
.cta-panel .tree-3 { left: 37%; width: 3.6%; }
.cta-panel .sun { width: 8%; left: 70%; bottom: 44%; }

/* Visit page */
.contact-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(32px, 5vw, 80px); align-items: start; }
.form-card { background: #fff; border: 1px solid rgba(42, 45, 23, .08); border-radius: 50px 38px 46px 36px; padding: clamp(24px, 3.6vw, 52px); box-shadow: 0 30px 60px -40px rgba(51, 55, 27, .55); }
.form-card h2 { font-size: clamp(2rem, 3.4vw, 3.2rem); color: var(--pine); margin-bottom: 1.6rem; }
.choice { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 26px; border: 0; padding: 0; }
.choice legend { font: 500 .78rem/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; margin-bottom: 12px; padding: 0; }
.choice input { position: absolute; opacity: 0; }
.choice label { padding: .85rem 1.3rem; border-radius: 999px; border: 2px solid var(--ink); font-weight: 600; cursor: pointer; transition: background .3s, color .3s; }
.choice input:checked + label { background: var(--pine); border-color: var(--pine); color: var(--wool); }
.choice input:focus-visible + label { outline: 3px solid var(--sun); outline-offset: 2px; }
.fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.field { display: flex; flex-direction: column; gap: 8px; }
.field.full { grid-column: 1 / -1; }
.field label { font: 500 .78rem/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.field input, .field textarea { font: 400 1.05rem/1.4 var(--sans); color: var(--ink); padding: 14px 16px; border: 1.5px solid rgba(42, 45, 23, .22); border-radius: 16px; background: var(--wool); width: 100%; }
.field input:focus, .field textarea:focus { outline: 0; border-color: var(--paddock); box-shadow: 0 0 0 4px rgba(86, 107, 58, .18); }
.field textarea { min-height: 130px; resize: vertical; }
.form-card .btn { margin-top: 24px; border: 0; cursor: pointer; }
.form-note { margin: 16px 0 0; font-size: .95rem; color: var(--barn); min-height: 1.4em; }
.info-card .blob-photo { aspect-ratio: 1 / 1.12; margin-bottom: clamp(28px, 3vw, 44px); }
.info-card .blob-photo img { object-position: 50% 30%; }
.info { margin: 0; display: grid; gap: 22px; }
.info dt { font: 500 .76rem/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--barn); margin-bottom: 9px; }
.info dd { margin: 0; font: 600 1.35rem/1.2 var(--display); font-stretch: 84%; letter-spacing: -.01em; color: var(--pine); }
.find { display: grid; grid-template-columns: 1.5fr 1fr; gap: clamp(10px, 1.4vw, 20px); height: clamp(320px, 38vw, 520px); }
.find iframe, .find figure { width: 100%; height: 100%; border: 0; overflow: hidden; }
.find iframe { border-radius: 60px 40px 40px 50px; }
.find figure { border-radius: 40px 70px 56px 40px; }
.find img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; }
.q-list ul { margin: 0 0 14px; padding-left: 1.2em; max-width: 36rem; }
.q-list li { margin-bottom: .3em; }
.q-list .todo { font-style: italic; opacity: .7; }

.farm-band.two { grid-template-columns: 1fr 1fr; max-width: 980px; margin-inline: auto; }

/* Slots for the Discover forms, and placeholders for details still to come */
.form-card .mono { color: var(--barn); margin-bottom: 1rem; }
.form-lead { font-size: 1.08rem; max-width: 32rem; margin-bottom: 1.8rem; }
.widget-slot { border: 2px dashed rgba(42, 45, 23, .28); border-radius: 26px; min-height: 340px; display: grid; place-items: center; text-align: center; padding: 32px; background: var(--wool); }
.widget-slot p { margin: 0; max-width: 22rem; color: rgba(42, 45, 23, .7); }
.widget-slot strong { display: block; font: 600 1.3rem/1.2 var(--display); font-stretch: 86%; color: var(--pine); margin-bottom: .5rem; }
.enrol-card { max-width: 860px; margin-inline: auto; text-align: left; }
.enrol-card .widget-slot { min-height: 420px; }
.ph { font-style: italic; opacity: .7; }
.info .ph { opacity: .6; }

/* Tablet */
@media (max-width: 980px) {
  .pcards, .space-cols { grid-template-columns: 1fr; }
  .pcard { max-width: 560px; margin-inline: auto; width: 100%; }
  .pcard figure { aspect-ratio: 1.3 / 1; }
  .space-col { max-width: 560px; margin-inline: auto; }
  .split, .split.flip, .contact-grid, .food-split { grid-template-columns: 1fr; }
  .safe-grid, .res-grid, .fees-grid, .enq-grid { grid-template-columns: 1fr; }
  .fees-cols { grid-template-columns: 1fr; }
  .fees-cols .q-list + .q-list details:first-child { border-top: 0; }
  .offer-card { flex-direction: column; align-items: flex-start; }
  .rotator { min-height: 3.1em; }
  .rot-word { white-space: normal; text-wrap: balance; max-width: 14ch; }
  .poem.dark { padding-bottom: clamp(50px, 7vw, 90px); }
  .pcards.two { grid-template-columns: 1fr 1fr; }
  .pcards.two .pcard { max-width: none; }
  .pcards.two .pcard figure { aspect-ratio: 1 / 1.2; }
  .values-split { grid-template-columns: 1fr; }
  .values-visual { position: relative; top: 0; width: min(440px, 100%); }
  .split.flip .split-visual { order: 0; }
  .split-visual, .info-card .blob-photo { width: min(480px, 100%); margin-inline: auto; }
  .pills.big { grid-template-columns: 1fr 1fr; }
  .looks-list li { grid-template-columns: 1fr; gap: 10px; }
  .looks-list .arr { width: 60px; }
  .find { grid-template-columns: 1fr; height: auto; }
  .find iframe { height: 360px; }
  .find figure { aspect-ratio: 1.4 / 1; }
}

/* Phone */
@media (max-width: 640px) {
  .page-hero { min-height: 74svh; padding: 130px 0 90px; }
  .pills.big { grid-template-columns: 1fr; }
  .subsidy-grid { grid-template-columns: 1fr; }
  .offer-card { border-radius: 40px; }
  .enrol-card enrolment-form { display: block; zoom: .8; }
  .pcards.two .pcard-panel { grid-template-columns: 1fr; gap: 10px; padding: 18px 18px 22px; }
  .pcards.two .pcard-panel .n { width: 38px; height: 38px; }
  .v-list summary { grid-template-columns: 40px 1fr 34px; gap: 14px; }
  .v-list .n { width: 40px; height: 40px; }
  .v-list details > p { padding: 0 0 24px; }
  .seasons { grid-template-columns: 1fr; }
  .fields { grid-template-columns: 1fr; }
  .cta-panel { border-radius: 40px; }
  .cta-panel .scene { height: 44vw; }
  .cta-panel .barn-art { width: 24%; left: 10%; }
  .cta-panel .silo-art { width: 7%; left: 36%; }
  .cta-panel .tree-3 { left: 47%; width: 7%; }
  .cta-panel .sun { width: 14%; }
  .form-card { border-radius: 34px; }
}

/* Special offer banner (home) */
.offer { padding: clamp(70px, 9vw, 120px) 0 0; }
.offer-card { display: flex; align-items: center; justify-content: space-between; gap: clamp(24px, 4vw, 60px); background: var(--paddock); color: var(--wool); padding: clamp(28px, 3.6vw, 52px) clamp(26px, 4vw, 60px); border-radius: 70px 44px 56px 40px / 50px 56px 44px 60px; }
.offer-card .mono { margin-bottom: .8rem; color: var(--butter); }
.offer-card h2 { font-size: clamp(2.2rem, 4.6vw, 4.2rem); }
.offer-card p:last-child { margin: .9rem 0 0; font-size: 1.08rem; max-width: 36rem; }
.offer-card .btn { flex: none; }
.offer-card .btn-cream { color: var(--pine); }
.offer-card .btn-cream i::after { border-color: var(--wool); }
.offer + .different { padding-top: clamp(70px, 9vw, 120px); }

/* Additional fees note */
.fee-note { margin: 1rem 0 0; font: 500 .76rem/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; }

/* Safe, settled and ready to explore (approach) */
.safe-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(36px, 6vw, 100px); align-items: start; }
.safe-head h2 { color: var(--pine); margin-bottom: 1.6rem; }
.safe-lead { font: 600 clamp(1.2rem, 1.7vw, 1.5rem)/1.3 var(--display); font-stretch: 88%; letter-spacing: -.01em; color: var(--pine); max-width: 30rem; }
.safe-copy p { font-size: 1.08rem; max-width: 40rem; }
.safe-copy p + p { padding-top: 1.2rem; border-top: 1.5px solid rgba(42, 45, 23, .14); margin-top: 1.2rem; }

/* Subsidies (visit) */
.subsidy-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.subsidy { display: flex; flex-direction: column; text-decoration: none; padding: clamp(28px, 3.4vw, 46px); color: var(--pine); transition: opacity .9s ease, transform .9s var(--ease), translate .5s var(--ease); }
.subsidy:hover { translate: 0 -6px; }
.subsidy.s-one { background: var(--pond); border-radius: 70px 36px 36px 36px; }
.subsidy.s-two { background: var(--butter); border-radius: 36px 36px 70px 36px; }
.subsidy h3 { font-size: clamp(1.7rem, 2.6vw, 2.4rem); margin-bottom: 1rem; }
.subsidy p { font-size: 1.08rem; max-width: 26rem; margin-bottom: 2rem; }
.subsidy .go { margin-top: auto; display: inline-flex; align-items: center; gap: 12px; font-weight: 600; }
.subsidy .go i, .res-list i { flex: none; width: 30px; height: 30px; border-radius: 50%; background: var(--pine); position: relative; transition: transform .4s var(--ease); }
.subsidy .go i::after, .res-list i::after { content: ''; position: absolute; inset: 0; margin: auto; width: 8px; height: 8px; border-top: 2px solid var(--wool); border-right: 2px solid var(--wool); transform: translateX(-2px) rotate(45deg); }
.subsidy:hover .go i, .res-list a:hover i { transform: translateX(5px); }

/* Parent resources */
.res-top { padding-top: clamp(150px, 14vw, 210px); }
.res-title { font-size: clamp(2.7rem, 6.4vw, 6.2rem); color: var(--pine); }
.res-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(32px, 6vw, 100px); align-items: start; }
.res-h { font-size: clamp(1.5rem, 2.2vw, 2rem); color: var(--pine); margin-bottom: 1.2rem; }
.res-list { list-style: none; margin: 0; padding: 0; }
.res-list a { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 0; border-top: 1.5px solid rgba(42, 45, 23, .18); text-decoration: none; }
.res-list li:last-child a { border-bottom: 1.5px solid rgba(42, 45, 23, .18); }
.res-list strong { display: block; font: 650 1.2rem/1.2 var(--display); font-stretch: 88%; letter-spacing: -.01em; color: var(--pine); }
.res-list em { display: block; font-style: normal; font-size: .96rem; color: rgba(42, 45, 23, .7); margin-top: 5px; }
.res-list a:hover strong { color: var(--barn); }

/* Discover form shells */
.contact-grid > * { min-width: 0; }
@media (min-width: 981px) { .contact-grid { grid-template-columns: 1.4fr .6fr; gap: clamp(28px, 3.4vw, 56px); } .contact-grid .form-card { padding: clamp(24px, 2.6vw, 40px); } }
.form-card .widget { min-width: 0; max-width: 100%; }
.widget .container, .widget .discover, .widget .discover-panel, .widget .discover-enquiry-form, .widget #dc-child-enquiry-form { width: 100% !important; max-width: 100% !important; margin-inline: 0 !important; padding-inline: 0 !important; box-sizing: border-box; }
.widget-loading, .widget-fallback { margin: 0; padding: 20px 0; color: rgba(42, 45, 23, .7); }
.form-card a, .q-list a, .info a { color: var(--barn); }
.info a, .site-footer p a { text-decoration: none; }
.info dd a { color: var(--pine); }
.info dd { overflow-wrap: anywhere; }

/* Home hero: full-bleed photo. The children sit in the upper half; the headline is anchored along the bottom over the path. */
.home-hero { position: relative; isolation: isolate; overflow: hidden; min-height: clamp(620px, 100svh, 980px); display: flex; align-items: flex-end; background: #1c1d12; color: var(--wool); }
.hh-img { position: absolute; left: 0; top: -6%; width: 100%; height: 112%; object-fit: cover; object-position: 50% 81%; z-index: -2; }
.home-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(rgba(20, 20, 14, .34), rgba(20, 20, 14, 0) 20%, rgba(20, 20, 14, 0) 46%, rgba(20, 20, 14, .72) 74%, rgba(20, 20, 14, .9)); }
.hh-copy { display: grid; grid-template-columns: 1.5fr 1fr; gap: clamp(28px, 5vw, 80px); align-items: end; padding-bottom: clamp(76px, 9vw, 132px); }
.hh-wave { position: absolute; left: 0; bottom: -1px; width: 100%; height: clamp(40px, 6vw, 90px); fill: var(--wool); }
.home-hero .tag-line { display: inline-block; margin-bottom: 1.4rem; padding: .6em 1.1em; border-radius: 999px; background: var(--wool); color: var(--pine); line-height: 1.2; }
.home-hero h1 { color: var(--wool); font-size: clamp(2.6rem, 6.3vw, 6.8rem); line-height: .9; position: relative; z-index: 0; }
.home-hero h1 .ln { display: block; white-space: nowrap; }
.home-hero .hl { color: var(--wool); }
.home-hero .lead { margin: 0 0 1.5rem; max-width: 26rem; font-size: clamp(1.05rem, 1.4vw, 1.25rem); color: var(--wool); }
.home-hero .btn-row { margin: 0; }
@media (max-width: 980px) {
  .hh-copy { grid-template-columns: 1fr; gap: 20px; }
  .home-hero { display: block; min-height: 0; background: var(--wool); color: var(--ink); }
  .home-hero::after { display: none; }
  .hh-img { position: relative; top: 0; height: 58svh; object-position: 50% 62%; z-index: 0; translate: none !important; display: block; }
  .hh-copy { padding: 26px 0 10px; }
  .hh-wave { display: none; }
  .home-hero .tag-line { display: block; padding: 0; border-radius: 0; background: none; color: var(--barn); line-height: 1.4; }
  .home-hero h1 { color: var(--pine); font-size: clamp(2.5rem, 8vw, 4.4rem); }
  .home-hero h1 .ln { white-space: normal; }
  .home-hero .hl { color: var(--paddock); }
  .home-hero .lead { color: var(--ink); }
  .home-hero .btn-ghost.light { border-color: var(--ink); color: var(--ink); }
}
.home-hero + .statement { padding-top: clamp(50px, 6vw, 90px); }
/* Home colour rhythm: white welcome, grey-green "different", dark "natural environment" */
.offer.on-sky, .different.on-sky { background: var(--sky); }
.learning.dark { background: var(--pine); color: var(--wool); }
.learning.dark .mono { color: var(--sun); }
.learning.dark .farm-head h2, .learning.dark blockquote { color: var(--wool); }
.learning.dark .farm-head p:last-child { color: rgba(254, 253, 251, .86); }
.learning.dark .btn-cream { color: var(--pine); }
.learning.dark .btn-cream i::after { border-color: var(--wool); }
.learning.dark + .questions { padding-top: clamp(90px, 11vw, 160px); }

/* Enquiry form on the home page */
.enq-grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: clamp(32px, 5vw, 80px); align-items: start; }
.enq-grid > * { min-width: 0; }
.enq-copy h2 { color: var(--pine); margin-bottom: 1.4rem; }
.enq-copy > p:not(.mono) { font-size: 1.1rem; max-width: 26rem; margin-bottom: 2.2rem; }
.enq-grid .form-card { padding: clamp(22px, 2.6vw, 40px); }
#enquire + .visit { padding-top: clamp(90px, 11vw, 160px); }

/* Two-step enquiry form (home) */
.two-step.step-1 #dc-child-container, .two-step.step-1 .discover-enquiry-buttons { display: none !important; }
.two-step.step-2 > .discover-row:not(.discover-enquiry-buttons), .two-step.step-2 .step-next { display: none !important; }
.step-bar { display: flex; align-items: baseline; gap: 14px; margin: 0 0 22px; padding-bottom: 16px; border-bottom: 1.5px solid rgba(42, 45, 23, .14); }
.step-bar .step-count { font: 500 .76rem/1 var(--mono) !important; letter-spacing: .06em; text-transform: uppercase; color: var(--barn); }
.step-bar .step-name { font: 700 1.5rem/1 var(--display) !important; font-stretch: 84%; letter-spacing: -.02em; color: var(--pine); }
.step-bar .step-back { margin-left: auto; background: none; border: 0; border-bottom: 1.5px solid currentColor; padding: 0 0 2px; font: 600 .95rem/1.2 var(--sans) !important; color: var(--pine); cursor: pointer; }
.step-bar .step-back[hidden] { display: none; }
.step-next { display: flex; flex-direction: column; align-items: flex-end; gap: 12px; margin-top: 10px; clear: both; }
.step-next .btn { font: 600 1rem/1 var(--sans) !important; border: 0; cursor: pointer; color: var(--wool) !important; }
.step-error { margin: 0; color: var(--barn); font-size: .95rem; align-self: flex-start; }
.step-error[hidden] { display: none; }

/* Fees (visit) */
.fees-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(20px, 3vw, 44px); align-items: start; margin-bottom: clamp(36px, 5vw, 64px); }
.fees-facts dl { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.fees-facts dl > div { padding: 26px 24px; background: var(--sky); border-radius: 34px; }
.fees-facts dl > div:nth-child(1) { background: var(--butter); border-radius: 60px 34px 34px 34px; }
.fees-facts dl > div:nth-child(4) { background: var(--pond); border-radius: 34px 34px 60px 34px; }
.fees-facts dt { font: 500 .76rem/1.3 var(--mono); letter-spacing: .06em; text-transform: uppercase; margin-bottom: clamp(24px, 3vw, 44px); }
.fees-facts dd { margin: 0; font: 700 clamp(2rem, 3vw, 2.8rem)/1 var(--display); font-stretch: 80%; letter-spacing: -.03em; color: var(--pine); }
.fees-facts dd span { display: block; font: 400 .95rem/1.35 var(--sans); letter-spacing: 0; margin-top: 8px; color: var(--ink); }
.calc { background: var(--pine); color: var(--wool); padding: clamp(26px, 3.2vw, 44px); border-radius: 44px 60px 44px 44px; }
.calc .mono { color: var(--sun); margin-bottom: .8rem; }
.calc h3 { font-size: clamp(1.7rem, 2.6vw, 2.4rem); margin-bottom: 1.6rem; }
.calc .choice { margin-bottom: 20px; }
.calc .choice label { border-color: rgba(254, 253, 251, .5); padding: .7rem 1.2rem; }
.calc .choice input:checked + label { background: var(--sun); border-color: var(--sun); color: var(--pine); }
.calc-row { display: flex; align-items: center; gap: 16px; margin-bottom: 18px; }
.calc-row label, .calc .choice legend { font: 500 .78rem/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.calc-row select { font: 500 1rem/1 var(--sans); padding: .75rem 1rem; border-radius: 14px; border: 0; background: var(--wool); color: var(--pine); }
.calc-check { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; cursor: pointer; }
.calc-check[hidden] { display: none; }
.calc-check input { width: 20px; height: 20px; accent-color: var(--sun); }
.calc-out { border-top: 1px solid rgba(254, 253, 251, .25); padding-top: 22px; margin-top: 6px; }
.calc-total { margin: 0 0 .6rem; } .calc-total span { font: 700 clamp(2.8rem, 5vw, 4.4rem)/1 var(--display); font-stretch: 80%; letter-spacing: -.035em; color: var(--sun); } .calc-total em { font-style: normal; font-size: 1.1rem; }
.calc-how, .calc-fb { margin: 0 0 .5rem; font-size: 1rem; color: rgba(254, 253, 251, .86); }
.calc-note { margin: 1rem 0 0; font-size: .86rem; opacity: .7; }
.fees-terms { background: var(--sky); border-radius: 44px 44px 60px 44px; padding: clamp(26px, 3.4vw, 48px); }
.fees-terms-h { font-size: clamp(1.6rem, 2.4vw, 2.2rem); color: var(--pine); margin-bottom: clamp(16px, 2vw, 26px); }
.fees-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0 clamp(28px, 4vw, 64px); align-items: start; }
.fees-terms .q-list details { border: 0; border-bottom: 1.5px solid rgba(42, 45, 23, .16); }
.fees-terms .q-list details:first-child { border-top: 1.5px solid rgba(42, 45, 23, .16); }
.fees-terms summary { font: 600 1.1rem/1.2 var(--sans); letter-spacing: 0; padding: 16px 44px 16px 0; }
.fees-terms summary::after { width: 28px; height: 28px; margin-top: -14px; font-size: 1.15rem; background: var(--wool); }
.fees-terms .q-list details p { font-size: 1rem; padding-bottom: 10px; }

/* Read more buttons: phone only */
.more-btn { display: none; }

/* Phone: card rows and photo bands swipe sideways, long text folds away */
@media (max-width: 640px) {
  .pills, .pills.big, .pcards:not(.two), .space-cols, .farm-band:not(.two) { display: flex; grid-template-columns: none; gap: 12px; height: auto; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; margin-inline: -20px; padding: 6px 20px 26px; scroll-padding-inline: 20px; align-items: stretch; }
  .diff-copy, .diff-grid > *, .wrap > * { min-width: 0; }
  .pcards:not(.two), .space-cols, .pills.big { align-items: flex-start; }
  .pills::-webkit-scrollbar, .pcards::-webkit-scrollbar, .space-cols::-webkit-scrollbar, .farm-band::-webkit-scrollbar { display: none; }
  .pills > li, .pills.big > li { flex: 0 0 80%; scroll-snap-align: start; }
  .pills { margin-bottom: 10px; }
  .pcards:not(.two) > .pcard, .space-cols > .space-col { flex: 0 0 84%; max-width: none; width: auto; margin: 0; scroll-snap-align: start; }
  .space-col .pcard { max-width: none; }
  .farm-band:not(.two) > figure, .farm-band:not(.two) > .f2 { flex: 0 0 80%; order: 0; grid-column: auto; aspect-ratio: 1 / 1.05; scroll-snap-align: start; }
  .js .pills > li.reveal, .js .pcards > .pcard.reveal, .js .space-cols > .reveal { opacity: 1; transform: none; }
  .swipe-hint { display: flex; align-items: center; gap: 10px; font: 500 .72rem/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; opacity: .65; margin: -6px 0 0; }
  .swipe-hint::after { content: ''; width: 34px; height: 1.5px; background: currentColor; }
  .center .swipe-hint, .sec-head.center + * + .swipe-hint { justify-content: center; }

  .more .extra { display: none; }
  .more.open .extra { display: block; }
  .clampable:not(.open) { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
  .more-btn { display: inline-flex; align-items: center; gap: 8px; margin-top: 12px; padding: 0 0 3px; background: none; border: 0; border-bottom: 1.5px solid currentColor; color: inherit; font: 600 .95rem/1.2 var(--sans); cursor: pointer; }
  .more-btn::after { content: '+'; font-weight: 500; font-size: 1.1rem; line-height: 1; }
  .more-btn[aria-expanded="true"]::after { content: '\2212'; }
  .space-text { padding-top: 18px; }
}
@media (min-width: 641px) { .swipe-hint { display: none; } }

@media (prefers-reduced-motion: reduce) {
  .rot-word { transition: none; transform: none !important; }
  .pcard, .pcard img { transition: none !important; }
  .js .looks-list li.reveal .arr { scale: 1 1; }
}

/* Whānau section: quiet link through to the parent resources page */
.fam-link { display: grid; justify-items: start; gap: 16px; margin-top: clamp(24px, 2.6vw, 36px); padding-top: clamp(20px, 2.2vw, 28px); border-top: 1px solid rgba(42, 45, 23, .16); }
.fam-link span { font-size: .98rem; line-height: 1.5; max-width: 40ch; }

/* Audit fixes */
@media (max-width: 980px) {
  .safe-grid, .res-grid, .fees-grid, .enq-grid, .fees-cols { grid-template-columns: 1fr; }
  .res-grid { gap: 44px; }
  .offer-card { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 640px) {
  .subsidy-grid { grid-template-columns: 1fr; }
  .offer-card { border-radius: 40px; }
}
@media (max-width: 640px) {
  .more-btn { padding: 10px 0 5px; }
  .footer-grid { margin-right: 20px; gap: 30px 24px; }
  .footer-grid > div:nth-child(n+3) { grid-column: 1 / -1; }
  .footer-grid a { display: inline-block; padding: 5px 0; overflow-wrap: anywhere; }
  .swipe-hint:not(:last-child) { margin-bottom: 30px; }
  .footer-grid p:not(.mono) { line-height: 1.3; }
}

/* Client photos 15 Oct: inside and out, and the new group photo */
.farm-band img[src*="in-inside"] { object-position: 40% 62%; }
.farm-band img[src*="in-outside"] { object-position: 50% 62%; }
.farm-band img[src*="in-staff"] { object-position: 50% 42%; }
.visit-panel img { object-position: 50% 44%; }
@media (max-width: 640px) { .visit-panel img { top: -16%; object-position: 50% 0; } }