@font-face { font-family: Ccoco; src: url("../fonts/cormorant-garamond-regular.ttf"); }
.ccoco-detail-page *{box-sizing: border-box;}
.ccoco-detail-page html{scroll-behavior: smooth; scroll-padding-top: 30px;}
.ccoco-detail-page {margin: 0px; background: rgb(250, 247, 240); color: rgb(41, 40, 34); font: 16px / 1.65 Arial, sans-serif;}
.ccoco-detail-page a{color: inherit; text-decoration: none;}
.ccoco-detail-page button,.ccoco-detail-page a{-webkit-tap-highlight-color: transparent;}
.ccoco-detail-page a:focus-visible{outline: rgb(172, 140, 88) solid 2px; outline-offset: 6px;}
.ccoco-detail-page img{max-width: 100%; display: block;}




.ccoco-detail-page h1,.ccoco-detail-page h2{font-family: Ccoco, Georgia, serif; font-weight: 400; line-height: 1.05; margin: 0px; letter-spacing: 0px;}
.ccoco-detail-page h1{font-size: 56px;}
.ccoco-detail-page h2{font-size: 44px;}
.ccoco-detail-page h3{font-weight: 400; font-size: 19px; line-height: 1.4; margin: 10px 0px;}
.ccoco-detail-page .inner{width: 90%; max-width: 1400px; margin: auto;}
.ccoco-detail-page .eyebrow{text-transform: uppercase; letter-spacing: 2px; font-size: 11px; margin: 0px 0px 18px;}
.ccoco-detail-page .book{display: inline-flex; align-items: center; justify-content: center; gap: 28px; padding: 12px 22px; background: rgb(169, 139, 92); color: white; border-radius: 3px; font-size: 13px;}
.ccoco-detail-page .finder{color: rgb(246, 240, 230); background: url("../images/backgrounds/editorial-dark-marble.webp") center center / cover rgb(23, 25, 20); padding: 70px 0px 46px;}
.ccoco-detail-page .finder h1{text-align: center;}
.ccoco-detail-page .finder .eyebrow{text-align: center; color: rgb(204, 185, 147);}
.ccoco-detail-page .subheading{text-align: center; margin: 22px 0px 3px; font-size: 20px;}
.ccoco-detail-page .intro{text-align: center; color: rgb(216, 213, 204); margin: 0px 0px 34px;}
.ccoco-detail-page .concern-grid{display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 22px;}
.ccoco-detail-page .concern-card{display: block; position: relative; overflow: hidden; background: rgb(48, 48, 41);}
.ccoco-detail-page .concern-card img{width: 100%; aspect-ratio: 4 / 4.5; object-fit: cover; transition: transform 0.35s;}
.ccoco-detail-page .concern-card:hover img{transform: scale(1.035);}
.ccoco-detail-page .concern-caption{position: absolute; bottom: 0px; left: 0px; right: 0px; padding: 45px 18px 18px; background: linear-gradient(transparent, rgba(0, 0, 0, 0.77)); display: flex; justify-content: space-between; align-items: end; gap: 10px;}
.ccoco-detail-page .concern-caption h2{font-size: 27px; line-height: 1.1; max-width: 220px;}
.ccoco-detail-page .concern-caption span{font-size: 20px;}
.ccoco-detail-page .start-link{display: table; margin: 34px auto 0px; border-bottom: 1px solid rgb(170, 147, 109); padding-bottom: 3px; font-size: 14px;}
.ccoco-detail-page .start-link span{margin-left: 20px;}
.ccoco-detail-page .back{display: inline-block; margin: 26px 0px; color: rgb(116, 98, 68); font-size: 13px;}
.ccoco-detail-page .detail-hero{display: grid; grid-template-columns: 1fr 1.08fr; gap: 64px; align-items: center; padding: 0px 0px 64px;}
.ccoco-detail-page .detail-hero > img{width: 100%; height: 580px; object-fit: cover;}
.ccoco-detail-page .detail-copy > p:not(.eyebrow){max-width: 570px; margin: 24px 0px;}
.ccoco-detail-page .detail-copy .eyebrow{color: rgb(129, 104, 64);}
.ccoco-detail-page .common{border-top: 1px solid rgb(215, 201, 180); padding: 22px 0px;}
.ccoco-detail-page .common h2{font-family: Arial, sans-serif; font-size: 15px;}
.ccoco-detail-page .common ul{display: grid; grid-template-columns: 1fr 1fr; gap: 10px 25px; padding-left: 18px; font-size: 14px;}
.ccoco-detail-page .outline{display: inline-flex; gap: 32px; align-items: center; border: 1px solid rgb(166, 138, 96); padding: 12px 20px; font-size: 13px;}
.ccoco-detail-page .recommendations{padding: 58px 0px; text-align: center; background: url("../images/backgrounds/editorial-popular-satin.webp") center center / cover rgb(239, 232, 220);}
.ccoco-detail-page .recommendations .section-heading{display: block; width: 100%; max-width: none; margin-left: auto; margin-right: auto; text-align: center;}
.ccoco-detail-page .recommendations .treatment a{align-self: center; margin-left: auto; margin-right: auto;}
.ccoco-detail-page .section-heading{display: flex; align-items: end; justify-content: space-between; gap: 35px; margin-bottom: 30px;}
.ccoco-detail-page .section-heading > p{font-size: 14px;}
.ccoco-detail-page .treatment-grid{display: flex; flex-wrap: wrap; justify-content: center; gap: 22px; --treatment-gap: 22px;}
.ccoco-detail-page .treatment-grid > .treatment{flex: 0 0 calc((100% - 3 * var(--treatment-gap)) / 4); min-width: 0;}
.ccoco-detail-page .treatment{background: rgb(250, 247, 241); display: flex; flex-direction: column;}
.ccoco-detail-page .treatment img{width: 100%; aspect-ratio: 1.2 / 1; object-fit: cover;}
.ccoco-detail-page .treatment h3{padding: 15px 18px 4px; margin: 0px; font-family: Ccoco, serif; font-size: 28px;}
.ccoco-detail-page .treatment a{font-size: 12px; margin: auto 18px 20px; padding-top: 20px; align-self: start; border-bottom: 1px solid rgb(189, 169, 138);}
.ccoco-detail-page .qualification{font-size: 12px; color: rgb(101, 92, 75); margin-bottom: 0px;}
.ccoco-detail-page .consultation{padding: 70px 0px;}
.ccoco-detail-page .consult-heading{display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: center; margin-bottom: 44px;}
.ccoco-detail-page .consult-heading > p{max-width: 540px;}
.ccoco-detail-page .steps{display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 28px;}
.ccoco-detail-page .steps article{border-top: 1px solid rgb(200, 183, 150); padding-top: 18px;}
.ccoco-detail-page .steps span{font-family: Ccoco, serif; font-size: 36px; color: rgb(155, 128, 87);}
.ccoco-detail-page .steps p{font-size: 14px; color: rgb(97, 93, 84);}
.ccoco-detail-page .consultation-book{margin-top: 28px;}


