/* Cohesive welcome flow: hero button → benefits intro → pillars → remaster. */
.reference-home .intro{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;gap:44px;width:min(1160px,calc(100% - 40px));height:auto;padding:120px 0 64px;text-align:left}
.reference-home .intro .eyebrow{margin-bottom:16px}
.reference-home .intro h1{font:600 32px/40px Jost,Arial,sans-serif;letter-spacing:-.5px;margin:0 0 20px;max-width:560px;color:#35322f}
.reference-home .intro p{width:min(560px,100%);font:400 15px/26px Lato,Arial,sans-serif;color:#8a8a8a;margin:0}
.intro-benefits{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:12px;margin:30px 0 0;padding:0;list-style:none}
.intro-benefits li{display:flex;align-items:center;gap:11px;padding:9px 17px 9px 9px;border-radius:999px;background:linear-gradient(180deg,#fff,#fdf8f1);box-shadow:0 6px 16px #ce723f14,inset 0 0 0 1px #1911380d;font:600 14px/1.2 Onest,Arial,sans-serif;color:#35322f;transition:transform .25s ease,box-shadow .25s ease}
.intro-benefits li:hover{transform:translateY(-2px);box-shadow:0 11px 24px #ce723f1f,inset 0 0 0 1px #f9c10b4d}
.intro-benefits i{display:grid;place-items:center;flex:0 0 auto;width:34px;height:34px;border-radius:50%;background:linear-gradient(150deg,#2a1e4d,#17102f);color:#ffd12f;font-size:17px;box-shadow:0 4px 10px #19113829,inset 0 0 0 1px #ffffff1c}
.intro-vision{display:inline-flex;align-items:center;gap:7px;margin-top:26px;font:500 14px/20px Onest,Arial,sans-serif;color:#35322f;text-decoration:underline;text-underline-offset:3px}
.intro-vision:hover{color:#d78f68}
.intro-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;width:min(560px,100%);margin:30px 0 0;padding:18px 0;border-radius:16px;background:#fff;box-shadow:0 14px 30px #ce723f12,inset 0 0 0 1px #1911380a;list-style:none}
.intro-stats li{display:flex;flex-direction:column;align-items:center;gap:6px;padding:0 12px;border-left:1px solid #1911380f}
.intro-stats li:first-child{border-left:0}
.intro-stats strong{color:#4c3a75;font:900 26px/1 Jost,Arial,sans-serif}
.intro-stats small{color:#9b8879;font:800 12px/1 Onest,Arial,sans-serif;letter-spacing:1.2px;text-transform:uppercase}
.intro-art{position:relative;display:flex;align-items:flex-end;justify-content:center;min-height:500px;isolation:isolate}
.intro-art-stage{position:absolute;inset:4% 0 2%;border-radius:28px;background:linear-gradient(165deg,#fffaef,#f5edff 52%,#eef4ff);box-shadow:0 36px 70px #3923381c,inset 0 0 0 1px #ffffffd9,inset 0 0 0 3px #f9c10b1f}
.intro-art:before{content:'';position:absolute;left:50%;top:50%;width:min(390px,88%);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:1px dashed #f9c10b52;animation:intro-spin 46s linear infinite}
.intro-art:after{content:'';position:absolute;left:50%;bottom:6%;width:420px;height:420px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,#f9c10b33,transparent 66%)}
.intro-shot{position:absolute;z-index:0;top:4%;right:0;width:min(440px,78%);overflow:hidden;border:6px solid #fff;border-radius:18px;box-shadow:0 26px 52px #3923382b,0 0 0 1px #f9c10b5c;transform:rotate(-2.4deg);transition:transform .5s ease}
.intro-shot:after{content:'LIVE CLIENT · IZLUDE';position:absolute;right:12px;bottom:10px;padding:5px 10px;border-radius:7px;background:#17102fe6;color:#ffd12f;font:800 12px/1 Onest,Arial,sans-serif;letter-spacing:1.2px}
.intro-art:hover .intro-shot{transform:rotate(-.8deg) scale(1.02)}
.intro-shot img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover}
.intro-champ{position:relative;z-index:1;width:min(340px,80%);margin-right:10%;filter:drop-shadow(0 28px 36px #4b2c1652);animation:intro-float 6s ease-in-out infinite}
.intro-poring{position:absolute;z-index:2;left:4%;bottom:16px;width:104px;filter:drop-shadow(0 14px 20px #4b2c1645);animation:intro-float 5s ease-in-out infinite reverse}
.intro-spark{position:absolute;z-index:2;color:#f9c10b;text-shadow:0 0 14px #f9c10b66}
.intro-spark-a{top:12%;right:16%;font-size:26px;animation:intro-pulse 3.4s ease-in-out infinite}
.intro-spark-b{bottom:26%;right:5%;font-size:18px;animation:intro-pulse 4.2s ease-in-out .8s infinite}
@keyframes intro-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes intro-pulse{0%,100%{opacity:.35;transform:scale(.9)}50%{opacity:1;transform:scale(1.08)}}
@keyframes intro-spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.intro-champ,.intro-poring,.intro-spark,.intro-art:before{animation:none}}
.reference-home .home-principles{position:relative;overflow:hidden;width:min(1160px,calc(100% - 40px));margin:38px auto 0;padding:46px 52px;border-radius:20px;background:linear-gradient(115deg,#17102ff5,#2d1f50e0),url('/assets/img/features/amatsu-day.webp') center/cover}
.reference-home .home-principle-grid article{background:#ffffff0f;box-shadow:inset 0 1px #ffffff12}
.reference-home .faq-section{min-height:0;padding:100px 20px 110px}
.faq-more{margin:34px 0 0;text-align:center}
.faq-more .install-button{display:inline-flex;width:auto;margin:0}
@keyframes dice-tilt{0%,86%,100%{transform:rotate(0)}89%{transform:rotate(-9deg)}92%{transform:rotate(8deg)}95%{transform:rotate(-5deg)}98%{transform:rotate(3deg)}}
.shop-menu summary img{animation:dice-tilt 10s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.shop-menu summary img{animation:none}}
.reference-home .home-principle-intro h2{font:600 32px/38px Jost,Arial,sans-serif;letter-spacing:-.4px;margin-bottom:18px}
.reference-home .home-principle-intro p{font-size:14px;line-height:1.85}
.reference-home .home-principle-grid article{padding:20px}
.reference-home .home-principle-grid strong{font-size:14px}
.reference-home .home-principle-grid small{font-size:13px}
/* Consistent section rhythm: more air above each title, less before its content. */
.reference-home .remodel-section{padding-top:110px}
.reference-home .classes-section{padding:125px 0 0;height:auto}
.reference-home .classes-section .section-heading{min-height:0;margin-bottom:55px}
.reference-home .feature-section{margin-top:40px;padding-top:90px}
.reference-home .feature-stage{margin-top:80px}
.reference-home .premium-section{padding-top:120px}
@media(max-width:1000px){.reference-home .intro{grid-template-columns:1fr;gap:18px;padding:112px 0 52px;text-align:center}.reference-home .intro h1{max-width:none;margin-inline:auto}.reference-home .intro p{width:min(680px,100%);margin-inline:auto}.intro-benefits{justify-content:center}.intro-stats{justify-content:center}.intro-art{min-height:400px}.intro-champ{width:min(300px,64%)}.intro-poring{width:84px;left:8%}.intro-shot{top:3%;right:4%;width:min(340px,60%)}}
@media(max-width:800px){.reference-home .intro{padding:100px 0 46px}.reference-home .intro h1{font-size:24px;line-height:31px}.intro-benefits{gap:9px;margin-top:26px}.intro-benefits li{padding:9px 15px 9px 10px;font-size:13px}.intro-benefits i{width:28px;height:28px;font-size:15px}.intro-vision{margin-top:22px;font-size:14px}.intro-stats{grid-template-columns:1fr 1fr;gap:14px 0;padding:16px 0}.intro-stats li:nth-child(odd){border-left:0}.intro-stats li:nth-child(n+3){padding-top:14px;box-shadow:inset 0 1px #1911380f}.intro-stats strong{font-size:22px}.reference-home .remodel-section{padding-top:85px}.reference-home .classes-section{padding-top:80px;height:auto}.reference-home .classes-section .section-heading{margin-bottom:40px}.reference-home .feature-section{margin-top:30px;padding-top:70px}.reference-home .feature-stage{margin-top:60px}.reference-home .premium-section{padding-top:110px}.reference-home .home-principles{padding:34px 30px}.reference-home .home-principle-intro h2{font-size:27px;line-height:33px}}
@media(max-width:560px){.reference-home .intro{padding:92px 0 38px}.reference-home .intro h1{font-size:20px;line-height:27px}.intro-benefits{flex-direction:column;align-items:center}.intro-benefits li{width:100%;max-width:330px;justify-content:flex-start}.intro-stats{gap:12px 0}.intro-stats strong{font-size:20px}.intro-shot{display:none}.intro-art{min-height:320px}.intro-art:before{width:min(260px,84%)}.intro-champ{width:min(240px,72%)}.intro-poring{width:80px}.reference-home .remodel-section{padding-top:75px}.reference-home .classes-section{padding-top:70px}.reference-home .feature-section{padding-top:60px}.reference-home .feature-stage{margin-top:75px}.reference-home .premium-section{padding-top:90px}.reference-home .home-principles{width:calc(100% - 28px);padding:26px 22px}.reference-home .home-principle-intro h2{font-size:24px;line-height:30px}}

/* Official progression strip under the welcome stats. */
.intro-mechanics{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0 0;padding:0;list-style:none}
.intro-mechanics li{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border-radius:999px;background:#fff;box-shadow:0 4px 12px #ce723f12;color:#4b423c;font:600 13px/1 Onest,Arial,sans-serif}
.intro-mechanics i{color:#b98a63;font-size:15px}
@media(max-width:560px){.intro-mechanics li{font-size:12px;padding:6px 11px}}

/* Intro v2: cleaner welcome, dark glass stat strip over the art. */
.reference-home .intro{display:block;width:min(1160px,calc(100% - 40px));margin-inline:auto;padding:104px 0 56px}
.intro-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:48px;align-items:center;text-align:left}
.reference-home .intro h1{font-size:38px;line-height:47px;max-width:620px}
.reference-home .intro p{max-width:600px;font-size:15.5px;line-height:27px}
.intro-benefits{margin-top:28px}
.intro-actions{display:flex;flex-wrap:wrap;gap:22px;margin-top:26px}
.intro-actions .intro-vision{margin-top:0}
.intro-art .intro-stats{position:absolute;z-index:3;left:16px;right:16px;bottom:16px;display:grid;grid-template-columns:repeat(4,1fr);gap:0;width:auto;margin:0;padding:13px 4px;border-radius:13px;background:#140d2beb;box-shadow:0 16px 34px #17102f4d}
.intro-art .intro-stats li{border-left:1px solid #ffffff17;padding:0 8px;gap:5px}
.intro-art .intro-stats li:first-child{border-left:0}
.intro-art .intro-stats strong{color:#fff;font:700 21px/1 Jost,Arial,sans-serif}
.intro-art .intro-stats small{color:#b3a6cc;font:800 12px/1 Onest,Arial,sans-serif;letter-spacing:1.1px;text-transform:uppercase}
.intro-art-stage{background:linear-gradient(165deg,#241a44,#17102f 55%,#1d1440);box-shadow:0 36px 70px #241a4433,inset 0 0 0 1px #ffffff14}
.intro-art:after{background:radial-gradient(circle,#f9c10b26,transparent 66%)}
@media (max-width:980px){.intro-grid{grid-template-columns:minmax(0,1fr);gap:30px;text-align:center}.reference-home .intro h1,.reference-home .intro p{margin-inline:auto}.intro-benefits{justify-content:center}.intro-actions{justify-content:center}.intro-mechanics{justify-content:center}.intro-art .intro-stats{position:static;margin-top:20px}}

.intro-art .intro-champ,.intro-art .intro-poring{z-index:4}
.intro-art .intro-champ{margin-bottom:26px}

.intro-art .intro-poring{left:-28px;bottom:58px;width:96px}
@media (max-width:980px){.intro-art .intro-poring{left:6px;bottom:14px;width:78px}}

/* Intro v3: MVP artwork on the right, copy left aligned. */
.intro-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.04fr)}
.intro-copy{text-align:left}
.reference-home .intro h1,.reference-home .intro p{margin-left:0;margin-right:auto;text-align:left}
.intro-art{min-height:0;align-items:center}
.intro-art-stage{inset:6% 2% 8%}
.intro-mvp{position:relative;z-index:1;display:block;width:min(520px,100%);margin-inline:auto;border-radius:18px;filter:drop-shadow(0 26px 44px #241a4447)}
.intro-mvp-chip{position:absolute;z-index:4;left:20px;top:20px;display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:999px;background:#140d2beb;color:#f9c10b;font:800 12px/1 Onest,Arial,sans-serif;letter-spacing:1.2px}
.intro-mvp-chip i{font-size:14px}
.intro-art .intro-stats{left:34px;right:34px;bottom:26px}
@media (max-width:980px){.intro-grid{grid-template-columns:minmax(0,1fr)}.intro-copy,.reference-home .intro h1,.reference-home .intro p{text-align:left}.intro-art .intro-stats{left:16px;right:16px;bottom:14px}}
