/* Homepage — reference: 01 - Homepage.png (805px mockup ≈ 1440px desktop, ×1.79) */

/* Hero: headline over sky (left), band composition (right), Lancaster sketch across the top */
.hero--home { --media-w: 50.5%; --fade: 9%; --hero-h: clamp(440px, 40vw, 640px); --copy-w: 56%; }
.hero--home .hero__media img { object-position: 0% 70%; }
.hero-home__lancaster {
  position: absolute; z-index: 0; top: 0; left: 36.3%; width: 40.5%; pointer-events: none;
  -webkit-mask-image: radial-gradient(ellipse 52% 50% at 50% 50%, #000 62%, transparent 100%);
  mask-image: radial-gradient(ellipse 52% 50% at 50% 50%, #000 62%, transparent 100%);
}
.hero--home .display { font-size: clamp(2.9rem, .6rem + 6.1vw, 6.4rem); line-height: .88; }
.hero--home .hero__inner { padding-top: clamp(2rem, 3.4vw, 3.6rem); }
.hero--home .hero__note { --tilt: -10deg; right: 3.5%; top: 9%; }
@media (max-width: 900px) {
  .hero--home { --copy-w: 100%; }
  .hero-home__lancaster { display: none; }
  .hero--home .hero__note { top: auto; bottom: calc(var(--wave-h) + .8rem); right: 1rem; }
}

/* Heritage introduction + scrapbook collage */
.story { background: var(--paper-tex) 0 0 / 512px, var(--paper-warm); padding-top: clamp(3rem, 5vw, 5rem); overflow: hidden; }
.story__grid { display: grid; grid-template-columns: minmax(0, .66fr) minmax(0, 1fr); gap: clamp(1.5rem, 2vw, 2rem); align-items: center; }
.story__text .h-serif { font-size: clamp(2.4rem, 1rem + 4.4vw, 5.2rem); letter-spacing: -.04em; margin-bottom: 1.3rem; white-space: nowrap; }
@media (max-width: 560px) { .story__text .h-serif { white-space: normal; } }
.story__prose { margin-bottom: 1.8rem; max-width: 34em; }
.collage { position: relative; aspect-ratio: 490 / 350; margin-right: calc(-1 * var(--gutter)); }
.collage > * { position: absolute; margin: 0; }
.collage__tartan { left: 45%; top: 0; width: 21%; height: 12%; transform: rotate(3deg); background: var(--tartan) 0 0 / 90px; box-shadow: var(--shadow-sm); }
.collage__sketch { left: 69%; top: 4%; width: 31%; height: 22%; padding: 4% 3%; transform: rotate(2.5deg); background: var(--paper-tex) 0 0 / 300px, #f1ece0; box-shadow: var(--shadow-sm); }
.collage__sketch img { width: 100%; height: 100%; object-fit: contain; opacity: .75; }
.collage__drummers { left: 9%; top: 3%; width: 34%; height: 44%; z-index: 2; }
.collage__piper { left: 52%; top: 12%; width: 19.5%; height: 58%; z-index: 3; }
.collage__practice { left: 0; top: 49%; width: 54%; height: 46%; z-index: 4; }
.collage__bomber { left: 51%; top: 79%; width: 21%; height: 18%; z-index: 4; }
.collage__thistle { left: 72%; top: 22%; width: 31%; opacity: .9; z-index: 1; }
.collage__note { left: 72%; top: 55%; z-index: 5; --tilt: -9deg; font-size: clamp(1.4rem, .9rem + 1.5vw, 2.5rem); }
@media (max-width: 900px) {
  .story__grid { grid-template-columns: 1fr; }
  .collage { margin-inline: 0; }
}

/* Services introduction */
.services-intro { overflow: hidden; }
.services-intro .h-serif { font-size: clamp(2.3rem, 1rem + 4vw, 5rem); }
.services-intro__plane { right: 2%; top: 3%; width: clamp(200px, 26vw, 400px); opacity: .5; }
.services-intro__note { --tilt: -10deg; align-self: flex-start; margin-right: 1rem; font-size: clamp(1.1rem, .8rem + .9vw, 1.7rem); }
.service-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(.9rem, 2vw, 1.8rem); }
.service-cards .card { background: linear-gradient(180deg, #fff, #f3f9fe); }
.service-cards .card__media { --ratio: 3 / 2; }
.service-cards .icon-badge { --size: clamp(54px, 3rem + 1.6vw, 84px); }
.service-cards .card__body { padding-top: 1.1rem; }
.service-rows { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(.9rem, 2vw, 1.8rem); margin-top: clamp(1.2rem, 2.4vw, 2rem); }
.service-row {
  position: relative; display: grid; grid-template-columns: minmax(0, .9fr) auto minmax(0, 1.25fr); align-items: center; gap: clamp(.8rem, 1.6vw, 1.6rem);
  background: linear-gradient(90deg, #f6fbff, #eaf5fd); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-sm); padding-right: 1.2rem;
}
.service-row__media { align-self: stretch; min-height: 150px; }
.service-row__media img { width: 100%; height: 100%; object-fit: cover; }
.service-row__icon { width: clamp(38px, 2rem + 1.2vw, 58px); height: clamp(38px, 2rem + 1.2vw, 58px); color: var(--navy-800); }
.service-row__body { display: grid; gap: .4rem; padding-block: 1rem; }
.service-row__body p { font-size: .92rem; line-height: 1.35; color: var(--text-soft); }
.service-row__body .text-link { justify-self: start; margin-top: .4rem; }
@media (max-width: 980px) {
  .service-cards { grid-template-columns: 1fr 1fr; }
  .service-cards > :last-child { grid-column: 1 / -1; }
  .service-rows { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .service-cards { grid-template-columns: 1fr; }
  .service-row { grid-template-columns: 1fr; padding: 0 0 1rem; }
  .service-row__icon { display: none; }
  .service-row__media { min-height: 180px; }
  .service-row__body { padding-inline: 1.1rem; }
}

/* Gallery teaser: navy band with tartan ribbons and a four-photo strip */
.gallery-teaser { position: relative; overflow: hidden; padding-bottom: 0; }
.gallery-teaser__wave { margin-bottom: -10px; }
.gallery-teaser__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; flex-wrap: wrap; padding-block: .5rem 1.4rem; }
.gallery-teaser .h-serif { font-size: clamp(2.2rem, 1rem + 3.6vw, 4.6rem); }
.gallery-strip { display: grid; grid-template-columns: 1.05fr .95fr 1.2fr 1.05fr; gap: 8px; padding-inline: 0; }
.gallery-strip li { aspect-ratio: 191 / 124; overflow: hidden; border: 2px solid rgb(255 255 255 / .85); }
.gallery-strip li:nth-child(1) { transform: rotate(-1deg); }
.gallery-strip li:nth-child(3) { transform: rotate(.8deg); }
.gallery-strip img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.gallery-strip li:hover img { transform: scale(1.05); }
.gallery-teaser__edge { margin-top: calc(var(--wave-h) * -.55); position: relative; z-index: 2; }
@media (max-width: 700px) { .gallery-strip { grid-template-columns: 1fr 1fr; } }

/* Join teaser */
.join-teaser { background: #fff; }
.join-teaser__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: center; }
.join-teaser .prose { margin: .9rem 0 1.4rem; max-width: 40em; }
.join-teaser .h-serif { letter-spacing: -.04em; font-size: clamp(1.9rem, .9rem + 2.7vw, 3.6rem); }
@media (min-width: 1100px) { .join-teaser .h-serif, .social-band .h-serif { white-space: nowrap; } }
@media (max-width: 900px) { .join-teaser__grid { grid-template-columns: 1fr; } }

/* Social band */
.social-band { background: linear-gradient(180deg, #e3f2fd, #d7ecfb); overflow: hidden; padding-bottom: calc(var(--section-y) * .6 + var(--wave-h) * .5); }
.social-band__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) auto; gap: 2rem; align-items: center; padding-left: clamp(0rem, 5vw, 5rem); }
.social-band__text { max-width: 38em; margin-top: .5rem; }
.social-band .h-serif { letter-spacing: -.04em; font-size: clamp(1.9rem, .9rem + 2.7vw, 3.6rem); }
.social-band__thistle { top: 10%; }
.social-band__plane { left: 52%; top: 8%; width: clamp(90px, 9vw, 150px); }
@media (max-width: 860px) { .social-band__grid { grid-template-columns: 1fr; padding-left: 0; } }