/* CocoonSilk brand story. Owner-supplied images stay unchanged on disk. */
.cocoon-page {
  --cocoon-cream: #f5f1e9;
  --cocoon-sage: #e6e9df;
  --cocoon-rose: #ead9d1;
  --cocoon-quiet: #74766b;
  --cocoon-rule: #d9ddd1;
}

.cocoon-page .eyebrow { color: #63705c; font-size: 10px; letter-spacing: .17em; }
.cocoon-page h1, .cocoon-page h2 { text-wrap: balance; }
.cocoon-page h2 { font-size: clamp(32px, 3.2vw, 47px); line-height: 1.28; }
.cocoon-page p { text-wrap: pretty; }
.cocoon-page section[id] { scroll-margin-top: 35px; }
.cocoon-page .button { min-height: 48px; padding: 16px 23px; font-size: 12px; }

.cocoon-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 7%;
  padding-block: 48px 40px;
}
.cocoon-hero-copy { padding-block: 20px; }
.cocoon-wordmark {
  margin-top: 24px;
  font-family: var(--serif);
  font-size: clamp(44px, 4.8vw, 70px);
  line-height: 1.08;
  letter-spacing: -.055em;
}
/* Show the owner's complete trademark, cropping only its white margins. */
.cocoon-trademark{display:block;position:relative;overflow:hidden;width:200px;max-width:100%;aspect-ratio:690/466;isolation:isolate;background:var(--paper)}
.cocoon-trademark>img{position:absolute;display:block;width:116.0869565%;height:auto;max-width:none;left:-8.115942%;top:-33.04721%;object-fit:initial;mix-blend-mode:multiply}
.cocoon-wordmark .cocoon-trademark{margin-top:16px}
.cocoon-home-brand{margin-bottom:22px}
.cocoon-home-brand .eyebrow{margin-bottom:12px}
.cocoon-hero h1 {
  max-width: 510px;
  margin: 35px 0 22px;
  font-size: clamp(32px, 3.35vw, 49px);
  line-height: 1.3;
  letter-spacing: -.025em;
}
.cocoon-lede { max-width: 440px; font-size: 14px; line-height: 1.95; color: var(--muted); }
.cocoon-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 15px 25px; margin-top: 29px; }
.cocoon-actions > a:not(.button) { font-size: 12px; padding-block: 12px; border-bottom: 1px solid #8b9580; }
.cocoon-availability { margin-top: 15px; color: var(--muted); font-size: 11px; line-height: 1.7; }
.cocoon-hero-visual { position: relative; min-width: 0; }
.cocoon-photo-note { display: block; color: var(--muted); font-size: 10px; line-height: 1.7; margin-top: 11px; text-align: right; }

/* Crop windows use source pixel coordinates. Keeping height:auto on the
   source image preserves its natural proportions at every viewport width. */
.cocoon-photo { position: relative; overflow: hidden; background: #eceae1; isolation: isolate; height: auto; }
.cocoon-photo > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.cocoon-photo-bedroom,
.cocoon-photo-town,
.cocoon-photo-fabric {
  aspect-ratio: var(--crop-width) / var(--crop-height);
}
.cocoon-photo-bedroom > img,
.cocoon-photo-town > img,
.cocoon-photo-fabric > img {
  position: absolute;
  width: calc(100% * var(--source-width) / var(--crop-width));
  height: auto;
  max-width: none;
  left: calc(-100% * var(--crop-x) / var(--crop-width));
  top: calc(-100% * var(--crop-y) / var(--crop-height));
  padding: 0;
  object-fit: initial;
  mix-blend-mode: normal;
  transform: none;
}
.cocoon-photo-bedroom {
  --source-width: 677;
  --crop-x: 24;
  --crop-y: 535;
  --crop-width: 632;
  --crop-height: 654;
  background: #e9e2d7;
}
.cocoon-photo-town {
  --source-width: 750;
  --crop-x: 0;
  --crop-y: 527;
  --crop-width: 750;
  --crop-height: 422;
}
.cocoon-photo-fabric {
  --source-width: 750;
  --crop-x: 20;
  --crop-y: 430;
  --crop-width: 710;
  --crop-height: 726;
  background: #eee4dc;
}
.cocoon-photo.cocoon-home-photo,
.silk-feature-image.cocoon-photo-bedroom {
  --crop-y: 565;
  --crop-height: 560;
  height: auto;
  align-self: stretch;
}
.cocoon-photo.cocoon-home-photo > img { object-fit: initial; }

.cocoon-chapters {
  display: flex;
  justify-content: center;
  gap: 8%;
  border-block: 1px solid var(--cocoon-rule);
  padding-block: 6px;
}
.cocoon-chapters a { display: inline-flex; align-items: center; gap: 11px; padding: 15px 8px; font-size: 12px; line-height: 1.5; }
.cocoon-chapters a:hover { color: #6b775f; }
.cocoon-chapters a span { color: #929c87; font-size: 10px; }

.cocoon-products { padding-block: 52px 12px; }
.cocoon-products > .eyebrow { margin-bottom: 15px; }
.cocoon-products > h2 { margin-bottom: 29px; }
.cocoon-product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.cocoon-product-card { display: flex; flex-direction: column; align-items: flex-start; padding: 28px 25px; background: var(--cocoon-cream); border: 1px solid var(--cocoon-rule); }
.cocoon-product-card.selected { background: #edf0e5; border-color: #617454; }
.cocoon-stock { display: inline-flex; align-items: center; gap: 7px; font-size: 10px; letter-spacing: .08em; color: #647457; }
.cocoon-stock::before { content: ''; width: 5px; height: 5px; background: #7c8b65; border-radius: 50%; }
.cocoon-product-card h3 { margin: 17px 0 9px; font-family: var(--serif); font-size: 28px; line-height: 1.35; letter-spacing: -.015em; }
.cocoon-product-card .cocoon-product-weight { color: #6b7564; font-size: 12px; line-height: 1.7; }
.cocoon-price { display: block; font-weight: 400; font-size: 36px; letter-spacing: -.03em; line-height: 1.2; margin: 22px 0 15px; }
.cocoon-product-card > p:not(.cocoon-product-weight) { color: var(--muted); font-size: 13px; line-height: 1.8; margin-bottom: 25px; max-width: 430px; }
.cocoon-product-card .button { margin-top: auto; gap: 20px; }
.cocoon-product-card .button[aria-pressed=true] { background: #233b2c; border-color: #233b2c; }

.cocoon-origin { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 8%; padding-block: 72px; }
.cocoon-origin-copy h2 { margin: 18px 0 23px; }
.cocoon-origin-copy > p:not(.eyebrow) { font-size: 13px; line-height: 1.95; color: var(--muted); max-width: 450px; }
.cocoon-origin-copy > p + p { margin-top: 12px; }
.cocoon-origin-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.cocoon-origin-tags span { padding: 8px 12px; background: var(--cocoon-sage); font-size: 10px; line-height: 1.6; color: #5b6952; }
.cocoon-origin-visual { min-width: 0; margin: 0; }
.cocoon-origin-visual figcaption { font-size: 10px; line-height: 1.7; color: var(--muted); margin-top: 12px; }

.cocoon-materials { padding-block: 3px 72px; }
.cocoon-materials > .eyebrow, .cocoon-showcase > .eyebrow { margin-bottom: 16px; }
.cocoon-materials > h2, .cocoon-showcase > h2 { margin-bottom: 30px; }
.cocoon-material-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 27px; }
.cocoon-material-grid article { min-width: 0; }
.cocoon-material-grid .cocoon-photo { aspect-ratio: 3 / 2; margin-bottom: 21px; }
.cocoon-material-grid .cocoon-photo > img { position: absolute; inset: 0; }
.cocoon-material-grid .cocoon-photo-fabric { --crop-y: 510; --crop-height: 473.333333; }
.cocoon-material-grid .cocoon-photo-fabric > img {
  inset: auto;
  left: calc(-100% * var(--crop-x) / var(--crop-width));
  top: calc(-100% * var(--crop-y) / var(--crop-height));
}
/* Image 18: preserve the complete cocoon close-up. The clipped edges prevent
   the original poster text from appearing beside the round subject. */
.cocoon-photo-silk { background: #efeee9; }
.cocoon-material-grid .cocoon-photo-silk > img {
  width: auto;
  height: calc(100% * 1054 / 510);
  max-width: none;
  inset: auto;
  top: calc(-100% * 505 / 510);
  left: 50%;
  transform: translateX(-50%);
  object-fit: initial;
  clip-path: inset(47.912713% 14% 3.70019% 14%);
}
.cocoon-material-grid article > .eyebrow { font-size: 9px; }
.cocoon-material-grid h3 { margin: 12px 0 11px; font-family: var(--serif); font-size: 25px; line-height: 1.3; }
.cocoon-material-grid article > p { color: var(--muted); font-size: 12px; line-height: 1.85; }

.cocoon-craft { background: var(--cocoon-sage); padding-block: 56px; }
.cocoon-craft-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 8%; align-items: center; }
.cocoon-craft-visual { min-width: 0; background: #eff0e7; }
.cocoon-craft-visual > img { display: block; width: 100%; height: auto; object-fit: contain; }
.cocoon-craft-copy h2 { margin: 17px 0 20px; }
.cocoon-craft-copy > p:not(.eyebrow) { max-width: 440px; color: #65715f; font-size: 13px; line-height: 1.9; }
.cocoon-steps { list-style: none; padding: 0; margin: 26px 0 0; }
.cocoon-steps li { display: grid; grid-template-columns: 30px 1fr; gap: 5px 14px; padding: 17px 0; border-top: 1px solid #c9d0c0; }
.cocoon-steps li > span { grid-row: 1 / 3; color: #8b9780; font-family: var(--serif); font-size: 20px; line-height: 1.25; }
.cocoon-steps li > b { font-size: 13px; line-height: 1.6; font-weight: 500; }
.cocoon-steps li > p { color: #6c7665; font-size: 12px; line-height: 1.8; }

.cocoon-showcase { padding-block: 68px 58px; }
.cocoon-showcase-grid { display: grid; grid-template-columns: 1.08fr 1fr; gap: 25px; align-items: start; }
.cocoon-showcase-grid .cocoon-photo-bedroom { --crop-y: 560; --crop-height: 585; }
.cocoon-showcase-grid .cocoon-photo-fabric { --crop-y: 440; --crop-height: 710; }
.cocoon-interest { padding: 48px 6%; margin-bottom: 66px; background: #efe4de; text-align: center; }
.cocoon-interest .eyebrow { color: #826f62; margin-bottom: 15px; }
.cocoon-interest h2 { margin-bottom: 17px; }
.cocoon-interest > p:not(.eyebrow):not(.cocoon-availability) { max-width: 560px; margin-inline: auto; color: #796e63; font-size: 13px; line-height: 1.9; }
.cocoon-interest .button { margin-top: 25px; }
.cocoon-interest .cocoon-availability { color: #827468; }
.cocoon-page .product-information { padding-top: 50px; }

@media (min-width: 1450px) {
  .cocoon-hero { gap: 9%; }
}
@media (max-width: 1050px) {
  .cocoon-hero { gap: 5%; }
  .cocoon-hero h1 { font-size: 35px; }
  .cocoon-wordmark { font-size: 51px; }
  .cocoon-origin, .cocoon-craft-layout { gap: 5%; }
  .cocoon-material-grid { gap: 20px; }
  .cocoon-material-grid h3 { font-size: 23px; }
}
@media (max-width: 760px) {
  .cocoon-page .eyebrow { font-size: 9px; }
  .cocoon-page h2 { font-size: 31px; line-height: 1.35; }
  .cocoon-hero { grid-template-columns: 1fr; gap: 29px; padding-block: 28px 29px; }
  .cocoon-hero-copy { padding: 0; }
  .cocoon-wordmark { margin-top: 19px; font-size: 49px; }
  .cocoon-wordmark .cocoon-trademark { width:180px; margin-top:12px; }
  .cocoon-hero h1 { margin: 26px 0 18px; font-size: 33px; line-height: 1.35; max-width: 380px; }
  .cocoon-lede { max-width: none; font-size: 13px; line-height: 1.95; }
  .cocoon-actions { gap: 13px 21px; margin-top: 23px; }
  .cocoon-actions > a:not(.button) { font-size: 12px; }
  .cocoon-availability { font-size: 11px; }
  .cocoon-hero-visual .cocoon-photo-bedroom { --crop-height: 610; --crop-y: 550; }
  .cocoon-photo-note { font-size: 9px; margin-top: 9px; }
  .cocoon-chapters { justify-content: space-between; gap: 4px; padding-block: 4px; }
  .cocoon-chapters a { font-size: 11px; gap: 7px; padding: 13px 3px; }
  .cocoon-products { padding-block: 37px 5px; }
  .cocoon-products > h2 { margin-bottom: 24px; }
  .cocoon-product-grid { grid-template-columns: 1fr; gap: 17px; }
  .cocoon-product-card { padding: 25px 23px; }
  .cocoon-product-card h3 { font-size: 26px; margin-top: 15px; }
  .cocoon-price { font-size: 34px; margin: 19px 0 13px; }
  .cocoon-product-card > p:not(.cocoon-product-weight) { font-size: 13px; margin-bottom: 22px; }
  .cocoon-product-card .button { width: 100%; justify-content: space-between; }
  .cocoon-origin { grid-template-columns: 1fr; gap: 28px; padding-block: 42px; }
  .cocoon-origin-copy h2 { margin: 14px 0 19px; }
  .cocoon-origin-copy > p:not(.eyebrow) { max-width: none; font-size: 13px; }
  .cocoon-origin-tags { margin-top: 20px; }
  .cocoon-origin-visual figcaption { font-size: 10px; }
  .cocoon-materials { padding-block: 3px 43px; }
  .cocoon-materials > h2, .cocoon-showcase > h2 { margin-bottom: 25px; }
  .cocoon-material-grid { grid-template-columns: 1fr; gap: 30px; }
  .cocoon-material-grid .cocoon-photo { margin-bottom: 17px; }
  .cocoon-material-grid h3 { margin: 9px 0; font-size: 25px; }
  .cocoon-material-grid article > p { font-size: 13px; }
  .cocoon-craft { padding-block: 37px; }
  .cocoon-craft-layout { grid-template-columns: 1fr; gap: 29px; }
  .cocoon-craft-copy h2 { margin: 14px 0 18px; }
  .cocoon-steps { margin-top: 22px; }
  .cocoon-steps li { padding-block: 15px; }
  .cocoon-steps li > p { font-size: 12px; }
  .cocoon-showcase { padding-block: 43px 35px; }
  .cocoon-showcase-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .cocoon-showcase-grid .cocoon-photo-bedroom { --crop-y: 535; --crop-height: 654; }
  .cocoon-showcase-grid .cocoon-photo-fabric { --crop-y: 430; --crop-height: 726; }
  .cocoon-interest { padding: 34px 22px; margin-bottom: 41px; }
  .cocoon-interest h2 { font-size: 28px; }
  .cocoon-interest > p:not(.eyebrow):not(.cocoon-availability) { font-size: 13px; }
  .cocoon-interest .button { margin-top: 22px; }
  .cocoon-page .product-information { padding-top: 38px; }
  .cocoon-photo.cocoon-home-photo, .silk-feature-image.cocoon-photo-bedroom { --crop-y: 570; --crop-height: 515; }
}

/* Keep all three in-stock choices balanced at tablet widths. */
@media (min-width:761px) and (max-width:1000px){.cocoon-product-card{padding:22px 18px}.cocoon-product-card h3{font-size:23px}.cocoon-product-card .button{padding:13px 14px;gap:10px}}
/* The homepage wrapper must grow with the cropped owner photograph. */
.silk-feature-image.cocoon-home-photo{height:auto;aspect-ratio:auto;background:none;align-self:start}
.cocoon-home-photo>.cocoon-photo-bedroom{--crop-y:560;--crop-height:570}
.cocoon-assurance{padding:44px 0 54px;border-top:1px solid var(--cocoon-rule);border-bottom:1px solid var(--cocoon-rule)}
.cocoon-assurance-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px}
.cocoon-assurance-grid article+article{border-left:1px solid var(--cocoon-rule);padding-left:34px}
.cocoon-assurance-number{display:block;font-family:var(--serif);font-size:55px;line-height:1.2;letter-spacing:-.04em}
.cocoon-assurance-number small{font-family:var(--sans);font-size:15px;letter-spacing:0;margin-left:5px}
.cocoon-assurance-grid h3{font-size:18px;line-height:1.5;margin:14px 0 10px}
.cocoon-assurance-grid p,.cocoon-warranty-note{font-size:12px;color:var(--muted);line-height:1.9}
.cocoon-warranty-note{margin-top:27px;padding-top:17px;border-top:1px solid var(--cocoon-rule)}
.cocoon-care{padding:12px 0 62px}
.cocoon-care-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px}
.cocoon-care-grid article{padding:30px;background:var(--cocoon-cream)}
.cocoon-care-grid h3{font-family:var(--serif);font-size:26px;line-height:1.4}
.cocoon-care-sub{font-size:11px;margin-top:9px;color:var(--muted)}
.cocoon-care-grid ul,.cocoon-care-grid ol{padding-left:18px;margin:23px 0;color:#57614f;font-size:13px;line-height:1.9}
.cocoon-care-grid li+li{margin-top:11px}
.cocoon-care-note{font-size:12px;color:var(--muted);border-top:1px solid var(--cocoon-rule);padding-top:17px}
.cocoon-chapters{gap:4%}
@media(max-width:760px){.cocoon-chapters{display:grid;grid-template-columns:1fr 1fr;gap:0}.cocoon-chapters a{justify-content:center}.cocoon-assurance{padding:33px 0}.cocoon-assurance-grid,.cocoon-care-grid{grid-template-columns:1fr;gap:24px}.cocoon-assurance-grid article+article{padding:22px 0 0;border-left:0;border-top:1px solid var(--cocoon-rule)}.cocoon-assurance-number{font-size:45px}.cocoon-care{padding-bottom:40px}.cocoon-care-grid article{padding:24px}.cocoon-care-grid h3{font-size:23px}}
/* Illustrative white jacquard scene; cover fabrics are specified by product. */
.cocoon-photo-scene{aspect-ratio:1;background:#eee9df}
.cocoon-photo-scene>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.cocoon-home-photo>.cocoon-photo-scene{aspect-ratio:1.1}

.cocoon-care-warning{background:#f3e9d7;border-left:3px solid #967542;padding:20px 24px;margin:0 0 28px;color:#55442d;font-size:14px;line-height:1.8}
.cocoon-care-warning strong{display:block;margin-bottom:5px}
.cocoon-care-link{display:block;margin-top:9px;text-decoration:underline;text-underline-offset:3px;font-weight:500}
