/* Rustic Carpentry: clean edition.
   Layout: centred logo and menu on white, framed photos with the words beneath, generous white space, light grey panels.
   One serif family throughout, soft greys, forest green kept only for the main call to action. */
:root{
  --white:#ffffff;
  --panel:#f4f4f2;      /* light grey panels */
  --line:#e2e2de;
  --ink:#2a2a28;        /* headings */
  --text:#545451;       /* body grey */
  --soft:#8a8a85;       /* captions */
  --forest:#23352b;     /* brand accent, used sparingly */
  --forest-hover:#34503f;
  --serif:"EB Garamond",Garamond,Georgia,"Times New Roman",serif;
  color-scheme:light;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
body{font-family:var(--serif);color:var(--text);background:var(--white);font-size:19px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--ink);text-underline-offset:3px}
a:hover{color:var(--forest)}
:focus-visible{outline:2px solid var(--forest);outline-offset:3px}
h1,h2,h3,h4{font-family:var(--serif);font-weight:400;color:var(--ink);line-height:1.2;text-wrap:balance}
h1{font-size:clamp(2rem,4.2vw,3rem)}
h2{font-size:clamp(1.6rem,3vw,2.2rem);margin-bottom:.8rem}
h3{font-size:1.35rem;margin-bottom:.3rem}
p{max-width:62ch}
strong{font-weight:500;color:var(--ink)}
.wrap{max-width:1200px;margin:0 auto;padding-inline:24px}
.section{padding-block:110px}
.section.tint,.section.green{background:var(--panel)}
.eyebrow{display:block;font-size:.85rem;letter-spacing:.18em;text-transform:uppercase;color:var(--soft);margin-bottom:1rem}
.lead{font-size:1.2rem;color:var(--text)}
.stack{display:grid;gap:1.1rem}
.center{text-align:center}.center p{margin-inline:auto}

/* Buttons: quiet, square, outlined */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.6rem;border:1px solid var(--ink);background:var(--white);color:var(--ink);font-family:var(--serif);font-size:1.05rem;text-decoration:none;cursor:pointer;transition:background .2s,color .2s,border-color .2s;border-radius:0}
.btn:hover{background:var(--ink);color:var(--white)}
.btn-green,.btn-white{background:var(--forest);border-color:var(--forest);color:var(--white)}
.btn-green:hover,.btn-white:hover{background:var(--forest-hover);border-color:var(--forest-hover);color:var(--white)}
.btn-outline,.btn-light{background:transparent}
.btn-row{display:flex;gap:1rem;flex-wrap:wrap}
.center .btn-row,.btn-row.center{justify-content:center}

/* Header: logo centred, menu centred beneath */
.site-header{background:var(--white);position:relative;z-index:50}
.site-header .wrap{display:flex;flex-direction:column;align-items:center;padding-block:28px 18px;position:relative}
.brand{display:flex;flex-direction:column;align-items:center;gap:.5rem;text-decoration:none;color:var(--ink);font-size:1.9rem;line-height:1;letter-spacing:.01em}
.brand:hover{color:var(--ink)}
.brand img{height:70px;width:auto}
.menu{display:flex;justify-content:center;flex-wrap:wrap;gap:.2rem 1.6rem;list-style:none;margin-top:1.2rem}
.menu>li{position:relative}
.menu>li>a{display:block;padding:.35rem 0;color:var(--ink);text-decoration:none;font-size:1.02rem;border-bottom:1px solid transparent}
.menu>li>a:hover,.menu>li.active>a,.menu>li>a[aria-current="page"]{border-bottom-color:var(--ink);color:var(--ink)}
.menu .has-sub>a::after{content:"";display:inline-block;width:6px;height:6px;margin-left:.45rem;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translateY(-3px) rotate(45deg)}
.sub{position:absolute;left:50%;top:100%;min-width:290px;background:var(--white);border:1px solid var(--line);list-style:none;padding:.6rem 0;opacity:0;visibility:hidden;transform:translate(-50%,6px);transition:.18s;z-index:60}
.has-sub:hover .sub,.has-sub:focus-within .sub{opacity:1;visibility:visible;transform:translate(-50%,0)}
.sub a{display:block;padding:.45rem 1.2rem;color:var(--text);text-decoration:none;font-size:.98rem}
.sub a:hover,.sub a[aria-current="page"]{background:var(--panel);color:var(--ink)}
.menu .cta>a{border-bottom-color:transparent}
.burger{display:none;position:absolute;right:24px;top:40px;background:none;border:0;color:var(--ink);cursor:pointer;padding:.3rem}
@media (max-width:820px){
  .site-header .wrap{padding-block:20px 16px}
  .brand{font-size:1.5rem}.brand img{height:56px}
  .burger{display:block;top:34px}
  .menu{display:none;flex-direction:column;align-items:stretch;width:100%;gap:0;margin-top:1rem;border-top:1px solid var(--line)}
  .menu.open{display:flex}
  .menu>li>a{padding:.8rem 0;border-bottom:1px solid var(--line);text-align:center}
  .menu>li>a:hover,.menu>li.active>a{border-bottom-color:var(--line)}
  .menu .has-sub>a::after{display:none}
  .sub{position:static;opacity:1;visibility:visible;transform:none;border:0;padding:.3rem 0 .6rem;min-width:0;text-align:center}
}

