/* Editorial layouts for the 11 editable reference designs. Authoring canvas:
   1200 × 640; print trim: 300 × 160 mm. Existing brand tokens are inherited. */
.reference-about .image-pane{padding:36px 62px 64px}
.reference-about .image-pane img{border-radius:50% 50% 0 0 / 35% 35% 0 0}
.reference-about .text-pane{padding:53px 48px 70px}
.reference-about .text-pane h2{font-size:49px}
.reference-about .text-pane p{font-size:13px;line-height:1.65}
.reference-factory .factory-text{padding:28px 35px 60px}
.reference-factory .factory-photo img{object-position:43% center}
.reference-factory .factory-text p{font-size:12px;line-height:1.65}
.reference-factory .factory-stats{margin-top:23px;gap:22px 12px}
.reference-factory .factory-stats span{font-size:7px;line-height:1.5}
.page.brand-directory{padding:0}
.page.brand-directory.active{display:grid;grid-template-columns:34% 66%;grid-template-rows:minmax(0,1fr)}
.brand-summary{background:var(--brand-green);padding:40px 40px 55px;min-height:0}
.page.brand-directory .brand-summary :is(h2,p,em){color:#fff}
.page.brand-directory .brand-summary .label{color:var(--cream-text)}
.brand-summary h2{font-size:45px}
.brand-total{font:110px/.95 var(--serif);margin:20px 0 8px;color:#fff}
.page.brand-directory .brand-total-caption{font:400 10px/1.8 var(--sans);letter-spacing:2px;text-transform:uppercase;max-width:260px}
.partner-note{border-top:1px solid #ffffff35;margin-top:20px;padding-top:20px}
.page.brand-directory .partner-note p{font:23px/1.35 var(--serif);margin-top:15px}
.brand-categories{display:grid;grid-template-columns:1fr 1fr;gap:18px 24px;padding:45px 36px 76px}
.brand-categories article{display:grid;grid-template-columns:24px 1fr;gap:8px;align-content:start;border-top:1px solid var(--rule);padding-top:10px}
.brand-categories article>span{font:22px/1 var(--serif);color:var(--cream-accent-on-light)}
.brand-categories h3{font:500 10px/1.3 var(--sans);letter-spacing:.35px;text-transform:uppercase;margin:0 0 7px}
.brand-categories p{font-size:10px;line-height:1.5;margin:0}
.brand-directory .folio>span:first-child{color:#fff;font-size:6px;letter-spacing:.5px}
.page.bespoke-page{padding:0}
.page.bespoke-page.active{display:grid;grid-template-columns:51% 49%}
.bespoke-copy{padding:44px 42px 70px}
.bespoke-copy h2{font-size:51px;margin-bottom:26px}
.bespoke-copy>p{font-size:12px;line-height:1.65}
.bespoke-image{padding:0 0 47px}
.bespoke-image img{width:100%;height:100%;object-position:center}
.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:23px 26px;margin-top:27px}
.feature-grid article{border-left:2px solid var(--brand-gold);padding-left:12px}
.feature-grid h3{font:500 13px/1.3 var(--sans);margin:0 0 6px}
.feature-grid p{font-size:11px;line-height:1.5;margin:0}
.divisions-page h2{font-size:43px;margin-bottom:28px}
.division-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr 1.25fr;gap:20px}
.division-images{display:flex;gap:7px;height:232px;margin-bottom:18px;overflow:hidden}
.division-images img{min-width:0;flex:1;width:0;height:100%;object-fit:cover}
.division-number{font:22px var(--serif);color:var(--cream-accent-on-light)}
.division-grid h3{font-size:25px;margin:7px 0 10px;letter-spacing:-.4px}
.division-grid p{font-size:11px;line-height:1.6;margin:0}
.sector-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:26px}
.sector-heading h2{font-size:47px;margin-bottom:0}
.sector-count{text-align:center;padding-right:4px}
.sector-count b{font:72px/.8 var(--serif);display:block;color:#fff}
.sector-count span{font-size:8px;letter-spacing:2px;display:block;margin-top:12px;color:var(--cream-text)}
.sector-list article{display:grid;grid-template-columns:26px 190px 1fr;gap:12px;align-items:center;border-top:1px solid #ffffff30;min-height:43px;padding:7px 0}
.sector-list article>span{font:20px var(--serif);color:var(--cream-text)}
.sector-list h3{font:500 10px/1.35 var(--sans);text-transform:uppercase;letter-spacing:.4px;margin:0}
.sector-list p{font-size:11px;line-height:1.4;margin:0}
.portfolio-intro{padding:0}
.portfolio-intro.active{display:grid;grid-template-columns:53% 47%;grid-template-rows:minmax(0,1fr)}
.portfolio-intro>div{min-height:0}
.portfolio-copy{padding:73px 54px 75px}
.portfolio-copy h2{font-size:79px;margin:27px 0}
.portfolio-copy>p{font-size:17px;line-height:1.65;max-width:460px}
.portfolio-count{display:flex;align-items:center;gap:23px;margin-top:34px}
.portfolio-count b{font:82px/1 var(--serif);color:var(--cream-text)}
.portfolio-count span{font-size:10px;line-height:1.7;letter-spacing:2px}
.portfolio-photo{padding:35px 54px 47px 0}
.portfolio-photo img{width:100%;height:100%;border-radius:50% 50% 0 0 / 38% 38% 0 0}
.project-detail{padding:35px 40px 65px}
.project-heading{display:grid;grid-template-columns:52% 48%;gap:20px;height:183px}
.project-number{font:72px/.85 var(--serif);color:var(--brand-gold);display:block}
.project-heading h2{font-size:42px;margin:7px 0 11px}
.project-heading .label{font-size:8px;letter-spacing:1.4px;line-height:1.5}
.project-description{padding-top:3px;padding-right:18px}
.project-description p{font-size:12px;line-height:1.6;margin:10px 0}
.project-description .project-brands{font-size:8px;line-height:1.5;letter-spacing:.5px;margin-top:11px}
.project-brands b{color:var(--cream-accent-on-light);margin-right:7px}
.project-gallery{display:grid;grid-template-columns:1.5fr 1fr 1fr;grid-template-rows:minmax(0,1fr);gap:16px;height:265px;margin-top:16px}
.project-gallery img{width:100%;height:100%;min-width:0;min-height:0;object-fit:cover}
.project-metrics{display:flex;gap:48px;margin:21px 0 0}
.project-metrics>div{min-width:100px}
.project-metrics dt{font-size:8px;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:5px;color:var(--brand-green)}
.project-metrics dd{font:29px/1.05 var(--serif);margin:0;color:var(--reading-ink)}
.project-metrics>div:first-child dd{color:var(--cream-accent-on-light)}
.selected-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:23px}
.selected-heading h2{font-size:47px;margin-bottom:0}
.selected-heading>.label{font-size:9px;letter-spacing:1px;padding-bottom:5px}
.fitout-grid{display:grid;grid-template-columns:1fr 1fr;gap:34px}
.fitout-photo{height:190px;position:relative}
.fitout-photo img{width:100%;height:100%;object-fit:cover}
.fitout-photo>span{position:absolute;bottom:0;left:0;background:var(--brand-green);color:#fff;font-size:9px;letter-spacing:2px;padding:10px 13px}
.fitout-grid h3{font-size:29px;margin:17px 0 8px}
.fitout-grid .label{font-size:8px;letter-spacing:1.3px}
.fitout-grid article>p{font-size:11px;line-height:1.55;margin:12px 0 18px;min-height:51px}
.fitout-grid .project-metrics{border-top:1px solid var(--rule);gap:20px;margin-top:0;padding-top:13px}
.fitout-grid .project-metrics>div{min-width:0}
.fitout-grid .project-metrics dd{font-size:23px;line-height:1.15}
.fitout-grid .project-metrics>div:last-child{flex:1}
.fitout-grid .project-metrics>div:last-child dd{font-size:20px}
.reference-contact .text-pane{padding:45px 43px 65px}
.reference-contact .text-pane h2{font-size:53px;line-height:1.01;margin:24px 0}
.reference-contact .contact-services{font:italic 20px/1.5 var(--serif);margin:22px 0}
.reference-contact .text-pane>.bars:nth-of-type(2){margin:24px 0}
.reference-contact .contact-info{margin-top:24px}
.reference-contact .contact-photo{padding:35px 45px 47px 15px}
.reference-contact .contact-photo img{border-radius:50% 50% 0 0 / 48% 48% 0 0}
.reference-contact .contact-info p{font-size:12px}
.reference-contact .web-address{display:inline-block;margin-top:15px;text-transform:lowercase}
.contents-page .book-contents>div{padding:7px 0;font-size:12px}

/* Portrait mode retains the same fixed page frame, with natural internal scroll. */
@media print{
 .page.brand-directory,.page.bespoke-page,.page.portfolio-intro{display:grid!important}
 .brand-directory{grid-template-columns:34% 66%}
 .bespoke-page{grid-template-columns:51% 49%}
 .portfolio-intro{grid-template-columns:53% 47%}
 .brand-directory,.portfolio-intro{grid-template-rows:minmax(0,1fr)}
}

/* About us: centre the copy vertically, with the footer title on its left axis. */
.page.reference-about .text-pane{display:flex;flex-direction:column;justify-content:center;padding:0 48px}
.page.reference-about .text-pane>.bars{flex-shrink:0}
.page.reference-about .text-pane>p{margin:0 0 14px}
.page.reference-about .text-pane>p:last-child{margin-bottom:0}
.page.reference-about .folio span:nth-child(2){left:calc(50% + 48px);transform:none}

/* Mission and vision: light paper, ordered statements, and an inset photograph. */
.page.mission-light{background:var(--paper);color:var(--brand-green)}
.page.mission-light.active{grid-template-columns:57% 43%}
.page.mission-light .text-pane{padding:45px 50px 74px 54px;display:flex;flex-direction:column;justify-content:center}
.page.mission-light .text-pane>.bars{margin:0 0 17px;flex-shrink:0}
.page.mission-light .text-pane>.label{font-size:9px;letter-spacing:2.2px;color:var(--brand-green)}
.page.mission-light .text-pane h2{font-size:49px;line-height:1.01;margin:18px 0 31px;letter-spacing:-1px}
.page.mission-light .purpose{position:relative;border-left:0;border-top:1px solid #c8bca5;padding:19px 0 19px 42px;margin:0}
.page.mission-light .purpose::before{content:'01';position:absolute;top:24px;left:0;font:500 10px/1 var(--sans);letter-spacing:1px;color:var(--cream-accent-on-light)}
.page.mission-light .purpose+.purpose::before{content:'02'}
.page.mission-light .purpose h3{font:400 28px/1.1 var(--serif);margin:0 0 9px;color:var(--brand-green)}
.page.mission-light .purpose p{font:400 13px/1.7 var(--sans);margin:0;max-width:475px;color:var(--reading-ink)}
.page.mission-light .full-image{padding:40px 54px 74px 0;min-height:0;position:relative}
.page.mission-light .full-image::before{content:'';position:absolute;left:-13px;right:68px;top:54px;bottom:61px;background:#e8ddc8}
.page.mission-light .full-image img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;object-position:50% center}
@media print{
 .page.mission-light{grid-template-columns:57% 43%!important}
 .page.mission-light .text-pane{padding:45px 50px 74px 54px;display:flex}
 .page.mission-light .full-image{padding:40px 54px 74px 0;margin:0;height:auto}
}

/* Bespoke work: a spacious image-led opening and a separate capability band. */
.page.bespoke-refined{padding:0;background:var(--paper)}
.page.bespoke-refined.active{display:block}
.bespoke-refined .bespoke-copy{position:absolute;left:54px;top:43px;width:450px;padding:0}
.bespoke-refined .bespoke-copy>.bars{margin:0 0 18px}
.bespoke-refined .bespoke-copy>.label{font-size:9px;letter-spacing:2.2px}
.page.bespoke-refined .bespoke-copy h2{font-size:57px;line-height:.99;margin:22px 0 25px;letter-spacing:-1.2px}
.page.bespoke-refined .bespoke-copy>p{font-size:13px;line-height:1.75;margin:0;max-width:420px}
.bespoke-refined .bespoke-image{position:absolute;left:560px;top:36px;right:54px;height:359px;padding:0;margin:0}
.bespoke-refined .bespoke-image img{width:100%;height:100%;object-fit:cover;object-position:center;filter:none}
.bespoke-refined .feature-grid{position:absolute;left:54px;right:54px;top:429px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;margin:0;padding-top:22px;border-top:1px solid #b5a484;counter-reset:capability}
.bespoke-refined .feature-grid article{border:0;padding:0;counter-increment:capability;min-width:0}
.bespoke-refined .feature-grid article::before{content:'0' counter(capability);display:block;font:500 9px/1 var(--sans);letter-spacing:1px;color:var(--cream-accent-on-light);margin-bottom:12px}
.page.bespoke-refined .feature-grid h3{font:400 25px/1.08 var(--serif);letter-spacing:-.3px;margin:0 0 10px;color:var(--brand-green)}
.page.bespoke-refined .feature-grid p{font:400 11px/1.6 var(--sans);margin:0;max-width:235px}
@media print{
 .page.bespoke-refined{display:block!important}
 .bespoke-refined .bespoke-copy{position:absolute;left:54px;top:43px;width:450px}
 .bespoke-refined .bespoke-image{position:absolute;left:560px;top:36px;right:54px;height:359px;margin:0}
 .bespoke-refined .feature-grid{position:absolute;left:54px;right:54px;top:429px;grid-template-columns:repeat(4,minmax(0,1fr));margin:0}
}

/* Three business divisions, each with a concise description. */
.page.divisions-three .division-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.divisions-three .division-images{height:260px;margin-bottom:17px}
.divisions-three .division-images img{object-position:50% 40%}
.page.divisions-three .division-grid h3{font-size:29px;margin:6px 0 10px}
.page.divisions-three .division-grid p{font-size:12px;line-height:1.6;max-width:315px}
@media print{.page.divisions-three .division-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}}