.ccoco-detail-page [hidden]{display: none !important;}
@media (max-width: 900px){

.ccoco-detail-page .detail-hero{gap: 30px;}
.ccoco-detail-page .detail-hero > img{height: 470px;}
.ccoco-detail-page .concern-grid,.ccoco-detail-page .treatment-grid{gap: 15px; --treatment-gap: 15px;}
.ccoco-detail-page .concern-caption{padding: 35px 12px 14px;}
.ccoco-detail-page .concern-caption h2{font-size: 23px;}
.ccoco-detail-page .steps{grid-template-columns: 1fr 1fr;}
.ccoco-detail-page .consult-heading{gap: 30px;}}
@media (max-width: 600px){



.ccoco-detail-page h1{font-size: 38px;}
.ccoco-detail-page h2{font-size: 34px;}
.ccoco-detail-page .finder{padding: 42px 0px 32px;}
.ccoco-detail-page .finder .eyebrow{font-size: 9px; letter-spacing: 1.5px;}
.ccoco-detail-page .intro{font-size: 14px;}
.ccoco-detail-page .subheading{font-size: 18px;}
.ccoco-detail-page .concern-grid{grid-template-columns: 1fr 1fr; gap: 14px;}
.ccoco-detail-page .concern-caption h2{font-size: 23px;}
.ccoco-detail-page .concern-card img{aspect-ratio: 3 / 4;}
.ccoco-detail-page .detail-hero{grid-template-columns: 1fr; gap: 26px; padding-bottom: 35px;}
.ccoco-detail-page .detail-hero > img{height: 340px; object-position: center 45%;}
.ccoco-detail-page .detail-copy > p:not(.eyebrow){margin: 20px 0px;}
.ccoco-detail-page .common ul{grid-template-columns: 1fr; font-size: 15px;}
.ccoco-detail-page .section-heading{display: block;}
.ccoco-detail-page .section-heading > p{margin-top: 15px;}
.ccoco-detail-page .treatment-grid > .treatment{flex-basis: calc((100% - var(--treatment-gap)) / 2);}
.ccoco-detail-page .treatment h3{font-size: 25px; padding: 12px;}
.ccoco-detail-page .treatment a{margin: 0px 12px 15px;}
.ccoco-detail-page .recommendations{padding: 36px 0px;}
.ccoco-detail-page .consultation{padding: 44px 0px;}
.ccoco-detail-page .consult-heading{grid-template-columns: 1fr; gap: 15px; margin-bottom: 25px;}
.ccoco-detail-page .consult-heading > p{margin: 0px;}
.ccoco-detail-page .steps{gap: 22px 18px;}
.ccoco-detail-page .steps h3{font-size: 17px;}
.ccoco-detail-page .steps p{font-size: 14px;}
.ccoco-detail-page .consultation-book{width: 100%;}

}
@media (max-width: 600px){}
.ccoco-detail-page .detail-copy{min-width: 0;}
.ccoco-detail-page .detail-copy #detail-title{font-family: Ccoco, Georgia, serif; font-size: 64px; font-weight: 400; line-height: 1.08; letter-spacing: 0px; overflow-wrap: anywhere;}
@media (max-width: 640px){.ccoco-detail-page .detail-copy #detail-title{font-size:38px;}}
.ccoco-detail-page .detail-copy .detail-category{font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 14px; font-weight: 400; line-height: 1.65; letter-spacing: 0px; margin: 20px 0px 24px; text-transform: uppercase;}
.ccoco-detail-page .concern-photo-grid{display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 16px; margin-top: 18px;}
.ccoco-detail-page .concern-photo-grid figure{margin: 0px; min-width: 0px;}
.ccoco-detail-page .concern-photo-grid img{width: 100%; height: 180px; object-fit: cover;}
.ccoco-detail-page .concern-photo-grid figcaption{font-size: 13px; line-height: 1.5; margin-top: 9px; color: rgb(101, 92, 75);}
@media (max-width: 600px){.ccoco-detail-page .concern-photo-grid img{height: 170px;}}
.ccoco-detail-page .consultation .consult-heading{grid-template-columns: minmax(0px, 1fr); gap: 20px; align-items: start;}
.ccoco-detail-page .consultation .consult-heading > p{max-width: 820px; margin: 0 auto;}
.ccoco-detail-page .consultation{text-align:center}
.ccoco-detail-page .consultation .consult-heading{justify-items:center}
.ccoco-detail-page .consultation .steps article{border-top: 0px; padding-top: 0px;}
.ccoco-detail-page .finder .subheading,.ccoco-detail-page .finder .intro{font-size: 17px; font-weight: 400; line-height: 1.65;}
.ccoco-detail-page section.finder{background: url("../images/backgrounds/editorial-popular-satin.webp") center center / cover rgb(238, 227, 209); color: rgb(41, 40, 34);}
.ccoco-detail-page section.finder .intro{color: rgb(81, 74, 64); margin: 22px auto 34px; font-size: 17px; line-height: 1.65;}
.ccoco-detail-page .concern-education{padding: 16px 0px 56px; text-align: center;}
.ccoco-detail-page .concern-education > p{max-width: 940px; margin-left: auto; margin-right: auto;}
.ccoco-detail-page .education-columns{display: grid; grid-template-columns: 1fr; gap: 32px; margin-top: 32px;}
.ccoco-detail-page .education-columns h2{font-size: 32px;}
.ccoco-detail-page .education-columns ul{padding-left: 0; list-style-position: inside;}
.ccoco-detail-page .education-columns li{margin-bottom: 10px;}
.ccoco-detail-page .education-source{font-size: 13px; color: rgb(101, 92, 75);}
.ccoco-detail-page .education-source a{text-decoration: underline;}
.ccoco-detail-page #treatment-guidance{max-width: 960px; margin: 0px auto 30px; text-align: center;}
@media (max-width: 700px){.ccoco-detail-page .education-columns{grid-template-columns: 1fr; gap: 20px;}}
.ccoco-detail-page section.finder .concern-grid{grid-template-columns: repeat(2, minmax(0px, 1fr));}
.ccoco-detail-page section.finder .concern-caption,.ccoco-detail-page section.finder .concern-caption h2,.ccoco-detail-page section.finder .concern-caption span{color: rgb(255, 255, 255);}
.ccoco-detail-page section.finder .concern-caption h2{max-width: none;}
.ccoco-detail-page section.finder .concern-card img{aspect-ratio: 1.5 / 1; object-fit: cover;}
@media (max-width: 600px){.ccoco-detail-page section.finder .concern-card img{aspect-ratio: 3 / 4;}}
.ccoco-detail-page section.finder .concern-grid{max-width: 960px; margin-inline: auto;}
.ccoco-detail-page section.finder .concern-card img{height: 240px; aspect-ratio: auto;}
@media (max-width: 600px){.ccoco-detail-page section.finder .concern-card img{height: 190px;}}
.ccoco-detail-page section.finder .concern-card-media{position: relative;}
.ccoco-detail-page section.finder .concern-card-media img{height: auto; aspect-ratio: 1.9 / 1; width: 100%; object-fit: cover;}
.ccoco-detail-page section.finder .concern-card{background: rgb(250, 247, 240); border: 1px solid rgb(189, 165, 125); border-radius: 4px;}
.ccoco-detail-page section.finder .concern-card-media{overflow: hidden;}
.ccoco-detail-page section.finder .concern-card-summary{margin: 0px; padding: 16px 18px 20px; color: rgb(81, 74, 64); font-size: 16px; line-height: 1.6; text-align: left;}
@media (max-width: 600px){.ccoco-detail-page section.finder .concern-caption{padding: 24px 8px 8px;}
.ccoco-detail-page section.finder .concern-caption h2{font-size: 18px; line-height: 1.1;}}
.ccoco-detail-page{background:#faf7f0;color:#292822;font:16px/1.65 Arial,sans-serif;padding-top:110px}
.ccoco-detail-page .inner{width:90%;max-width:1400px;margin:auto}
@media(max-width:640px){.ccoco-detail-page{padding-top:0}}
@media(max-width:480px){.ccoco-detail-page .treatment-grid>.treatment{flex-basis:100%}}
