/* ==========================================================================
   NORTON PARK - TRANG CON BANG TINH GIA
   Phu thuoc: fonts.css va brand-tokens.css (ban sao nguyen van tu trang chinh).
   Nav, CTA, form, footer, nut noi: lay nguyen quy cach tu trang chinh
   (../css/page.css) de hai trang dong bo.
   Trang nay KHONG dung Screen Lock: cuon tu nhien, bang tinh can cho rong.
   Decor theo DECOR_RULES: Hero = B (hoa van goc tren trai), Bang tinh = C
   (dau qua cho nho), Form = B (dai hoa van mep trai). Hai section lien ke
   khong trung kieu.
   ========================================================================== */

:root{
  /* Hai hinh vector nhung data: URI (copy tu decor.css trang chinh) de chay ca khi mo bang file:// */
  --quacho:url("data:image/svg+xml,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20858%20964'%20width='858'%20height='964'%20fill='%23000'><path%20fill-rule='evenodd'%20d='M418.88,962.55C418.54,962.21%20415.39,961.49%20411.88,960.95C392.43,957.94%20374.18,948.56%20360.37,934.47C351.92,925.86%20348.61,921.19%20343.54,910.71C337.39,898%20335.6,888.43%20336.38,872.5C337.16,856.65%20340.55,846.85%20350.41,832C355,825.09%20368.08,811%20369.91,811C370.34,811%20371.78,810.06%20373.1,808.9C378.47,804.21%20392.18,798.13%20404.78,794.84C417.36,791.56%20440.64,791.56%20453.22,794.84C465.82,798.13%20479.53,804.21%20484.9,808.9C486.22,810.06%20487.66,811%20488.09,811C489.92,811%20503,825.09%20507.59,832C517.45,846.85%20520.84,856.65%20521.62,872.5C522.4,888.43%20520.61,898%20514.46,910.71C509.39,921.19%20506.08,925.86%20497.63,934.47C484.14,948.24%20468.25,956.64%20448,960.73C440.06,962.33%20419.92,963.59%20418.88,962.55ZM427.06,765.25C426.37,763.74%20423.11,755.75%20419.81,747.5C413.55,731.83%20413.28,731.19%20404.26,711C396.51,693.63%20376.99,655.35%20367.04,638C325.54,565.61%20278.24,501.4%20220.05,438.5C206.65,424.02%20162.94,381.01%20148.99,368.59C113.88,337.32%2079.95,309.82%2049.95,288.32C30.8,274.6%204.02,257%202.29,257C1.24,257%201,232.67%201,129C1,44.33%201.34,1%202,1C2.55,1%203,1.41%203,1.91C3,2.41%2011.66,7.43%2022.25,13.06C109.63,59.56%20182.3,108.69%20239,159.59C254.62,173.61%20284.69,204.12%20296.59,218C347.53,277.46%20383.21,342.13%20401.97,409C402.66,411.48%20403.59,414.62%20404.04,416C404.75,418.21%20407.29,428.59%20410.03,440.5C415.01,462.13%20419.72,493.31%20421.96,519.5C424.87,553.56%20425.25,566.79%20425.59,644C425.94,722.42%20426.8,759.13%20428.31,760.65C428.69,761.02%20429.31,761.02%20429.69,760.65C431.2,759.13%20432.06,722.42%20432.41,644C432.75,566.79%20433.13,553.56%20436.04,519.5C438.28,493.31%20442.99,462.13%20447.97,440.5C450.71,428.59%20453.25,418.21%20453.96,416C454.41,414.62%20455.34,411.48%20456.03,409C470.37,357.91%20496.35,304.74%20529.71,258.26C548.31,232.35%20563.21,214.82%20588.45,189.16C616.84,160.3%20639.58,140.43%20671.5,116.57C725.35,76.33%20771.46,47.27%20835.75,13.06C846.34,7.43%20855,2.41%20855,1.91C855,1.41%20855.45,1%20856,1C856.66,1%20857,44.33%20857,129C857,232.67%20856.76,257%20855.71,257C853.98,257%20827.2,274.6%20808.05,288.32C778.05,309.82%20744.12,337.32%20709.01,368.59C695.06,381.01%20651.35,424.02%20637.95,438.5C579.76,501.4%20532.46,565.61%20490.96,638C481.01,655.35%20461.49,693.63%20453.74,711C444.72,731.19%20444.45,731.83%20438.19,747.5C430.98,765.55%20429.88,768%20429,768C428.63,768%20427.75,766.76%20427.06,765.25Z'/></svg>");
  --pattern:url("data:image/svg+xml,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20242.87%20180'%20width='242.87'%20height='180'%20fill='%23000'%20preserveAspectRatio='none'><defs><g%20id='mo'><circle%20cx='0'%20cy='0'%20r='16'/><path%20transform='translate(-72.37,-157.00)'%20d='M0.44,139.63C0.03,139.07%20-0,137.57%20-0,116.67L-0,94.32L2.1,92.16C3.49,90.73%204.39,90%204.75,90C5.1,90%205.84,89.44%206.75,88.5C7.64,87.57%208.4,87%208.74,87C9.1,87%2010.27,86%2012.25,84C14.14,82.09%2015.41,81%2015.74,81C16.45,81%2031.75,65.7%2031.75,64.99C31.75,64.66%2032.84,63.39%2034.75,61.5C36.73,59.54%2037.75,58.35%2037.75,57.99C37.75,57.65%2038.48,56.74%2039.75,55.5C41.03,54.24%2041.75,53.35%2041.75,53C41.75,52.65%2042.47,51.76%2043.75,50.5C45.14,49.14%2045.75,48.36%2045.75,47.95C45.75,47.58%2046.12,47.01%2046.75,46.43C47.35,45.88%2047.75,45.29%2047.75,44.95C47.75,44.6%2048.19,43.96%2048.88,43.3C49.51,42.69%2050,42%2050,41.7C50,41.41%2050.45,40.73%2051,40.19C51.55,39.65%2052,38.98%2052,38.69C52,38.41%2052.45,37.73%2053,37.19C53.55,36.65%2054,35.98%2054,35.69C54,35.41%2054.45,34.73%2055,34.19C55.84,33.37%2056,33.05%2056,32.19C56,31.33%2056.16,31.02%2057,30.19C57.55,29.65%2058,28.98%2058,28.69C58,28.41%2058.45,27.73%2059,27.19C59.84,26.37%2060,26.05%2060,25.19C60,24.33%2060.16,24.02%2061,23.19C61.85,22.35%2062,22.06%2062,21.16C62,20.26%2062.15,19.96%2063,19.12C63.84,18.3%2064,17.99%2064,17.12C64,16.26%2064.16,15.95%2065,15.12C65.85,14.3%2066,13.99%2066,13.11C66,12.39%2066.15,11.94%2066.5,11.62C66.77,11.38%2067,10.93%2067,10.63C67,10.32%2067.22,9.87%2067.5,9.63C67.85,9.31%2068,8.86%2068,8.13C68,7.39%2068.15,6.94%2068.5,6.63C68.77,6.38%2069,5.93%2069,5.63C69,5.32%2069.22,4.87%2069.5,4.63C69.84,4.31%2070,3.86%2070,3.16C70,2.3%2070.16,1.98%2071.05,1.07C71.63,0.48%2072.29,0%2072.51,0C73.25,0%2074,1.08%2074,2.15C74,2.99%2074.16,3.31%2075,4.13C75.95,5.05%2076,5.17%2076,6.64C76,7.86%2076.1,8.27%2076.5,8.62C76.77,8.87%2077,9.32%2077,9.62C77,9.93%2077.22,10.38%2077.5,10.63C77.77,10.87%2078,11.32%2078,11.63C78,11.93%2078.22,12.38%2078.5,12.63C78.77,12.87%2079,13.32%2079,13.62C79,13.93%2079.22,14.38%2079.5,14.62C79.85,14.94%2080,15.39%2080,16.11C80,16.99%2080.15,17.3%2081,18.13C81.85,18.96%2082,19.26%2082,20.16C82,21.06%2082.15,21.35%2083,22.19C83.84,23.02%2084,23.33%2084,24.19C84,25.05%2084.16,25.37%2085,26.19C85.56,26.74%2086,27.41%2086,27.71C86,28.01%2086.22,28.45%2086.5,28.68C86.77,28.92%2087,29.42%2087,29.8C87,30.23%2087.19,30.58%2087.5,30.75C87.81,30.92%2088,31.28%2088.01,31.7C88.01,32.17%2088.31,32.63%2089.01,33.24C89.68,33.81%2090,34.3%2090.01,34.74C90.01,35.17%2090.34,35.66%2091.01,36.24C91.61,36.76%2092,37.31%2092,37.65C92,37.97%2092.42,38.63%2093,39.19C93.55,39.73%2094,40.41%2094,40.69C94,40.98%2094.45,41.65%2095,42.19C95.55,42.73%2096,43.41%2096,43.7C96,44%2096.49,44.69%2097.12,45.3C97.8,45.95%2098.25,46.6%2098.25,46.94C98.25,47.27%2098.67,47.91%2099.25,48.47C99.82,49.02%20100.25,49.68%20100.25,49.99C100.25,50.35%20100.95,51.23%20102.25,52.5C103.53,53.76%20104.25,54.65%20104.25,55C104.25,55.35%20104.96,56.24%20106.23,57.48C107.65,58.87%20108.23,59.62%20108.29,60.15C108.36,60.77%20108.5,60.89%20109.25,61C109.99,61.11%20110.14,61.24%20110.21,61.83C110.31,62.76%20130.45,83%20131.27,83C131.59,83%20132.7,83.93%20134.25,85.5C135.87,87.15%20136.9,88%20137.26,88C137.6,88%20138.35,88.57%20139.25,89.5C140.14,90.42%20140.9,91%20141.23,91C141.55,91%20142.29,91.52%20143.01,92.24L144.25,93.48L144.25,116.86L144.25,140.25L143.44,140.25C142.81,140.25%20142.43,140.02%20141.75,139.25C141.14,138.55%20140.67,138.25%20140.2,138.25C139.78,138.25%20139.42,138.06%20139.25,137.75C139.08,137.42%20138.73,137.25%20138.25,137.25C137.77,137.25%20137.42,137.08%20137.25,136.75C137.08,136.44%20136.72,136.25%20136.3,136.25C135.83,136.25%20135.36,135.95%20134.75,135.25C134.17,134.59%20133.66,134.25%20133.25,134.25C132.84,134.25%20132.33,133.91%20131.75,133.25C131.17,132.59%20130.66,132.25%20130.25,132.25C129.84,132.25%20129.33,131.91%20128.75,131.25C128.2,130.62%20127.66,130.25%20127.29,130.25C126.89,130.25%20126.21,129.75%20125.25,128.75C124.34,127.8%20123.6,127.25%20123.25,127.25C122.9,127.25%20122.16,126.7%20121.25,125.75C120.35,124.81%20119.6,124.25%20119.26,124.25C118.9,124.25%20118.02,123.55%20116.75,122.25C115.52,120.99%20114.6,120.25%20114.26,120.25C113.52,120.25%2096,102.79%2096,102.06C96,101.73%2095.24,100.79%2094,99.56C92.69,98.28%2092,97.4%2092,97.04C92,96.71%2091.59,96.11%2091,95.57C90.38,95%2090,94.42%2090,94.07C90,93.71%2089.62,93.13%2089,92.57C88.34,91.95%2088,91.43%2088,91.01C88,90.64%2087.79,90.24%2087.5,90.06C87.18,89.86%2087,89.48%2087,89.01C87,88.52%2086.83,88.17%2086.5,88C86.19,87.83%2086,87.47%2086,87.05C86,86.58%2085.7,86.11%2085,85.5C84.11,84.71%2084,84.51%2084,83.45C84,82.52%2083.89,82.21%2083.5,82C83.17,81.83%2083,81.48%2083,81C83,80.52%2082.83,80.17%2082.5,80C82.17,79.83%2082,79.48%2082,79C82,78.52%2081.83,78.17%2081.5,78C81.17,77.83%2081,77.48%2081,77C81,76.52%2080.83,76.17%2080.5,76C80.07,75.77%2080,75.48%2080,74C80,72.52%2079.93,72.23%2079.5,72C79.17,71.83%2079,71.48%2079,71C79,70.52%2078.83,70.17%2078.5,70C78.07,69.77%2078,69.48%2078,68C78,66.52%2077.93,66.23%2077.5,66C77.1,65.79%2077,65.48%2077,64.49C77,63.52%2076.89,63.19%2076.5,62.94C76.05,62.66%2076,62.36%2076,59.98C76,57.64%2075.94,57.27%2075.5,56.88C75.1,56.52%2075,56.11%2075,54.88C75,53.64%2074.9,53.23%2074.5,52.88C74.02,52.44%2074,52.11%2074,45.27C74,38.43%2073.98,38.11%2073.51,37.81C73.06,37.54%2073.01,37.18%2072.94,34.19C72.89,31.44%2072.81,30.88%2072.5,30.88C72.19,30.88%2072.11,31.5%2072.06,34.69C71.99,38.17%2071.94,38.53%2071.49,38.81C71.04,39.1%2071,39.41%2071,42.77C71,46.11%2070.96,46.46%2070.5,46.88C70.03,47.3%2070,47.64%2070,51.88C70,56.11%2069.97,56.45%2069.5,56.88C69.15,57.19%2069,57.64%2069,58.38C69,59.11%2068.85,59.56%2068.5,59.88C68.07,60.26%2068,60.64%2068,62.53C68,64.48%2067.94,64.76%2067.5,65C67.1,65.21%2067,65.52%2067,66.5C67,67.48%2066.9,67.79%2066.5,68C66.07,68.23%2066,68.52%2066,70C66,71.48%2065.93,71.77%2065.5,72C65.17,72.17%2065,72.52%2065,73C65,73.48%2064.83,73.83%2064.5,74C64.1,74.21%2064,74.52%2064,75.5C64,76.48%2063.9,76.79%2063.5,77C63.17,77.17%2063,77.52%2063,78C63,78.48%2062.83,78.83%2062.5,79C62.11,79.21%2062,79.52%2062,80.45C62,81.51%2061.89,81.71%2061,82.5C60.12,83.27%2060,83.5%2060,84.5C60,85.5%2059.88,85.73%2059,86.5C58.3,87.11%2058,87.58%2058,88.05C58,88.47%2057.81,88.83%2057.5,89C57.17,89.17%2057,89.52%2057,90.01C57,90.48%2056.82,90.86%2056.5,91.06C56.21,91.24%2056,91.64%2056,92.01C56,92.43%2055.66,92.95%2055,93.57C54.41,94.11%2054,94.71%2054,95.04C54,95.4%2053.31,96.28%2052,97.56C50.75,98.79%2050,99.73%2050,100.06C50,100.39%2049.2,101.37%2047.88,102.69C46.58,103.97%2045.75,105%2045.75,105.31C45.75,106.04%2033.48,118.25%2032.75,118.25C32.4,118.25%2031.35,119.13%2029.75,120.75C28.13,122.4%2027.1,123.25%2026.74,123.25C26.4,123.25%2025.65,123.82%2024.75,124.75C23.84,125.7%2023.1,126.25%2022.75,126.25C22.4,126.25%2021.66,126.8%2020.75,127.75C19.79,128.75%2019.11,129.25%2018.71,129.25C18.34,129.25%2017.8,129.62%2017.25,130.25C16.67,130.91%2016.16,131.25%2015.75,131.25C15.34,131.25%2014.83,131.59%2014.25,132.25C13.67,132.91%2013.16,133.25%2012.75,133.25C12.34,133.25%2011.83,133.59%2011.25,134.25C10.64,134.95%2010.17,135.25%209.7,135.25C9.28,135.25%208.92,135.44%208.75,135.75C8.58,136.06%208.22,136.25%207.8,136.25C7.33,136.25%206.86,136.55%206.25,137.25C5.67,137.91%205.16,138.25%204.75,138.25C4.34,138.25%203.83,138.59%203.25,139.25C2.19,140.45%201.14,140.59%200.44,139.63Z'/></g></defs><use%20href='%23mo'%20transform='translate(-169.37,-164.00)'/><use%20href='%23mo'%20transform='translate(-169.37,16.00)'/><use%20href='%23mo'%20transform='translate(-169.37,196.00)'/><use%20href='%23mo'%20transform='translate(73.50,-164.00)'/><use%20href='%23mo'%20transform='translate(73.50,16.00)'/><use%20href='%23mo'%20transform='translate(73.50,196.00)'/><use%20href='%23mo'%20transform='translate(316.37,-164.00)'/><use%20href='%23mo'%20transform='translate(316.37,16.00)'/><use%20href='%23mo'%20transform='translate(316.37,196.00)'/><use%20href='%23mo'%20transform='translate(-47.07,-16.00)%20rotate(180)%20translate(-0.7,0)'/><use%20href='%23mo'%20transform='translate(-47.07,164.00)%20rotate(180)%20translate(-0.7,0)'/><use%20href='%23mo'%20transform='translate(-47.07,344.00)%20rotate(180)%20translate(-0.7,0)'/><use%20href='%23mo'%20transform='translate(195.80,-16.00)%20rotate(180)%20translate(-0.7,0)'/><use%20href='%23mo'%20transform='translate(195.80,164.00)%20rotate(180)%20translate(-0.7,0)'/><use%20href='%23mo'%20transform='translate(195.80,344.00)%20rotate(180)%20translate(-0.7,0)'/><use%20href='%23mo'%20transform='translate(438.67,-16.00)%20rotate(180)%20translate(-0.7,0)'/><use%20href='%23mo'%20transform='translate(438.67,164.00)%20rotate(180)%20translate(-0.7,0)'/><use%20href='%23mo'%20transform='translate(438.67,344.00)%20rotate(180)%20translate(-0.7,0)'/></svg>");
  --pat-h:92px;--pat-w:124.13px;--tile:var(--pat-w) var(--pat-h);
  --qw:clamp(310px,25vw,400px);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scrollbar-gutter:stable;
  scroll-padding-top:calc(var(--nav-h) + 12px)}
