/*
Theme Name: SOLINA Landing
Description: Trang tư vấn dự án SOLINA Signature by Wyndham của Thủy Võ. Tông nâu kem theo tài liệu dự án.
Version: 1.0
Author: Thủy Võ
*/
:root{--nau:#4a2a1c;--nau2:#6b4230;--kem:#f4ece3;--kem2:#fbf7f1;--vang:#c8975a;--cam:#ff8a1f;--chu:#3b2a22;--xam:#7a6a60}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:'Be Vietnam Pro',Arial,sans-serif;color:var(--chu);background:var(--kem2);line-height:1.65;font-size:16px;padding-bottom:64px}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:'Playfair Display',Georgia,serif;color:var(--nau);line-height:1.25;margin:0 0 .5em}
h2{font-size:clamp(26px,4.4vw,38px)}
.khung{max-width:1120px;margin:0 auto;padding:0 18px}
section{padding:56px 0}
.nen{background:var(--kem)}
.dam{background:var(--nau);color:#f5e8da}
.dam h2,.dam h3{color:#f5e8da}
.phu{color:var(--xam);margin:-4px 0 26px}
.dam .phu{color:#d9c5b4}
header.tren{position:sticky;top:0;z-index:20;background:rgba(74,42,28,.97);color:#fff}
header.tren .khung{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:10px;padding-bottom:10px}
.logo{font-family:'Playfair Display',Georgia,serif;font-size:21px;letter-spacing:4px;text-decoration:none;color:#f5e8da;white-space:nowrap}
.logo small{display:block;font-family:'Be Vietnam Pro',Arial,sans-serif;font-size:9.5px;letter-spacing:1.6px}
nav.menu{display:flex;gap:18px;font-size:14px}
nav.menu a{text-decoration:none;color:#f5e8da}
.tel{background:var(--cam);color:#fff;font-weight:700;padding:8px 14px;border-radius:30px;text-decoration:none;white-space:nowrap;font-size:14px}
.hero{position:relative;color:#fff;background:var(--nau) center/cover no-repeat;padding:0}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(40,20,10,.25),rgba(40,20,10,.72))}
.hero .khung{position:relative;z-index:2;min-height:min(84vh,640px);display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:44px}
.hero h1{color:#fff;font-size:clamp(32px,6vw,58px);margin-bottom:.25em}
.hero p{font-size:clamp(16px,2.2vw,20px);max-width:720px;margin:0 0 20px}
.nut{display:inline-block;padding:13px 24px;border-radius:30px;font-weight:700;text-decoration:none;border:0;cursor:pointer;font-size:16px;font-family:inherit}
.nut.cam{background:var(--cam);color:#fff}
.nut.vien{border:2px solid #fff;color:#fff;margin-left:8px}
.so{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;text-align:center}
.so b{display:block;font-family:'Playfair Display',Georgia,serif;font-size:clamp(28px,4.6vw,42px);color:var(--nau)}
.so span{font-size:13.5px;color:var(--xam)}
.hai{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}
.bang{width:100%;border-collapse:collapse;background:#fff}
.bang td,.bang th{padding:11px 13px;border-bottom:1px solid #eadfd3;text-align:left;vertical-align:top;font-size:15px}
.bang th{background:var(--nau);color:#f5e8da;font-weight:600}
.bang td:first-child{font-weight:600;color:var(--nau);width:38%}
.the{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.the article{background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 2px 10px rgba(74,42,28,.09)}
.the article div{padding:14px 16px}
.the h3{font-size:20px;margin-bottom:4px}
.the p{margin:0;font-size:14.5px;color:var(--xam)}
.anh{border-radius:10px;overflow:hidden}
.ds{columns:2;padding-left:18px;margin:0}
.ds li{margin-bottom:4px;break-inside:avoid}
.phut{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}
.phut div{background:#fff;border-radius:8px;padding:12px;text-align:center;font-size:13.5px}
.phut b{display:block;font-size:24px;color:var(--nau);font-family:'Playfair Display',Georgia,serif}
.luu{font-size:13.5px;color:var(--xam);margin-top:12px}
.dam .luu{color:#d9c5b4}
.hoi details{background:#fff;border-radius:8px;margin-bottom:10px;padding:13px 16px}
.hoi summary{font-weight:600;cursor:pointer;color:var(--nau)}
.hoi p{margin:9px 0 2px}
.vd{position:relative;padding-top:56.25%;background:#000;border-radius:10px;overflow:hidden}
.vd iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
form.dk{background:#fff;color:var(--chu);padding:22px;border-radius:12px}
form.dk label{display:block;font-size:14px;font-weight:600;margin:0 0 10px}
form.dk input,form.dk select{display:block;width:100%;padding:11px;border:1px solid #cdbcad;border-radius:7px;font:inherit;margin-top:4px}
.an{position:absolute;left:-9999px}
.bao{background:#e8f6ea;color:#1f6b2d;padding:12px;border-radius:8px;margin-bottom:12px}
footer{background:#2d190f;color:#d9c5b4;padding:30px 0;font-size:13.5px}
footer a{color:#fff}
.noi{position:fixed;left:0;right:0;bottom:0;z-index:30;display:grid;grid-template-columns:1fr 1fr;box-shadow:0 -2px 10px rgba(0,0,0,.2)}
.noi a{padding:14px 6px;text-align:center;color:#fff;font-weight:700;text-decoration:none}
.noi .g{background:var(--cam)}
.noi .z{background:#0068ff}
.bv{max-width:780px;margin:0 auto;padding:40px 18px}
.bv h1{font-size:clamp(28px,5vw,40px)}
@media(max-width:820px){nav.menu{display:none}.hai{grid-template-columns:1fr}.the{grid-template-columns:1fr}.so{grid-template-columns:repeat(2,1fr)}.phut{grid-template-columns:repeat(2,1fr)}.ds{columns:1}section{padding:42px 0}.nut.vien{margin:10px 0 0}}