/* Page opener: framed photo, words beneath */
.hero{padding-bottom:90px}
.hero-img{width:100%;aspect-ratio:21/8;object-fit:cover;background:var(--panel)}
.hero.home .hero-img{aspect-ratio:16/7}
.hero-text{text-align:center;max-width:780px;margin:56px auto 0}
.hero-text p{margin:1.1rem auto 0;font-size:1.2rem}
.hero-text .btn-row{justify-content:center;margin-top:2rem}
.crumbs{font-size:.85rem;letter-spacing:.18em;text-transform:uppercase;color:var(--soft);margin-bottom:1rem}
.crumbs a{color:var(--soft);text-decoration:none}
.crumbs a:hover{color:var(--ink)}
@media (max-width:700px){.hero-img,.hero.home .hero-img{aspect-ratio:4/3}.hero-text{margin-top:36px}}
.stars{color:var(--ink);letter-spacing:3px;font-size:.9rem}

/* Split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.split>*{min-width:0}
.split.wide-left{grid-template-columns:1.1fr 1fr}
@media (max-width:900px){.split,.split.wide-left{grid-template-columns:1fr;gap:44px}}
.photo{width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--panel)}
.photo.tall{aspect-ratio:4/5}

/* Lists */
.ticks{list-style:none;display:grid;gap:.6rem;margin-block:1.4rem 2rem}
.ticks li{padding-left:1.6rem;position:relative}
.ticks li::before{content:"";position:absolute;left:0;top:.75em;width:.8rem;height:1px;background:var(--ink)}

/* Image tiles with a pale caption strip */
.choices,.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:2.6rem}
.choices{margin-top:0}
@media (max-width:900px){.choices,.tiles{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.choices,.tiles{grid-template-columns:1fr}}
.choice,.tile{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;text-decoration:none;color:var(--ink);background:var(--panel)}
.choice img,.tile img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.choice:hover img,.tile:hover img{transform:scale(1.03)}
.tile span,.choice div{position:absolute;left:0;right:0;bottom:0;background:rgba(255,255,255,.86);padding:.8rem 1rem;text-align:center;font-size:1.15rem;line-height:1.3;color:var(--ink)}
.tile small{display:block;font-size:.92rem;color:var(--text);margin-top:.15rem}
.choice div h3{font-size:1.2rem;margin:0}
.choice div p,.choice .go{display:none}

/* Steps: a real order */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;margin-top:3rem;counter-reset:step;list-style:none}
@media (max-width:900px){.steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}
.steps li{border-top:1px solid var(--ink);padding-top:1.2rem}
.steps li::before{counter-increment:step;content:"0" counter(step);display:block;font-size:.85rem;letter-spacing:.18em;color:var(--soft);margin-bottom:.6rem}
.steps p{font-size:1rem}

/* Gallery + lightbox */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-top:2.4rem}
.gallery button{border:0;padding:0;background:var(--panel);cursor:zoom-in;overflow:hidden;aspect-ratio:1}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.gallery button:hover img{transform:scale(1.03)}
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(255,255,255,.97);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:24px}
.lightbox[hidden]{display:none!important}
.lightbox img{max-height:86vh;max-width:100%;margin:auto;object-fit:contain}
.lightbox button{background:none;color:var(--ink);border:1px solid var(--ink);width:46px;height:46px;cursor:pointer;font-size:1.4rem;line-height:1;font-family:var(--serif)}
.lightbox button:hover{background:var(--ink);color:var(--white)}
.lightbox .lb-close{position:absolute;top:20px;right:20px}
.lightbox .lb-count{position:absolute;bottom:16px;left:0;right:0;text-align:center;color:var(--soft);font-size:.95rem}

