/* Scoped to the institutional pages. The field camera and store map are untouched. */
.care-story,.home-journal,.next-connection {padding-block:clamp(80px,9vw,144px)}
.care-story {display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:40px 5%;align-items:start}
.care-photo {position:relative;margin:0;overflow:hidden;background:#e7eee9}
.care-photo img,.motion-photo>img {display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.08) translateY(var(--camera-y,0px))}
.care-photo-wide {grid-column:1/9;grid-row:1;height:clamp(280px,30vw,440px);border-radius:14px}
.care-photo-close {grid-column:9/13;grid-row:1;margin-top:100px;height:clamp(270px,25vw,370px);border-radius:14px}
.care-photo-close img {object-position:70% center}
.care-copy {grid-column:1/6;grid-row:2;padding-top:32px}
.care-copy h2 {font:600 clamp(36px,4.1vw,62px)/1.08 var(--display);letter-spacing:-.035em;margin:0 0 28px}
.care-copy>p {font-size:17px;line-height:1.7;color:var(--muted);max-width:49ch}
.care-copy>.care-lead {font-size:clamp(21px,2vw,28px);line-height:1.45;color:var(--ink)}
.care-copy .button {margin-top:16px}
.care-photo-field {grid-column:6/13;grid-row:2;height:clamp(330px,32vw,480px);margin-top:-60px;border-radius:14px}
.care-photo figcaption,.journal-cover figcaption {position:absolute;bottom:16px;left:16px;right:16px;width:fit-content;background:#182c24ed;color:white;padding:6px 12px;font-size:12px;border-radius:4px}
.motion-heading>span {display:block}
.motion-heading em,.scene-heading em,.journal-cover em,.next-connection em {font-style:normal;color:var(--red)}
.scene-heading {display:flex;justify-content:space-between;align-items:end;gap:48px;padding-bottom:48px}
.scene-heading h2,.next-connection h2 {font:600 clamp(38px,5vw,72px)/1.04 var(--display);letter-spacing:-.035em;margin:0}
.scene-heading p,.next-connection p {font-size:18px;line-height:1.65;color:var(--muted);max-width:42ch;margin:0 0 24px}
.featured-scenes {padding-top:36px}
.product-scenes {display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.product-scene {position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:center;min-height:650px;padding:38px 24px 30px;color:white;background:var(--scene-color);perspective:1000px}
.scene-berry {--scene-color:#493329;color:var(--scene-color);background:radial-gradient(ellipse at 50% 46%,#fffaf0 0%,#f4e8d5 45%,#ddc4a6 100%)}
.scene-berry .fluid-material {opacity:.12}
.scene-berry .scene-title p {color:var(--scene-color)}
.scene-plum {--scene-color:#513367}
.scene-ocean {--scene-color:#285b6b}
.scene-forest {--scene-color:#3e593e}
.fluid-material {position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.scene-title {text-align:center;min-height:94px;width:100%}
.scene-title h3 {font:600 clamp(24px,2.1vw,32px)/1.15 var(--display);letter-spacing:-.025em;margin:0 0 12px}
.scene-title p {font-size:14px;line-height:1.45;color:#fff;max-width:24ch;margin:0 auto}
.scene-product {display:grid;place-items:center;flex:1;width:100%;min-height:290px;margin:20px 0;transform:translate3d(var(--scene-x,0px),var(--scene-y,0px),0) rotateY(var(--scene-r,0deg));transform-origin:50% 60%}
.scene-product img {display:block;width:78%;height:330px;object-fit:contain;filter:drop-shadow(12px 18px 15px #0005)}
.scene-product .featured-box {display:block;width:100%;height:330px;cursor:pointer;--poster-color:transparent}
.scene-toggle [data-box-label] {font:inherit}
.featured-box:not(:defined) {visibility:hidden}
.scene-berry .scene-product img {width:94%;height:280px}
.scene-actions {display:flex;align-items:center;flex-direction:column;gap:12px;width:100%}
.scene-actions>span {font-size:14px;margin-bottom:6px}
.scene-actions .button {display:inline-flex;align-items:center;justify-content:center;gap:12px;position:relative;min-height:44px;font:600 13px/1.3 var(--sans);border-radius:100px;padding:12px 18px;color:var(--scene-color);background:white;border:0;cursor:pointer;white-space:normal;text-align:center;max-width:100%;text-decoration:none}
.scene-actions .scene-toggle {background:transparent;color:white;border:1px solid #ffffff70}
.scene-toggle[aria-pressed=true] {background:white;color:var(--scene-color)}
.scene-berry .scene-actions .scene-toggle {color:var(--scene-color);border-color:#49332966}
.scene-berry .scene-toggle[aria-pressed=true] {background:var(--scene-color);color:#fff8ed;border-color:var(--scene-color)}
.scene-actions .ui-icon {width:17px;height:17px;flex-shrink:0}
.product-scene:focus-within {outline:3px solid var(--red);outline-offset:-3px}
.home-journal .scene-heading {padding-bottom:44px}
.journal-pair {display:grid;grid-template-columns:1.2fr 1fr;gap:6%}
.journal-preview:nth-child(2) {padding-top:100px}
.journal-image {display:block;position:relative;overflow:hidden;aspect-ratio:1.5;border-radius:14px;background:#e4eee7}
.journal-arrow {position:absolute;bottom:20px;right:20px;width:48px;height:48px;display:grid;place-items:center;background:white;color:var(--red);border-radius:50%;transition:transform .3s cubic-bezier(.16,1,.3,1)}
.journal-image:hover .journal-arrow {transform:rotate(45deg)}
.journal-location {font-size:13px;color:var(--muted);line-height:1.6;margin:22px 0 12px}
.journal-preview h3 {font:600 clamp(25px,2.5vw,36px)/1.2 var(--display);letter-spacing:-.025em;margin:0 0 18px}
.journal-preview h3 a {text-decoration:none;color:inherit}
.journal-preview>p:last-child {font-size:17px;line-height:1.7;color:var(--muted);max-width:48ch}
.next-connection {display:grid;grid-template-columns:1fr 1fr;gap:10%;border-top:1px solid var(--line)}
.next-connection .button {margin:4px 10px 4px 0}
.editorial-company .company-purpose-grid {grid-template-columns:1.25fr 1fr;gap:0;align-items:center}
.editorial-company .company-field-photo img {aspect-ratio:.95;border-radius:14px}
.editorial-company .company-field-photo figcaption {position:absolute;top:16px;left:16px;max-width:calc(100% - 32px);padding:6px 10px;border-radius:4px;background:#182c24ed;color:white;font-size:12px;line-height:1.4}
.editorial-company .company-purpose-text {position:relative;margin-left:-80px;background:white;padding:clamp(30px,4vw,60px);border-radius:14px;box-shadow:12px 24px 48px #253d3414}
.editorial-company .company-purpose-text h3 {font-size:clamp(30px,3.5vw,48px)}
.editorial-company .company-values-photo {overflow:hidden;border-radius:14px}
.journal-cover {display:grid;grid-template-columns:1fr 1fr;gap:7%;align-items:center;padding-block:80px}
.journal-cover h1 {font:600 clamp(40px,5vw,72px)/1.08 var(--display);letter-spacing:-.035em;margin:0 0 28px}
.journal-cover p {font-size:18px;line-height:1.7;color:var(--muted);max-width:40ch;margin-bottom:28px}
.journal-cover figure {position:relative;margin:0;height:480px;overflow:hidden;border-radius:14px}
.journal-close {padding-block:64px 100px;border-top:1px solid var(--line)}
.journal-close h2 {font-size:clamp(30px,3.5vw,48px);margin:0 0 20px}
.journal-close p {color:var(--muted);font-size:18px;margin-bottom:28px}
.contact-introduction {display:grid;grid-template-columns:1fr .85fr;gap:8%;padding-block:70px 50px;align-items:center}
.contact-introduction h1 {font:600 clamp(40px,5.5vw,76px)/1.05 var(--display);letter-spacing:-.035em;margin:0 0 28px}
.contact-introduction h1 em {font-style:normal;color:var(--red)}
.contact-introduction p {font-size:18px;line-height:1.7;color:var(--muted);max-width:44ch}
.contact-introduction figure {margin:0;position:relative;overflow:hidden;height:340px;border-radius:14px}
.contact-introduction figure img {object-position:72% center}
.contact-introduction figcaption {position:absolute;bottom:14px;left:14px;color:white;background:#182c24ed;padding:6px 10px;font-size:12px;border-radius:4px}
.contact-workspace {display:grid;grid-template-columns:.8fr 1.2fr;gap:10%;padding-bottom:100px}
.contact-topics h2 {font-size:30px;line-height:1.2;letter-spacing:-.025em;margin:0 0 28px}
.contact-topics p {font-size:17px;color:var(--muted);line-height:1.65;max-width:35ch}
.contact-topics button {display:flex;justify-content:space-between;align-items:center;gap:16px;background:white;color:var(--ink);padding:22px 0;width:100%;border:0;border-bottom:1px solid var(--line);font:500 20px/1.3 var(--sans);cursor:pointer;text-align:left}
.contact-topics button:hover {color:var(--red)}
.contact-topics button .ui-icon {color:var(--red);flex-shrink:0}
.contact-workspace form {padding:36px;background:var(--surface);border-radius:14px}
.contact-workspace .form-heading {display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:28px}
.contact-workspace .form-heading h2 {font-size:28px;margin:0}
.contact-workspace .form-heading span {font-size:12px;color:var(--muted)}
.contact-workspace label {display:block;font:500 15px/1.4 var(--sans);margin-bottom:20px}
.contact-workspace .form-row {display:grid;grid-template-columns:1fr 1fr;gap:18px}
.contact-workspace input,.contact-workspace select,.contact-workspace textarea {display:block;width:100%;border:1px solid #a5adb7;background:white;border-radius:6px;color:var(--ink);font:400 16px/1.4 var(--sans);padding:12px 14px;min-height:48px;margin-top:10px;caret-color:var(--red)}
.contact-workspace input::placeholder,.contact-workspace textarea::placeholder {color:var(--muted);opacity:1}
.contact-workspace .form-note,.contact-workspace .form-status {font-size:14px;line-height:1.6;color:var(--muted)}
.contact-workspace .button {margin-top:8px}
.catalogue .catalogue-heading h1 {font:600 clamp(40px,5vw,72px)/1.08 var(--display);letter-spacing:-.035em;margin:0 0 20px}
.catalogue .catalogue-heading h1 em {font-style:normal;color:var(--red)}
.catalogue .product-promo {border-radius:14px;background:#f3f4f4}
.catalogue .promo-slide.is-entering .promo-art {animation:banner-reveal .7s cubic-bezier(.16,1,.3,1) both}
.catalogue .promo-slide.is-entering .promo-copy {animation:banner-copy .5s cubic-bezier(.16,1,.3,1) both}
.catalogue .product-shot {border-radius:0;background:#f5f6f5}
.catalogue .product-card:target {outline:2px solid var(--red);outline-offset:10px}
@keyframes banner-reveal {from {clip-path:inset(0 100% 0 0);transform:scale(1.03)}to {clip-path:inset(0);transform:none}}
@keyframes banner-copy {from {clip-path:inset(0 0 100% 0)}to {clip-path:inset(0)}}
@media (prefers-reduced-motion:no-preference) {
  .brand-motion .motion-heading>span {clip-path:inset(0 0 100% 0);transform:translateY(24px);transition:clip-path .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1)}
  .brand-motion .motion-heading.is-revealed>span {clip-path:inset(0);transform:translateY(0)}
  .brand-motion .motion-heading>span:nth-child(2) {transition-delay:.1s}
  .brand-motion .motion-photo {clip-path:inset(0 0 18% 0);transition:clip-path 1s cubic-bezier(.16,1,.3,1)}
  .brand-motion .motion-photo.is-revealed {clip-path:inset(0)}
  .motion-photo:focus-within {clip-path:inset(0)}
}
@media (max-width:1100px) {
  .product-scenes {grid-template-columns:repeat(2,minmax(0,1fr))}
  .product-scene {min-height:630px}
  .scene-title h3 {font-size:30px}
  .scene-actions {display:grid;grid-template-columns:1fr 1fr;justify-items:center;gap:14px}
  .scene-actions>span {grid-column:1/-1}
  .care-story {gap:32px 4%}
  .care-photo-close {margin-top:70px}
  .care-copy {grid-column:1/7}
  .care-photo-field {grid-column:7/13;height:390px;margin-top:-36px}
}
@media (max-width:700px) {
  .care-story {grid-template-columns:1fr 1fr;gap:20px;padding-block:64px}
  .care-copy {grid-column:1/-1;grid-row:1;padding-top:0}
  .care-copy h2 {font-size:clamp(35px,9vw,48px)}
  .care-copy>.care-lead {font-size:23px}
  .care-photo-wide {grid-column:1/-1;grid-row:2;height:240px;margin-top:16px}
  .care-photo-close {grid-column:1;grid-row:3;height:210px;margin:0}
  .care-photo-field {grid-column:2;grid-row:3;height:230px;margin:30px 0 0}
  .care-photo figcaption {left:10px;right:10px;bottom:10px;font-size:10px;padding:5px 7px}
  .scene-heading {align-items:start;flex-direction:column;gap:24px;padding-bottom:32px}
  .scene-heading h2,.next-connection h2 {font-size:clamp(36px,10vw,50px)}
  .scene-heading p {font-size:17px;margin-bottom:20px}
  .product-scenes {grid-template-columns:1fr}
  .product-scene {min-height:610px;padding:32px 22px 28px}
  .scene-title {min-height:80px}
  .scene-title h3 {font-size:32px}
  .scene-product img {height:310px;width:70%}
  .scene-berry .scene-product img {height:280px;width:75%}
  .scene-actions {display:grid;grid-template-columns:1fr 1fr}
  .scene-actions .button {padding-inline:14px}
  .journal-pair,.next-connection,.journal-cover,.contact-introduction,.contact-workspace {grid-template-columns:1fr;gap:32px}
  .journal-preview:nth-child(2) {padding-top:20px}
  .home-journal,.next-connection {padding-block:64px}
  .journal-cover {padding-block:44px 64px}
  .journal-cover h1,.contact-introduction h1 {font-size:clamp(39px,10vw,54px)}
  .journal-cover figure {height:330px}
  .editorial-company .company-purpose-grid {grid-template-columns:1fr}
  .editorial-company .company-purpose-text {margin:-40px 14px 0;padding:28px}
  .editorial-company .company-field-photo img {aspect-ratio:1.15}
  .contact-introduction {padding-block:44px 38px}
  .contact-introduction figure {height:260px}
  .contact-workspace {padding-bottom:64px}
  .contact-workspace form {padding:26px 22px}
  .contact-workspace .form-row {grid-template-columns:1fr;gap:0}
  .catalogue .catalogue-heading h1 {font-size:40px}
}
@media (prefers-reduced-motion:reduce) {
  .motion-photo>img,.care-photo img,.scene-product {transform:none}
  .brand-motion .motion-heading,.brand-motion .motion-photo {clip-path:none;transition:none}
  .brand-motion .motion-heading>span {clip-path:none;transform:none;transition:none}
  .fluid-material {display:none}
  .catalogue .promo-slide.is-entering .promo-art,.catalogue .promo-slide.is-entering .promo-copy {animation:none}
}
