/* V13 — image-led editorial integration */

/* Editorial moments: use background-bearing imagery as real image fields, not floating assets */
.moments-editorial{gap:clamp(70px,8vw,150px)}
.moments-editorial .moment-card{position:relative}
.moments-editorial .moment-media{border-radius:0;background:#d8c7b4;min-height:clamp(620px,68vw,960px)}
.moments-editorial .moment-card-wide .moment-media{height:min(62vw,920px)}
.moments-editorial .moment-card-offset{width:min(74vw,1080px);margin-left:auto;margin-right:var(--mx)}
.moments-editorial .moment-card-offset .moment-media{height:min(68vw,900px)}
.moments-editorial .moment-card-object{width:min(70vw,980px);margin-left:var(--mx)}
.moments-editorial .moment-media>img.parallax-media{inset:-6%;width:112%;height:112%;object-fit:cover;filter:none}
.moment-image-wash{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.02) 48%,rgba(0,0,0,.55) 100%)}
.moment-cover-light .moment-image-wash{background:linear-gradient(180deg,rgba(28,17,10,.02) 45%,rgba(28,17,10,.48) 100%)}
.moment-caption-overlay{position:absolute;z-index:4;left:clamp(28px,4vw,66px);right:clamp(28px,4vw,66px);bottom:clamp(30px,4vw,62px);display:grid;grid-template-columns:70px minmax(0,1.1fr) minmax(240px,.8fr);gap:24px;color:#fff;align-items:end;margin:0;padding:0;border:0}
.moment-caption-overlay>span{font-size:13px;letter-spacing:.1em;opacity:.75;align-self:start;padding-top:7px}
.moment-caption-overlay h3{font-size:clamp(42px,4.2vw,74px);line-height:.92;letter-spacing:-.055em;font-weight:500;margin:0;max-width:680px}
.moment-caption-overlay p{font-size:clamp(15px,1.25vw,19px);line-height:1.48;margin:0;max-width:480px;opacity:.82}
.moment-object-editorial .moment-media{background:#e7e0d8;display:grid;place-items:center}
.moment-object-editorial .moment-media>img.parallax-object{width:min(60%,620px);max-height:65%;object-fit:contain;z-index:2}
.moment-caption-dark{color:#221914}

/* Brand cues: background-bearing visuals fill the frame like editorial art direction */
.brand-cues-visual{min-height:560px;background:#d8d0c6}
.brand-cues-visual img{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover;filter:none!important;z-index:1;transform:scale(1.015);transition:transform .8s var(--ease-silk)}
.brand-cues-visual:after{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.18));pointer-events:none}
.brand-cues-visual span{z-index:3;color:rgba(255,255,255,.78);text-shadow:0 1px 22px rgba(0,0,0,.18)}
#conceptCanvas[data-concept="heritage"] .brand-cues-visual,
#conceptCanvas[data-concept="product"] .brand-cues-visual,
#conceptCanvas[data-concept="editorial"] .brand-cues-visual{background:#d8d0c6}
#conceptCanvas[data-concept="product"] .brand-cues-visual img{width:100%!important;height:100%!important;filter:none!important}

/* Website preview: treat visual as image panel with deliberate crop */
.web-visual-panel{background:#d8d0c6;min-height:620px}
.web-visual-panel>img{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover;filter:none!important;z-index:1;transform:scale(1.02);transition:transform .8s var(--ease-silk)}
.web-visual-panel:after{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.18));pointer-events:none}
.web-ghost-word{z-index:3;color:rgba(255,255,255,.34)!important;text-shadow:0 1px 22px rgba(0,0,0,.14)}
.web-visual-caption{z-index:4;color:#fff!important;background:rgba(15,12,10,.28);backdrop-filter:blur(8px);padding:8px 12px;border-radius:999px}
#conceptCanvas[data-concept="heritage"] .web-visual-panel,
#conceptCanvas[data-concept="product"] .web-visual-panel,
#conceptCanvas[data-concept="editorial"] .web-visual-panel{background:#d8d0c6;color:#fff}
#conceptCanvas[data-concept="product"] .web-visual-panel>img{width:100%!important;height:100%!important;filter:none!important}

/* Instagram = true equal 3x3 tiles; photography always edge-to-edge */
.concept-social-grid{display:grid!important;grid-template-columns:repeat(3,1fr)!important;grid-template-rows:repeat(3,1fr)!important;aspect-ratio:1/1;gap:2px!important;padding:2px!important;border-radius:0!important;background:#fff!important}
.concept-social-grid .tile{aspect-ratio:1/1!important;min-width:0;min-height:0;border-radius:0!important;overflow:hidden}
.concept-social-grid .tile.image img{width:100%!important;height:100%!important;object-fit:cover!important;padding:0!important;filter:none!important;transform:scale(1.01)}
.concept-social-grid .tile.concept-color,.concept-social-grid .tile.concept-copy{display:flex;align-items:center;justify-content:center;text-align:center;padding:8%;font-size:clamp(9px,.8vw,12px);line-height:1.2;letter-spacing:.1em}

/* Communication examples: image-led campaign surface, typography over image */
.communication-thought{grid-template-columns:minmax(0,1.55fr) minmax(260px,.45fr);min-height:760px}
.communication-main{min-height:760px;padding:clamp(34px,4vw,62px);background:#111!important;color:#fff!important;border:0;isolation:isolate}
.communication-main>img{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover!important;filter:none!important;z-index:0;transition:transform .9s var(--ease-silk);transform:scale(1.015)}
.communication-main:after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(14,10,8,.68) 0%,rgba(14,10,8,.32) 48%,rgba(14,10,8,.08) 100%),linear-gradient(180deg,rgba(0,0,0,.05) 45%,rgba(0,0,0,.44) 100%);pointer-events:none}
.communication-kicker,.communication-word,.communication-copy,.communication-foot{position:relative;z-index:3;color:#fff}
.communication-kicker{opacity:.72}
.communication-word{margin-top:clamp(90px,11vw,180px);max-width:850px;text-shadow:0 2px 24px rgba(0,0,0,.16)}
.communication-copy p{opacity:.82}
.communication-foot{opacity:.68}
.communication-touchpoints{background:#f4f0e9;color:#211a16;border-color:rgba(33,26,22,.1)}
#conceptCanvas[data-concept="heritage"] .communication-main,
#conceptCanvas[data-concept="product"] .communication-main,
#conceptCanvas[data-concept="editorial"] .communication-main{background:#111;color:#fff}

/* Seasonal storytelling: 16:9 and background-bearing imagery fills the entire scene */
.season-photo-stage{background:#111}
.season-photo-stage .season-photo{position:absolute;inset:-5%;width:110%;height:110%;object-fit:cover;filter:none;z-index:0}
.spring-frame .season-photo{object-position:center center}
.summer-frame .season-photo{object-position:center 48%}
.autumn-frame .season-photo{object-position:center center}
.season-photo-shade{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,.05) 48%,rgba(0,0,0,.42) 100%)}
.season-ghost-overlay{z-index:2;color:rgba(255,255,255,.76)!important;mix-blend-mode:normal!important;text-shadow:0 2px 26px rgba(0,0,0,.16)}
.season-photo-stage .scene-index{z-index:3}

/* Smaller devices */
@media(max-width:900px){
  .moments-editorial .moment-card-offset,.moments-editorial .moment-card-object{width:auto;margin-left:var(--mx);margin-right:var(--mx)}
  .moment-caption-overlay{grid-template-columns:44px 1fr;gap:14px 16px}
  .moment-caption-overlay p{grid-column:2}
  .brand-cues-visual,.web-visual-panel{min-height:470px}
  .communication-thought{grid-template-columns:1fr}
  .communication-main{min-height:650px}
}
@media(max-width:600px){
  .moments-editorial .moment-media,.moments-editorial .moment-card-wide .moment-media{height:72vh;min-height:560px}
  .moment-caption-overlay{left:22px;right:22px;bottom:24px;grid-template-columns:1fr}
  .moment-caption-overlay>span{display:none}
  .moment-caption-overlay h3{font-size:40px}
  .moment-caption-overlay p{grid-column:auto;font-size:15px}
  .brand-cues-visual,.web-visual-panel{min-height:400px}
  .communication-main{min-height:590px;padding:28px 22px}
  .communication-word{font-size:50px;margin-top:80px}
  .communication-copy{max-width:92%}
}