body{margin:0;background:var(--bg-1);color:var(--tx-3);
  font-family:var(--font-body);font-size:var(--body);line-height:1.75;
  text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
[hidden]{display:none!important}
h1,h2,h3{margin:0;font-family:var(--font-display);font-weight:400}
p{margin:0}
ul,dl,dd{margin:0;padding:0;list-style:none}
a{color:inherit}
button{font:inherit;color:inherit}
::selection{background:rgba(167,128,97,.24)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}

.wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.d1{font-size:var(--d1);font-weight:300;line-height:1.05;letter-spacing:-.012em;text-wrap:balance}
.d2{font-size:var(--d2);font-weight:400;line-height:1.14;letter-spacing:-.008em;text-wrap:balance}
.d3{font-size:var(--d3);font-weight:700;line-height:1.24}
.eyebrow{display:block;font-family:var(--font-sub);font-size:var(--eyebrow);font-weight:400;
  letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--tx-4)}
.smark{display:block;width:clamp(1.75rem,2.6vw,2.9rem);height:auto;margin-bottom:.88rem}
.tag{display:inline-block;padding:5px 12px;border:1px solid var(--line-2);border-radius:999px;
  font-family:var(--font-sub);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--tx-2)}
.tag--ltd{border-color:rgba(167,128,97,.55);color:var(--accent-deep)}
.pending{display:inline-block;padding:4px 10px;border:1px dashed var(--line-2);border-radius:4px;
  font-family:var(--font-sub);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--tx-4);white-space:nowrap;
  background:repeating-linear-gradient(135deg,rgba(89,74,66,.05) 0 8px,transparent 8px 16px)}
.ic{width:1.38rem;height:1.38rem;stroke:currentColor;fill:none;stroke-width:1.1;
  stroke-linecap:round;stroke-linejoin:round;display:block;flex:0 0 auto}
.ic-s{width:.94rem;height:.94rem}

/* ==========================================================================
   NAV (quy cach trang chinh). Doi logo bang 2 file SVG, KHONG dung filter.
   ========================================================================== */
.nav{position:fixed;top:0;left:0;right:0;z-index:70;
  background:rgba(30,24,20,.28);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(255,255,255,.12);color:#FFF;
  transition:background .4s var(--ease),color .4s var(--ease),border-color .4s var(--ease),box-shadow .4s var(--ease)}
