/* ALIGN specialisms: restrained alternating chapters with card design leading. */
.specialism {
  padding: clamp(65px, 6.8vw, 116px) 6%;
  scroll-margin-top: 90px;
}
.specialism-inner {
  max-width: 1496px;
  margin: 0 auto;
}
.specialism-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(290px, .75fr);
  align-items: end;
  gap: 5%;
  margin-bottom: 42px;
}
.specialism-heading h2 {
  font-size: clamp(3rem, 6vw, 7rem);
  line-height: 1.02;
  margin-top: 20px;
  text-wrap: balance;
}
.specialism-heading h2 span { color: var(--coral); }
.specialism-heading > p {
  max-width: 490px;
  font-size: clamp(.96rem, 1.2vw, 1.08rem);
  line-height: 1.8;
  padding-bottom: 8px;
  text-wrap: pretty;
}
.specialism-card {
  background: #fff;
  color: var(--ink);
}
.specialism-card .eyebrow { color: var(--coral); }
.specialism-card .specialism-heading > p { color: var(--ink); }
.card-sector-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 20px;
}
.card-sector-link {
  min-width: 0;
  display: flex;
  flex-direction: column;
  min-height: 325px;
  border-radius: 18px;
  padding: clamp(25px, 3vw, 40px);
  background: #DACBB9;
  color: var(--ink);
  border: 1px solid #25252515;
  transition: background-color .24s ease, transform .24s ease, border-color .24s ease;
}
.card-sector-link:hover,
.card-sector-link:focus-visible {
  background: var(--coral);
  border-color: var(--coral);
  transform: translateY(-3px);
}
.card-sector-link:focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; }
.card-sector-link:active { background: var(--coral); }
.card-sector-number {
  display: block;
  margin-bottom: 30px;
  color: var(--wine);
  font: 700 1.15rem/1 Syne, Arial, sans-serif;
}
.card-sector-link h3 {
  font-size: clamp(1.8rem, 2.65vw, 3rem);
  line-height: 1.12;
  letter-spacing: -.035em;
  margin: 0 0 20px;
  text-wrap: balance;
}
.card-sector-link > p {
  font-size: clamp(.9rem, 1vw, 1rem);
  line-height: 1.7;
  max-width: 37ch;
  text-wrap: pretty;
}
.sector-action,
.specialism-all,
.brand-feature-action {
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  font-size: .92rem;
}
.card-sector-link .sector-action {
  margin-top: auto;
  padding-top: 27px;
  border: 0;
  justify-content: flex-start;
  font-size: .84rem;
}
.sector-action .ui-arrow,
.specialism-all .ui-arrow { color: var(--wine); }
.card-sector-link:hover .ui-arrow,
.card-sector-link:focus-visible .ui-arrow { color: var(--ink); }
.specialism-all {
  border-bottom: 1px solid #25252580;
  padding-bottom: 7px;
  margin-top: 30px;
  width: fit-content;
}
.specialism-all:hover,
.specialism-all:focus-visible { border-color: var(--wine); color: var(--wine); }

