/* One-time, gentle reveals. Without JavaScript or with reduced motion, content stays visible. */
@media(prefers-reduced-motion:no-preference){
 .trouble-section .trouble-motion{opacity:0;translate:0 14px}
 .trouble-section .trouble-motion--visible{opacity:1;translate:0 0;transition:opacity .9s ease,translate 1s cubic-bezier(.22,.61,.36,1);transition-delay:var(--trouble-delay,0ms)}
 .trouble-section__title{--trouble-delay:80ms}
 .trouble-card:nth-child(3n + 2){--trouble-delay:90ms}
 .trouble-card:nth-child(3n){--trouble-delay:180ms}
 .trouble-section__message{--trouble-delay:120ms}
}
@media(max-width:1000px){.trouble-section .trouble-card{--trouble-delay:0ms}.trouble-section .trouble-card:nth-child(even){--trouble-delay:90ms}}
@media(max-width:600px){.trouble-section .trouble-card:nth-child(n){--trouble-delay:0ms}}
.trouble-section{padding-top:clamp(90px,10vw,150px);background:#fff;color:#2f332f;overflow:hidden}
.trouble-section *{box-sizing:border-box}
.trouble-section__canvas{position:relative;isolation:isolate;container-type:inline-size;width:100%;margin:auto;padding-bottom:140px}
.trouble-section__header,.trouble-list,.trouble-section__bridge{position:relative;z-index:1;width:74%;max-width:1200px;margin-inline:auto}
.trouble-section__header{text-align:center}
.trouble-section__label{display:table;margin:0 auto;padding:6px 34px;border-radius:99px;background:#e5f2e2;color:#43876e;font-family:YBConceptLabel,"Yu Gothic",sans-serif;font-weight:500;font-size:14px;letter-spacing:.075em;line-height:1.5}
.trouble-section__title{font-family:YorisoiHeadline,serif;font-size:clamp(36px,3.8vw,62px);font-weight:500;line-height:1.5;letter-spacing:.025em;color:#24372e;margin:20px 0 26px}
.trouble-section__title::after{content:"";display:block;width:210px;height:12px;margin:9px auto 0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 12' fill='none'%3E%3Cpath d='M3 8 Q60 1 113 6 T217 5' stroke='%23BFDDBD' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}
.trouble-list{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 28px}
.trouble-card{position:relative;aspect-ratio:1.46;min-width:0;isolation:isolate;display:flex;align-items:flex-end;justify-content:center;padding:0 18px 22px}
.trouble-card__illustration{position:absolute;inset:0;z-index:-1;background-image:url('assets/trouble-artwork.webp');background-repeat:no-repeat;background-size:398.095% 336.071%;border-radius:34% 38% 32% 36% / 30% 34% 30% 32%}
.trouble-card:nth-child(1) .trouble-card__illustration{background-position:18.37% 24.21%}
.trouble-card:nth-child(2) .trouble-card__illustration{background-position:50.32% 24.21%}
.trouble-card:nth-child(3) .trouble-card__illustration{background-position:83.06% 24.21%}
.trouble-card:nth-child(4) .trouble-card__illustration{background-position:18.37% 65.81%}
.trouble-card:nth-child(5) .trouble-card__illustration{background-position:50.32% 65.81%}
.trouble-card:nth-child(6) .trouble-card__illustration{background-position:83.06% 65.81%}
.trouble-card:nth-child(1) .trouble-card__illustration{clip-path:inset(0 6% 0 0)}
.trouble-card:nth-child(3) .trouble-card__illustration{clip-path:inset(0 2% 0 4%)}
.trouble-card:nth-child(6) .trouble-card__illustration{clip-path:polygon(0 0,100% 0,100% 50%,75% 100%,0 100%)}
.trouble-card__text{margin:0;font-family:YBConceptLabel,"Yu Gothic",sans-serif;font-weight:500;font-size:clamp(15px,1.2vw,20px);line-height:1.55;letter-spacing:0;text-align:center;color:#373b35}
.trouble-section__bridge{text-align:center;font-family:YorisoiHeadline,serif;font-size:clamp(20px,1.7vw,28px);line-height:1.8;letter-spacing:.025em;margin-top:38px}
.trouble-section__message{position:absolute;z-index:2;font-family:YorisoiHandFull,cursive;font-size:clamp(14px,1.05vw,17px);font-weight:400;color:#827971;line-height:1.85;letter-spacing:.1em;margin:0;transform:rotate(-8deg)}
.trouble-section__message::after{content:"";display:block;height:22px;width:100%;margin-top:9px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 32' fill='none'%3E%3Cpath d='M2 24C42 5 65 33 108 19S182 0 238 9' stroke='%23A39C94' stroke-width='1.15' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.trouble-section__message--a{left:6.2%;top:7%}.trouble-section__message--b{right:1.6%;top:10%;transform:rotate(-3deg)}
.trouble-section__message--c{left:2.8%;top:66%;font-size:clamp(12px,1vw,16px)}.trouble-section__message--d{right:1.8%;top:52%}
.trouble-section__botanical{position:absolute;z-index:0;pointer-events:none;top:0;height:36cqw;width:14%;mask-image:linear-gradient(to bottom,#000 70%,transparent);background:url('assets/trouble-artwork.webp') no-repeat;background-size:100cqw 56.28cqw}
.trouble-section__botanical--left{left:0;background-position:left top}.trouble-section__botanical--right{right:0;width:22%;background-position:right top;clip-path:polygon(0 0,100% 0,100% 100%,36.4% 100%,36.4% 83%,28% 83%,28% 65%,36.4% 65%,36.4% 26%,0 26%);mask-image:linear-gradient(to bottom,transparent,#000 32px,#000 70%,transparent)}
.trouble-section__landscape{position:absolute;z-index:0;pointer-events:none;bottom:0;left:0;width:100%;height:140px;background:url('assets/trouble-artwork.webp') center bottom/100% auto no-repeat;mask-image:linear-gradient(to bottom,transparent,#000 32%)}
@media(max-width:1200px){.trouble-section__header,.trouble-list,.trouble-section__bridge{width:82%}.trouble-list{gap:25px 18px}.trouble-section__message{display:none}.trouble-section__botanical{display:none}.trouble-card{padding-bottom:22px}.trouble-card__text{font-size:15px}}
@media(max-width:1000px){.trouble-section{padding-top:90px}.trouble-section__header,.trouble-list,.trouble-section__bridge{width:calc(100% - 64px);max-width:760px}.trouble-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px}.trouble-section__title{font-size:clamp(30px,4.7vw,44px)}.trouble-card__text{font-size:clamp(15px,2vw,18px)}.trouble-section__botanical{display:none}.trouble-section__landscape{height:100px;background-size:auto 460px}.trouble-section__canvas{padding-bottom:120px}.trouble-section__bridge{font-size:20px}.trouble-section__label{font-size:12px;padding:6px 25px}}
@media(max-width:600px){.trouble-section{padding-top:72px}.trouble-section__header,.trouble-list,.trouble-section__bridge{width:calc(100% - 48px)}.trouble-section__label{font-size:11px;padding:6px 18px;letter-spacing:.055em}.trouble-section__title{font-size:clamp(28px,7vw,36px);line-height:1.6;margin:24px 0 28px}.trouble-section__title span{display:block}.trouble-section__title::after{width:155px;margin-top:12px}.trouble-list{grid-template-columns:minmax(0,1fr);max-width:390px;gap:24px}.trouble-card{padding-bottom:22px}.trouble-card__text{font-size:clamp(15px,4.1vw,18px)}.trouble-section__bridge{font-size:20px;line-height:1.9;margin-top:36px;text-wrap:pretty}.trouble-section__bridge span{display:block}.trouble-section__canvas{padding-bottom:110px}.trouble-section__landscape{height:80px;background-size:auto 380px}}

/* Keep content comfortably sized while the watercolor reaches the viewport edges. */
@media(min-width:1001px){
 .trouble-section{padding-top:clamp(80px,7vw,120px)}
 .trouble-section__header,.trouble-list,.trouble-section__bridge{width:calc(100% - 80px);max-width:1120px}
 .trouble-section__title{font-size:clamp(38px,3.6vw,54px)}
 .trouble-card__text{font-size:clamp(15px,1.1vw,16px)}
 .trouble-section__bridge{font-size:24px}
}
@media(min-width:1001px) and (max-width:1200px){
 .trouble-section__header,.trouble-list,.trouble-section__bridge{width:calc(100% - 80px)}
}
@media(min-width:1001px) and (max-width:1440px){
 .trouble-section__message,.trouble-section__botanical{display:none}
}
@media(min-width:1673px){
 .trouble-section__botanical{background-size:1672px 941px;width:234px;height:602px}
 .trouble-section__botanical--right{width:368px}
 .trouble-section__landscape{background-size:100% auto;height:140px}
 .trouble-section__message--a{left:100px}
 .trouble-section__message--b{right:36px}
 .trouble-section__message--c{left:46px}
 .trouble-section__message--d{right:40px}
}





/* The yellow watercolor has a shallower lower edge than the other illustrations. */
.trouble-card:nth-child(5){padding-bottom:38px}



.trouble-card:nth-child(2) .trouble-card__illustration{background-image:url('assets/trouble-pickup-concerned.webp')}


.trouble-card:nth-child(5) .trouble-card__illustration{background-image:url('assets/trouble-window-concerned.webp')}