:root {
  --emi-serif: 'Newsreader', Georgia, 'Times New Roman', serif;
  font-optical-sizing: auto;
  /* Bảng màu chính EMi Balance */
  --emi-navy: #1f3557;
  --emi-navy-dark: #14243b;
  --emi-navy-light: #2c4a75;
  --emi-navy-soft: #33456a;
  --emi-sky: #9cc3e4;
  --emi-sky-soft: #cfe2ef;
  --emi-sky-dark: #4a75a5;
  --emi-sakura: #f2c6cf;
  --emi-sakura-soft: #fae8ec;
  --emi-sakura-dark: #d8899b;
  --emi-cream: #f7f1e6;
  --emi-cream-soft: #fbf8f1;
  --emi-accent: #1f3557;
  --emi-accent-hover: #2c4a75;
  --emi-white: #ffffff;
  --emi-border: rgba(31, 53, 87, 0.12);
  --emi-border-subtle: rgba(31, 53, 87, 0.08);
  --emi-card-shadow: 0 10px 28px -10px rgba(31, 53, 87, 0.12);
  --emi-focus: var(--emi-sky-dark);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--emi-cream)}
body{margin:0;color:var(--emi-navy);background:var(--emi-cream);font-family:'Be Vietnam Pro',Arial,sans-serif;-webkit-font-smoothing:antialiased}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;cursor:pointer}
a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible{outline:3px solid var(--emi-focus);outline-offset:4px}

/* Step 1: Polished Cream Clearing — Living Home Aesthetics */
.home-more{position:relative;overflow:hidden;background:var(--emi-cream)}
.home-inner{max-width:1200px;margin:auto}
.home-kicker{font-size:13px;letter-spacing:2.2px;text-transform:uppercase;line-height:1.8;color:var(--emi-sky-dark);font-weight:600;display:inline-block;margin-bottom:6px}
.home-title{font:clamp(34px,4.2vw,54px)/1.15 var(--emi-serif);letter-spacing:-1.2px;font-weight:400;color:var(--emi-navy);margin:14px 0 20px}
.home-title em{font-weight:400;font-style:italic;color:var(--emi-sky-dark)}
.home-lead{font-size:16px;line-height:1.75;max-width:520px;color:var(--emi-navy-soft);margin:0 0 24px}
.home-link{display:inline-flex;align-items:center;gap:12px;font-size:12px;font-weight:500;color:var(--emi-navy);border-bottom:1px solid rgba(31,53,87,0.3);padding:6px 0;line-height:1.5;text-decoration:none;transition:color .25s ease,border-color .25s ease}
.home-link span{display:inline-block;transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.home-link:hover{color:var(--emi-navy-dark);border-color:var(--emi-navy)}
.home-link:hover span{transform:translateX(4px)}
.home-link:focus-visible{outline:2px solid var(--emi-focus);outline-offset:4px;border-radius:2px}
.home-reveal{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);will-change:opacity,transform}
.home-reveal.is-visible{opacity:1;transform:none}

/* 1.1 Thương hiệu (#ranges) */
.home-ranges{background:var(--emi-cream);padding:55px 6% 40px}
.home-ranges .home-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:34px}
.home-ranges .home-section-head .home-title{margin-bottom:0}
.range-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.range-grid.range-single{display:block;max-width:960px;margin:0 auto}
.range-card{display:flex;flex-direction:column;min-width:0;border-radius:24px;background:var(--emi-white);border:1px solid var(--emi-border);overflow:hidden;box-shadow:var(--emi-card-shadow),inset 0 1px 0 rgba(255,255,255,0.9);transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s cubic-bezier(.2,.8,.2,1),border-color .4s ease}
.range-card:hover{transform:translateY(-4px);box-shadow:0 20px 42px -12px rgba(31,53,87,0.18),inset 0 1px 0 #ffffff;border-color:rgba(31,53,87,0.22)}
.range-card:focus-within{outline:2px solid var(--emi-focus);outline-offset:3px}
.range-card-featured{display:grid;grid-template-columns:1fr 1.15fr;min-height:340px}
.range-art{height:270px;position:relative;overflow:hidden;background:var(--emi-sky)}
.range-card-featured .range-art{height:100%;min-height:300px}
.range-art>img{width:100%;height:100%;object-fit:cover;object-position:68% center;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.range-card:hover .range-art>img{transform:scale(1.03)}
.range-art small{position:absolute;left:20px;top:20px;border-radius:24px;background:rgba(255,255,255,0.9);padding:7px 14px;font-size:9.5px;letter-spacing:1.2px;font-weight:500;color:var(--emi-navy);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--emi-border);box-shadow:0 4px 12px rgba(31,53,87,0.08)}
.range-text{padding:28px 30px 32px;flex:1;display:flex;flex-direction:column;background:linear-gradient(135deg,rgba(255,255,255,0.95),var(--emi-cream-soft))}
.range-card-featured .range-text{padding:38px 44px;justify-content:center}
.range-text h3{font:28px/1.2 var(--emi-serif);margin:0 0 12px;font-weight:400;letter-spacing:-0.4px;color:var(--emi-navy)}
.range-card-featured .range-text h3{font-size:32px;margin:0 0 14px}
.range-text p{font-size:13.5px;line-height:1.8;color:var(--emi-navy-soft);margin:0 0 22px}
.range-card-featured .range-text p{font-size:14px;line-height:1.85;max-width:440px}
.range-text .home-link{margin-top:auto;align-self:flex-start}

/* 1.2 Chăm sóc & Cảm nhận (#care / #voices) */
.care-clearing{padding:48px 6% 38px;background:var(--emi-cream)}
.care-layout{display:grid;grid-template-columns:1fr 1fr;gap:7%;align-items:center}
.care-visual{position:relative;height:520px;border-radius:160px 160px 20px 20px;overflow:hidden;margin:0;box-shadow:0 24px 50px -15px rgba(31,53,87,0.22),0 2px 10px rgba(0,0,0,0.04)}
.care-visual>img{width:100%;height:100%;object-fit:cover;object-position:70% center;animation:none}
.care-visual:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(31,53,87,0.88) 0%,rgba(31,53,87,0.42) 42%,transparent 75%);pointer-events:none}
.care-list{margin-top:24px}
.care-list article{display:grid;grid-template-columns:38px 1fr;gap:16px;padding:16px 0;border-top:1px solid var(--emi-border)}
.care-list span{font:22px var(--emi-serif);color:var(--emi-sakura-dark);font-weight:400}
.care-list h3{font:20px var(--emi-serif);font-weight:400;color:var(--emi-navy);margin:0 0 6px}
.care-list p{font-size:13px;color:var(--emi-navy-soft);line-height:1.7;margin:0}
.care-testimonials{position:absolute;left:20px;right:20px;bottom:20px;z-index:2;background:rgba(31,53,87,0.9);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:var(--emi-cream);border:1px solid rgba(156,195,228,0.25);border-radius:24px;padding:24px 26px;box-shadow:0 16px 36px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.12)}
.voice-stage{min-height:174px}
.voice-slide[hidden]{display:none!important}
.voice-slide .home-kicker{color:var(--emi-sky);font-size:8.5px;letter-spacing:2px}
.voice-slide p{font:22px/1.45 var(--emi-serif);color:var(--emi-cream);margin:12px 0 16px}
.voice-person{display:flex;align-items:center;gap:14px}
.voice-person img{width:42px;height:42px;border-radius:50%;object-fit:cover;border:1px solid rgba(255,255,255,0.35);box-shadow:0 2px 8px rgba(0,0,0,0.2)}
.voice-person strong{display:block;font-size:12.5px;font-weight:500;color:var(--emi-cream)}
.voice-person small{display:block;font-size:11px;color:var(--emi-sky);margin-top:3px}
.voice-slide.is-current{animation:voiceFade .25s ease-out}
@keyframes voiceFade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.voice-controls{display:flex;align-items:center;justify-content:space-between;margin-top:14px}
.voice-controls button{min-width:36px;min-height:36px;border:1px solid rgba(156,195,228,0.3);border-radius:50%;background:rgba(255,255,255,0.05);color:inherit;cursor:pointer;transition:background .2s,border-color .2s,transform .2s}
.voice-controls button:hover{background:rgba(156,195,228,0.18);border-color:rgba(156,195,228,0.55);transform:scale(1.05)}
.voice-controls button:focus-visible{outline:2px solid var(--emi-focus);outline-offset:3px}
.voice-dots{display:flex;gap:6px}
.voice-dots button{border:0;font-size:9px;opacity:.45;padding:6px;background:transparent;color:inherit;cursor:pointer;transition:opacity .2s}
.voice-dots button[aria-current="true"]{opacity:1;background:rgba(156,195,228,0.25);border-radius:50%}
.care-source{padding-top:22px}
.voice-source{font-size:11px;line-height:1.7;color:var(--emi-navy-soft);margin:0 0 14px}
.care-source>div{display:flex;gap:30px;flex-wrap:wrap}