.nav.is-solid{background:rgba(220,211,192,.96);border-bottom-color:var(--line-1);color:var(--tx-1);
  box-shadow:0 4px 20px rgba(0,0,0,.06)}
.nav-in{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);height:var(--nav-h);
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px}
.lang{display:flex;align-items:center;gap:8px;font-family:var(--font-sub);
  font-size:.74rem;letter-spacing:.16em;text-transform:uppercase}
.lang button{background:none;border:0;padding:4px 2px;cursor:pointer;opacity:.55;
  transition:opacity .3s var(--ease);letter-spacing:inherit;font-family:inherit;font-size:inherit}
.lang button.on{opacity:1;font-weight:700}
.lang button:hover{opacity:.85}
.lang i{opacity:.4;font-style:normal}
.brand{justify-self:center;display:block;line-height:0}
.brand img{width:clamp(8.1rem,14vw,11.6rem);max-height:2.25rem;height:auto;object-fit:contain}
.nav:not(.is-solid) .brand-dark{display:none}
.nav.is-solid .brand-light{display:none}
.nav-actions{display:flex;align-items:center;gap:12px;justify-self:end}
.btn-ghost{display:inline-flex;align-items:center;gap:.5rem;white-space:nowrap;
  padding:.69rem 1.13rem;border:1px solid rgba(255,255,255,.5);border-radius:var(--r-btn);
  font-family:var(--font-sub);font-size:.68rem;font-weight:700;letter-spacing:var(--track-btn);
  text-transform:uppercase;text-decoration:none;color:inherit;
  transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease)}
.btn-ghost .ic-s{transition:transform .38s var(--ease)}
.btn-ghost:hover .ic-s{transform:translateX(-4px)}
.nav:not(.is-solid) .btn-ghost:hover{background:rgba(255,255,255,.16)}
.nav.is-solid .btn-ghost{border-color:rgba(167,128,97,.55);color:var(--hoadau-brown)}
.nav.is-solid .btn-ghost:hover{background:var(--accent);border-color:var(--accent);color:#FFF}

/* ==========================================================================
   CTA
   ========================================================================== */
.cta{display:inline-flex;align-items:center;justify-content:center;gap:11px;
  font-family:var(--font-sub);font-size:.735rem;font-weight:700;letter-spacing:var(--track-btn);
  text-transform:uppercase;text-decoration:none;padding:1rem 1.88rem;
  border:1px solid var(--accent);border-radius:var(--r-btn);color:#FFF;background:var(--accent);
  cursor:pointer;white-space:nowrap;
  transition:background .34s var(--ease),border-color .34s var(--ease),transform .18s var(--ease)}
.cta:hover{background:var(--accent-deep);border-color:var(--accent-deep)}
.cta:active{transform:translateY(1px)}
.cta .ic{transition:transform .38s var(--ease)}
.cta:hover .ic{transform:translateX(4px)}
.chero-cta .cta:first-child:hover .ic{transform:translateY(3px)}
.cta--sm{padding:.69rem 1.38rem;font-size:.68rem}
.cta--wide{width:100%}
.cta--onimg{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.72);color:#FFF;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.cta--onimg:hover{background:rgba(255,255,255,.22);border-color:#FFF}

/* ==========================================================================
   1. HERO. Thap hon hero trang chinh (khong full man) de bang tinh lo ngay.
   ========================================================================== */
.chero{position:relative;min-height:clamp(520px,78svh,980px);display:flex;align-items:flex-end;
  overflow:hidden;background:var(--bg-dark)}
.chero-media{position:absolute;inset:0;z-index:0}
.chero-media img{width:100%;height:100%;object-fit:cover;object-position:50% 50%}
/* Scrim (dong bo Hero trang chinh 30/09/2026): anh giu MAU GOC, khong phu nau,
   khong hoa tiet qua cho. Dai toi o dinh cho nav + lop toi trung tinh
   trai sang phai cho vung chu. Man doc: toi tu duoi len. */
.chero-scrim{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(30,24,20,.64) 0%,rgba(30,24,20,.62) 6%,rgba(30,24,20,.16) 13%,rgba(30,24,20,0) 20%),
    linear-gradient(90deg,rgba(12,12,12,.78) 0%,rgba(12,12,12,.70) 24%,rgba(12,12,12,.54) 42%,rgba(12,12,12,.28) 58%,rgba(12,12,12,.08) 72%,rgba(12,12,12,0) 84%)}
@media (max-width:640px),(max-width:1040px) and (orientation:portrait){
  /* Khoi chu trang con cao hon Hero trang chinh nen lop toi len cao hon */
  .chero-scrim{background:
    linear-gradient(180deg,rgba(30,24,20,.46) 0%,rgba(30,24,20,.44) 7%,rgba(30,24,20,.14) 15%,rgba(30,24,20,0) 23%),
    linear-gradient(0deg,rgba(12,12,12,.86) 0%,rgba(12,12,12,.8) 40%,rgba(12,12,12,.6) 58%,rgba(12,12,12,.28) 72%,rgba(12,12,12,0) 86%)}
}
@media (max-width:640px){
  .chero .chero-meta{display:none}
}
.chero-in{position:relative;z-index:2;width:100%;
  padding-top:calc(var(--nav-h) + 40px);padding-bottom:clamp(48px,9vh,110px);color:var(--tx-on-dark)}
.chero .eyebrow{color:rgba(244,240,231,.84);margin-bottom:16px}
.chero h1{color:var(--tx-on-dark);max-width:14ch;margin-bottom:18px}
.chero-sub{max-width:46ch;font-size:var(--lead);line-height:1.66;color:var(--tx-on-dark-2);margin-bottom:26px}
.chero-meta{display:flex;flex-wrap:wrap;gap:clamp(18px,3vw,48px);margin-bottom:30px}
.chero-meta li{display:flex;flex-direction:column;gap:2px;padding-left:14px;border-left:1px solid rgba(220,211,192,.4)}
.chero-meta b{font-family:var(--font-display);font-weight:400;font-size:clamp(1.6rem,2.4vw,2.2rem);line-height:1.1;color:var(--beige-sand);
  font-variant-numeric:lining-nums}
.chero-meta span{font-family:var(--font-sub);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,240,231,.78)}
.chero-cta{display:flex;gap:14px;flex-wrap:wrap}

/* ==========================================================================
   2. BANG TINH
   ========================================================================== */
.calc{position:relative;background:var(--bg-1);padding:clamp(56px,7vw,120px) 0 clamp(64px,8vw,140px)}
.calc-head{margin-bottom:clamp(22px,3vw,40px)}
.calc-head h2{color:var(--tx-1);margin-top:10px}

/* Tab loai can: chia 2 bo suu tap, kieu tab Section Can ho trang chinh */
.ctabs{display:flex;align-items:flex-end;gap:clamp(18px,2.6vw,40px);border-bottom:1px solid var(--line-1);
  margin-bottom:clamp(30px,4vw,56px)}
.ctab-g{display:flex;flex-direction:column;gap:6px}
.ctab-g+.ctab-g{padding-left:clamp(18px,2.6vw,40px);border-left:1px solid var(--line-1)}
.ctab-gh{font-family:var(--font-sub);font-size:.56rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--tx-4)}
.ctab-g--ltd .ctab-gh{color:var(--accent)}
.ctab-row{display:flex;gap:clamp(14px,2vw,30px)}
.ctabs button{position:relative;background:none;border:0;padding:6px 0 12px;cursor:pointer;
  font-family:var(--font-display);font-size:clamp(1.1rem,1.5vw,1.4rem);line-height:1.2;color:var(--tx-4);
  white-space:nowrap;transition:color .3s var(--ease)}
.ctabs button:hover{color:var(--tx-2)}
.ctabs button[aria-selected="true"]{color:var(--tx-1)}
.ctabs button::before{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--accent);
  transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.ctabs button[aria-selected="true"]::before{transform:scaleX(1)}
/* Decor C: dau qua cho nho duoi tab dang chon (giong trang chinh) */
.ctabs button[aria-selected="true"]::after{content:"";position:absolute;left:50%;bottom:-1.45rem;transform:translateX(-50%);
  width:.82rem;height:.92rem;-webkit-mask:var(--quacho) no-repeat center/contain;mask:var(--quacho) no-repeat center/contain;
  background-color:var(--champagne-bronze)}

.calc-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr) var(--qw);
  gap:clamp(24px,2.8vw,52px);align-items:start}

/* Mat bang: dat thang tren nen, anh nen trang nen multiply (giong trang chinh) */
.c-plan{position:sticky;top:calc(var(--nav-h) + 24px);background:var(--bg-1)}
/* sticky tao stacking context: nen phai co nen that de multiply an duoc nen trang cua anh */
.c-fig{margin:0;display:flex;align-items:center;justify-content:center}
.c-fig img{max-width:100%;max-height:clamp(340px,calc(100svh - var(--nav-h) - 150px),720px);width:auto;height:auto;object-fit:contain;mix-blend-mode:multiply;
  transition:opacity .35s var(--ease)}
.c-fig.is-swap img{opacity:0}
.c-figcap{margin-top:14px;font-size:.74rem;line-height:1.6;color:var(--tx-4);max-width:44ch}
.c-figcap b{font-family:var(--font-sub);font-weight:700;letter-spacing:.06em;color:var(--tx-2)}

.c-type{padding-bottom:clamp(18px,2.4vw,28px);border-bottom:1px solid var(--line-1);margin-bottom:clamp(18px,2.4vw,28px)}
.c-type .d3{font-weight:400;font-size:clamp(1.7rem,2.6vw,2.4rem);color:var(--tx-1);margin:14px 0 4px}
.c-rooms{font-family:var(--font-sub);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--tx-2);margin-bottom:12px}
.c-desc{font-size:.92rem;line-height:1.72;max-width:52ch;margin-bottom:18px}
.c-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.c-stats div{padding-left:12px;border-left:1px solid var(--line-2);display:flex;flex-direction:column;justify-content:space-between}
.c-stats dt{font-family:var(--font-sub);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:var(--tx-4)}
.c-stats dd{font-family:var(--font-display);font-size:clamp(1.15rem,1.5vw,1.4rem);line-height:1.3;color:var(--tx-2);
  font-variant-numeric:lining-nums}

