@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600&display=swap');
:root{--bg:#07111e;--surface:#102034;--line:#aac8df2b;--ink:#f0eee7;--muted:#b0c0d1;--red:#e6c894;--red-text:#e6c894;--red-button:#264762;--silver:#b9ddf1;--gold:#e6c894;--display:'Playfair Display',Georgia,serif}
body{background:radial-gradient(ellipse at 100% 32%,#17395838,transparent 38%),var(--bg);color:var(--ink)}
.wrap{width:min(1150px,calc(100% - 64px))}.concept-notice{text-align:center;padding:8px 16px;font-size:11px;color:var(--silver);background:#142132;letter-spacing:.04em}
.header{gap:20px;padding-block:19px;flex-wrap:wrap}.celestial-wordmark{font:500 20px var(--display);letter-spacing:.12em;color:var(--gold);white-space:nowrap}.header nav{gap:20px}.header nav a{font-size:13px}.header .compact{font-size:12px;padding:10px 13px}.language-control select{background:#132538;border-color:var(--line)}
.celestial-hero{min-height:400px;border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;align-items:center;padding:30px 54px;background:linear-gradient(90deg,#06102066,#07111e00 75%),url('assets/celestial-banner.png') center/cover}
.celestial-hero-copy{width:58%}.celestial-logo{width:140px;height:140px;object-fit:contain;margin-bottom:13px}.celestial-hero h1{font:400 clamp(36px,4.3vw,56px)/1.18 var(--display);max-width:520px;letter-spacing:-.025em}.celestial-hero p{font-size:14px;line-height:1.75;color:#d4ddea;margin-top:17px;max-width:430px}
.section{padding-block:56px}.section-title{gap:35px}.section h2,html[lang=vi] .section h2,#build h2,html[lang=vi] #build h2{font:400 clamp(30px,3.1vw,43px)/1.23 var(--display);letter-spacing:-.015em;text-transform:none}.section-title>p{font-size:15px;line-height:1.8}.eyebrow{font-size:11px;letter-spacing:.12em;color:var(--gold)}h2 span{color:var(--gold)}
.all-rates,.type-panel,.style-card,.process-step,dialog,.duration-cards .visual-duration{background:linear-gradient(135deg,#142438,#0c192a);border-color:var(--line)}.rates-heading h3{font:500 24px var(--display)}.rates-heading p{font-size:13px}.all-rates{padding:27px 30px;margin-top:22px}.rate-table th,.rate-table td{border-color:var(--line)}.rate-table tbody th{font-size:17px}.rate-table tbody th small{color:var(--muted);line-height:1.6}.rate-table thead th{color:var(--muted)}
.rate-table button{background:#20344b5c;color:#dceaf6;border-color:#7c9cb440;font:500 23px/1.35 var(--body)}.rate-table td:nth-child(3) button{background:#33506c4a;color:#e3f2ff;border-color:#adcfe76b}.rate-table td:last-child button{background:#d8b5760d;color:var(--gold);border-color:#d8b57670}.rate-table button[aria-pressed=true],.rate-table td:last-child button[aria-pressed=true]{outline-color:var(--gold);background:#d8b57616;color:#ffe7ba}
.price-selection{background:#081421;border-color:var(--line)}.selection-total output{font:500 29px/1.4 var(--body);color:var(--gold)}.premium-toggle{border-color:#dbc49148;color:var(--gold);font-size:12px}
.featured-offer{background:linear-gradient(100deg,#e4c68a14,#87cfff07);border-color:#dfc08b58;padding:20px 28px;gap:22px;box-shadow:none}.featured-offer h3{font:500 25px/1.4 var(--display);text-transform:none}.featured-offer .eyebrow{color:var(--gold);font-size:10px;margin-bottom:5px}.featured-offer p:not(.eyebrow){color:var(--muted);font-size:13px}.featured-offer .offer-stamp{border-color:#d7bc8050}.featured-offer .offer-free{color:#0d1b2c;background:var(--gold);font-size:11px}.featured-offer .offer-stamp strong{font:500 36px/1.2 var(--body);color:var(--gold)}.featured-offer .offer-stamp>span:last-child{font-size:10px;color:var(--muted)}
.story-intro,.consultation,.idea-help{background:linear-gradient(115deg,#152c40,#0c192a);border-color:var(--line)}.story-intro-icon{color:var(--gold)}.story-intro h3,.idea-help h3{font:400 28px/1.3 var(--display)}.duration-cards .duration-body h4{font:500 23px/1.35 var(--display)}.duration-time{font:600 18px/1.4 var(--body);color:var(--gold)}.idea-help p{color:var(--muted)}
.button,.type-tabs button[aria-selected=true]{background:#d8c092;color:#091625;border-color:#d8c092}.button:hover{box-shadow:0 5px 25px #d8c09220}.button small{color:#20354a}.type-tabs button{border-color:#8babca42;background:#112135;color:var(--ink)}.type-tabs button[aria-selected=true]{color:#091625}.section-stamp{border-color:#d8c09255;color:var(--gold)}.type-panel h3{font:400 34px/1.2 var(--display)}.type-panel p,.type-panel li,.quality-copy>p,.faqs p,.dialog-copy>p:not(.eyebrow){color:var(--muted)}.discussion-label{font-size:14px}
.quality-copy .big-detail{font:400 45px/1.1 var(--display);color:var(--gold)}.comparison{border-color:#b9ddf150}.comparison-handle{background:#17344c;border-color:#e6d3a8;color:#fff}.comparison.is-dragging .comparison-handle{background:#244d6b}.comparison .divider::before{background:#e6d3a8}.comparison-nameplate span{color:#dcecff}.comparison-nameplate strong{font-family:var(--body);font-weight:700}.compare-label{background:#071625e8}.spec-note{border-color:var(--line);color:var(--muted)}
.style-section{background:linear-gradient(140deg,#101f31,#0a1727);border-color:var(--line)}.style-card h3{font:500 23px/1.3 var(--display);text-transform:none}.style-card p,.style-detail p{color:var(--muted)}.style-card .view-style{font-size:11px;color:var(--gold)}.style-card:hover{border-color:var(--gold)}.style-options li,.dialog-copy .style-duration-note{background:#20354a;border-color:var(--line)}.dialog-close{background:#101f31ed;border-color:#8babca60}.dialog-copy h2{font:400 32px/1.2 var(--display);text-transform:none}
.process-step h3{font:500 20px/1.35 var(--display)}.process-icon,.payment-step .process-icon{background:#20354a;border-color:#87a9bf66;color:var(--gold)}.process-badge{background:#d8c09212;color:var(--gold);border-color:#d8c09255}.process-index{color:var(--muted)}.process-step p{color:var(--muted)}.payment-step{border-color:#d8c09250}.faqs details,.faq-section{border-color:var(--line)}.faqs summary{font-size:16px}.consultation h2,html[lang=vi] .consultation h2{font:400 36px/1.25 var(--display)}.consultation-topics h3{font:500 23px var(--display)}
.gallery-controls button{background:#20354a;border-color:#8babca50;color:var(--ink);min-height:44px}.video-samples .sample-heading{font:500 22px/1.4 var(--display)}.sample-card{background:#0b1727;border-color:var(--line)}.sample-card figcaption strong{font:500 19px/1.4 var(--display)}.sample-track{scrollbar-color:#7598b6 #0b1727}.zalo-floating{background:#d8c092;border-color:#f1dfbc;color:#091625}.zalo-floating:hover{background:#efd6a7}#zalo-dialog{background:#102034;border-color:#abc6df55}#zalo-dialog h2{font:400 30px/1.25 var(--display)}#zalo-number{background:#091625;border-color:#abc6df55}.zalo-close{border-color:#abc6df55}footer{border-color:var(--line);color:var(--muted)}.footer-brand img{width:90px;height:90px;object-fit:contain}
@media(max-width:1000px){.header nav{order:3;width:100%;justify-content:center}.header .language-control{margin-left:auto}}
@media(max-width:800px){#type-tabs{background:#07111ef5;border-color:var(--line);backdrop-filter:blur(8px)}}
@media(max-width:600px){.wrap{width:calc(100% - 32px)}.header{gap:10px;padding-block:14px}.celestial-wordmark{font-size:17px}.header nav{justify-content:start}.header nav a{background:#112135;border-color:var(--line);font-size:12px}.header .language-control{margin:0}.concept-notice{font-size:9px}.celestial-hero{min-height:355px;padding:24px 23px;align-items:flex-start;background-position:65% center;background-image:linear-gradient(90deg,#07111ed9,#07111e70),url('assets/celestial-banner.png')}.celestial-hero-copy{width:100%}.celestial-logo{width:116px;height:116px;margin-bottom:16px}.celestial-hero h1{font-size:35px;max-width:300px}.celestial-hero p{font-size:13px;max-width:260px;margin-top:15px}.section{padding-block:38px}.section h2,html[lang=vi] .section h2,#build h2,html[lang=vi] #build h2{font-size:29px;line-height:1.3}.section-title>p{font-size:15px}.eyebrow{font-size:10px;letter-spacing:.09em}.all-rates{padding:20px 15px}.rates-heading>p{font-size:14px}.rate-table tbody th{font-size:17px}.rate-table tbody th small{font-size:13px}.rate-table button{font-size:21px;min-height:100px}.rate-quality{font-size:12px}.rate-table td:last-child .rate-amount{font-size:23px}.selection-total output{font:500 26px/1.35 var(--body)}.featured-offer{padding:17px 16px;gap:14px;grid-template-columns:minmax(0,1fr) 78px}.featured-offer h3{font:500 21px/1.3 var(--display)}.featured-offer .eyebrow{font-size:9px}.featured-offer p:not(.eyebrow){font-size:12px}.featured-offer .offer-free{font-size:10px;padding:5px 7px}.featured-offer .offer-stamp strong{font-size:29px}.featured-offer .offer-stamp>span:last-child{font-size:9px}.story-intro h3,.idea-help h3{font:400 25px/1.35 var(--display)}.duration-cards .duration-body h4{font:500 20px/1.4 var(--display)}.duration-time{font-size:18px}.type-panel h3{font-size:29px}.quality-copy .big-detail{font-size:37px}.style-card h3{font-size:20px}.process-step h3{font-size:19px}.consultation h2,html[lang=vi] .consultation h2{font-size:29px}.consultation-topics h3{font-size:21px}.zalo-floating{font-size:14px}.sample-card figcaption strong{font-size:18px}.footer-brand img{width:78px;height:78px}}
/* Keep the celestial header proportions independent of legacy language rules. */
.header .brand .celestial-wordmark{font:500 20px/1.3 var(--display);letter-spacing:.12em}
html[lang=vi] .celestial-hero h1,.celestial-hero h1{font:400 clamp(36px,4.3vw,56px)/1.18 var(--display);letter-spacing:-.025em}
@media(max-width:600px){.header .brand .celestial-wordmark{font-size:17px}html[lang=vi] .celestial-hero h1,.celestial-hero h1{font-size:35px;line-height:1.2}}