/* 1.3 Hồ sơ (#records) */
.home-records{padding:48px 6% 40px;background:var(--emi-cream)}
.records-layout{display:grid;grid-template-columns:1fr 1.25fr;gap:48px;align-items:center;min-height:180px}
.home-records .home-title{font-size:clamp(30px,3.4vw,44px);line-height:1.15;margin:12px 0 16px}
.home-records .home-lead{font-size:13.5px;line-height:1.8;margin:0 0 18px;max-width:440px;color:var(--emi-navy-soft)}
.home-records .home-link{font-size:11.5px}
.certificate-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.certificate{padding:14px;min-width:88px;text-align:left;color:inherit;border-radius:24px;border:1px solid var(--emi-border);background:var(--emi-white);box-shadow:var(--emi-card-shadow),inset 0 1px 0 #ffffff;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s cubic-bezier(.2,.8,.2,1),border-color .35s ease;cursor:pointer;display:flex;flex-direction:column}
.certificate:hover{transform:translateY(-4px);box-shadow:0 16px 36px -8px rgba(31,53,87,0.18),inset 0 1px 0 #ffffff;border-color:rgba(31,53,87,0.25)}
.certificate:focus-visible{outline:2px solid var(--emi-focus);outline-offset:3px}
.certificate img{display:block;width:100%;height:125px;object-fit:contain;background:var(--emi-cream-soft);border-radius:14px;border:1px solid var(--emi-border);box-shadow:0 2px 6px rgba(0,0,0,0.03);transition:transform .4s ease}
.certificate:hover img{transform:scale(1.02)}
.certificate span{display:block;font-size:11.5px;font-weight:500;line-height:1.45;margin:12px 0 6px;color:var(--emi-navy)}
.certificate small{font-size:10px;color:var(--emi-sky-dark);font-weight:600;margin-top:auto}

/* 1.4 FAQ (#faq) */
.home-faq{background:var(--emi-cream);padding:50px 6% 65px}
.faq-layout{display:grid;grid-template-columns:.85fr 1.35fr;gap:50px}
.home-faq .home-title{font-size:clamp(30px,3.4vw,44px);line-height:1.15;margin:12px 0 16px}
.home-faq .home-lead{font-size:13.5px;line-height:1.8;color:var(--emi-navy-soft);margin-bottom:22px}
.faq-list{border-top:1px solid var(--emi-border)}
.faq-list details{border-bottom:1px solid var(--emi-border);padding:0 8px;border-radius:8px;transition:background .25s ease}
.faq-list details:hover{background:rgba(255,255,255,0.45)}
.faq-list details[open]{background:rgba(255,255,255,0.7)}
.faq-list summary{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:14.5px;font-weight:500;line-height:1.6;padding:20px 4px;color:var(--emi-navy);cursor:pointer;list-style:none;transition:color .2s ease}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary:after{content:'+';font:22px var(--emi-serif);color:var(--emi-navy);width:28px;height:28px;min-width:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(156,195,228,0.25);transition:transform .25s cubic-bezier(.2,.8,.2,1),background .2s,color .2s}
.faq-list summary:hover:after{background:rgba(156,195,228,0.45);color:var(--emi-navy)}
.faq-list details[open] summary:after{content:'−';transform:rotate(180deg);background:var(--emi-navy);color:var(--emi-white)}
.faq-list details p{font-size:13px;line-height:1.85;color:var(--emi-navy-soft);margin:0 20px 22px 4px;max-width:640px}

.journey-world{overflow:hidden}

/* 1.5 Dải chuyển tiếp (.footer-return) & Footer (#contact) */
.footer-return{height:200px;position:relative;overflow:hidden;margin-bottom:-2px;z-index:1;background:linear-gradient(var(--emi-cream) 0%,#d8e5ee 32%,#6a8fae 62%,var(--emi-navy) 92%,var(--emi-navy) 100%)}
.footer-return:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 30% 40%,rgba(247,241,230,0.5),transparent 65%),radial-gradient(ellipse at 78% 65%,rgba(156,195,228,0.3),transparent 60%);mask-image:linear-gradient(transparent,#000 25%,#000 70%,transparent);pointer-events:none}
.home-contact{background:var(--emi-navy);color:var(--emi-cream);padding:75px 6% 30px;position:relative;overflow:hidden}
.home-contact .home-inner{position:relative;z-index:2}
.home-contact:before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,var(--emi-navy) 0%,rgba(20,36,59,0.95) 70px),linear-gradient(90deg,rgba(31,53,87,0.98),rgba(20,36,59,0.95));pointer-events:none;z-index:1}
.home-contact:after{content:'';position:absolute;inset:0 0 auto;height:70px;background:linear-gradient(var(--emi-navy) 0%,var(--emi-navy) 20px,rgba(31,53,87,0) 100%);pointer-events:none;z-index:1}
.contact-top{display:flex;justify-content:space-between;align-items:center;gap:40px;padding-bottom:50px;border-bottom:1px solid rgba(247,241,230,0.18)}
.contact-top .home-title{max-width:650px;margin:0;color:var(--emi-cream)}
.contact-top .home-title em{color:var(--emi-sky)}
.contact-action{border:1px solid rgba(156,195,228,0.45);border-radius:999px;padding:15px 28px;font-size:12.5px;font-weight:500;white-space:nowrap;background:rgba(156,195,228,0.12);color:var(--emi-cream);transition:all .3s cubic-bezier(.2,.8,.2,1);text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.contact-action:hover{background:var(--emi-cream);border-color:var(--emi-cream);color:var(--emi-navy);font-weight:600;transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,0.3)}
.contact-action:focus-visible{outline:2px solid var(--emi-sky);outline-offset:4px}
.contact-columns{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:35px;margin:45px 0 50px}
.contact-columns h3{font-size:11.5px;font-weight:500;color:var(--emi-sky);letter-spacing:1.5px;margin:0 0 18px}
.contact-columns p,.contact-columns a{font-size:11.5px;line-height:1.9}
.contact-columns a{display:block;width:fit-content;color:rgba(247,241,230,0.85);margin-bottom:8px;transition:color .2s,transform .2s;text-decoration:none}
.contact-columns a:hover{color:var(--emi-sky);transform:translateX(2px)}
.contact-company{font:28px var(--emi-serif);color:var(--emi-cream);margin-bottom:16px}
.contact-columns p{color:rgba(247,241,230,0.72);max-width:310px}
.contact-columns .contact-phone{font:24px var(--emi-serif);color:var(--emi-cream);display:block;margin:4px 0 8px}
.contact-columns .contact-phone:hover{color:var(--emi-sky)}
.contact-legal{display:flex;justify-content:space-between;gap:30px;border-top:1px solid rgba(247,241,230,0.18);padding-top:25px;color:rgba(247,241,230,0.6);font-size:10px;line-height:1.8}
.contact-legal a{color:var(--emi-sky);transition:color .2s;text-decoration:none}
.contact-legal a:hover{color:var(--emi-cream)}

/* 1.6 Responsive & Reduced Motion */
@media(max-width:900px){.contact-columns{grid-template-columns:1fr 1fr}}
@media(max-width:800px){
  .home-ranges{padding:40px 6% 30px}
  .range-grid{grid-template-columns:1fr;gap:20px}
  .range-art{height:220px}
  .range-card-featured{display:flex;flex-direction:column;min-height:auto}
  .range-card-featured .range-art{height:230px;min-height:auto}
  .range-card-featured .range-text{padding:26px 22px 28px}
  .range-card-featured .range-text h3{font-size:26px}
  .range-card-featured .range-text p{font-size:13px}
  .care-clearing{padding:35px 6% 25px}
  .care-layout{display:flex;flex-direction:column;gap:24px}
  .care-visual{order:-1;width:100%;height:420px;border-radius:120px 120px 20px 20px}
  .care-testimonials{left:16px;right:16px;bottom:16px;padding:18px 20px}
  .voice-slide p{font-size:20px}
  .voice-stage{min-height:165px}
  .care-source>div{gap:16px}
  .home-records{padding:35px 6% 25px}
  .records-layout{grid-template-columns:1fr;gap:24px;min-height:0}
  .certificate-grid{gap:10px}
  .certificate{padding:10px;border-radius:14px}
  .certificate img{height:110px}
  .home-faq{padding:35px 6% 40px}
  .faq-layout{grid-template-columns:1fr;gap:28px}
  .footer-return{height:180px;margin-bottom:-2px}
  .home-contact:after{height:60px;background:linear-gradient(var(--emi-navy) 0%,var(--emi-navy) 16px,rgba(31,53,87,0) 100%)}
}
@media(max-width:760px){
  .footer-return{height:100px;margin-bottom:-2px}
  .home-contact{padding-top:40px}
  .contact-columns a{min-height:44px;display:flex;width:100%;align-items:center;margin-bottom:2px}
  .contact-columns .contact-phone{min-height:44px;display:flex;align-items:center}
  .menu-phone,.menu-mail{min-height:44px;display:inline-flex;align-items:center}
}
@media(max-width:600px){
  .home-ranges .home-section-head{display:block}
  .home-ranges .home-section-head>.home-link{margin-top:16px}
  .contact-top{display:block}
  .contact-action{display:inline-flex;margin-top:24px;min-height:44px}
  .contact-columns{grid-template-columns:1fr 1fr;gap:28px 18px}
  .contact-columns>div:first-child{grid-column:1/-1}
  .contact-legal{display:block}
  .contact-legal span{display:block;margin-top:8px}
  .contact-columns a{min-height:44px;display:flex;width:100%;align-items:center;margin-bottom:2px}
  .contact-columns .contact-phone{min-height:44px;display:flex;align-items:center}
  .menu-phone,.menu-mail{min-height:44px;display:inline-flex;align-items:center}
  .contact-legal a{min-height:44px;display:inline-flex;align-items:center}
  .home-link{min-height:44px}
}
@media(prefers-reduced-motion:reduce){
  .home-reveal{transition:none!important;opacity:1!important;transform:none!important}
  .range-card,.range-art>img,.certificate,.certificate img,.contact-action,.home-link span{transition:none!important;transform:none!important}
  .voice-slide{animation:none!important}
}
body.paused .range-card,body.paused .range-art>img,body.paused .certificate,body.paused .voice-slide{transition:none!important;animation:none!important}

/* EMi Balance — hành trình "Ngôi nhà sống": 6 phòng, mỗi phòng đi từ mờ bụi tới sáng sạch. */
.rooms-journey{position:relative;height:1180svh;background:var(--emi-cream);color:var(--emi-navy)}
.journey-sticky{position:sticky;top:0;height:100svh;min-height:540px;overflow:hidden;isolation:isolate}
.room{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .6s ease,visibility 0s linear .6s;background:radial-gradient(ellipse at 70% 60%,#fff 0,var(--tone) 70%)}
.room.active{opacity:1;visibility:visible;transition-delay:0s}
.room-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.room-clean{opacity:var(--clean,1)}
.room.has-dirty .room-clean{opacity:var(--clean,0);transition:opacity .15s linear}
.room-dirty{opacity:calc(1 - var(--clean,0));pointer-events:none;transition:opacity .15s linear}
.room-fg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;z-index:4;transform:translate3d(calc((var(--room-p,0) - 0.5) * -3%),0,0);will-change:transform}
.room-label{position:absolute;right:5%;top:12%;font:clamp(60px,11vw,180px)/.9 var(--emi-serif);font-style:italic;color:rgba(255,255,255,0.65);pointer-events:none;z-index:2}
.room-dust{position:absolute;inset:0;background:linear-gradient(160deg,rgba(40,65,95,0.65),rgba(20,35,55,0.75));opacity:calc(1 - var(--clean,0));mix-blend-mode:multiply;pointer-events:none;z-index:1}
.room.has-dirty .room-dust{display:none!important}
.room-microbes i{position:absolute;left:var(--mx);top:var(--my);width:var(--ms);height:var(--ms);border-radius:50%;background:#fffbe8;box-shadow:0 0 14px 4px #ffe9a8aa;opacity:var(--clean,0);transform:scale(calc(.3 + var(--clean,0)));animation:microbeFloat var(--md) ease-in-out infinite alternate;animation-delay:var(--delay);z-index:2}
@keyframes microbeFloat{to{translate:6px -10px}}
body.paused .room-microbes i{animation-play-state:paused}

/* Chai bóc nền trong suốt có bóng đổ mềm tự nhiên */
.room-bottle{
  position:absolute;
  left:var(--bx,75%);
  top:var(--by,85%);
  transform:translate(-50%,-100%);
  height:min(50svh,430px);
  width:auto;
  filter:drop-shadow(0 14px 20px rgba(31,53,87,0.38)) drop-shadow(0 2px 6px rgba(0,0,0,0.22));
  opacity:calc(.2 + var(--clean,0) * .8);
  transition:opacity .3s ease;
  z-index:3;
  pointer-events:auto;
}

/* Chặng Bếp đặc biệt — Multi-shot animation */
.room-kitchen-sequence{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.kitchen-shot{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:0;will-change:transform,opacity}
.kitchen-shot-1{background-image:url("assets/shots/01-kitchen-overview.webp");opacity:1;transform-origin:26.8% 39.7%}
.room.kitchen-shots-loaded .kitchen-shot-2{background-image:url("assets/shots/02-sink-wide.jpg");transform-origin:50% 50%}
.room.kitchen-shots-loaded .kitchen-shot-3{background-image:url("assets/shots/03-sink-closeup.webp");transform-origin:50% 50%}
.kitchen-intro{position:absolute;left:6%;top:14%;font:clamp(22px,2.6vw,36px)/1.35 var(--emi-serif);color:var(--emi-cream);text-shadow:0 2px 14px rgba(15,26,43,0.85);max-width:480px;z-index:4;pointer-events:none;opacity:0;transform:translateY(10px);transition:opacity .4s ease,transform .4s ease}
.room-kitchen-cutout{display:block;height:var(--sink-bh, 270px);width:auto;left:var(--sink-bx, 78%);top:var(--sink-by, 640px);transform:translate(-50%, -100%);filter:drop-shadow(0 16px 24px rgba(15,26,43,0.45));z-index:4;opacity:0;pointer-events:auto}
.room-kitchen .room-label{display:none!important}
.room-kitchen .room-card{top:20%;transform:none;width:min(340px,82%);padding:22px 24px}
.room-kitchen .room-card h2{font-size:clamp(22px,2.4vw,32px);margin:0 0 10px}
.room-kitchen .room-card p,.room-kitchen .room-card li{font-size:13px;line-height:1.6}
.room-kitchen .room-card ul{margin:0 0 14px;padding-left:16px}
.room-kitchen .room-card .room-cta{padding:9px 18px;font-size:12px;min-height:38px}

/* Chặng Bàn ăn — Khăn lau biết bay */
.room-table-sequence{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.table-shot{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat}
.room.media-attached .table-shot-dirty{background-image:url("assets/shots/04-table-dirty.jpg")}
.room.media-attached .table-shot-clean{
  background-image:url("assets/shots/04-table-clean.webp");
  -webkit-mask-image:linear-gradient(to right, #000 0%, #000 calc(var(--clean-w, 0%) - 30px), rgba(0,0,0,0.5) var(--clean-w, 0%), transparent calc(var(--clean-w, 0%) + 30px));
  mask-image:linear-gradient(to right, #000 0%, #000 calc(var(--clean-w, 0%) - 30px), rgba(0,0,0,0.5) var(--clean-w, 0%), transparent calc(var(--clean-w, 0%) + 30px));
}
.table-cloth{position:absolute;left:0;top:0;width:var(--cloth-w, 280px);height:auto;transform:translate(-50%, -50%);pointer-events:none;z-index:4;filter:drop-shadow(0 18px 26px rgba(15,26,43,0.40));opacity:0;transition:opacity .2s ease}
.table-cloth-flat{filter:drop-shadow(0 4px 6px rgba(15,26,43,0.30)) drop-shadow(0 1px 2px rgba(0,0,0,0.25))}
.table-sparkle{position:absolute;width:24px;height:24px;pointer-events:none;z-index:5;background:radial-gradient(circle,#ffffff 20%,rgba(156,195,228,0.7) 60%,transparent 85%);border-radius:50%;box-shadow:0 0 16px rgba(156,195,228,0.8);opacity:0;transform:translate(-50%, -50%) scale(0);transition:transform .3s cubic-bezier(0.175,0.885,0.32,1.275),opacity .3s ease}
.table-bottle{display:block;height:var(--table-bh, 290px);width:auto;left:var(--table-bx, 68%);top:var(--table-by, 780px);transform:translate(-50%, -100%);filter:drop-shadow(0 16px 24px rgba(15,26,43,0.45));z-index:4;opacity:0;pointer-events:auto}
.room-table .room-label{display:none!important}
.room-table .room-card{top:18%;transform:none;width:min(380px,84%);padding:24px 26px}

/* Chặng Giặt giũ */
.room-laundry-sequence{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.laundry-shot{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:0;will-change:opacity}
.room.media-attached .laundry-shot-empty{background-image:url("assets/shots/05-laundry-empty-line.webp");opacity:1}
.room.media-attached .laundry-shot-door{background-image:url("assets/shots/05-laundry-door-open.webp")}
.room.media-attached .laundry-shot-family{background-image:url("assets/shots/05-laundry-family.webp")}
.laundry-item{position:absolute;left:0;top:0;width:var(--item-w, 120px);height:auto;transform:translate(-50%, -50%);pointer-events:none;z-index:4;filter:drop-shadow(0 12px 18px rgba(15,26,43,0.35));opacity:0;transition:opacity .15s ease}
.laundry-sunbeam{position:absolute;inset:0;background:radial-gradient(ellipse at 45% 40%,rgba(255,250,230,0.35) 0%,transparent 65%);pointer-events:none;z-index:3;opacity:0}
.laundry-bottle{display:block;height:var(--laundry-bh, 150px);width:auto;left:var(--laundry-bx, 76%);top:var(--laundry-by, 608px);transform:translate(-50%, -100%);filter:drop-shadow(0 14px 20px rgba(15,26,43,0.45));z-index:4;opacity:0;pointer-events:auto}
.room-laundry .room-label{display:none!important}
.room-laundry .room-card{top:auto;bottom:90px;left:6%;transform:none;width:min(370px,82%);padding:22px 24px}

/* Chặng Phòng tắm — Giọt nước lan sóng */
.room-bathroom-sequence{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.bathroom-shot{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat}
.room.media-attached .bathroom-shot-dirty{background-image:url("assets/shots/06-bathroom-dirty.jpg");opacity:1}
.room.media-attached .bathroom-shot-clean{background-image:url("assets/shots/06-bathroom-clean.jpg");opacity:var(--bath-clean-op, 0);clip-path:var(--bath-mask, none);will-change:clip-path,opacity}
.bathroom-ripple{position:absolute;border-radius:50%;border:2px solid rgba(255,255,255,0.85);box-shadow:0 0 16px rgba(180,225,255,0.7),inset 0 0 12px rgba(255,255,255,0.4);pointer-events:none;z-index:3;opacity:0;transform:translate(-50%, -50%) scale(1, 0.42)}
.bathroom-drop{position:absolute;width:12px;height:18px;background:radial-gradient(ellipse at 35% 30%,#ffffff 15%,rgba(195,230,255,0.9) 65%,rgba(130,195,245,0.7) 100%);border-radius:50% 50% 50% 50% / 60% 60% 40% 40%;box-shadow:0 0 10px rgba(255,255,255,0.85),0 4px 8px rgba(31,53,87,0.3);pointer-events:none;z-index:4;opacity:0;transform:translate(-50%, -50%)}
.bathroom-sparkle{position:absolute;width:20px;height:20px;pointer-events:none;z-index:5;background:radial-gradient(circle,#ffffff 25%,rgba(215,235,255,0.85) 60%,transparent 85%);border-radius:50%;box-shadow:0 0 14px #e0f2fe;opacity:0;transform:translate(-50%, -50%) scale(0);transition:transform .3s ease,opacity .3s ease}
.bathroom-bottle{display:block;height:var(--bath-bh, 220px);width:auto;left:var(--bath-bx, 58%);top:var(--bath-by, 786px);transform:translate(-50%, -100%);filter:drop-shadow(0 14px 22px rgba(15,26,43,0.42));z-index:4;opacity:0;pointer-events:auto}
.room-bathroom .room-label{display:none!important}
.room-bathroom .room-card{top:16%;left:6%;transform:none;width:min(370px,82%);padding:22px 24px}

@media(max-width:760px){
  .kitchen-shot-1{background-position:center center;transform-origin:26.8% 39.7%}
  .kitchen-shot-2{background-position:center center;transform-origin:50% 50%}
  .kitchen-shot-3{background-position:center center;transform-origin:50% 50%}
  .kitchen-intro{left:20px;right:20px;top:74px;max-width:none;font-size:18px;line-height:1.4}
  .room-kitchen-cutout{left:var(--sink-bx, 68%);top:var(--sink-by, 540px)}
  .room-kitchen .room-card,.room-table .room-card,.room-laundry .room-card,.room-bathroom .room-card{top:auto;bottom:74px;left:16px;right:16px;width:auto;max-width:none;transform:none;padding:18px 20px}
  .table-shot{background-position:68% center}
  .laundry-shot{background-position:78% center}
  .bathroom-shot{background-position:72% center}
}

/* Thẻ ảnh tạm thời đã bỏ: không còn dùng */
.room-bottle.is-card{display:none}

.room-card{
  position:absolute;left:6%;top:50%;transform:translateY(-50%);
  width:min(440px,88%);padding:32px 34px;border-radius:24px;
  background:rgba(255,255,255,0.42);
  backdrop-filter:blur(18px) saturate(1.2);
  -webkit-backdrop-filter:blur(18px) saturate(1.2);
  border:1px solid rgba(255,255,255,0.65);
  box-shadow:0 16px 40px -16px rgba(15,26,43,0.18);
  z-index:5;
}
.room-card h2{font:clamp(30px,3.4vw,46px)/1.1 var(--emi-serif);font-weight:400;margin:0 0 14px;color:var(--emi-navy)}
.room-card h2 em{color:var(--emi-sky-dark)}
.room-card p,.room-card li{font-size:14px;line-height:1.75;color:var(--emi-navy-soft)}
.room-card ul{margin:0 0 20px;padding-left:18px}
.room-card .room-cta{display:inline-block;padding:12px 24px;border-radius:999px;background:var(--emi-accent);color:var(--emi-cream);font-size:13px;font-weight:600;min-height:44px;line-height:20px;box-shadow:0 4px 14px rgba(31,53,87,0.18);transition:background .2s,transform .2s}
.room-card .room-cta:hover{background:var(--emi-accent-hover);color:var(--emi-cream);transform:translateY(-1px);box-shadow:0 6px 18px rgba(31,53,87,0.25)}

.journey-nav{position:absolute;left:6%;right:6%;top:auto;bottom:22px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;z-index:6}
.journey-nav button{border:1px solid rgba(31,53,87,0.22);background:rgba(255,255,255,0.85);border-radius:999px;padding:9px 16px;font-size:13px;color:var(--emi-navy);min-height:44px;display:inline-flex;align-items:center;justify-content:center;transition:all .2s ease}
.journey-nav button:hover{background:#ffffff;border-color:var(--emi-navy)}
.journey-nav button[aria-current="true"]{background:var(--emi-navy);color:#ffffff;border-color:var(--emi-navy);font-weight:600}
.journey-progress{position:absolute;left:0;top:0;height:3px;width:100%;background:var(--emi-accent);transform-origin:left;transform:scaleX(var(--progress,0));z-index:10}

@media(max-width:760px){
  .room-card{
  left:16px;right:16px;bottom:74px;top:auto;width:auto;max-width:none;transform:none;padding:18px 20px;border-radius:18px;
  background:rgba(255,255,255,0.52);
  backdrop-filter:blur(18px) saturate(1.2);
  -webkit-backdrop-filter:blur(18px) saturate(1.2);
  border:1px solid rgba(255,255,255,0.7);
  box-shadow:0 12px 28px -10px rgba(15,26,43,0.18);
  z-index:5;
}
  .room-card h2{font-size:22px;line-height:1.15;margin:0 0 8px}
  .room-card p,.room-card li{font-size:13px;line-height:1.5}
  .room-card ul{margin:0 0 12px;padding-left:16px}
  .room-card .room-cta{min-height:44px;padding:10px 20px;display:inline-flex;align-items:center}
  .room-bottle:not(.room-kitchen-cutout):not(.table-bottle):not(.laundry-bottle):not(.bathroom-bottle){left:auto;right:16px;top:70px;bottom:auto;height:min(26svh,190px);width:auto;transform:translateY(calc((1 - var(--clean,0)) * 15px));z-index:3}
  .room-label{top:60px;left:16px;right:auto;bottom:auto;font-size:clamp(44px,13vw,68px);opacity:0.45;z-index:2}
  .journey-nav{left:12px;right:12px;bottom:14px;overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;gap:8px}
  .journey-nav::-webkit-scrollbar{display:none}
  .journey-nav button{flex:none;min-height:44px;min-width:44px;padding:10px 18px;font-size:13px}
}
@media(prefers-reduced-motion:reduce){
  .rooms-journey{height:auto}
  .journey-sticky{position:relative;height:auto}
  .room{position:relative;height:100svh;min-height:600px;opacity:1;visibility:visible;--clean:1;transition:none}
  .room-microbes i{animation:none}
  .room-fg{transform:none!important}
  .journey-nav,.journey-progress{display:none}
}


/* Chặng 5: Cảnh kết & Dải sản phẩm bàn ăn gia đình */
.room-ending{background:#f7f4ee}
.room-ending-sequence{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.ending-shot{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:0;will-change:transform,opacity}
.room.media-attached .ending-shot-family{background-image:url(assets/shots/07-family-ending.webp);opacity:1;transform-origin:50% 50%}
.room.media-attached .ending-shot-table{background-image:url(assets/shots/08-family-table.webp);opacity:0;transform-origin:50% 50%}

/* Đáy cảnh kết: dải gradient kem mờ dần (18-25vh) nối mềm sang #why */
.room-ending::after{
  content:'';
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:clamp(140px, 22vh, 220px);
  background:linear-gradient(to bottom, rgba(247,241,230,0) 0%, rgba(247,241,230,0.35) 35%, rgba(247,241,230,0.85) 75%, var(--emi-cream) 100%);
  pointer-events:none;
  z-index:3;
}

/* Bụi sáng lơ lửng cho cảnh kết */
.ending-sparkles{position:absolute;inset:0;pointer-events:none;z-index:2}
.ending-sparkle{position:absolute;border-radius:50%;background:radial-gradient(circle,#ffffff 20%,rgba(156,195,228,0.7) 60%,transparent 85%);box-shadow:0 0 12px rgba(156,195,228,0.8);opacity:0;transition:opacity .4s ease}

/* Khối chữ cảnh kết (Bên trái vùng trống, không đè lên mặt người) */
.ending-copy{
  position:absolute;
  left:6%;
  top:22%;
  width:min(500px,88%);
  padding:30px 32px 32px;
  border-radius:24px;
  /* left of the family shot is a bright blurred wall: dark text on a cream glass card reads, white did not */
  background:rgba(255,253,248,0.62);
  border:1px solid rgba(255,255,255,0.7);
  box-shadow:0 18px 50px -18px rgba(15,26,43,0.35);
  backdrop-filter:blur(18px) saturate(1.15);
  -webkit-backdrop-filter:blur(18px) saturate(1.15);
  z-index:4;
  pointer-events:auto;
  opacity:0;
  will-change:opacity,transform;
}
.ending-kicker{
  display:block;
  font-size:12px;
  font-weight:700;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--emi-sky-dark);
  margin-bottom:12px;
}
.ending-title{
  font:clamp(36px,4.2vw,56px)/1.15 var(--emi-serif);
  font-weight:400;
  color:var(--emi-navy);
  margin:0 0 16px;
}
.ending-title em{
  color:#4a78a8;
  font-style:italic;
  display:block;
}
.ending-lead{
  font-size:clamp(14px,1.2vw,16px);
  line-height:1.75;
  color:#33445e;
  margin:0 0 24px;
}
.ending-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:14px 28px;
  border-radius:999px;
  background:var(--emi-accent);
  color:var(--emi-cream);
  font-size:14px;
  font-weight:700;
  text-decoration:none;
  box-shadow:0 6px 20px rgba(31,53,87,0.22);
  transition:all .2s ease;
  min-height:46px;
}
.ending-cta:hover{
  background:var(--emi-accent-hover);
  color:var(--emi-cream);
  transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(31,53,87,0.3);
}

/* Sân khấu 6 chai bàn ăn gia đình */
.family-table-stage{
  position:absolute;
  inset:0;
  z-index:4;
  pointer-events:none;
  opacity:0;
  will-change:opacity;
}
.table-header{
  position:absolute;
  left:0;
  right:0;
  top:8%;
  text-align:center;
  pointer-events:none;
  z-index:5;
  padding:0 20px;
}
.table-title{
  font:clamp(28px,3.2vw,44px)/1.2 var(--emi-serif);
  color:var(--emi-navy);
  margin:0 0 6px;
  text-shadow:0 1px 8px rgba(255,255,255,0.9);
}
.table-subtitle{
  font-size:clamp(13px,1.1vw,15px);
  color:var(--emi-navy-soft);
  margin:0;
  text-shadow:0 1px 8px rgba(255,255,255,0.9);
}

/* 6 chai tương tác trên mặt bàn */
.table-product-bottle{
  position:absolute;
  display:flex;
  flex-direction:column;
  align-items:center;
  transform:translate(-50%, -100%);
  pointer-events:auto;
  text-decoration:none;
  color:inherit;
  cursor:pointer;
  outline:none;
  will-change:transform,opacity;
}
.table-product-bottle:focus-visible{
  outline:2px solid var(--emi-focus);
  outline-offset:4px;
  border-radius:14px;
}
.table-bottle-img{
  display:block;
  height:var(--bottle-h, 240px);
  width:auto;
  filter:drop-shadow(0 16px 20px rgba(15,26,43,0.36)) drop-shadow(0 2px 4px rgba(0,0,0,0.18));
  transition:transform .25s cubic-bezier(0.175,0.885,0.32,1.275);
}
.table-bottle-shadow{
  width:70%;
  height:12px;
  background:radial-gradient(ellipse at 50% 50%, rgba(15,26,43,0.45) 0%, rgba(15,26,43,0.15) 50%, transparent 80%);
  border-radius:50%;
  margin-top:-6px;
  transform:scale(1);
  transition:transform .25s ease, opacity .25s ease;
}

/* Tooltip nhãn giá phía trên chai khi hover / focus */
.table-bottle-tooltip{
  position:absolute;
  bottom:calc(100% + 14px);
  left:50%;
  transform:translateX(-50%) translateY(8px);
  background:rgba(255,255,255,0.95);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  padding:10px 14px;
  border-radius:14px;
  border:1px solid rgba(223,183,70,0.5);
  box-shadow:0 12px 30px rgba(15,26,43,0.22);
  white-space:nowrap;
  text-align:center;
  opacity:0;
  pointer-events:none;
  transition:all .22s cubic-bezier(0.16, 1, 0.3, 1);
  z-index:10;
}
.table-bottle-tooltip::after{
  content:'';
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%);
  border-width:6px 6px 0 6px;
  border-style:solid;
  border-color:rgba(255,255,255,0.95) transparent transparent transparent;
}

/* Lượt 18: Các video chuyển cảnh tua theo cuộn (B3, B4, B5, B7) & Lớp sáng ấm B6 */
.room-transition-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  pointer-events:none;
  opacity:0;
  z-index:3;
  will-change:opacity,transform;
}
@media(max-width:760px){
  .room-transition-video{
    object-position:center;
  }
}
body.paused .room-transition-video{
  display:none!important;
}
@media(prefers-reduced-motion:reduce){
  .room-transition-video{
    display:none!important;
  }
}

/* B6: Lớp sáng ấm trắng-kem dâng lên mở cảnh gia đình */
.bathroom-warm-bloom,.kitchen-warm-bloom{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:5;
  opacity:0;
  background:radial-gradient(ellipse 70% 60% at 50% 50%, rgba(255, 248, 235, 0.95) 0%, rgba(247, 241, 230, 0.75) 50%, rgba(244, 223, 226, 0.3) 100%);
  mix-blend-mode:screen;
  transition:none;
}
body.paused .bathroom-warm-bloom,body.paused .kitchen-warm-bloom{
  display:none!important;
}
@media(prefers-reduced-motion:reduce){
  .bathroom-warm-bloom,.kitchen-warm-bloom{
    display:none!important;
  }
}
.tooltip-name{
  font-size:12px;
  font-weight:700;
  color:var(--emi-navy);
  margin-bottom:2px;
}
.tooltip-price{
  font-size:12px;
  font-weight:700;
  color:var(--emi-sky-dark);
  margin-bottom:6px;
}
.tooltip-link{
  display:inline-block;
  font-size:11px;
  font-weight:600;
  color:var(--emi-sky-dark, #1c6f96);
  text-decoration:underline;
  pointer-events:auto;
}

/* Hover / Focus state */
.table-product-bottle:hover .table-bottle-img,
.table-product-bottle:focus-visible .table-bottle-img{
  transform:translateY(-10px) scale(1.02);
}
.table-product-bottle:hover .table-bottle-shadow,
.table-product-bottle:focus-visible .table-bottle-shadow{
  transform:scale(0.85);
  opacity:0.6;
}
.table-product-bottle:hover .table-bottle-tooltip,
.table-product-bottle:focus-visible .table-bottle-tooltip,
.table-product-bottle.is-hovered .table-bottle-tooltip{
  opacity:1;
  transform:translateX(-50%) translateY(0);
  pointer-events:auto;
}

@media(max-width:760px){
  .ending-copy{
    left:16px;
    right:16px;
    top:auto;
    bottom:76px;
    width:auto;
    padding:20px;
    border-radius:18px;
    background:rgba(255,253,248,0.8);
  }
  .ending-kicker{font-size:11px;margin-bottom:6px}
  .ending-title{font-size:24px;margin:0 0 8px}
  .ending-lead{font-size:13px;line-height:1.5;margin:0 0 16px}
  .ending-cta{padding:10px 20px;font-size:13px;min-height:44px}
  
  /* Mobile: 6 chai xếp hàng ngang cuộn snap trên nền bàn */
  .family-table-stage{
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    padding-bottom:70px;
    --table-pad-x:16px;
    --table-gap:12px;
  }
  .table-header{
    top:65px;
    padding:0 16px;
  }
  .table-title{font-size:20px}
  .table-subtitle{font-size:13px}
  
  .table-bottles-row{
    position:absolute;
    left:0;
    right:0;
    bottom:82px;
    display:flex;
    gap:var(--table-gap, 12px);
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    padding:16px var(--table-pad-x, 16px) 18px;
    padding-right:calc(var(--table-pad-x, 16px) + 48px);
    scroll-padding-left:var(--table-pad-x, 16px);
    scroll-padding-right:calc(var(--table-pad-x, 16px) + 48px);
    scrollbar-width:none;
    pointer-events:auto;
    -webkit-mask-image:linear-gradient(to right, #000 0%, #000 calc(100% - 44px), transparent 100%);
    mask-image:linear-gradient(to right, #000 0%, #000 calc(100% - 44px), transparent 100%);
  }
  .table-bottles-row::-webkit-scrollbar{display:none}
  
  .table-product-bottle{
    position:relative;
    left:auto!important;
    top:auto!important;
    transform:none!important;
    flex:0 0 calc((100vw - var(--table-pad-x, 16px) - 2 * var(--table-gap, 12px)) / 2.45);
    min-width:128px;
    scroll-snap-align:start;
    scroll-snap-stop:normal;
    background:rgba(255,255,255,0.88);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,0.75);
    border-radius:14px;
    padding:12px 8px 10px;
    box-shadow:0 8px 24px rgba(15,26,43,0.12);
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    align-items:center;
    text-align:center;
  }
  .table-bottle-img{
    height:120px!important;
    margin-bottom:4px;
  }
  .table-bottle-shadow{display:none}
  
  .table-bottle-tooltip{
    position:static;
    transform:none!important;
    opacity:1!important;
    background:transparent;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    border:none;
    box-shadow:none;
    padding:0;
    pointer-events:auto;
    white-space:normal;
    width:100%;
    margin-bottom:6px;
  }
  .table-bottle-tooltip::after{display:none}
  .tooltip-name{
    font-size:13px;
    line-height:1.35;
    font-weight:700;
    color:var(--emi-navy);
    white-space:normal;
    margin-bottom:4px;
    min-height:35px;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .tooltip-price{
    font-size:13px;
    font-weight:700;
    color:var(--emi-sky-dark);
    margin-bottom:6px;
    white-space:nowrap;
  }
  .tooltip-link{
    display:inline-block;
    font-size:13px;
    font-weight:600;
    color:var(--emi-sky-dark, #1c6f96);
    text-decoration:underline;
    text-underline-offset:2px;
    white-space:nowrap;
  }
}

/* Hide journey nav when looking at products table on mobile so it never overlaps cards */
@media(max-width:760px){
  .room-ending.active ~ .journey-nav{
    opacity:0.25;
    pointer-events:none;
    transform:translateY(8px);
    transition:opacity .3s ease, transform .3s ease;
  }
}

/* Chặng 2 Overview — Multi-shot & Chuyển động sống động */
.kitchen-shot-1{background-image:url("assets/shots/01-kitchen-overview.webp");opacity:1;transform-origin:26.8% 39.7%}
.room.kitchen-shots-loaded .kitchen-shot-2{background-image:url("assets/shots/02-sink-wide.jpg");transform-origin:50% 50%}
.room.kitchen-shots-loaded .kitchen-shot-3{background-image:url("assets/shots/03-sink-closeup.webp");transform-origin:50% 50%}

/* Video lặp cho Overview bếp (khớp nền Ken Burns) */
.kitchen-overview-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  pointer-events:none;
}
@media(max-width:760px){
  .kitchen-overview-video{
    object-position:center center;
  }
}
body.paused .kitchen-overview-video{
  display:none!important;
}
@media(prefers-reduced-motion:reduce){
  .kitchen-overview-video{
    display:none!important;
  }
}

/* Video lặp cho Sink Closeup */
.kitchen-sink-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  pointer-events:none;
}
body.paused .kitchen-sink-video{
  display:none!important;
}
@media(prefers-reduced-motion:reduce){
  .kitchen-sink-video{
    display:none!important;
  }
}

/* Video lặp cho Bàn ăn sạch (crossfade sau khi khăn lau xong) */
.table-clean-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  pointer-events:none;
  opacity:0;
  transition:opacity .4s ease;
  z-index:2;
}
body.paused .table-clean-video{
  display:none!important;
}
@media(prefers-reduced-motion:reduce){
  .table-clean-video{
    display:none!important;
  }
}

/* Video lặp cho Khu giặt (crossfade sau khi quần áo đáp dây) */
.laundry-family-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  pointer-events:none;
  opacity:0;
  transition:opacity .6s ease;
  z-index:2;
}
@media(max-width:760px){
  .laundry-family-video{
    object-position:78% center;
  }
}
body.paused .laundry-family-video{
  display:none!important;
}
@media(prefers-reduced-motion:reduce){
  .laundry-family-video{
    display:none!important;
  }
}

/* Video lặp cho Phòng tắm sạch (crossfade sau khi sóng lan xong) */
.bathroom-clean-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  pointer-events:none;
  opacity:0;
  transition:opacity .4s ease;
  z-index:2;
}
@media(max-width:760px){
  .bathroom-clean-video{
    object-position:72% center;
  }
}
body.paused .bathroom-clean-video{
  display:none!important;
}
@media(prefers-reduced-motion:reduce){
  .bathroom-clean-video{
    display:none!important;
  }
}

/* Video lặp cho Cảnh kết gia đình (dual video crossfade mượt) + bàn 6 chai */
.family-ending-video,.family-table-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  pointer-events:none;
  transition:opacity .5s ease;
}
body.paused .family-ending-video,body.paused .family-table-video{
  display:none!important;
}
@media(prefers-reduced-motion:reduce){
  .family-ending-video,.family-table-video{
    display:none!important;
  }
}

/* Chai nước rửa chén đứng trên mặt đá ở shot 2 (sink-wide) */
.sink-wide-bottle{
  position:absolute;
  pointer-events:none;
  z-index:5;
  width:0;
  height:0;
  opacity:0;
}
.sink-wide-bottle img{
  display:block;
  height:var(--sink-wide-bh, 120px);
  width:auto;
  transform:translate(-50%, -100%);
  filter:drop-shadow(0 14px 20px rgba(15,26,43,0.45));
}

/* Bụi sáng lơ lửng trong vệt nắng */
.kitchen-sun-dusts{position:absolute;inset:0;pointer-events:none;z-index:3;opacity:0}
.ks-dust{
  position:absolute;border-radius:50%;background:#ffffff;
  width:var(--dsize, 4px);height:var(--dsize, 4px);
  box-shadow:0 0 10px 2px rgba(255,235,160,0.8);
  animation:ksDustFloat var(--ddur, 5s) ease-in-out infinite alternate;
  animation-delay:var(--ddelay, 0s);
}
@keyframes ksDustFloat{
  to{transform:translate(var(--dx, 10px), var(--dy, -20px)) scale(1.3);opacity:0.35}
}
body.paused .ks-dust{animation-play-state:paused}

/* Overview Stage: Tiêu đề và 4 góc sản phẩm */
.kitchen-overview-stage{
  position:absolute;inset:0;z-index:4;pointer-events:none;
  opacity:0;transition:opacity .3s ease;
}
.kitchen-overview-title{
  position:absolute;left:5%;top:11%;
  font-size:clamp(14px, 1.35vw, 18px);
  font-family:var(--emi-serif);font-style:italic;
  color:var(--emi-navy);
  background:rgba(255,255,255,0.72);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  padding:8px 18px;border-radius:24px;
  border:1px solid rgba(255,255,255,0.85);
  box-shadow:0 8px 24px -6px rgba(15,26,43,0.12);
  margin:0;pointer-events:none;
}

/* Lớp neo cố định tại đáy chai: left & top là tâm đáy chai */
.kitchen-corner-spot{
  position:absolute;
  pointer-events:auto;
  cursor:pointer;
  outline:none;
  z-index:6;
  width:0;
  height:0;
  overflow:visible;
}

/* Lớp con nhận hiệu ứng xuất hiện / hover (không ảnh hưởng left/top neo) */
.spot-animator{
  position:absolute;
  left:0;
  bottom:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  transform:translate(-50%, 0);
  transition:transform .25s ease, opacity .25s ease;
}

.kitchen-corner-spot:hover .spot-animator,
.kitchen-corner-spot:focus-visible .spot-animator{
  transform:translate(-50%, -6px)!important;
}

.corner-bottle-wrap{
  display:block;
  line-height:0;
}
.corner-bottle-wrap img{
  display:block;
  height:var(--spot-bh, 100px);
  width:auto;
  filter:drop-shadow(0 14px 18px rgba(15,26,43,0.42)) drop-shadow(0 2px 4px rgba(0,0,0,0.20));
  transition:transform .25s ease;
}
.kitchen-corner-spot:hover .corner-bottle-wrap img{
  transform:scale(1.05);
}

/* Tooltip nhãn + chấm kim nằm phía trên chai */
.corner-tooltip-box{
  display:flex;
  flex-direction:column;
  align-items:center;
  margin-bottom:6px;
  pointer-events:auto;
}

/* Chấm kim và vệt nối */
.corner-pin{
  display:flex;
  flex-direction:column;
  align-items:center;
}
.pin-line{width:1px;height:10px;background:rgba(74,117,165,0.7);display:block}
.pin-dot{
  width:7px;height:7px;border-radius:50%;background:var(--emi-sky-dark);
  box-shadow:0 0 10px rgba(156,195,228,0.8);display:block;
}

/* Nhãn kính mờ: chữ >= 13px */
.corner-label{
  background:rgba(255,255,255,0.78);
  backdrop-filter:blur(16px) saturate(1.2);
  -webkit-backdrop-filter:blur(16px) saturate(1.2);
  border:1px solid rgba(255,255,255,0.9);
  border-radius:14px;
  padding:7px 14px;
  box-shadow:0 8px 24px -4px rgba(15,26,43,0.18);
  display:flex;
  align-items:center;
  gap:6px;
  white-space:nowrap;
  transition:all .2s ease;
  font-size:13px;
}
.kitchen-corner-spot:hover .corner-label{
  background:rgba(255,255,255,0.95);
  border-color:var(--emi-sky-dark);
  box-shadow:0 10px 28px -4px rgba(15,26,43,0.25);
}
.corner-tag{
  font-size:13px;
  font-weight:700;
  color:var(--emi-navy);
}
.corner-tag::after{content:'·';margin-left:6px;opacity:0.6}
.corner-desc{
  font-size:13px;
  color:var(--emi-navy-soft);
  font-weight:500;
}

/* Đối với Nước giặt ở góc phải: đặt nhãn lệch sang TRÁI chai để không bị tràn khung */
.spot-label-left .corner-tooltip-box{
  position:absolute;
  right:calc(100% + 8px);
  bottom:20%;
  flex-direction:row;
  align-items:center;
  margin-bottom:0;
}
.spot-label-left .corner-pin{
  flex-direction:row;
}
.spot-label-left .pin-line{width:14px;height:1px}
.spot-label-left .pin-dot{order:2}
/* table label sits beside the bottle's shoulder, in the empty wall area, not over the fruit bowl */
.spot-table.spot-label-left .corner-tooltip-box{bottom:auto;top:6%}

@media(max-width:760px){
  .kitchen-overview-title{left:16px;top:74px;font-size:13px;padding:6px 14px}
  .corner-bottle-wrap img{height:var(--spot-bh, 54px)!important}
  .pin-line{height:6px}
  .pin-dot{width:6px;height:6px}
  .corner-label{
    padding:4px 8px;font-size:11px;
    border-radius:8px;gap:4px;
  }
  .corner-tag{font-size:11px}
  .corner-desc{font-size:11px}
  
  .spot-label-left .corner-tooltip-box{
    position:static;
    flex-direction:column;
    margin-bottom:4px;
  }
  .spot-label-left .corner-pin{
    flex-direction:column;
  }
  .spot-label-left .pin-line{width:1px;height:6px}
}

/* Điểm hút cuộn tại các mốc "phanh" của hành trình */
/* markers only: the smooth scroller in home.js settles on them (CSS snap fought the wheel) */
.journey-snap{position:absolute;left:0;width:1px;height:1px;pointer-events:none}

/* ---- Vì sao vi sinh EM: chữ trái, mặt bàn sạch dần theo cuộn bên phải (VISUAL_DIRECTION §8) ---- */
.em-why{
  position:relative;
  padding:120px 6% 100px;
}
/* Dải nối mềm đầu #why với sắc trời và anh đào nhạt */
.em-why::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:clamp(120px, 18vh, 180px);
  background:radial-gradient(ellipse 70% 100% at 50% 0%, rgba(207,226,239,0.35) 0%, rgba(242,198,207,0.18) 45%, transparent 100%);
  pointer-events:none;
  z-index:1;
}
.em-why-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:72px;align-items:center}
.em-why-list{list-style:none;margin:32px 0 0;padding:0}
.em-why-list li{display:grid;grid-template-columns:48px 1fr;gap:16px;padding:18px 0;border-top:1px solid var(--emi-border);opacity:.38;transition:opacity .5s cubic-bezier(.2,.7,.2,1)}
.em-why-list li.is-lit{opacity:1}
.em-why-num{font:20px/1.3 var(--emi-serif);color:#9a7618;font-variant-numeric:tabular-nums}
.em-why-list h3{font:22px/1.3 var(--emi-serif);font-weight:400;color:var(--emi-navy);margin:0 0 6px}
.em-why-list p{font-size:15px;line-height:1.7;color:var(--emi-navy-soft);margin:0}
.em-why-visual{position:relative;margin:0;aspect-ratio:4/5;border-radius:24px;overflow:hidden;box-shadow:0 30px 70px -30px rgba(31,53,87,.45)}
.em-why-surface{position:absolute;inset:0;background-size:auto 260%;background-position:50% 86%;background-repeat:no-repeat}
.em-why.media-attached .em-why-dirty{background-image:url(assets/shots/04-table-dirty.jpg)}
.em-why.media-attached .em-why-clean{background-image:url(assets/shots/04-table-clean.webp);clip-path:inset(0 calc(100% - var(--why-p,0)*100%) 0 0)}
.em-why-edge{position:absolute;top:0;bottom:0;left:calc(var(--why-p,0)*100%);width:2px;background:linear-gradient(transparent,rgba(255,248,225,.95) 30%,rgba(255,248,225,.95) 70%,transparent);box-shadow:0 0 18px 6px rgba(255,236,190,.55);opacity:calc(1 - var(--why-done,0));pointer-events:none}
.em-why-chip{position:absolute;left:24px;bottom:24px;right:24px;max-width:320px;padding:14px 18px;border-radius:14px;font-size:14px;line-height:1.5;color:var(--emi-navy);background:rgba(255,253,248,.7);border:1px solid rgba(255,255,255,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 12px 30px -14px rgba(31,53,87,.35);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}

/* ---- Hướng dẫn pha dùng: thẻ chọn việc, cốc đong, chai vệ tinh chồng mép ---- */
.em-dose{padding:40px 6% 120px}
.em-dose-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:72px;align-items:center}
.em-dose-card{position:relative;padding:32px 120px 32px 32px;border-radius:24px;background:rgba(255,253,248,.75);border:1px solid rgba(255,255,255,.8);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 30px 60px -30px rgba(31,53,87,.35)}
.em-dose-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.em-dose-chips button{font:500 14px/1 'Be Vietnam Pro',Arial,sans-serif;color:var(--emi-navy);background:transparent;border:1px solid var(--emi-border-strong);border-radius:999px;padding:10px 16px;min-height:40px;cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .15s}
.em-dose-chips button:hover{border-color:var(--emi-navy)}
.em-dose-chips button:active{transform:scale(.98)}
.em-dose-chips button[aria-pressed="true"]{background:var(--emi-navy);border-color:var(--emi-navy);color:#fdfbf7}
.em-dose-chips button:focus-visible{outline:2px solid var(--emi-focus);outline-offset:2px}
.em-dose-body{display:grid;grid-template-columns:120px 1fr;gap:28px;align-items:center}
.em-dose-cup{width:120px;height:150px;overflow:visible}
.em-dose-glass{fill:rgba(156,195,228,.12);stroke:rgba(31,53,87,.35);stroke-width:2}
.em-dose-liquid{fill:#9cc3e4;transform-origin:50% 100%;transform:scaleY(var(--fill,.3));transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.em-dose-ticks line{stroke:rgba(31,53,87,.4);stroke-width:2}
.em-dose-amount{display:block;font:clamp(40px,4vw,56px)/1 var(--emi-serif);color:var(--emi-navy);font-variant-numeric:tabular-nums}
.em-dose-with{display:block;margin-top:8px;font-size:16px;color:#4a78a8}
.em-dose-note{margin:14px 0 18px;font-size:15px;line-height:1.65;color:var(--emi-navy-soft);max-width:38ch}
.em-dose-link{font-size:14px;font-weight:600;color:var(--emi-navy);text-decoration:none;border-bottom:1px solid var(--emi-sky-dark)}
.em-dose-read>*{transition:opacity .25s ease,transform .25s ease}
.em-dose-read.is-swapping>*{opacity:0;transform:translateY(6px)}
.em-dose-bottle{position:absolute;right:-44px;bottom:-28px;height:118%;width:auto;filter:drop-shadow(0 22px 26px rgba(31,53,87,.35));transition:opacity .3s ease}
@media(max-width:900px){
  .em-why,.em-dose{padding:72px 16px}
  .em-why-grid,.em-dose-grid{grid-template-columns:1fr;gap:36px}
  .em-why-visual{aspect-ratio:4/3}
  .em-dose-card{padding:24px 24px 200px}
  .em-dose-bottle{right:16px;bottom:-20px;height:220px}
  .em-dose-body{grid-template-columns:90px 1fr;gap:18px}
  .em-dose-cup{width:90px;height:112px}
}
@media(max-width:760px){
  .em-dose{padding:48px 20px 64px}
  .em-dose-grid{gap:24px}
  .em-dose-card{
    position:relative;
    padding:20px 20px 18px 20px;
    border-radius:24px;
    background:rgba(255,253,248,.8);
    border:1px solid rgba(255,255,255,.85);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 20px 45px -20px rgba(31,53,87,.22);
    overflow:hidden;
  }
  .em-dose-chips{
    display:flex;
    flex-wrap:nowrap;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    gap:8px;
    margin-bottom:20px;
    padding:2px 2px 6px 2px;
    mask-image:linear-gradient(to right,#000 calc(100% - 36px),transparent 100%);
    -webkit-mask-image:linear-gradient(to right,#000 calc(100% - 36px),transparent 100%);
  }
  .em-dose-chips::-webkit-scrollbar{display:none}
  .em-dose-chips button{
    flex:0 0 auto;
    scroll-snap-align:start;
    white-space:nowrap;
    min-height:44px;
    padding:10px 16px;
    font-size:13.5px;
    line-height:1;
    font-weight:500;
    border-radius:999px;
    background:rgba(255,255,255,0.72);
    border:1px solid var(--emi-border-strong);
    color:var(--emi-navy);
    cursor:pointer;
    transition:background .18s ease,color .18s ease,border-color .18s ease;
  }
  .em-dose-chips button:hover{border-color:var(--emi-navy)}
  .em-dose-chips button[aria-pressed="true"]{
    background:var(--emi-navy);
    border-color:var(--emi-navy);
    color:var(--emi-cream);
    box-shadow:0 4px 14px rgba(31,53,87,0.18);
  }
  .em-dose-body{
    display:grid;
    grid-template-columns:56px 1fr;
    grid-template-rows:auto auto auto minmax(92px,auto);
    column-gap:16px;
    row-gap:0;
    align-items:center;
  }
  .em-dose-cup{
    grid-column:1;
    grid-row:1 / 3;
    width:56px;
    height:70px;
    align-self:center;
    justify-self:center;
  }
  .em-dose-read{display:contents}
  .em-dose-amount{
    grid-column:2;
    grid-row:1;
    font-size:34px;
    line-height:1.05;
    color:var(--emi-navy);
    align-self:end;
  }
  .em-dose-with{
    grid-column:2;
    grid-row:2;
    font-size:14px;
    line-height:1.35;
    color:#4a78a8;
    margin-top:3px;
    align-self:start;
  }
  .em-dose-note{
    grid-column:1 / -1;
    grid-row:3;
    margin:14px 0 0;
    font-size:13.5px;
    line-height:1.55;
    color:var(--emi-navy-soft);
    max-width:none;
    padding-top:12px;
    padding-right:56px;
    border-top:1px solid var(--emi-border-subtle);
  }
  .em-dose-link{
    grid-column:1 / -1;
    grid-row:4;
    display:inline-flex;
    align-items:center;
    min-height:44px;
    font-size:14px;
    font-weight:600;
    color:var(--emi-navy);
    text-decoration:none;
    border-bottom:1px solid var(--emi-sky-dark);
    align-self:end;
    justify-self:start;
    margin-top:10px;
    margin-bottom:2px;
  }
  .em-dose-bottle{
    position:absolute;
    right:20px;
    bottom:16px;
    height:84px;
    max-height:88px;
    width:auto;
    object-fit:contain;
    filter:drop-shadow(0 8px 12px rgba(31,53,87,.22));
    transition:opacity .18s ease,transform .18s ease;
    pointer-events:none;
  }
  .em-dose-read>*{transition:opacity .18s ease,transform .18s ease}
  .em-dose-read.is-swapping>*{opacity:0;transform:translateY(4px)}
}
@media(prefers-reduced-motion:reduce){.em-why-list li{opacity:1}.em-why-edge{display:none}.em-dose-read>*, .em-dose-bottle{transition:none!important}}

/* ---- Dòng sông: ảnh tràn khung, thẻ kính trái, giọt sáng từ miệng cống xuống sông theo cuộn ---- */
.em-river{position:relative;min-height:100svh;display:flex;align-items:center;padding:96px 6%;overflow:hidden;background:var(--emi-cream)}
.em-river-scene{position:absolute;inset:0}
.em-river-bg{position:absolute;inset:0;background:url(assets/shots/09-river.webp) center/cover no-repeat}
.em-river-scene::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(247,241,230,.55) 0%,rgba(247,241,230,.15) 45%,transparent 65%);pointer-events:none}
.em-river-card{position:relative;z-index:2;max-width:480px;padding:32px;border-radius:24px;background:rgba(255,253,248,.62);border:1px solid rgba(255,255,255,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 24px 60px -24px rgba(31,53,87,.35);backdrop-filter:blur(18px) saturate(1.1);-webkit-backdrop-filter:blur(18px) saturate(1.1)}
.em-river-card .home-title{margin-top:8px}
.em-river-drop{position:absolute;left:var(--drop-x,80%);top:var(--drop-y,70%);width:12px;height:16px;margin:-8px 0 0 -6px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:radial-gradient(circle at 40% 35%,#fff 0%,#e8f6ff 35%,rgba(156,195,228,.9) 100%);box-shadow:0 0 16px 6px rgba(255,248,225,.75);opacity:var(--drop-op,0);pointer-events:none}
.em-river-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
@media(max-width:760px){.em-river-video{object-position:78% center}}
.em-river-ring{position:absolute;left:var(--ring-x,80%);top:var(--ring-y,84%);width:120px;height:36px;margin:-18px 0 0 -60px;border-radius:50%;border:2px solid rgba(255,252,240,.85);box-shadow:0 0 12px rgba(255,248,225,.6);transform:scale(var(--ring-s,0));opacity:var(--ring-op,0);pointer-events:none}
.em-river-ring-2{transform:scale(calc(var(--ring-s,0)*.6));opacity:calc(var(--ring-op,0)*.8)}
@media(max-width:760px){
  .em-river{align-items:flex-end;padding:72px 16px 40px;min-height:90svh}
  .em-river-bg{background-position:78% center}
  .em-river-card{padding:24px}
}
@media(prefers-reduced-motion:reduce){.em-river-drop,.em-river-ring{display:none}}

/* Mobile crop = the alignX home.js uses to place bottles, so shot, loop video and incoming transition share one frame */
@media(max-width:760px){
  .kitchen-shot-2,.kitchen-shot-3{background-position:78% center}
  .kitchen-sink-video,.room-transition-video.b2-scrub-video{object-position:78% center}
  .table-clean-video,.room-transition-video.b3-scrub-video{object-position:68% center}
  .room-transition-video.b4-scrub-video{object-position:78% center}
  .room-transition-video.b5-scrub-video{object-position:72% center}
  .room-table .room-card{top:76px;bottom:auto}
}

/* ==========================================================================
   Responsive Scaling for Full HD (1920), 2K (2560), and 4K (3840)
   ========================================================================== */

/* --- Breakpoint: Full HD (1441px - 1920px) --- */
@media(min-width:1441px) and (max-width:1920px){
  .hd-navigation{max-width:1600px;padding:24px 48px}
  .site-header.is-scrolled .hd-navigation{padding:16px 48px}
  .home-inner{max-width:1520px;padding:0 40px}
  
  .room-kitchen .room-card,.room-table .room-card,.room-laundry .room-card,.room-bathroom .room-card{
    width:min(440px, 35vw);padding:28px 32px
  }
  .room-card h2,.room-kitchen .room-card h2{font-size:32px}
  .room-card p,.room-card li,.room-kitchen .room-card p,.room-kitchen .room-card li{font-size:14.5px}
  .journey-nav button{font-size:14px;padding:12px 24px}
  
  .em-why-grid{gap:80px}
  .home-title{font-size:clamp(38px,4vw,56px)}
  .home-lead{font-size:17px}
  .em-why-list h3{font-size:24px}
  .em-why-list p{font-size:16px}
  
  .em-dose-grid{gap:80px}
  .em-dose-amount{font-size:58px}
  .em-dose-with{font-size:18px}
  .em-dose-note{font-size:16px}
  
  .em-river-card{max-width:560px;padding:38px}
  
  .faq-layout{gap:70px}
  .faq-list summary{font-size:16.5px}
  .faq-list p{font-size:15.5px}
  
  .contact-top .home-title{font-size:46px}
}

/* --- Breakpoint: 2K / QHD (1921px - 2560px) --- */
@media(min-width:1921px) and (max-width:2560px){
  .hd-navigation{max-width:2080px;padding:28px 64px}
  .site-header.is-scrolled .hd-navigation{padding:18px 64px}
  .hd-logo{font-size:26px}
  .hd-nav-links{gap:48px}
  .hd-nav-links a{font-size:17px}
  .hd-nav-action{font-size:15px;padding:13px 26px}
  
  .home-inner{max-width:1920px;padding:0 60px}
  
  .room-kitchen .room-card,.room-table .room-card,.room-laundry .room-card,.room-bathroom .room-card{
    width:min(540px, 32vw);padding:36px 42px;border-radius:28px
  }
  .room-card h2,.room-kitchen .room-card h2{font-size:40px;margin-bottom:14px}
  .room-card p,.room-card li,.room-kitchen .room-card p,.room-kitchen .room-card li{font-size:17px;line-height:1.75}
  .room-card ul,.room-kitchen .room-card ul{margin:0 0 20px;padding-left:20px}
  .room-card .room-cta,.room-kitchen .room-card .room-cta{font-size:15px;padding:14px 28px;min-height:48px}
  .journey-nav button{font-size:16px;padding:14px 28px}
  .kitchen-intro{font-size:38px;max-width:650px}
  .table-title{font-size:46px}
  .table-subtitle{font-size:18px}
  
  .em-why{padding:140px 6% 120px}
  .em-why-grid{gap:110px}
  .home-kicker{font-size:16px;letter-spacing:2.5px}
  .home-title{font-size:clamp(48px,4vw,72px);line-height:1.1}
  .home-lead{font-size:20px;line-height:1.75;margin-bottom:28px}
  .em-why-list li{padding:24px 0;gap:20px}
  .em-why-num{font-size:26px}
  .em-why-list h3{font-size:28px}
  .em-why-list p{font-size:18px}
  .em-why-chip{font-size:17px;padding:18px 24px;max-width:440px;border-radius:18px}
  
  .em-dose{padding:60px 6% 140px}
  .em-dose-grid{gap:110px}
  .em-dose-card{padding:44px 150px 44px 44px;border-radius:28px}
  .em-dose-chips button{font-size:16px;padding:12px 22px;min-height:48px}
  .em-dose-cup{width:150px;height:185px}
  .em-dose-amount{font-size:68px}
  .em-dose-with{font-size:20px}
  .em-dose-note{font-size:18px}
  .em-dose-link{font-size:16px}
  
  .em-river{padding:120px 6%}
  .em-river-card{max-width:660px;padding:48px;border-radius:28px}
  .em-river-card .home-title{font-size:52px}
  .em-river-card .home-lead{font-size:19px}
  .em-river-card .home-link{font-size:17px}
  
  .home-faq{padding:80px 6% 90px}
  .faq-layout{gap:90px}
  .home-faq .home-title{font-size:48px}
  .faq-list summary{font-size:18px;padding:24px 8px}
  .faq-list p{font-size:17px}
  
  .home-contact{padding:100px 6% 40px}
  .contact-top .home-title{font-size:54px}
  .contact-action{font-size:15px;padding:18px 36px}
  .contact-columns h3{font-size:15px}
  .contact-columns p,.contact-columns a{font-size:16px}
  .contact-legal{font-size:15px}
}

/* --- Breakpoint: 4K / UHD (2561px and up) --- */
@media(min-width:2561px){
  .hd-navigation{max-width:2900px;padding:36px 80px}
  .site-header.is-scrolled .hd-navigation{padding:24px 80px}
  .hd-logo{font-size:34px}
  .hd-nav-links{gap:64px}
  .hd-nav-links a{font-size:22px}
  .hd-nav-action{font-size:20px;padding:16px 34px}
  
  .home-inner{max-width:2700px;padding:0 80px}
  
  .room-kitchen .room-card,.room-table .room-card,.room-laundry .room-card,.room-bathroom .room-card{
    width:min(720px, 30vw);padding:52px 60px;border-radius:36px
  }
  .room-card h2,.room-kitchen .room-card h2{font-size:54px;margin-bottom:20px}
  .room-card p,.room-card li,.room-kitchen .room-card p,.room-kitchen .room-card li{font-size:23px;line-height:1.75}
  .room-card ul,.room-kitchen .room-card ul{margin:0 0 28px;padding-left:28px}
  .room-card .room-cta,.room-kitchen .room-card .room-cta{font-size:20px;padding:18px 38px;min-height:60px}
  .journey-nav button{font-size:20px;padding:18px 36px;border-radius:999px}
  .kitchen-intro{font-size:52px;max-width:900px}
  .table-title{font-size:64px}
  .table-subtitle{font-size:24px}
  
  .em-why{padding:180px 6% 160px}
  .em-why-grid{gap:150px}
  .home-kicker{font-size:20px;letter-spacing:3px}
  .home-title{font-size:clamp(64px,4vw,100px);line-height:1.1}
  .home-lead{font-size:28px;line-height:1.75;margin-bottom:36px}
  .em-why-list li{padding:34px 0;gap:28px}
  .em-why-num{font-size:36px}
  .em-why-list h3{font-size:38px}
  .em-why-list p{font-size:24px}
  .em-why-chip{font-size:24px;padding:24px 34px;max-width:600px;border-radius:22px}
  
  .em-dose{padding:80px 6% 180px}
  .em-dose-grid{gap:150px}
  .em-dose-card{padding:60px 200px 60px 60px;border-radius:36px}
  .em-dose-chips button{font-size:22px;padding:16px 30px;min-height:60px}
  .em-dose-cup{width:200px;height:250px}
  .em-dose-amount{font-size:96px}
  .em-dose-with{font-size:28px}
  .em-dose-note{font-size:25px}
  .em-dose-link{font-size:22px}
  
  .em-river{padding:140px 6%}
  .em-river-card{max-width:920px;padding:64px;border-radius:36px}
  .em-river-card .home-title{font-size:64px}
  .em-river-card .home-lead{font-size:26px}
  .em-river-card .home-link{font-size:24px}
  
  .home-faq{padding:120px 6% 130px}
  .faq-layout{gap:120px}
  .home-faq .home-title{font-size:64px}
  .faq-list summary{font-size:25px;padding:32px 12px}
  .faq-list summary:after{font-size:34px}
  .faq-list p{font-size:23px}
  
  .home-contact{padding:140px 6% 60px}
  .contact-top{padding-bottom:70px}
  .contact-top .home-title{font-size:76px}
  .contact-action{font-size:22px;padding:24px 48px;border-radius:999px}
  .contact-columns h3{font-size:20px;margin-bottom:24px}
  .contact-columns p,.contact-columns a{font-size:22px;line-height:1.8}
  .contact-legal{font-size:20px;margin-top:60px}
}