.c-step{margin-bottom:14px}
.c-step-h{display:block;font-family:var(--font-sub);font-size:.68rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--tx-1)}
.c-key{margin-top:4px;font-size:.72rem;line-height:1.6;color:var(--tx-4)}

/* Bang ma can: moi ma mot dong, cot dien tich can phai de so sanh nhanh */
.c-codes{display:flex;flex-direction:column;border-top:1px solid var(--line-2)}
.code-hd,.code{display:grid;grid-template-columns:minmax(0,1fr) 7.2rem 7.2rem;column-gap:14px;align-items:center}
.code-hd{padding:10px 14px 8px;font-family:var(--font-sub);font-size:.54rem;letter-spacing:.14em;text-transform:uppercase;color:var(--tx-4)}
.code-hd span:nth-child(n+2){text-align:right}
.code{position:relative;width:100%;text-align:left;cursor:pointer;row-gap:3px;
  padding:12px 14px;margin:0;background:transparent;border:0;border-bottom:1px solid var(--line-1);border-radius:0;
  transition:background .3s var(--ease),box-shadow .3s var(--ease)}
.code::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:2px;background:var(--dark-pine);
  transform:scaleY(0);transition:transform .35s var(--ease)}
.code:hover{background:rgba(251,250,246,.7)}
.code[aria-checked="true"]{background:var(--bg-0);box-shadow:0 6px 18px rgba(89,74,66,.07)}
.code[aria-checked="true"]::before{transform:scaleY(1)}
.code-id{display:flex;align-items:center;gap:8px;font-family:var(--font-sub);font-size:.92rem;font-weight:400;letter-spacing:.03em;color:var(--tx-1)}
.code[aria-checked="true"] .code-id{font-weight:700;letter-spacing:.05em}
.code-badge{font-family:var(--font-sub);font-size:.5rem;font-weight:400;letter-spacing:.12em;text-transform:uppercase;
  padding:3px 8px;border-radius:999px;background:var(--accent-soft);color:var(--accent-deep);white-space:nowrap}
.code-a{text-align:right;font-family:var(--font-display);font-size:1.12rem;line-height:1.2;color:var(--dark-pine);
  font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}
.code-a--n{color:var(--tx-3);font-size:1rem}
.code-a--p{grid-column:2 / 4}
.code-meta{grid-column:1 / -1;font-size:.68rem;line-height:1.5;color:var(--tx-4)}
.code[aria-checked="true"] .code-meta{color:var(--tx-3)}

/* Khung gia: sticky, dau Dark Pine */
.c-quote{position:sticky;top:calc(var(--nav-h) + 24px);border-radius:var(--r-card);overflow:hidden;
  background:var(--bg-0);border:1px solid var(--line-1);box-shadow:0 18px 44px rgba(89,74,66,.10)}
.q-top{position:relative;padding:22px 24px 20px;background:var(--dark-pine);color:var(--tx-on-dark);overflow:hidden}
/* Decor C: bong qua cho mo trong dau khung (0 do, khong cat, khong de chu) */
.q-top::after{content:"";position:absolute;right:14px;top:14px;width:46px;height:52px;pointer-events:none;
  -webkit-mask:var(--quacho) no-repeat center/contain;mask:var(--quacho) no-repeat center/contain;
  background-color:var(--beige-sand);opacity:.22}
.q-k{display:block;font-family:var(--font-sub);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(220,211,192,.82)}
.q-price{margin:8px 0 6px;font-family:var(--font-display);font-size:clamp(1.7rem,2.3vw,2.25rem);line-height:1.1;color:var(--beige-sand);
  font-variant-numeric:lining-nums tabular-nums;overflow-wrap:anywhere}
.q-price.is-pending{font-size:1.3rem;color:var(--tx-on-dark-2)}
.q-code{font-family:var(--font-sub);font-size:.8rem;letter-spacing:.06em;color:var(--tx-on-dark-2)}
.q-rows{padding:8px 24px 4px}
.q-rows div{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid var(--line-1);font-size:.8rem}
.q-rows div:last-child{border-bottom:0}
.q-rows dt{color:var(--tx-4);white-space:nowrap}
.q-rows dd{color:var(--tx-1);text-align:right;font-variant-numeric:lining-nums}
.q-act{padding:12px 24px 0;display:grid;gap:10px}
.q-act .cta{padding:1rem 1rem;font-size:.66rem;letter-spacing:.09em;white-space:normal;text-align:center;line-height:1.4}
.q-call{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px;text-decoration:none;
  font-family:var(--font-sub);font-size:.64rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-deep)}
.q-call:hover{color:var(--hoadau-brown)}
/* .q-note = dong chu thich gia, cung kieu chu voi .q-disc (canh trai, cung co chu, mau, dong) */
.q-note{padding:10px 24px 0;font-size:.64rem;line-height:1.55;color:var(--tx-4)}
.q-disc{padding:6px 24px 18px;font-size:.64rem;line-height:1.55;color:var(--tx-4)}

/* Thanh gia co dinh o day man (duoi 1180px khi khung gia khong con canh ben) */
.qbar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:none;align-items:center;justify-content:space-between;gap:14px;
  padding:10px var(--gutter) calc(10px + env(safe-area-inset-bottom));
  background:rgba(93,97,79,.97);color:var(--tx-on-dark);box-shadow:0 -8px 24px rgba(30,24,20,.18);
  transform:translateY(110%);transition:transform .4s var(--ease)}