/* Warm stone follows the white Card Design chapter. */
.visual-evolution .print-pillar.wrap {
  max-width: none;
  padding: 100px max(6%, calc((100vw - 1496px) / 2));
  background: #DACBB9;
  color: var(--ink);
}
.print-pillar .eyebrow { color: var(--coral); }
.print-pillar .pillar-head,
.print-pillar .print-composition,
.print-pillar .pillar-foot { max-width: 1496px; margin-left: auto; margin-right: auto; }
.print-pillar .print-composition img { background: #e3e6dd; }
.print-pillar .pillar-foot .text-link { border-color: var(--ink); }

.specialism-brand {
  background: #fff;
  color: var(--ink);
}
.specialism-brand .eyebrow,
.specialism-brand .specialism-heading h2 span { color: var(--coral); }
.brand-feature-link {
  display: block;
  color: var(--ink);
}
.brand-feature-media {
  display: grid;
  grid-template-columns: 1fr 1.25fr;
  gap: 20px;
}
.brand-feature-media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1.45;
  object-fit: contain;
  background: #e8e0d3;
  border-radius: 20px;
}
.brand-feature-media img:first-child { background: #ffdd37; }
.brand-feature-action {
  border-top: 1px solid #2525257a;
  margin-top: 24px;
  padding-top: 16px;
  font-family: Syne, Arial, sans-serif;
  font-size: clamp(1.2rem, 1.8vw, 1.7rem);
  font-weight: 700;
}
.brand-feature-action .ui-arrow { color: var(--wine); }
.brand-feature-link:hover .brand-feature-action { color: var(--wine); }

.visual-evolution .digital-pillar { background: #DACBB9; color: var(--ink); }
.visual-evolution .digital-pillar .packaging-showcase { background: #DACBB9; }
.digital-pillar .eyebrow { color: var(--coral); }
.digital-pillar .text-link { border-color: var(--ink); }
.digital-pillar .video-toggle { color: var(--ink); border-color: #25252580; }
.digital-pillar .video-toggle:hover { background: var(--ink); color: #fff; }

/* Card Design detail: choice first, followed by separate evidence for each audience. */
.card-service .service-hero { padding-bottom: 70px; }
.card-service-dot { color: var(--coral); }
.card-route-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 24px;
}
.card-route {
  display: block;
  min-width: 0;
  background: var(--ink);
  color: var(--chalk);
  padding: 12px;
  border-radius: 20px;
  border: 1px solid transparent;
  transition: transform .25s ease, border-color .25s ease;
}
.card-route:hover,
.card-route:focus-visible { transform: translateY(-4px); border-color: var(--coral); }
.card-route > img {
  width: 100%;
  aspect-ratio: 1.586;
  object-fit: cover;
  border-radius: 12px;
}
.card-route > div { padding: 23px 16px 21px; }
.card-route h2 {
  font-size: clamp(1.9rem, 2.6vw, 3.1rem);
  line-height: 1.12;
  margin: 12px 0 27px;
}
.card-route .eyebrow { color: var(--coral); }
.card-route span:not(.eyebrow) {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding-bottom: 6px;
  border-bottom: 1px solid #f4f0e96b;
  font-size: .88rem;
}
.card-route .ui-arrow { color: var(--coral); }
.card-service .capabilities { padding-top: 50px; }
.card-section-intro { max-width: 1100px; margin-bottom: 48px; }
.card-section-intro .eyebrow { color: var(--coral); margin-bottom: 22px; }
.card-section-intro h2 { font-size: clamp(2.5rem, 4.6vw, 5.4rem); }
.card-section-intro > p:last-child { font-size: 1.05rem; line-height: 1.8; max-width: 740px; margin-top: 25px; }
.card-financial-section.wrap,
.card-retail-section.wrap {
  max-width: none;
  padding: 85px max(6%, calc((100vw - 1496px) / 2));
  scroll-margin-top: 85px;
}
.card-financial-section { background: var(--ink); color: var(--chalk); }
.card-financial-section .project-grid img { background: #3f3f3f; }
.card-financial-section .video-grid { max-width: 750px; }
.card-financial-section .project-video .video-toggle { color: var(--chalk); border-color: #f4f0e977; }
.card-retail-section { background: #DACBB9; color: var(--ink); }
.card-retail-section .card-section-intro .eyebrow { color: var(--wine); }
.retail-category-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 16px;
  margin-bottom: 88px;
}
.retail-category-grid article {
  min-width: 0;
  background: var(--chalk);
  border: 1px solid #25252529;
  border-radius: 18px;
  padding: clamp(22px, 3vw, 38px);
  display: flex;
  flex-direction: column;
  min-height: 310px;
}
.retail-category-grid article:first-child { background: var(--coral); }
.retail-category-grid .category-number {
  font: 700 1.2rem Syne, Arial, sans-serif;
  color: var(--wine);
  margin-bottom: 29px;
}
.retail-category-grid h3 { font-size: clamp(1.7rem, 2.2vw, 2.6rem); margin-bottom: 18px; }
.retail-category-grid p { font-size: .91rem; line-height: 1.7; }
.retail-category-grid a {
  display: inline-flex;
  gap: 15px;
  align-items: center;
  width: fit-content;
  margin-top: auto;
  padding-top: 22px;
  font-size: .84rem;
  border-bottom: 1px solid;
}
.retail-category-grid article { scroll-margin-top: 105px; }
.gift-card-work { scroll-margin-top: 105px; }
.gift-card-work .section-head { margin-bottom: 42px; }
.card-retail-section .project-grid img { background: #ebe6df; }

/* No fixed-ratio letterboxing: the approved artwork fills its own image frame. */
.card-retail-section .project-grid img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: auto;
  object-fit: cover;
}
.card-retail-section .project-grid figure { align-self: start; }

/* One typographic scale and one accent for chapters 01–04. */
.visual-evolution .specialism-heading h2,
.visual-evolution .pillar-head h2 {
  font-size: clamp(2.6rem, 4.7vw, 5.2rem);
  line-height: 1.08;
  letter-spacing: -.035em;
  text-wrap: balance;
}
.visual-evolution .work-heading {
  width: min(88%, 1496px);
  max-width: 1496px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
}

@media(max-width: 900px) {
  .specialism-heading { grid-template-columns: 1fr; gap: 22px; }
  .specialism-heading > p { max-width: 730px; }
  .retail-category-grid { gap: 12px; }
  .retail-category-grid article { padding: 22px; }
}
@media(max-width: 850px) {
  .card-sector-grid { grid-template-columns: 1fr; }
  .card-sector-link { min-height: 250px; }
}
@media(max-width: 720px) {
  .specialism { padding: 56px 6%; }
  .specialism-heading { margin-bottom: 30px; }
  .specialism-heading h2 { font-size: clamp(2.55rem, 10vw, 4.4rem); }
  .card-route-grid,
  .brand-feature-media { grid-template-columns: 1fr; }
  .card-sector-grid { gap: 14px; }
  .card-route { border-radius: 16px; }
  .card-route > img { border-radius: 10px; }
  .card-sector-link { min-height: 238px; border-radius: 16px; padding: 26px; }
  .card-sector-link h3 { font-size: clamp(1.9rem, 7vw, 2.4rem); margin-bottom: 12px; }
  .card-sector-number { margin-bottom: 22px; }
  .card-sector-link .sector-action { padding-top: 20px; }
  .visual-evolution .print-pillar.wrap { padding: 60px 6%; }
  .brand-feature-media img { aspect-ratio: 1.55; border-radius: 14px; }
  .brand-feature-action { font-size: 1.18rem; }
  .card-service .service-hero { padding-bottom: 45px; }
  .card-route-grid { gap: 18px; }
  .card-route > div { padding: 19px 12px 18px; }
  .card-service .capabilities { padding-top: 25px; }
  .card-financial-section.wrap,
  .card-retail-section.wrap { padding: 60px 6%; }
  .card-section-intro h2 { font-size: 2.45rem; }
  .card-section-intro > p:last-child { font-size: .97rem; }
  .retail-category-grid { grid-template-columns: 1fr; margin-bottom: 60px; }
  .retail-category-grid article { min-height: 0; padding: 25px; }
  .retail-category-grid .category-number { margin-bottom: 18px; }
  .retail-category-grid h3 { margin-bottom: 13px; }
  .retail-category-grid a { margin-top: 20px; }
  .visual-evolution .specialism-heading h2,
  .visual-evolution .pillar-head h2 { font-size: clamp(2.45rem, 8.4vw, 3.6rem); }
}
@media(prefers-reduced-motion:reduce) {
  .card-sector-link,.card-route { transition: none; }
  .card-sector-link:hover,.card-route:hover { transform: none; }
}