/* Complete-frame presentation. The two views share one source-based asset. */
:root{--visual-paper:#faf8f3}
span.frame-visual{display:block;position:relative;inset:auto;overflow:hidden;background:var(--visual-paper);isolation:isolate;width:100%;aspect-ratio:0.7125;margin-inline:auto}
span.frame-visual>img.frame-artwork{display:block;position:absolute;inset:0 auto auto 0;width:210.526316%;max-width:none;height:100%;max-height:none;object-fit:fill;transform:none;filter:none;opacity:1;margin:0;pointer-events:none}
span.frame-visual>img.frame-mark{position:absolute;left:52.63158%;top:50%;width:18%;height:auto;max-height:none;max-width:none;transform:translate(-50%,-50%);filter:none;opacity:.93;object-fit:contain;margin:0;pointer-events:none}
.frame-visual--corner{aspect-ratio:.7875}
span.frame-visual--corner>img.frame-artwork{width:190.47619%;left:-90.47619%}
.hero{grid-template-columns:1.02fr 1fr;min-height:680px}
.hero-copy{padding:64px 9% 43px 12%}
.hero h1{font-size:clamp(52px,4.7vw,76px);line-height:1.055;letter-spacing:-2.4px}
.hero-intro{max-width:480px;font-size:14px;line-height:1.85}
.hero-art{padding:26px 7% 24px;background:var(--deep);min-width:0;justify-content:space-between}
.hero-photo{display:block;min-height:0;margin:22px 0;width:100%;max-width:none}
.hero-product-pair{display:grid;grid-template-columns:1fr .43fr;gap:4%;align-items:center;background:var(--visual-paper);padding:13px 14px 12px 3px;width:100%;border:1px solid #a98b5166;color:var(--green);text-align:left;cursor:zoom-in}
.hero-product-pair>.frame-visual{max-height:none;max-width:331px;width:100%}
.hero-detail{min-width:0;display:block;border-left:1px solid #d9d1c1;padding-left:10px}
.hero-detail .frame-visual{width:100%;aspect-ratio:.7875}
.hero-detail-label{display:block;font-size:7px;letter-spacing:1.6px;line-height:1.8;text-align:center;margin-top:12px;color:#78684d}
.art-bottom{align-items:end;gap:20px;padding-top:18px}
.art-bottom p{font-size:32px;line-height:1.12}
.art-bottom>a{font-size:8px;line-height:1.8;letter-spacing:1.25px}
.art-top{font-size:8px;letter-spacing:1.4px}
.hero .quote-turnaround-note{font-size:11px;line-height:1.85;max-width:475px;margin-top:23px}
.hero-footnote{margin-top:10px}
.collection-image{height:390px;padding:30px 20px 36px;background:var(--visual-paper)!important;border:1px solid #ded7c9}
.collection-image>.frame-visual{height:100%;width:auto;max-width:100%;transition:transform .5s ease}
.collection-image:hover>.frame-visual{transform:scale(1.025)}
.collection-image .image-label,.collection-image .image-caption{color:#78684d;z-index:1}
.collection-image .image-arrow{color:var(--green)}
.collection-copy{padding-top:27px}
.collection-tagline{font-size:22px}
.collection-hero{align-items:center;grid-template-columns:1.1fr .9fr;padding-block:55px}
.collection-hero-image{display:flex;justify-content:center;align-items:center;background:var(--visual-paper)!important;padding:20px 25px 42px;min-height:0;border:1px solid #ded7c9}
.collection-hero-image>.frame-visual{height:420px;width:auto;max-width:100%}
.collection-hero-image>span:not(.frame-visual){color:#78684d;font-size:8px;letter-spacing:1.4px}
.product-grid,.collection-gallery .product-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.product-card{background:var(--visual-paper);border:1px solid #ded7c9;min-width:0;transition:border-color .2s,box-shadow .2s}
.product-card:hover{border-color:#ad9568;box-shadow:0 8px 24px #173e2910}
.product-view{padding:10px 10px 18px;width:100%;cursor:zoom-in}
.product-view>.frame-visual{width:100%;max-width:290px;transition:transform .35s ease}
.product-view:hover>.frame-visual{transform:translateY(-3px)}
.product-label{margin:3px 12px 0;display:flex;align-items:baseline;justify-content:space-between;gap:8px;text-align:left}
.product-label strong{font:30px var(--serif);font-weight:400}
.product-label span{font-size:8px;letter-spacing:1px}
.product-view-hint{display:block;text-align:left;margin:12px 12px 0;color:#7f725b;font-size:9px;letter-spacing:.6px}
.product-add{margin:0 22px;width:calc(100% - 44px);padding:13px 0 16px;min-height:44px}
.gallery-disclaimer{max-width:890px}
.buyer-card-image{background:var(--visual-paper);padding:12px 12px 32px;height:280px}
.buyer-card-image>.frame-visual{height:100%;width:auto;max-width:100%}
.buyer-card-image>span:not(.frame-visual){color:#78684d;font-size:7px}
.audience-hero-art{background:var(--deep);padding:27px 8% 23px;gap:22px}
.audience-photo{background:var(--visual-paper);padding:0 12px}
.audience-photo>.frame-visual{height:430px;width:auto;max-width:100%}
.project-sample-image{background:var(--visual-paper)!important;height:340px;padding:15px 20px 35px}
.project-sample-image>.frame-visual{height:100%;width:auto;max-width:100%}
.project-sample-image>span:not(.frame-visual){color:#78684d}
.why-material-photo{background:var(--visual-paper);padding:30px 8% 45px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.why-material-photo>.frame-visual{height:440px;width:auto;max-width:100%}
.why-material-photo>span:not(.frame-visual){color:#78684d}
.about-hero-photo{background:var(--deep);padding:24px 6% 23px}
.about-hero-photo>.frame-visual{height:430px;width:auto;max-width:100%}
dialog#frame-dialog{width:min(1040px,94vw);max-height:94dvh;border:0;background:var(--ivory);box-shadow:0 25px 100px #0005}
#frame-dialog .dialog-close{position:sticky;float:right;top:14px;right:14px;margin:14px 14px -52px 0;border:1px solid var(--line);border-radius:50%;background:var(--ivory);width:42px;height:42px;font-size:28px;z-index:5}
.dialog-heading{padding:30px 36px 20px}
.dialog-heading .eyebrow{margin-bottom:8px}
.dialog-heading h2{font-size:42px;margin:0;line-height:1.1}
.dialog-heading>p:last-child{font:17px var(--serif);color:var(--muted);margin:10px 0 0}
.dialog-views{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border-block:1px solid var(--line)}
.dialog-views figure{margin:0;background:var(--visual-paper);min-width:0;padding:0 30px 18px}
.dialog-views .frame-visual{height:380px;width:auto;max-width:100%}
.dialog-views figcaption{display:flex;justify-content:space-between;gap:8px;font-size:8px;letter-spacing:1.4px;line-height:1.6;color:var(--green);border-top:1px solid var(--line);padding-top:14px}
.dialog-views figcaption span{color:var(--muted);letter-spacing:.2px;font-size:10px}
.dialog-copy{padding:23px 36px 30px}
.dialog-copy>.small-copy{font-size:11px;line-height:1.8;max-width:890px;margin-bottom:0}
.dialog-actions{margin-top:20px;justify-content:space-between}
.visual-note{max-width:850px}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
@media(min-width:1600px){.hero h1{font-size:76px}.hero-photo{max-width:600px;align-self:center}.product-view>.frame-visual{max-width:310px}.collection-image{height:430px}}
@media(max-width:1100px){.hero-copy{padding:45px 8%}.hero h1{font-size:54px}.hero-art{padding-inline:5%}.hero-product-pair{grid-template-columns:1fr .38fr}.hero-detail{padding-left:4px}.hero-detail-label{font-size:6px;letter-spacing:.5px}.collection-image{height:340px}.product-grid,.collection-gallery .product-grid{gap:16px}.product-label{display:block}.product-label span{display:block;margin-top:6px}.buyer-card-image{height:235px}.dialog-views .frame-visual{height:340px}}
@media(max-width:800px){.hero h1{font-size:48px}.hero-actions{align-items:flex-start;flex-direction:column;gap:17px}.hero-art{padding-inline:6%}.hero-product-pair{grid-template-columns:1fr;padding:0 12px}.hero-detail{display:none}.hero-product-pair>.frame-visual{max-height:460px;width:auto}.product-grid,.collection-gallery .product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.collection-image{height:300px}.buyer-card-image{height:300px}.audience-photo>.frame-visual{height:430px}.audience-hero-art{padding-inline:15%}.collection-hero-image>.frame-visual{height:360px}}
@media(max-width:700px){.hero{grid-template-columns:1fr}.hero-copy{padding:40px 6.5% 33px}.hero h1{font-size:clamp(46px,10vw,66px)}.hero-intro{font-size:14px}.hero-actions{flex-direction:row;align-items:center;gap:18px}.hero-art{padding:21px 6.5% 23px}.hero-photo{margin:19px 0}.hero-product-pair{grid-template-columns:1fr .42fr;padding:10px 12px 10px 0;gap:2%}.hero-product-pair>.frame-visual{height:auto;width:100%;max-height:none}.hero-detail{display:block;padding-left:8px}.hero-detail-label{font-size:7px;letter-spacing:.6px}.art-bottom{display:flex}.art-bottom p{font-size:30px}.art-bottom>a{font-size:7px}.hero-footnote{margin-top:0}.collection-image{height:400px;padding:25px 15px 36px}.collection-copy{padding-top:22px}.collection-hero{grid-template-columns:1fr;padding-block:35px}.collection-hero-image>.frame-visual{height:390px}.product-grid,.collection-gallery .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.product-view{padding:4px 4px 15px}.product-label{margin:0 10px}.product-label strong{font-size:26px}.product-label span{font-size:7px;letter-spacing:.6px}.product-view-hint{font-size:8px;letter-spacing:0;margin:11px 10px 0}.product-add{margin:0 14px;width:calc(100% - 28px);font-size:10px}.buyer-card-image{height:300px}.project-sample-image{height:370px}.audience-hero-art{padding:24px 9%}.audience-photo>.frame-visual{height:390px}.why-material-photo>.frame-visual{height:400px}.about-hero-photo>.frame-visual{height:380px}.dialog-heading{padding:25px 22px 19px}.dialog-heading h2{font-size:35px}.dialog-heading>p:last-child{font-size:15px}.dialog-views{grid-template-columns:1fr 1fr}.dialog-views figure{padding:0 10px 13px}.dialog-views .frame-visual{height:auto;width:100%;max-width:none}.dialog-views figcaption{flex-direction:column;font-size:7px;letter-spacing:.6px;gap:3px}.dialog-views figcaption span{font-size:9px}.dialog-copy{padding:20px 22px 25px}.dialog-copy>.small-copy{font-size:10px}.dialog-actions{gap:17px}.dialog-actions .button{font-size:11px}.dialog-actions .text-link{font-size:10px}}
@media(max-width:370px){.hero-product-pair{grid-template-columns:1fr .36fr}.hero-detail-label{font-size:6px}.collection-image{height:340px}.product-view-hint{font-size:7px}.collection-hero-image>.frame-visual{height:340px}.dialog-actions{flex-direction:column;align-items:flex-start}}
@media(prefers-reduced-motion:reduce){.collection-image:hover>.frame-visual,.product-view:hover>.frame-visual{transform:none}}

/* C84 has a slightly wider generated frame within its source canvas. */
.frame-visual--full[data-frame="C84"]{aspect-ratio:.75}
span.frame-visual--full[data-frame="C84"]>img.frame-artwork{width:200%}
span.frame-visual--full[data-frame="C84"]>img.frame-mark{left:50%}
.frame-visual--corner[data-frame="C84"]{aspect-ratio:.75}
span.frame-visual--corner[data-frame="C84"]>img.frame-artwork{width:200%;left:-100%}