/* Courses */
.courses{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:56px 40px;margin-top:3rem}
.course{display:flex;flex-direction:column}
.course img{width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--white)}
.course .body{padding-top:1.3rem;display:flex;flex-direction:column;gap:.6rem;flex:1}
.pill{font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--soft)}
.course ul{list-style:none;display:grid;gap:.2rem;font-size:1rem}
.course ul li::before{content:"– "}
.price-row{display:flex;justify-content:space-between;align-items:center;gap:1rem;border-top:1px solid var(--line);padding-top:1rem;margin-top:auto;flex-wrap:wrap}
.price{font-size:1.6rem;color:var(--ink);font-variant-numeric:tabular-nums lining-nums}
.price small{font-size:.95rem;color:var(--soft)}

/* Gift */
.gift{display:grid;grid-template-columns:240px 1fr auto;gap:48px;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding-block:48px}
.gift img{width:100%}
@media (max-width:820px){.gift{grid-template-columns:1fr;gap:24px}.gift img{max-width:300px}}

/* Reviews */
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:56px;margin-top:3rem}
.reviews.all{grid-template-columns:repeat(2,1fr)}
@media (max-width:900px){.reviews,.reviews.all{grid-template-columns:1fr;gap:44px}}
.review{display:flex;flex-direction:column;gap:.8rem}
.review blockquote{font-size:1.08rem;color:var(--text)}
.review.short blockquote{font-size:1.3rem;font-style:italic;color:var(--ink);line-height:1.45}
.review cite{font-style:normal;color:var(--ink);margin-top:auto}
.review cite span{display:block;color:var(--soft);font-size:.95rem}

/* Timeline */
.timeline{list-style:none;display:grid;margin-top:3rem;max-width:760px}
.timeline li{padding-block:2.2rem;border-top:1px solid var(--line)}
.timeline .when{font-size:.85rem;letter-spacing:.18em;text-transform:uppercase;color:var(--soft)}
.timeline h3{margin:.4rem 0 .6rem;font-size:1.6rem}
.timeline .pics{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:1.4rem}
.timeline .pics img{aspect-ratio:4/3;object-fit:cover;width:100%;background:var(--panel)}

.pull{font-size:1.45rem;font-style:italic;line-height:1.45;color:var(--ink);margin-block:1.6rem}

/* Facts */
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;margin-top:2.6rem}
@media (max-width:900px){.facts{grid-template-columns:1fr 1fr}}
@media (max-width:460px){.facts{grid-template-columns:1fr}}
.facts div{border-top:1px solid var(--ink);padding-top:1rem}
.facts strong{display:block;font-size:1.25rem;font-weight:400}
.facts span{font-size:1rem}

