/* Sector composition families. Information objects remain in vocabulary.ts.
   Container queries allow the same scenes to recompose in comparison windows. */
@container (min-width: 700px) {
 .engine-essential:is(.vertical-materials,.vertical-craft,.vertical-exhibition) .essential-layout{grid-template-columns:1fr 1fr}
 .engine-essential:is(.vertical-materials,.vertical-craft,.vertical-exhibition) .essential-copy{grid-column:2;grid-row:1;padding-left:4%}
 .engine-essential:is(.vertical-materials,.vertical-craft,.vertical-exhibition) .essential-layout>.demo-photo{grid-column:1;grid-row:1;border-radius:0}
 .engine-essential:is(.vertical-practice,.vertical-decision,.vertical-syllabus) .essential-layout{grid-template-columns:1.7fr .65fr;gap:7%}
 .engine-essential:is(.vertical-practice,.vertical-decision,.vertical-syllabus) .essential-layout>.demo-photo{height:67%;align-self:end;border-radius:0}
 .engine-essential:is(.vertical-practice,.vertical-decision,.vertical-syllabus) h3{font-size:5.4cqw;max-width:12ch}
 .engine-essential:is(.vertical-property,.vertical-event) .essential-layout{display:block;position:relative;padding:0 5%}
 .engine-essential:is(.vertical-property,.vertical-event) .essential-copy{position:absolute;inset:auto 43% 5% 8%;background:var(--sector-paper);padding:4%;z-index:2}
 .engine-essential:is(.vertical-property,.vertical-event) .essential-layout>.demo-photo{border-radius:0;height:100%;margin-left:20%}
 .engine-essential:is(.vertical-specification,.vertical-technical,.vertical-shipment) .essential-layout{grid-template-columns:1.3fr 1fr;border-top:1px solid currentColor;margin-inline:5%;padding-inline:0}
 .engine-essential:is(.vertical-specification,.vertical-technical,.vertical-shipment) .essential-layout>.demo-photo{border-radius:0;height:80%;align-self:center}
 .engine-essential:is(.vertical-access,.vertical-care) .essential-layout{grid-template-columns:1.2fr .85fr;gap:8%}
 .engine-essential:is(.vertical-access,.vertical-care) .essential-layout>.demo-photo{border-radius:0 0 45% 45%}
 .engine-essential:is(.vertical-schedule,.vertical-participation) .essential-layout{grid-template-columns:.9fr 1.1fr}
 .engine-essential:is(.vertical-schedule,.vertical-participation) .essential-layout>.demo-photo{border-radius:0;clip-path:polygon(12% 0,100% 0,100% 100%,0 100%)}
 .engine-essential.vertical-seasonal .essential-layout>.demo-photo{border-radius:0 45% 0 0}
 .engine-essential.vertical-vehicle .essential-layout>.demo-photo{border-radius:0;object-position:40%}
 .engine-business:is(.vertical-stay,.vertical-property,.vertical-event) .business-grid{grid-template-columns:54% 1fr;grid-template-rows:50% 50%;gap:0 5%}
 .engine-business:is(.vertical-stay,.vertical-property,.vertical-event) .business-grid>.demo-photo{grid-column:1;grid-row:1/3}
 .engine-business:is(.vertical-stay,.vertical-property,.vertical-event) .business-title{grid-column:2;grid-row:1;align-self:center}
 .engine-business:is(.vertical-stay,.vertical-property,.vertical-event) .business-title h3{font-size:4.3cqw}
 .engine-business:is(.vertical-stay,.vertical-property,.vertical-event) .business-index{grid-column:2;grid-row:2;align-self:center;border:0;display:flex;gap:8%;padding:0}
 .engine-business:is(.vertical-stay,.vertical-property,.vertical-event) .business-index>.demo-kicker{display:none}
 .engine-business:is(.vertical-stay,.vertical-property,.vertical-event) .business-index>div{padding:1rem 0;font-size:1.2cqw}
 .engine-business:is(.vertical-stay,.vertical-property,.vertical-event) .business-note{display:none}
 .engine-business:is(.vertical-materials,.vertical-craft,.vertical-seasonal,.vertical-exhibition) .business-grid{grid-template-columns:30% 40% 1fr;grid-template-rows:50% 50%}
 .engine-business:is(.vertical-materials,.vertical-craft,.vertical-seasonal,.vertical-exhibition) .business-title{grid-column:1/3;grid-row:1}
 .engine-business:is(.vertical-materials,.vertical-craft,.vertical-seasonal,.vertical-exhibition) .business-grid>.demo-photo{grid-column:2;grid-row:2}
 .engine-business:is(.vertical-materials,.vertical-craft,.vertical-seasonal,.vertical-exhibition) .business-index{grid-column:3;grid-row:1/3;padding-left:12%;border-right:0;border-left:1px solid #899083;align-self:center}
 .engine-business:is(.vertical-materials,.vertical-craft,.vertical-seasonal,.vertical-exhibition) .business-note{grid-column:1;grid-row:2;align-self:center;padding:0 10% 0 0}
 .engine-business:is(.vertical-practice,.vertical-decision,.vertical-access,.vertical-technical) .business-grid{grid-template-columns:22% 1fr 27%;grid-template-rows:53% 47%}
 .engine-business:is(.vertical-practice,.vertical-decision,.vertical-access,.vertical-technical) .business-title{grid-column:2/4}
 .engine-business:is(.vertical-practice,.vertical-decision,.vertical-access,.vertical-technical) .business-title h3{font-family:Arial,Helvetica,sans-serif;max-width:15ch}
 .engine-business:is(.vertical-practice,.vertical-decision,.vertical-access,.vertical-technical) .business-grid>.demo-photo{grid-column:3}
 .engine-business:is(.vertical-practice,.vertical-decision,.vertical-access,.vertical-technical) .business-note{grid-column:2;grid-row:2;align-self:center;padding:0 12% 0 0}
 .engine-business:is(.vertical-schedule,.vertical-vehicle,.vertical-shipment) .business-grid{grid-template-columns:19% 53% 1fr}
 .engine-business:is(.vertical-schedule,.vertical-vehicle,.vertical-shipment) .business-title h3{font-family:Arial,Helvetica,sans-serif;font-weight:500;letter-spacing:-.06em}
 .engine-signature:is(.vertical-stay,.vertical-property,.vertical-event) .signature-depth>.photo-context{inset:0;opacity:.8}
 .engine-signature:is(.vertical-stay,.vertical-property,.vertical-event) .signature-depth>.photo-detail{inset:53% 7% 7% 73%;transform:translateY(calc(var(--travel)*-40%))}
 .engine-signature:is(.vertical-stay,.vertical-property,.vertical-event) .signature-title{top:23%;left:7%;right:27%}
 .engine-signature:is(.vertical-stay,.vertical-property,.vertical-event) .signature-title h3{max-width:10ch;font-size:8cqw}
 .engine-signature:is(.vertical-materials,.vertical-craft,.vertical-lookbook) .signature-depth>.photo-context{inset:0 45% 0 0;opacity:.65}
 .engine-signature:is(.vertical-materials,.vertical-craft,.vertical-lookbook) .signature-depth>.photo-detail{inset:10% 7% 14% 68%;transform:translateY(calc(var(--travel)*-14%)) rotate(calc(3deg - var(--detail)*3deg))}
 .engine-signature:is(.vertical-materials,.vertical-craft,.vertical-lookbook) .signature-title{left:31%;top:23%;right:5%}
 .engine-signature:is(.vertical-materials,.vertical-craft,.vertical-lookbook) .signature-title h3{font-size:7.2cqw;max-width:11ch}
 .engine-signature:is(.vertical-specification,.vertical-installation,.vertical-technical,.vertical-shipment) .signature-depth>.photo-context{inset:12% 0 0 26%;opacity:.62}
 .engine-signature:is(.vertical-specification,.vertical-installation,.vertical-technical,.vertical-shipment) .signature-depth>.photo-detail{inset:16% 71% 8% 5%;transform:translateY(calc(var(--travel)*-10%))}
 .engine-signature:is(.vertical-specification,.vertical-installation,.vertical-technical,.vertical-shipment) .signature-title{top:30%;left:12%}
 .engine-signature:is(.vertical-specification,.vertical-installation,.vertical-technical,.vertical-shipment) .signature-title h3{font-size:7.4cqw;max-width:11ch}
}
/* Calm, open Signature art direction for care, access and learning. */
.engine-signature:is(.vertical-access,.vertical-care,.vertical-syllabus,.vertical-participation){background:var(--sector-paper);color:#17232b}
.engine-signature:is(.vertical-access,.vertical-care,.vertical-syllabus,.vertical-participation) .demo-brand,
.engine-signature:is(.vertical-access,.vertical-care,.vertical-syllabus,.vertical-participation) .demo-veil{background:var(--sector-paper)!important}
.engine-signature:is(.vertical-access,.vertical-care,.vertical-syllabus,.vertical-participation) .signature-depth>.photo-context{opacity:.3;filter:none}
.engine-signature:is(.vertical-access,.vertical-care,.vertical-syllabus,.vertical-participation) .signature-depth>.photo-detail{opacity:calc(.6 - var(--detail)*.6);transform:none}
.engine-signature:is(.vertical-access,.vertical-care,.vertical-syllabus,.vertical-participation) .signature-title h3{text-shadow:none}
.engine-signature:is(.vertical-access,.vertical-care,.vertical-syllabus,.vertical-participation) .signature-reframe{background:linear-gradient(90deg,var(--sector-paper) 75%,transparent)}
@container (max-width: 699px){
 .engine-essential:is(.vertical-property,.vertical-event) .essential-layout>.demo-photo{border-radius:0}
 .engine-essential:is(.vertical-materials,.vertical-craft,.vertical-exhibition) .essential-layout>.demo-photo{border-radius:0 60px 0 0}
 .engine-essential:is(.vertical-practice,.vertical-decision,.vertical-syllabus) .essential-layout>.demo-photo{border-radius:0;max-height:35%}
 .engine-business:is(.vertical-stay,.vertical-property,.vertical-event) .business-grid>.demo-photo{border-radius:0 50px 0 0}
 .engine-business:is(.vertical-specification,.vertical-technical,.vertical-shipment) .business-title h3{font-family:Arial,Helvetica,sans-serif}
 .engine-signature:is(.vertical-stay,.vertical-property,.vertical-event) .signature-depth>.photo-context{inset:9% 0 0;opacity:.8}
 .engine-signature:is(.vertical-stay,.vertical-property,.vertical-event) .signature-depth>.photo-detail{inset:63% 65% 8% 6%}
 .engine-signature:is(.vertical-materials,.vertical-craft,.vertical-lookbook) .signature-depth>.photo-detail{inset:14% 9% 52% 60%}
}