.qbar.on{transform:none}
.qbar-l{min-width:0;display:flex;flex-direction:column}
.qbar-k{font-family:var(--font-sub);font-size:.7rem;letter-spacing:.04em;color:rgba(220,211,192,.85);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qbar-v{font-family:var(--font-display);font-size:1.2rem;line-height:1.25;color:var(--beige-sand);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font-variant-numeric:lining-nums tabular-nums}

/* ==========================================================================
   3. FORM BAO GIA (quy cach Section Form trang chinh, 1 buoc)
   ========================================================================== */
.reg{position:relative;background:var(--bg-3);overflow:hidden;padding:clamp(56px,7vw,120px) 0}
.reg-bg{position:absolute;inset:0;z-index:0}
.reg-bg img{width:100%;height:100%;object-fit:cover}
.reg-scrim{position:absolute;inset:0;z-index:1;background:rgba(89,74,66,.34);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
/* Decor B: dai hoa van doc mep trai (giong trang chinh) */
.reg::after{content:"";position:absolute;pointer-events:none;z-index:1;left:0;top:0;bottom:0;width:min(26%,440px);
  -webkit-mask-image:var(--pattern),linear-gradient(90deg,#000 0%,#000 30%,transparent 100%);
          mask-image:var(--pattern),linear-gradient(90deg,#000 0%,#000 30%,transparent 100%);
  -webkit-mask-size:var(--tile),cover;mask-size:var(--tile),cover;
  -webkit-mask-repeat:repeat,no-repeat;mask-repeat:repeat,no-repeat;
mask-composite:intersect;
  background-color:var(--beige-sand);opacity:.20}
.reg>.wrap{position:relative;z-index:2}
.reg-card{display:grid;grid-template-columns:1fr 1fr;border-radius:var(--r-card);max-width:min(1080px,100%);margin:0 auto;
  overflow:hidden;box-shadow:0 24px 60px rgba(60,48,40,.22)}
.reg-form{background:var(--bg-dark);color:var(--tx-on-dark-2);padding:clamp(26px,3.4vw,46px) clamp(22px,2.8vw,46px)}
.reg-info{background:var(--bg-0);padding:clamp(26px,3.4vw,46px) clamp(22px,2.8vw,46px)}
.reg-form .eyebrow{color:var(--beige-sand);margin-bottom:10px}
.reg-form h2{color:var(--beige-sand);margin-bottom:9px;font-size:clamp(1.5rem,2.4vw,2.1rem);font-weight:400}
.reg-form .sub{font-size:.87rem;line-height:1.65;color:var(--tx-on-dark-2);margin-bottom:18px}
.pick{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:12px 14px;margin-bottom:20px;
  border:1px solid rgba(167,128,97,.55);border-radius:var(--r-input);background:rgba(167,128,97,.14)}
.pick-k{font-family:var(--font-sub);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(213,206,184,.8)}
.pick-v{flex:1 1 auto;font-size:.88rem;font-weight:700;color:var(--tx-on-dark)}
.pick-edit{font-family:var(--font-sub);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--beige-sand)}
.reg .field{margin-bottom:14px}
.reg .field label{display:block;font-family:var(--font-sub);font-size:.62rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--beige-sand);margin-bottom:7px}
.reg .field input{width:100%;padding:13px 15px;font-family:var(--font-body);font-size:.95rem;color:var(--tx-on-dark);
  background:rgba(244,240,231,.09);border:1px solid var(--line-on-dark);border-radius:var(--r-input);
  transition:border-color .3s var(--ease),background .3s var(--ease)}
.reg .field input:focus{outline:none;border-color:var(--champagne-bronze);background:rgba(244,240,231,.14)}
.reg .field input[aria-invalid="true"]{border-color:#E08E7A}
.err{display:block;font-size:.78rem;color:#E08E7A;margin-top:6px}
.err:empty{margin-top:0}
.err--consent{margin-top:-10px;margin-bottom:10px}
.consent{display:flex;gap:12px;align-items:flex-start;margin-bottom:18px}
.consent input{width:1.19rem;height:1.19rem;margin-top:.19rem;flex:0 0 auto;accent-color:var(--champagne-bronze)}
.consent label{font-size:.84rem;line-height:1.6;color:var(--tx-on-dark-2)}
.privacy{margin-top:12px;text-align:center;font-size:.72rem;color:rgba(213,206,184,.66)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ok{display:none;text-align:center;padding:14px 0}
.ok.on{display:block}
.ok .ic{width:2.75rem;height:2.75rem;margin:0 auto 1.13rem;color:var(--champagne-bronze)}
.reg-form .ok h3{color:var(--beige-sand);margin-bottom:8px}
.reg-info h3{color:var(--tx-1);margin-bottom:16px}
.info-row{display:flex;gap:12px;padding:14px 0;border-top:1px solid var(--line-1);font-size:.86rem}
.info-row:first-of-type{border-top:0;padding-top:0}
.info-row .ic{color:var(--accent);margin-top:4px;width:18px;height:18px}
.info-v{display:block;font-size:.92rem;line-height:1.55;color:var(--tx-1);text-decoration:none}
a.info-v:hover{color:var(--accent)}
.info-k{display:block;font-family:var(--font-sub);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:var(--tx-4);margin-bottom:5px}
.disc{margin-top:18px;padding-top:14px;border-top:1px solid var(--line-1);font-size:.7rem;line-height:1.6;color:var(--tx-4)}

/* ==========================================================================
   FOOTER + POPUP PHAP NHAN (quy cach trang chinh)
   ========================================================================== */
.foot{background:var(--bg-dark-alt);color:var(--tx-on-dark-2)}
.f-top{display:grid;grid-template-columns:1.5fr 1fr 1.15fr 1fr;gap:clamp(20px,2.6vw,46px);
  padding:clamp(22px,2.6vw,32px) 0 clamp(20px,2.4vw,30px)}
.f-top>div{display:flex;flex-direction:column}
.f-logo{width:clamp(10.5rem,18vw,14rem);height:auto}
.f-h{display:block;font-family:var(--font-sub);font-size:.6rem;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--beige-sand);margin-bottom:9px}
.f-list li{margin-bottom:5px;font-size:.84rem}
.f-list a{text-decoration:none;transition:color .3s var(--ease)}
.f-list a:hover{color:var(--champagne-bronze)}
.f-ct{display:flex;gap:10px;align-items:flex-start;margin-bottom:7px;font-size:.84rem}
.f-ct .ic{color:var(--champagne-bronze);margin-top:5px}
.f-v{display:block;color:var(--tx-on-dark);text-decoration:none;line-height:1.5}
a.f-v:hover{color:var(--beige-sand)}
.f-k{display:block;font-family:var(--font-sub);font-size:.53rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(213,206,184,.66);margin-bottom:4px}
.f-disc{margin-top:clamp(14px,1.8vw,20px);font-size:.72rem;line-height:1.65;color:rgba(213,206,184,.8);max-width:44ch;text-wrap:pretty}
.f-cr{margin-top:auto;padding-top:14px;font-size:.72rem;color:rgba(213,206,184,.8);white-space:nowrap}
.lgl .pending{border-color:rgba(244,240,231,.32);color:rgba(244,240,231,.62);
  background:repeating-linear-gradient(135deg,rgba(244,240,231,.06) 0 8px,transparent 8px 16px)}
.f-legal{display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,3vw,54px);align-items:start}
.f-legal-h{display:block;font-family:var(--font-sub);font-size:.53rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(213,206,184,.66);margin-bottom:9px}
.gam-plate{display:inline-block;background:var(--bg-0);border-radius:8px;padding:10px 15px;line-height:0}
.gam-plate img{width:clamp(8.25rem,13vw,11rem);height:auto}
.f-ent{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px clamp(20px,2.4vw,40px);padding-top:18px}
.f-ent .row{font-size:.84rem}
.lgl{position:fixed;inset:0;z-index:121;display:none;place-items:center;padding:clamp(14px,3vw,40px)}
.lgl.is-open{display:grid}
.lgl-backdrop{position:absolute;inset:0;background:rgba(30,24,20,.62);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
.lgl-panel{position:relative;width:min(38rem,100%);max-height:100%;overflow:auto;background:var(--bg-dark-alt);
  color:var(--tx-on-dark-2);border-radius:var(--r-card);box-shadow:0 30px 70px rgba(30,24,20,.4);padding:clamp(28px,3.4vw,44px)}
.lgl-close{position:absolute;top:.75rem;right:.75rem;width:2.38rem;height:2.38rem;border-radius:50%;
  border:1px solid rgba(244,240,231,.4);background:rgba(30,24,20,.45);color:#F4F0E7;display:grid;place-items:center;cursor:pointer}

/* ==========================================================================
   NUT NOI
   ========================================================================== */
.fab{position:fixed;right:clamp(14px,2vw,26px);bottom:clamp(18px,3vw,32px);z-index:55;display:flex;flex-direction:column;gap:13px;
  transition:transform .4s var(--ease)}
.fab a,.fab button{width:clamp(48px,3.25rem,76px);height:clamp(48px,3.25rem,76px);border-radius:50%;border:0;cursor:pointer;
  display:grid;place-items:center;color:#F4F0E7;text-decoration:none;box-shadow:0 6px 20px rgba(60,48,40,.26);
  transition:transform .3s var(--ease),background .3s var(--ease)}
.fab a:hover,.fab button:hover{transform:translateY(-3px)}
.fab-call{background:var(--hoadau-brown)}
.fab-zalo{background:var(--dark-pine)}
.fab-top{background:var(--hoadau-brown);opacity:0;visibility:hidden;
  transition:opacity .34s var(--ease),visibility .34s var(--ease),transform .3s var(--ease)!important}
.fab-top.on{opacity:1;visibility:visible}
.fab .ic{width:1.44rem;height:1.44rem;stroke-width:1.4}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
/* Man trung binh: khung gia xuong duoi, thanh gia co dinh o day man */
@media (max-width:1179px){
  .calc-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
  /* Khung gia xuong hang duoi: mat bang KHONG sticky nua (sticky se de len khung gia) */
  .c-plan{position:static}
  .c-quote{grid-column:1 / -1;position:static;max-width:760px;width:100%;justify-self:center}
  .qbar{display:flex}
  body.has-qbar .fab{opacity:0;visibility:hidden;pointer-events:none}
  .fab{transition:opacity .3s var(--ease),visibility .3s var(--ease)}
}
@media (max-width:1040px){
  .f-top{grid-template-columns:1fr 1fr}
  .reg-card{grid-template-columns:1fr}
}
@media (max-width:820px){
  .calc-grid{grid-template-columns:1fr}
  .c-plan{position:static}
  .c-fig img{max-height:54svh}
  .c-quote{display:block}
  /* Tab truot ngang tren man hep */
  .ctabs{overflow-x:auto;scrollbar-width:none;margin-left:calc(-1 * var(--gutter));margin-right:calc(-1 * var(--gutter));
    padding:0 var(--gutter);padding-bottom:1.6rem;margin-bottom:24px}
  .ctabs::-webkit-scrollbar{display:none}
  .nav-actions .btn-ghost{padding:9px;border-radius:50%}
  .btn-ghost-t{display:none}
}
@media (max-width:640px){
  .chero{min-height:clamp(560px,92svh,760px)}
  .chero h1{max-width:12ch}
  .chero-cta{flex-direction:column;align-items:stretch}
  .c-stats{grid-template-columns:1fr 1fr}
  .c-stats div:last-child{grid-column:1 / -1}
  .code-hd,.code{grid-template-columns:minmax(0,1fr) 5.6rem 5.6rem;column-gap:8px}
  .code{padding:11px 10px}
  .code-hd{padding-left:10px;padding-right:10px}
  .code-a{font-size:1rem}.code-a--n{font-size:.92rem}
  .f-top{grid-template-columns:1fr}
  .f-legal{grid-template-columns:1fr}
  .fab a,.fab button{width:48px;height:48px}
  .lang i{display:none}
}
@media (max-width:480px){
  .nav-actions .btn-ghost{display:none}
}
@media (max-width:400px){
  .nav-in{padding-left:16px;padding-right:16px;gap:6px}
  .nav-actions{gap:6px}
  .lang{font-size:.6rem;gap:4px}
  .nav-cta{padding:8px 11px;font-size:.55rem;letter-spacing:.07em}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* Desktop: khung gia da co nut goi, an nut noi khi dang o bang tinh de khong de len khung gia */
@media (min-width:1180px){
  body.in-calc .fab{opacity:0;visibility:hidden;pointer-events:none}
  .fab{transition:opacity .3s var(--ease),visibility .3s var(--ease)}
}

/* ==========================================================================
   NHIP MAN HINH (giong trang chinh, R-bo fullpage): tu 1041x600, Hero va
   Bang tinh moi phan van cao dung 1 man hinh nhung KHONG con scroll-snap bat
   buoc, trang cuon binh thuong. Form va Footer giu chieu cao tu nhien.
   Bang tinh: tieu de 1 dong + tab o tren; ben duoi 3 cot an het phan con lai.
   Cot giua: khoi ten/mo ta loai can CO DINH, chi danh sach ma can cuon noi bo.
   Nap SAU cac media query khac de ghi de rule <=1179px (khung gia xuong duoi).
   ========================================================================== */
@media (min-width:1041px) and (min-height:600px){
  :root{--qw:clamp(268px,24vw,400px)}
  .chero{height:100dvh;min-height:0}
  .calc{height:100dvh;overflow:hidden;
    padding:calc(var(--nav-h) + clamp(14px,2.6vh,30px)) 0 clamp(16px,2.8vh,32px)}
  .calc>.wrap{height:100%;display:flex;flex-direction:column}
  .calc-head{flex:0 0 auto;margin-bottom:clamp(6px,1.2vh,14px)}
  .calc-head h2{margin:0;font-size:clamp(1.6rem,4.4vh,2.7rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ctabs{flex:0 0 auto;margin-bottom:clamp(24px,3.4vh,36px);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;padding-bottom:0}
  .ctabs::-webkit-scrollbar{display:none}
  .ctabs button[aria-selected="true"]::after{display:none}
  .calc-grid{flex:1 1 auto;min-height:0;grid-template-columns:minmax(0,.86fr) minmax(0,1.1fr) var(--qw);
    grid-template-rows:minmax(0,1fr);align-items:stretch;gap:clamp(20px,2.4vw,48px)}
  /* Cot mat bang: anh an het chieu cao con lai, khong cat anh */
  .c-plan{position:relative;top:auto;display:flex;flex-direction:column;min-height:0}
  .c-fig{flex:1 1 auto;min-height:0}
  .c-fig img{max-height:100%}
  .c-figcap{flex:0 0 auto;margin-top:10px;font-size:.7rem}
  /* Cot giua: khoi loai can co dinh, bang ma can cuon noi bo */
  .c-main{display:flex;flex-direction:column;min-height:0}
  .c-type{flex:0 0 auto;padding-bottom:clamp(10px,1.8vh,20px);margin-bottom:clamp(10px,1.6vh,18px)}
  .c-type .d3{font-size:clamp(1.5rem,3.6vh,2.2rem);margin:clamp(6px,1.2vh,12px) 0 2px}
  .c-rooms{margin-bottom:clamp(6px,1.2vh,12px)}
  .c-desc{font-size:.86rem;line-height:1.62;margin-bottom:clamp(8px,1.6vh,16px)}
  .c-step{flex:0 0 auto;margin-bottom:8px}
  .c-codes{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:auto;
    scrollbar-width:thin;scrollbar-color:rgba(89,74,66,.35) transparent;
    /* mo nhe mep duoi de bao hieu con ma can phia duoi */
    -webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 28px),transparent);
            mask-image:linear-gradient(180deg,#000 calc(100% - 28px),transparent);
    padding-bottom:24px}
  .code-hd{position:sticky;top:0;z-index:2;background:var(--bg-1);border-bottom:1px solid var(--line-1)}
  /* Cot gia: nam canh ben o moi be ngang tu 1041 (ghi de rule <=1179px) */
  .c-quote{grid-column:auto;position:relative;top:auto;max-width:none;justify-self:stretch;align-self:start;
    display:flex;flex-direction:column;max-height:100%;overflow-y:auto;scrollbar-width:none}
  .c-quote::-webkit-scrollbar{display:none}
  .qbar{display:none}
  body.has-qbar .fab{opacity:1;visibility:visible;pointer-events:auto}
  body.in-calc .fab{opacity:0;visibility:hidden;pointer-events:none}
  .fab{transition:opacity .3s var(--ease),visibility .3s var(--ease)}
}
/* Man thap: nen chu de nhuong cho anh va bang ma can */
@media (min-width:1041px) and (min-height:600px) and (max-height:860px){
  .c-desc{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
}
/* R4: nen khung gia tu 960px tro xuong (truoc la 860) de 1440x900, 1536x864, 1470x956 khong tran */
@media (min-width:1041px) and (min-height:600px) and (max-height:960px){
  .c-stats dd{font-size:1.1rem}
  .q-top{padding:16px 20px 14px}
  .q-price{font-size:clamp(1.5rem,2vw,1.9rem);margin:4px 0}
  .q-rows{padding:2px 20px 0}
  .q-rows div{padding:7px 0;font-size:.74rem}
  .q-act{padding:10px 20px 0;gap:4px}
  .q-act .cta{padding:.8rem .9rem}
  .q-call{padding:6px}
  .q-note{padding:6px 20px 0;font-size:.58rem;line-height:1.45}
  .q-disc{padding:3px 20px 12px;font-size:.58rem;line-height:1.45}
  .c-key{font-size:.66rem}
}
@media (min-width:1041px) and (min-height:600px) and (max-height:740px){
  .c-desc{-webkit-line-clamp:2}
  .c-stats{display:none}
  .c-type .tag{display:none}
  .c-rooms{margin-bottom:4px}
  .q-rows div:nth-child(n+5){display:none}
}
/* Hero man thap: an dai so lieu de khoi chu khong chui duoi thanh menu */
@media (min-width:1041px) and (min-height:600px) and (max-height:760px){
  .chero .chero-meta{display:none}
  .chero h1{font-size:clamp(2.4rem,8.4vh,4.2rem);margin-bottom:12px}
  .chero-sub{margin-bottom:20px}
  .chero-in{padding-bottom:clamp(36px,7vh,70px)}
}

/* Duplex: mat bang 2 tang xep doc (tang 1 tren, tang 2 duoi), cung ti le,
   moi tang co nhan tang + dien tich (brochure) + ghi chu cong nang. */
.c-fig.is-dplx{align-items:stretch}
.dplx{display:flex;flex-direction:column;gap:clamp(12px,2vh,22px);width:100%}
.dplx-lv{display:flex;flex-direction:column;min-height:0}
.dplx-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;padding-bottom:6px;margin-bottom:8px;border-bottom:1px solid var(--line-1)}
.dplx-n{font-family:var(--font-sub);font-size:.64rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--tx-1)}
.dplx-a{font-family:var(--font-display);font-size:1.05rem;line-height:1.2;color:var(--dark-pine);font-variant-numeric:lining-nums}
.dplx-note{flex:1 0 100%;font-size:.7rem;line-height:1.45;color:var(--tx-4)}
.c-fig .dplx img{width:100%;height:auto;max-height:none;object-fit:contain;object-position:left center;mix-blend-mode:normal}
@media (min-width:1041px) and (min-height:600px){
  .dplx{height:100%}
  .dplx-lv{flex-basis:0}
  .c-fig .dplx img{flex:1 1 0;min-height:0;height:100%}
}
@media (min-width:1041px) and (min-height:600px) and (max-height:760px){
  .dplx-note{display:none}
}

/* R3 (30/09/2026): nut nhan tin (bot chat). Nhan hien khi re chuot/focus. */
.fab .fab-chat{position:relative}
.fab-tip{position:absolute;right:calc(100% + 12px);top:50%;transform:translate(8px,-50%);opacity:0;pointer-events:none;
  white-space:nowrap;text-align:left;background:var(--bg-0,#FBFAF6);color:var(--tx-1);padding:10px 16px;border-radius:10px;
  box-shadow:0 10px 28px rgba(60,48,40,.18);transition:opacity .25s ease,transform .25s ease}
.fab-tip b{display:block;font-family:var(--font-display);font-weight:400;font-size:1.02rem;line-height:1.2}
.fab-tip small{display:block;margin-top:3px;font-size:.72rem;color:var(--tx-3)}
@media (hover:hover){.fab-chat:hover .fab-tip{opacity:1;transform:translate(0,-50%)}}
.fab-chat:focus-visible .fab-tip{opacity:1;transform:translate(0,-50%)}

/* ==========================================================================
   R4 (03/10/2026): SUA 3 LOI SCREEN LOCK
   1. Cuon lech: html co scroll-padding-top = cao menu nen snap dung section
      o y = cao menu, day section bi cat va lo dai section truoc duoi menu.
      Moi section da tu chua cho menu bang padding ben trong, nen bo padding.
   2. Gia bi cat: .c-quote la flex cot co max-height, cac khoi con bi co lai
      va .q-top (overflow:hidden) giau mat #qPrice. Khong cho khoi con co lai;
      neu thieu cho, ca khung cuon (khoi gia luon o tren cung, luon thay).
   3. Form vuot 1 man hinh: section form = 100dvh, nen khoang cach theo vh.
   ========================================================================== */
@media (min-width:1041px) and (min-height:600px){
  html{scroll-padding-top:0}
  .c-quote>*{flex-shrink:0}

  .reg{height:100dvh;display:flex;flex-direction:column;justify-content:center;
    padding:calc(var(--nav-h) + clamp(12px,2.6vh,32px)) 0 clamp(12px,2.6vh,32px)}
  .reg>.wrap{width:100%;max-height:100%;display:flex;flex-direction:column;min-height:0}
  .reg-card{max-height:100%;min-height:0;max-width:min(1080px,100%)}
  .reg-form,.reg-info{padding:clamp(18px,3.4vh,44px) clamp(22px,2.6vw,44px);overflow-y:auto;scrollbar-width:none}
  .reg-form::-webkit-scrollbar,.reg-info::-webkit-scrollbar{display:none}
  .reg-form .eyebrow{margin-bottom:clamp(4px,.9vh,10px)}
  .reg-form h2{font-size:clamp(1.4rem,3.4vh,2.1rem);margin-bottom:clamp(4px,.8vh,9px)}
  .reg-form .sub{font-size:clamp(.78rem,1.55vh,.87rem);line-height:1.55;margin-bottom:clamp(8px,1.6vh,18px)}
  .pick{padding:clamp(7px,1.2vh,12px) 14px;margin-bottom:clamp(10px,1.8vh,20px)}
  .reg .field{margin-bottom:clamp(8px,1.4vh,14px)}
  .reg .field label{margin-bottom:clamp(4px,.7vh,7px)}
  .reg .field input{padding:clamp(9px,1.35vh,13px) 15px}
  .consent{margin-bottom:clamp(10px,1.8vh,18px)}
  .consent label{font-size:clamp(.76rem,1.5vh,.84rem);line-height:1.5}
  .reg .cta--wide{padding-top:clamp(.75rem,1.6vh,1.05rem);padding-bottom:clamp(.75rem,1.6vh,1.05rem)}
  .privacy{margin-top:clamp(6px,1.2vh,12px)}
  .reg-info h3{margin-bottom:clamp(8px,1.6vh,16px)}
  .info-row{padding:clamp(8px,1.5vh,14px) 0}
  .reg-info .disc{margin-top:clamp(8px,1.6vh,18px)}
}
/* R4: man rat thap (600 den 680): nen them khung gia de vua 1 man */
@media (min-width:1041px) and (min-height:600px) and (max-height:680px){
  .q-top{padding:12px 18px 10px}
  .q-price{font-size:1.45rem;margin:2px 0}
  .q-rows{padding:0 18px}
  .q-rows div{padding:5px 0;font-size:.72rem}
  .q-act{padding:8px 18px 0;gap:2px}
  .q-act .cta{padding:.65rem .8rem}
  .q-call{padding:4px}
  .q-note{padding:4px 18px 0;font-size:.56rem;line-height:1.4}
  .q-disc{padding:3px 18px 8px;font-size:.56rem;line-height:1.4}
}
@media (min-width:1041px) and (min-height:600px) and (max-height:680px){
  .reg-form .sub{display:none}
  .reg-form .eyebrow{display:none}
  .reg .err{margin-top:3px;font-size:.72rem}
  .privacy{margin-top:4px;font-size:.66rem}
}
/* R4: Duplex khong cong khai gia, khung gia hien loi moi nhan bao gia */
.q-price.is-ask{font-size:clamp(1.2rem,1.45vw,1.55rem);line-height:1.2;margin:4px 0 4px;overflow-wrap:normal;max-width:15ch}
@media (min-width:1041px) and (min-height:600px) and (max-height:680px){.q-price.is-ask{font-size:1.2rem}}

/* ==========================================================================
   R5 (03/10/2026): HE CHUYEN DONG THONG NHAT (xem page.js muc 16)
   1 duong cong, 3 thoi luong. Chu: mo dan + troi 24px. Anh nen: zoom out
   108 -> 100%. The: mo dan + troi 32px, anh trong the zoom 106 -> 100%.
   Chi chay LAN DAU section vao man. Chi dung opacity/transform/clip-path.
   ========================================================================== */
:root{--mo-ease:cubic-bezier(.22,.61,.36,1);--mo-t:.9s;--mo-c:1.2s;--mo-bg:2.4s;--mo-gap:90ms;--mo-y:24px;--mo-yc:32px}
@media (max-width:1040px){:root{--mo-y:16px;--mo-yc:22px}}
.chero-media,.reg-bg{overflow:hidden}

/* Trang thai cho: chi ap khi section CHUA .mo-in va phan tu chua .in, nen
   sau khi chay xong moi style goc (ke ca hover) duoc tra lai nguyen ven. */
html.mo section:not(.mo-in) [data-mo]:not(.in){opacity:0}
html.mo section:not(.mo-in) [data-mo="bg"]:not(.in){opacity:1;transform:scale(1.08)}
html.mo section:not(.mo-in) [data-mo="mask"]:not(.in){opacity:1;clip-path:inset(0 100% 0 0)}
html.mo section:not(.mo-in) [data-mo="mask"]:not(.in) img{transform:scale(1.08)}
html.mo section:not(.mo-in) [data-mo="rule"]:not(.in){opacity:1;transform:scaleX(0);transform-origin:left center}
html.mo section:not(.mo-in) .tram[data-mo]:not(.in) .tram-fig img,html.mo section:not(.mo-in) .blk[data-mo]:not(.in) .blk-fig img,
html.mo section:not(.mo-in) .ncard[data-mo]:not(.in) .ncard-fig img,html.mo section:not(.mo-in) .life-stage[data-mo]:not(.in) .life-slide.on img{transform:scale(1.06)}

/* Chay hieu ung */
html.mo .mo-in [data-mo],html.mo [data-mo].in{animation-duration:var(--mo-t);animation-timing-function:var(--mo-ease);
  animation-fill-mode:backwards;animation-delay:calc(var(--mo-i,0) * var(--mo-gap))}
html.mo .mo-in [data-mo="t"],html.mo [data-mo="t"].in{animation-name:moUp}
html.mo .mo-in [data-mo="fade"],html.mo [data-mo="fade"].in{animation-name:moFade;animation-duration:var(--mo-c)}
html.mo .mo-in [data-mo="rule"],html.mo [data-mo="rule"].in{animation-name:moRule;animation-duration:var(--mo-c)}
html.mo .mo-in [data-mo="card"],html.mo [data-mo="card"].in{animation-name:moCard;animation-duration:var(--mo-c)}
html.mo .mo-in [data-mo="bg"],html.mo [data-mo="bg"].in{animation-name:moBg;animation-duration:var(--mo-bg);animation-delay:0s}
html.mo .mo-in [data-mo="mask"],html.mo [data-mo="mask"].in{animation-name:moMask;animation-duration:1.4s}
html.mo .mo-in [data-mo="mask"] img,html.mo [data-mo="mask"].in img{animation:moBg var(--mo-bg) var(--mo-ease) backwards}
html.mo .mo-in .tram[data-mo] .tram-fig img,html.mo .tram[data-mo].in .tram-fig img,
html.mo .mo-in .blk[data-mo] .blk-fig img,html.mo .blk[data-mo].in .blk-fig img,
html.mo .mo-in .ncard[data-mo] .ncard-fig img,html.mo .ncard[data-mo].in .ncard-fig img,
html.mo .mo-in .life-stage[data-mo] .life-slide.on img,html.mo .life-stage[data-mo].in .life-slide.on img{
  animation:moZoom 1.8s var(--mo-ease) backwards;animation-delay:calc(var(--mo-i,0) * var(--mo-gap))}

@keyframes moUp{from{opacity:0;transform:translateY(var(--mo-y))}to{opacity:1;transform:none}}
@keyframes moCard{from{opacity:0;transform:translateY(var(--mo-yc))}to{opacity:1;transform:none}}
@keyframes moFade{from{opacity:0}to{opacity:1}}
@keyframes moRule{from{transform:scaleX(0);transform-origin:left center}to{transform:scaleX(1);transform-origin:left center}}
@keyframes moBg{from{transform:scale(1.08)}to{transform:scale(1)}}
@keyframes moZoom{from{transform:scale(1.06)}to{transform:scale(1)}}
@keyframes moMask{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
@media (prefers-reduced-motion:reduce){html.mo [data-mo]{opacity:1!important;transform:none!important;clip-path:none!important}}

/* ==========================================================================
   R8 (06/10/2026) bug0 + bug8: GIA BI NGAT GIUA CON SO
   - Mobile: overflow-wrap:anywhere cat "2.948.400.00 | 0 d".
   - 1041-1279px EN: "6,104,000,000 | VND" xuong dong, nut CTA 2 dong,
     tieu de cot "UNIT CODE" 2 dong.
   Giai phap: con so KHONG BAO GIO xuong dong; co chu tu co theo be ngang
   khung gia bang container query (cqi), tran tren giu nguyen co cu. Bong qua
   cho chuyen xuong goc DUOI phai (canh dong ma can ngan) de khong de len gia.
   ========================================================================== */
.q-top{container-type:inline-size}
.q-top::after{top:auto;bottom:12px;width:40px;height:45px}
.q-price:not(.is-ask):not(.is-pending){white-space:nowrap;overflow-wrap:normal;
  font-size:min(clamp(1.7rem,2.3vw,2.25rem),9.4cqi,calc((100cqi - 44px) / 9.2))}
.code-hd span{white-space:nowrap}
@media (min-width:1041px) and (min-height:600px) and (max-height:960px){
  .q-price:not(.is-ask):not(.is-pending){font-size:min(clamp(1.5rem,2vw,1.9rem),9.4cqi,calc((100cqi - 44px) / 9.2))}
}
@media (min-width:1041px) and (min-height:600px) and (max-height:680px){
  .q-price:not(.is-ask):not(.is-pending){font-size:min(1.45rem,9.4cqi,calc((100cqi - 44px) / 9.2))}
}
@media (min-width:1041px) and (max-width:1279px) and (min-height:600px){
  :root{--qw:clamp(268px,27vw,400px)}
  .code-hd,.code{grid-template-columns:minmax(0,1fr) 6.2rem 6.2rem;column-gap:10px}
  .q-act .cta{letter-spacing:.05em;font-size:.58rem;padding-left:.7rem;padding-right:.7rem;white-space:nowrap}
}

/* R8 (06/10/2026): dong dien tich san vuon + chu thich (khong bao gom trong GCN) */
.q-rows dt sup,.q-gnote sup{font-size:.7em;line-height:0;margin-left:1px}
.q-gnote{margin:8px 0 2px;font-size:.66rem;line-height:1.5;color:var(--tx-4);font-style:italic}

/* R8 (06/10/2026): nut Zalo trong cum nut noi (mau Accent Deep, giua nut Goi
   va nut Bot chat). Icon mot mau, khong dung mau xanh thuong hieu Zalo. */
.fab-zl{background:var(--accent-deep,#8E6A4E)}
.fab-zl:hover{background:#7A5A41}
/* R8: tranh chu mo coi / tieu de vo dong lech (xem page.css) */
p,li,dd{text-wrap:pretty}
h1,h2,h3,.eyebrow{text-wrap:balance}
.c-stats dt,.q-rows dt{text-wrap:balance}

/* 09/10/2026: mo ta loai can dang tam an; [hidden] thang display:-webkit-box o cac breakpoint */
.c-desc[hidden]{display:none}

/* 09/10/2026: doan disclaimer dai (2 doan) nam trong .q-legal. Man hinh khoa (>=1041px): khung gia khong
   cao hon man hinh, phan chu phap ly co hang nho co the cuon noi bo (thanh cuon mong) neu man qua thap. */
@media (min-width:1041px) and (min-height:600px){
  .c-quote>.q-legal{flex:1 1 auto;min-height:4rem;flex-shrink:1;overflow-y:auto;overscroll-behavior:contain;
    scrollbar-width:thin;scrollbar-color:rgba(89,74,66,.3) transparent}
}

/* ==========================================================================
   WP-MIGRATION: NUT BURGER + DRAWER MENU
   Trang nay truoc day KHONG co nut mo menu (nav rieng, don gian). Nay dung
   header.php/footer.php CHUNG voi moi trang (co san nut burger + drawer),
   nhung style 2 thanh phan nay von chi nam trong css/page.css — copy nguyen
   van sang day de drawer hien dung giao dien khi mo tren trang nay, thay vi
   hien tho (khong co style) nhu truoc khi vá. KHONG sua logic, chi copy y
   het gia tri tu page.css.
   ========================================================================== */
.btn-burger{display:grid;gap:.38rem;padding:.69rem .19rem;background:none;border:0;cursor:pointer;color:inherit}
.btn-burger span{display:block;width:1.38rem;height:.13rem;background:currentColor;border-radius:2px;
  transition:transform .34s var(--ease)}
.btn-burger:hover span:first-child{transform:translateX(-3px)}
.btn-burger:hover span:last-child{transform:translateX(3px)}

.drawer{position:fixed;inset:0;z-index:100;visibility:hidden;pointer-events:none}
.drawer.is-open{visibility:visible;pointer-events:auto}
.drawer-backdrop{position:absolute;inset:0;background:rgba(30,24,20,.55);
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  opacity:0;transition:opacity .4s var(--ease)}
.drawer.is-open .drawer-backdrop{opacity:1}
.drawer-panel{position:absolute;top:0;right:0;bottom:0;width:min(25rem,86vw);
  background:var(--bg-0);border-left:1px solid var(--line-1);
  transform:translateX(100%);transition:transform .45s var(--ease);
  padding:clamp(20px,3vh,30px) clamp(22px,4vw,34px);
  display:flex;flex-direction:column;gap:clamp(16px,3vh,30px);
  overflow-y:auto;overscroll-behavior:contain}
.drawer.is-open .drawer-panel{transform:translateX(0)}
.drawer-top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.drawer-logo{width:clamp(7.4rem,30vw,9.75rem);height:auto}
.drawer-close{width:2.63rem;height:2.63rem;flex:0 0 auto;display:grid;place-items:center;
  background:none;border:1px solid var(--line-1);border-radius:50%;cursor:pointer;color:var(--tx-2);
  transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease)}
.drawer-close:hover{background:var(--accent);border-color:var(--accent);color:#FFF}
.drawer-nav{display:flex;flex-direction:column}
.drawer-nav a{display:flex;align-items:baseline;gap:14px;text-decoration:none;
  padding:clamp(10px,1.7vh,17px) 0;border-bottom:1px solid var(--line-1);
  font-family:var(--font-display);font-weight:400;font-size:clamp(1.02rem,1.5vh,1.24rem);
  line-height:1.3;color:var(--tx-1);
  transition:color .3s var(--ease),padding-left .3s var(--ease)}
.drawer-nav a:hover{color:var(--accent);padding-left:8px}
.drawer-nav i{flex:0 0 auto;font-family:var(--font-sub);font-style:normal;font-size:.62rem;
  letter-spacing:.16em;color:var(--tx-4)}
.drawer-foot{margin-top:auto;display:grid;gap:10px}
.drawer-act{display:flex;align-items:center;justify-content:center;gap:10px;
  padding:13px 18px;border:1px solid var(--accent);border-radius:var(--r-btn);
  text-decoration:none;color:var(--accent);
  font-family:var(--font-sub);font-size:.66rem;font-weight:700;
  letter-spacing:var(--track-btn);text-transform:uppercase;
  transition:background .3s var(--ease),color .3s var(--ease)}
.drawer-act:hover{background:var(--accent);color:#FFF}
button.drawer-act{-webkit-appearance:none;appearance:none;background:transparent;width:100%;cursor:pointer;line-height:inherit}
.drawer-tag{margin-top:4px;text-align:center;font-family:var(--font-sub);font-size:.56rem;
  letter-spacing:.24em;text-transform:uppercase;color:var(--tx-4);line-height:2}

@media (max-height:780px){
  .drawer-foot{grid-template-columns:1fr 1fr;gap:8px}
  .drawer-act{padding:10px 12px;letter-spacing:.1em}
  .drawer-foot button.drawer-act,.drawer-tag{grid-column:1 / -1}
}
@media (max-height:780px) and (max-width:400px){.drawer-act{font-size:.58rem;letter-spacing:.05em;padding:10px 8px;gap:6px}}
@media (prefers-reduced-motion:reduce){.drawer-panel{transition:none}}

/* ==========================================================================
   WP-MIGRATION: NUT 360 TOUR (.btn-vr/.btn-eye), LOP PHONG TO BAN DO (.lb),
   POPUP FORM (.pop) — 3 thanh phan nay cung chi nam trong css/page.css,
   trang Bang tinh gia truoc day khong dung nen chua co. Header/footer dung
   chung gio dua ca 3 vao trang nay nen can style theo, neu khong se hien
   RONG/KHONG DINH DANG o cuoi trang (dung la loi "popup lech xuong cuoi
   trang" nguoi dung bao). Copy nguyen gia tri tu page.css, khong sua logic.
   ========================================================================== */
.btn-vr{
  display:inline-flex;align-items:center;gap:.5rem;white-space:nowrap;
  padding:.69rem 1.13rem;border:1px solid currentColor;border-radius:var(--r-btn);
  font-family:var(--font-sub);font-size:.68rem;font-weight:700;
  letter-spacing:var(--track-btn);text-transform:uppercase;text-decoration:none;color:inherit;
  transition:background .3s var(--ease),color .3s var(--ease),
             border-color .3s var(--ease),box-shadow .3s var(--ease);
}
.nav:not(.is-solid) .btn-vr:hover{background:rgba(255,255,255,.16);box-shadow:0 0 18px rgba(255,255,255,.3)}
.nav.is-solid .btn-vr{border-color:var(--accent);color:var(--hoadau-brown)}
.nav.is-solid .btn-vr:hover{background:var(--accent);color:#FFF;box-shadow:0 0 18px rgba(167,128,97,.42)}
.btn-vr .ic-s{transition:transform .6s var(--ease)}
.btn-vr:hover .ic-s{transform:rotate(360deg)}
.btn-eye{position:relative;isolation:isolate;overflow:hidden;border-color:rgba(255,255,255,.38);
  --sheen:rgba(255,255,255,.32)}
.nav.is-solid .btn-eye{border-color:rgba(167,128,97,.45);--sheen:rgba(255,255,255,.75)}
.btn-eye::before{content:"";position:absolute;top:0;bottom:0;left:0;width:60%;z-index:-1;pointer-events:none;
  background:linear-gradient(100deg,rgba(255,255,255,0) 0%,var(--sheen) 50%,rgba(255,255,255,0) 100%);
  transform:translateX(-120%) skewX(-18deg);animation:vr-sheen 4.5s ease-in-out infinite}
.btn-eye:hover::before{animation-play-state:paused;opacity:0}
@keyframes vr-sheen{0%,62%{transform:translateX(-120%) skewX(-18deg)}100%{transform:translateX(260%) skewX(-18deg)}}
@media (prefers-reduced-motion:reduce){.btn-eye::before{animation:none;display:none}}
@media (max-width:640px){
  .btn-vr-t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .nav-actions .btn-vr{padding:8px;border-radius:50%}
}

.lb{position:fixed;inset:0;z-index:90;display:none;background:rgba(60,48,40,.94);
  align-items:center;justify-content:center;padding:clamp(14px,3vw,40px)}
.lb.is-open{display:flex}
.lb-img{max-width:100%;max-height:100%;overflow:auto;cursor:grab;
  -webkit-overflow-scrolling:touch;border-radius:6px}
.lb-img img{max-width:none;width:auto;height:auto}
.lb-close{position:absolute;top:clamp(12px,2.4vw,26px);right:clamp(12px,2.4vw,26px);
  width:2.9rem;height:2.9rem;display:grid;place-items:center;cursor:pointer;
  background:rgba(251,250,246,.14);border:1px solid rgba(244,240,231,.3);
  border-radius:50%;color:var(--tx-on-dark)}
.lb-hint{position:absolute;left:0;right:0;bottom:clamp(12px,2.4vw,26px);text-align:center;
  font-family:var(--font-sub);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(244,240,231,.7)}

/* POPUP FORM. Hien sau khi qua vai giay, moi phien mot lan. z-index 120, tren ca drawer (100) va .lb (90). */
.pop{position:fixed;inset:0;z-index:120;display:none;place-items:center;
  padding:clamp(14px,3vw,40px)}
.pop.is-open{display:grid}
.pop-backdrop{position:absolute;inset:0;background:rgba(30,24,20,.62);
  -webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
.pop-panel{position:relative;width:min(57.5rem,100%);max-height:100%;overflow:auto;
  display:grid;grid-template-columns:1.08fr .92fr;
  background:var(--bg-0);border-radius:var(--r-card);
  box-shadow:0 30px 70px rgba(30,24,20,.4)}
.pop-form{padding:clamp(26px,3.2vw,42px)}
.pop-logo{width:clamp(8.1rem,14vw,10.5rem);height:auto;display:block;margin:0 auto clamp(14px,2vh,20px)}
.pop-sub{text-align:center;font-size:.86rem;line-height:1.6;color:var(--tx-3);margin-bottom:clamp(14px,2vh,20px)}
.pop .field{margin-bottom:11px}
.pop .field input,.pop .field select{width:100%;padding:13px 15px;font-family:var(--font-body);
  font-size:.92rem;color:var(--tx-1);background:var(--bg-1);
  border:1px solid var(--line-1);border-radius:var(--r-input)}
.pop .field input:focus,.pop .field select:focus{outline:none;border-color:var(--accent);background:var(--bg-0)}
.pop .field input[aria-invalid="true"]{border-color:#A8442F}
.pop .err{color:#A8442F}
.pop .two{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.pop .consent{margin-bottom:12px}
.pop .consent label{color:var(--tx-3)}
.pop .cta{margin-top:5px}
.pop-media{position:relative;min-height:240px}
.pop-media .ph span{display:none}
.pop-info{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;
  justify-content:center;gap:14px;padding:clamp(22px,2.4vw,34px);
  background:rgba(89,74,66,.78);color:var(--tx-on-dark)}
.pop-info .info-v{color:var(--tx-on-dark)}
.pop-info h3{color:var(--beige-sand)}
.pop-info .info-k{color:rgba(220,211,192,.72)}
.pop-info .pending{border-color:rgba(244,240,231,.35);color:rgba(244,240,231,.72);
  background:repeating-linear-gradient(135deg,rgba(244,240,231,.06) 0 8px,transparent 8px 16px)}
.pop-close{position:absolute;top:.75rem;right:.75rem;z-index:3;width:2.38rem;height:2.38rem;
  border-radius:50%;border:1px solid rgba(244,240,231,.4);background:rgba(30,24,20,.45);
  color:#F4F0E7;display:grid;place-items:center;cursor:pointer}
.pop .ok .ic{color:var(--accent)}
.pop .ok h3{color:var(--tx-1)}
.pop .field select{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;
  height:auto;line-height:1.5;padding-right:46px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23594A42' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;background-size:16px 16px}
.pop .field select::-ms-expand{display:none}
.pop .field input,.pop .field select{height:3.05rem;padding-top:0;padding-bottom:0}
.pop-media{overflow:hidden;background:var(--hoadau-brown)}
.pop-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 50%;
  transform:scale(1.04);filter:blur(1.5px) saturate(.9)}
.pop-info{background:linear-gradient(160deg,rgba(89,74,66,.66) 0%,rgba(89,74,66,.78) 45%,rgba(60,49,43,.9) 100%)}
.pop-info::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(70% 50% at 20% 50%,rgba(40,33,29,.35) 0%,rgba(40,33,29,0) 70%)}
.pop-info>*{position:relative}
@media (max-width:820px){
  .pop-panel{grid-template-columns:1fr}
  .pop-media{display:none}
}