/* Press & links */
.press{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:1.6rem}
.press img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top;background:var(--panel)}
.linkcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;margin-top:2.4rem}
.linkcard{display:flex;gap:1rem;align-items:center;border-top:1px solid var(--ink);padding-top:1.2rem;text-decoration:none;color:var(--text)}
.linkcard img{width:64px;height:64px;object-fit:contain;flex:none}
.linkcard strong{display:block;font-size:1.2rem;font-weight:400}
audio{width:100%;max-width:520px;margin-top:1rem}
.video{position:relative;aspect-ratio:16/9;max-width:760px;background:var(--panel);margin-top:1.2rem}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:80px;align-items:start}
.contact-grid>*{min-width:0}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr;gap:56px}}
.direct{display:grid;gap:0;border-top:1px solid var(--line)}
.direct a,.direct div{display:flex;gap:1rem;align-items:center;padding-block:1rem;border-bottom:1px solid var(--line);text-decoration:none;color:var(--text)}
.direct svg{width:22px;height:22px;color:var(--ink);flex:none}
.direct strong{display:block;font-weight:400;font-size:1.15rem}
form.enquiry{display:grid;gap:1.1rem;background:var(--panel);padding:2.4rem}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
@media (max-width:520px){.row2{grid-template-columns:1fr}}
label{display:block;font-size:1rem;color:var(--ink);margin-bottom:.3rem}
input,select,textarea{width:100%;padding:.75rem .9rem;border:1px solid #c9c9c4;border-radius:0;font:inherit;font-size:1rem;background:var(--white);color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:1px solid var(--ink);border-color:var(--ink)}
textarea{min-height:150px;resize:vertical}
.form-note{font-size:.95rem;color:var(--soft)}
.next-steps{list-style:none;display:grid;gap:.8rem;margin-top:1.2rem;counter-reset:n}
.next-steps li{display:flex;gap:1rem}
.next-steps li::before{counter-increment:n;content:"0" counter(n);color:var(--soft);letter-spacing:.1em;flex:none}

/* Closing band */
.cta-band{border-top:1px solid var(--line)}
.cta-band .wrap{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1.4rem;padding-block:100px}
.cta-band h2{margin:0 auto;max-width:26ch}
.cta-band p{margin:.6rem auto 0}

/* Footer */
.site-footer{background:var(--panel);font-size:1rem}
.site-footer .wrap{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:56px;padding-block:80px 56px}
@media (max-width:900px){.site-footer .wrap{grid-template-columns:1fr;gap:40px}}
.site-footer h4{font-size:1.05rem;color:var(--ink);margin-bottom:1rem}
.site-footer a{color:var(--text);text-decoration:none}
.site-footer a:hover{color:var(--ink);text-decoration:underline}
.site-footer ul{list-style:none;display:grid;gap:.25rem}
.site-footer .btn{color:var(--white);text-decoration:none}
.copyright{background:var(--panel);font-size:.95rem;color:var(--soft)}
.copyright .wrap{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding-block:28px 34px;border-top:1px solid var(--line)}
.copyright a{color:var(--soft)}
.foot-mark{width:100%;text-align:center;font-size:2rem;color:var(--ink);padding-bottom:1rem}

.callbar{display:none}
@media (max-width:700px){
  .callbar{display:grid;grid-template-columns:1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:60;padding-bottom:env(safe-area-inset-bottom,0px);background:var(--white);border-top:1px solid var(--line)}
  .callbar a{padding:1rem;text-align:center;color:var(--ink);text-decoration:none;font-size:1.05rem}
  .callbar a+a{background:var(--forest);color:var(--white)}
  body{padding-bottom:58px}
}
.note-box{border-left:1px solid var(--ink);padding:.4rem 0 .4rem 1.2rem;font-size:1.02rem}
form.enquiry .note-box{background:none}
.facts.three{grid-template-columns:repeat(3,1fr)}
@media (max-width:600px){.facts.three{grid-template-columns:1fr;gap:24px}}
/* Strapline under the name */
.strap{display:block;font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:var(--soft);margin-top:.15rem;white-space:normal;text-align:center}
.foot-mark .strap{margin-top:.5rem}
@media (max-width:820px){.brand .strap{font-size:.68rem;letter-spacing:.14em;max-width:240px}}
/* Photos stored upside down, shown the right way up */
.gallery .rot180 img{transform:rotate(180deg)}
.gallery .rot180:hover img{transform:rotate(180deg) scale(1.03)}
/* Experiences: long montage strip, then single photo beside the details */
.exps{display:grid;gap:96px;margin-top:3.4rem}
.exp{display:grid;gap:22px}
.exp-strip{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;background:var(--white)}
.exp-body{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:48px;align-items:start}
.exp:nth-child(even) .exp-body{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.exp:nth-child(even) .exp-photo{order:2}
.exp-photo{width:100%;aspect-ratio:4/5;object-fit:cover;background:var(--white)}
.exp-text{display:flex;flex-direction:column;gap:.7rem;min-width:0;padding-top:.4rem}
.exp-text h3{font-size:1.75rem}
.exp-text ul{list-style:none;display:grid;gap:.25rem}
.exp-text ul li::before{content:"– "}
.exp-text .price-row{margin-top:.8rem}
.exp-flag{align-self:flex-start;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--white);background:var(--forest);padding:.2rem .6rem}
@media (max-width:760px){
  .exps{gap:72px}
  .exp-body,.exp:nth-child(even) .exp-body{grid-template-columns:1fr;gap:20px}
  .exp:nth-child(even) .exp-photo{order:0}
  .exp-photo{aspect-ratio:4/3}
}
/* Home banner made of two photos side by side */
.hero-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hero.home .hero-pair .hero-img{aspect-ratio:8/7}
@media (max-width:700px){.hero-pair{gap:8px}.hero.home .hero-pair .hero-img{aspect-ratio:3/4}}
/* Two-photo banners on inner pages keep the standard banner shape */
.hero:not(.home) .hero-pair:not(.natural){aspect-ratio:21/8;grid-template-rows:minmax(0,1fr);overflow:hidden}
.hero:not(.home) .hero-pair:not(.natural) .hero-img{aspect-ratio:auto;width:100%;height:100%;min-width:0;min-height:0}
@media (max-width:700px){.hero:not(.home) .hero-pair:not(.natural){aspect-ratio:4/3}}
/* Keep the About Ian timeline inside the screen on phones */
.timeline{grid-template-columns:minmax(0,1fr)}
.timeline li,.timeline .pics img{min-width:0}
/* Timeline photos shown uncropped */
.timeline .pics.full{align-items:start}
.timeline .pics.full img{aspect-ratio:auto;height:auto}
/* Home banner: both photos whole, same height */
.hero-pair.natural{align-items:start}
.hero-pair.natural .hero-img{width:100%;height:auto;object-fit:cover}
.gallery .rot90 img{transform:rotate(90deg)}
.gallery .rot90:hover img{transform:rotate(90deg) scale(1.03)}
.gallery .rot270 img{transform:rotate(270deg)}
.gallery .rot270:hover img{transform:rotate(270deg) scale(1.03)}
.gallery .rot90 img{transform:rotate(90deg)}
.gallery .rot90:hover img{transform:rotate(90deg) scale(1.03)}
.gallery .rot270 img{transform:rotate(270deg)}
.gallery .rot270:hover img{transform:rotate(270deg) scale(1.03)}
/* Slightly larger logo and name, with more breathing room above the strapline */
.brand{font-size:2.25rem}
.brand img{height:86px}
.brand .strap{margin-top:.75rem}
@media (max-width:820px){.brand{font-size:1.75rem}.brand img{height:66px}.brand .strap{margin-top:.55rem}}
/* Green woodworking banner shown whole (its photo is a long 4:1 strip) */
.hero.panorama .hero-img,.hero.panorama .hero-img:only-child{aspect-ratio:4/1}
@media (max-width:700px){.hero.panorama .hero-img{aspect-ratio:4/1}}
/* A photo shown whole, at its own shape */
.photo.natural{aspect-ratio:auto;height:auto}

/* Timber frame tile: keep the porch roof in view wherever it appears */
.tile[href="timber-buildings.html"] img{object-position:center top}
.tile[href="garden-structures.html"] img{object-position:center top}

/* Header photo shown whole, at its own shape */
.hero.whole .hero-img,.hero.whole .hero-img:only-child{aspect-ratio:auto;height:auto;object-fit:contain}
@media (max-width:700px){.hero.whole .hero-img{aspect-ratio:auto}}

/* Scrollable photo strip inside a course card */
.exp-scroll{padding:0;min-width:0}
.exp-scroll-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.8rem}
.exp-scroll-head h4{margin:0;font-size:1.15rem;font-weight:500}
.exp-scroll-nav{display:flex;gap:6px}
.exp-scroll-nav button{width:38px;height:38px;border:1px solid #cfcfc8;background:var(--white);font-size:1.5rem;line-height:1;cursor:pointer;color:var(--ink)}
.exp-scroll-nav button:hover{background:var(--panel)}
.gallery.scroller{display:flex;gap:10px;margin-top:0;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding-bottom:8px;-webkit-overflow-scrolling:touch}
.gallery.scroller button{flex:0 0 auto;width:220px;aspect-ratio:3/4;scroll-snap-align:start}
@media (max-width:560px){.gallery.scroller button{width:70%}}

/* Home intro: main photo with two robin photos beneath */
.photo-trio{display:grid;grid-template-columns:1fr 1fr;gap:12px;min-width:0}
.photo-trio .photo{grid-column:1 / -1}
.photo-trio .photo.robin{grid-column:auto;aspect-ratio:1/1}

/* Deeper banner (memorial benches page) */
.hero.deep .hero-img{aspect-ratio:16/9}
@media (max-width:700px){.hero.deep .hero-img{aspect-ratio:4/3}}

/* Strapline in bold */
.strap{font-weight:700}

/* Four-photo band (green woodworking page) */
.photo-band-section{padding-top:clamp(28px,4vw,48px)}
.photo-band{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.photo-band img{width:100%;aspect-ratio:1/1;object-fit:cover;background:var(--panel);display:block}
@media (max-width:700px){.photo-band{grid-template-columns:repeat(2,minmax(0,1fr));gap:0}}

/* Home header: two equal halves; left photo shown whole (stretched to fit) */
.hero-pair.half{grid-template-columns:1fr 1fr}
.hero.home .hero-pair.half .hero-img{aspect-ratio:1/1;width:100%;height:auto}
.hero-pair.half .hero-img.stretch{object-fit:fill}
@media (max-width:700px){.hero.home .hero-pair.half .hero-img{aspect-ratio:1/1}}
/* Three-photo header: until each photo loads, show equal squares */
.hero-pair.trio .hero-img{aspect-ratio:1/1}