/* Additional shopping stories and curated routes on the homepage. */
.expansion-section { margin-top: 72px; }
.expansion-section .section-intro { margin: 0 0 3px; color: #737b72; font-size: 12px; line-height: 1.85; max-width: 340px; }
.coffee-guide-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 25px; }
.coffee-guide-card { min-width: 0; }
.coffee-guide-art { height: 265px; display: block; position: relative; isolation: isolate; overflow: hidden; border-radius: 10px; background: #ebece2; }
.coffee-guide-card:nth-child(2) .coffee-guide-art { background: #ece5db; }
.coffee-guide-card:nth-child(3) .coffee-guide-art { background: #e4e9e7; }
.guide-index { position: absolute; top: 19px; left: 23px; font-size: 9px; letter-spacing: .1em; color: #6e7c6c; z-index: 2; }
.coffee-guide-art img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: contain; padding: 15px 35px; mix-blend-mode: multiply; transform: scale(1.23); transition: transform .35s; }
.coffee-guide-art:hover img { transform: scale(1.3); }
.guide-art-circle { position: absolute; width: 190px; height: 190px; border: 1px solid #ffffff9c; border-radius: 50%; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1; }
.coffee-guide-copy { padding: 25px 4px 0; }
.coffee-guide-copy h3 { font-size: 25px; font-weight: 550; line-height: 1.25; margin: 0 0 13px; }
.coffee-guide-copy p { font-size: 12px; line-height: 1.9; color: #737b72; margin: 0; min-height: 70px; }
.guide-check { border-top: 1px solid #dfe3d7; margin-top: 21px; padding-top: 15px; font-size: 11px; color: #52684f; }
.guide-check span { display: block; font-size: 8px; letter-spacing: .1em; color: #89917f; margin-bottom: 5px; }
.coffee-guide-copy .text-link { margin-top: 21px; gap: 15px; font-size: 12px; }
.living-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.living-card { position: relative; min-height: 407px; background: #e3e9de; border-radius: 12px; overflow: hidden; isolation: isolate; }
.living-beauty { background: #ede2dc; }
.living-card-copy { position: relative; z-index: 2; padding: 35px 0 35px 32px; width: 53%; }
.living-label { font-size: 9px; letter-spacing: .13em; color: #687c63; }
.living-card h3 { font-size: 34px; line-height: 1.15; letter-spacing: -.045em; font-weight: 550; margin: 28px 0 15px; }
.living-card p { font-size: 12px; color: #6b7966; line-height: 1.85; max-width: 230px; }
.living-cta { display: inline-flex; align-items: center; gap: 13px; font-size: 11px; font-weight: 650; margin-top: 19px; }
.living-cta svg { width: 18px; height: 18px; transition: transform .25s; }
.living-card:hover .living-cta svg { transform: translateX(4px); }
.living-card-art { position: absolute; inset: 70px -12px 45px 45%; z-index: 1; }
.living-product { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; transform: rotate(-9deg) scale(1.35); position: relative; z-index: 1; transition: transform .4s; }
.living-beauty .living-product { transform: rotate(14deg) scale(1.26); }
.living-card:hover .living-product { transform: rotate(-5deg) scale(1.4); }
.living-beauty:hover .living-product { transform: rotate(9deg) scale(1.31); }
.living-orbit { position: absolute; border: 1px solid #ffffffb0; border-radius: 50%; width: 260px; height: 260px; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1; }
.living-art-note { position: absolute; right: 24px; bottom: 22px; font-size: 7px; letter-spacing: .12em; color: #809076; }
.living-beauty .living-label, .living-beauty .living-art-note { color: #927968; }
.living-beauty p { color: #7e756b; }
.everyday-section .product-grid { margin-top: 29px; }
.budget-section { display: grid; grid-template-columns: 1.1fr 2fr; background: #183f36; border-radius: 12px; color: #f4f3e8; overflow: hidden; }
.budget-intro { padding: 43px 38px; position: relative; isolation: isolate; overflow: hidden; }
.budget-intro .eyebrow { color: #b7c8ac; font-size: 9px; }
.budget-intro h2 { font-size: 34px; margin-top: 20px; font-weight: 500; }
.budget-intro p { font-size: 12px; line-height: 1.9; color: #b8c9b7; margin: 19px 0 0; max-width: 260px; }
.budget-decoration { position: absolute; z-index: -1; right: 12px; bottom: -80px; color: #ffffff04; font-size: 250px; letter-spacing: -.07em; line-height: 1; }
.budget-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 38px 28px 38px 0; align-items: stretch; }
.budget-option { border-left: 1px solid #edf3e126; padding: 13px 21px; display: flex; flex-direction: column; align-items: flex-start; transition: background .2s; }
.budget-option:hover { background: #ffffff08; }
.budget-number { color: #a0b496; font-size: 10px; }
.budget-option strong { font-size: clamp(23px, 2.3vw, 33px); letter-spacing: -.04em; font-weight: 500; margin-block: 38px auto; white-space: nowrap; }
.budget-option strong small { display: block; font-size: 14px; color: #c6d2bf; margin-top: 1px; font-weight: 400; letter-spacing: 0; }
.budget-option-link { display: flex; align-items: center; justify-content: space-between; gap: 13px; font-size: 10px; color: #d2ddca; width: 100%; margin-top: 38px; white-space: nowrap; }
.budget-option-link svg { width: 17px; height: 17px; }
@media(max-width:1100px) {
    .living-card { min-height: 395px; }
    .living-card-copy { padding-left: 25px; width: 57%; }
    .living-card h3 { font-size: 29px; }
    .living-card-art { left: 47%; }
    .living-art-note { font-size: 6px; }
    .coffee-guide-copy h3 { font-size: 22px; }
    .coffee-guide-copy p { min-height: 94px; }
    .budget-intro { padding: 35px 29px; }
    .budget-intro h2 { font-size: 29px; }
    .budget-options { padding-right: 13px; }
    .budget-option { padding-inline: 15px; }
    .budget-option-link { font-size: 9px; gap: 8px; }
}
@media(max-width:900px) and (min-width:781px) {
    .living-card h3 { font-size: 26px; }
    .living-card-copy { width: 62%; }
    .living-card p { font-size: 11px; }
    .living-card-art { left: 55%; top: 105px; bottom: 37px; }
    .budget-section { grid-template-columns: 1fr; }
    .budget-intro { padding-bottom: 25px; }
    .budget-intro p { max-width: none; }
    .budget-options { padding: 0 25px 30px; }
    .budget-option strong { margin-block: 20px auto; }
    .budget-option-link { margin-top: 25px; }
}
@media(max-width:780px) {
    .expansion-section { margin-top: 44px; }
    .expansion-section .section-heading { display: block; margin-bottom: 23px; }
    .expansion-section .section-intro { margin-top: 15px; font-size: 12px; max-width: none; }
    .expansion-section .section-intro br { display: none; }
    .coffee-guide-grid { grid-template-columns: 1fr; gap: 31px; }
    .coffee-guide-card { display: grid; grid-template-columns: 38% 1fr; align-items: start; gap: 20px; }
    .coffee-guide-art { height: 220px; border-radius: 8px; }
    .coffee-guide-art img { padding: 10px 0; transform: scale(1.48); }
    .coffee-guide-art:hover img { transform: scale(1.5); }
    .guide-index { left: 13px; top: 13px; font-size: 7px; }
    .guide-art-circle { width: 145px; height: 145px; }
    .coffee-guide-copy { padding: 2px 0 0; }
    .coffee-guide-copy h3 { font-size: 22px; line-height: 1.2; margin-bottom: 10px; }
    .coffee-guide-copy p { font-size: 11px; line-height: 1.85; min-height: 0; }
    .guide-check { margin-top: 13px; padding-top: 11px; font-size: 10px; line-height: 1.6; }
    .guide-check span { font-size: 7px; }
    .coffee-guide-copy .text-link { font-size: 10px; margin-top: 13px; gap: 7px; }
    .coffee-guide-copy .text-link svg { width: 14px; }
    .living-grid { grid-template-columns: 1fr; gap: 17px; }
    .living-card { min-height: 360px; }
    .living-card-copy { padding: 30px 0 28px 25px; width: 58%; }
    .living-label { font-size: 8px; }
    .living-card h3 { font-size: 29px; margin-top: 25px; }
    .living-card p { font-size: 11px; max-width: 190px; }
    .living-cta { margin-top: 15px; gap: 8px; font-size: 10px; }
    .living-card-art { left: 51%; right: -28px; top: 80px; bottom: 48px; }
    .living-product { transform: rotate(-12deg) scale(1.6); }
    .living-beauty .living-product { transform: rotate(14deg) scale(1.42); }
    .living-orbit { width: 190px; height: 190px; }
    .living-art-note { right: 20px; bottom: 19px; font-size: 6px; }
    .everyday-section .section-heading { display: flex; }
    .everyday-section .section-heading>.text-link { flex-shrink: 0; }
    .everyday-section .product-grid { margin-top: 0; }
    .budget-section { grid-template-columns: 1fr; }
    .budget-intro { padding: 31px 27px 27px; }
    .budget-intro h2 { font-size: 32px; margin-top: 15px; }
    .budget-intro p { font-size: 12px; max-width: none; margin-top: 15px; }
    .budget-options { grid-template-columns: 1fr; padding: 0 27px 23px; }
    .budget-option { display: grid; grid-template-columns: 20px 1fr 18px; gap: 15px; border: 0; border-top: 1px solid #edf3e126; padding: 23px 0; align-items: center; }
    .budget-option strong { font-size: 28px; margin: 0; }
    .budget-option strong small { display: inline; font-size: 13px; }
    .budget-option-link { width: auto; font-size: 0; margin: 0; gap: 0; }
    .budget-option-link svg { width: 18px; }
}
@media(max-width:370px) {
    .coffee-guide-card { grid-template-columns: 1fr; gap: 18px; }
    .coffee-guide-art { height: 220px; }
    .coffee-guide-art img { padding: 12px 30px; transform: scale(1.2); }
    .coffee-guide-copy p { font-size: 12px; }
    .coffee-guide-copy .text-link { font-size: 12px; }
    .living-card-copy { width: 63%; padding-left: 21px; }
    .living-card h3 { font-size: 27px; }
    .living-card-art { left: 59%; }
    .living-cta { gap: 7px; font-size: 9px; }
}
.living-card-art { mix-blend-mode: multiply; }
@media(max-width:780px) {
    .coffee-guide-art img { transform: scale(1.12); }
    .coffee-guide-art:hover img { transform: scale(1.16); }
    .living-card { min-height: 470px; }
    .living-card-copy { width: 100%; min-height: 470px; padding: 29px 25px; }
    .living-card h3 { font-size: 31px; margin-top: 22px; }
    .living-card p { font-size: 12px; max-width: 260px; }
    .living-cta { position: absolute; bottom: 27px; left: 25px; font-size: 11px; margin: 0; }
    .living-card-art { top: 228px; bottom: 40px; left: 38%; right: -2px; }
    .living-product { transform: rotate(-8deg) scale(1.24); }
    .living-beauty .living-product { transform: rotate(17deg) scale(1.22); }
    .living-card:hover .living-product { transform: rotate(-5deg) scale(1.27); }
    .living-beauty:hover .living-product { transform: rotate(12deg) scale(1.26); }
    .living-art-note { display: none; }
}
@media(max-width:370px) {
    .living-card-copy { padding-inline: 21px; }
    .living-card h3 { font-size: 29px; }
    .living-card p { max-width: 240px; }
    .living-cta { left: 21px; }
}
