
/* Phong cách means aesthetic language, not a building category. */
.page-styles__hero>img{object-position:center 55%;}
.page-styles__hero::before{background:linear-gradient(90deg,#1d1510 0%,rgba(29,21,16,.96) 24%,rgba(29,21,16,.77) 43%,rgba(29,21,16,.16) 80%),linear-gradient(0deg,rgba(19,14,10,.24),transparent 42%);}
.style-index{padding-bottom:clamp(48px,5.7vw,88px);}
.style-index__top{display:grid;grid-template-columns:1.15fr .7fr;align-items:end;gap:clamp(24px,5vw,88px);}
.style-index__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(34px,4.3vw,65px);border-top:1px solid #cdb9a1;border-bottom:1px solid #cdb9a1;}
.style-index__link{min-width:0;display:flex;flex-direction:column;gap:15px;position:relative;padding:22px 20px 28px;border-right:1px solid #cdb9a1;font:clamp(21px,2.15vw,34px)/1.18 var(--serif);transition:background .35s ease,color .35s ease,padding .35s ease;}
.style-index__link:first-child{padding-left:0}.style-index__link:last-child{border-right:0}
.style-index__number{font:11px/1.2 var(--sans);color:#9d7e5a;letter-spacing:.16em}
.style-index__link>span:last-child{align-self:flex-end;font:19px/1 var(--sans);color:#9d7e5a;transition:transform .3s ease;}
.style-index__link:hover{background:#eee2d2;color:#38291e;padding-left:28px}.style-index__link:hover>span:last-child{transform:translate(4px,-3px)}
.style-feature-list{background:#f7efe3;}
.style-feature{scroll-margin-top:24px;display:grid;grid-template-columns:1fr 1fr;align-items:stretch;min-height:clamp(460px,44vw,680px);border-top:1px solid rgba(132,100,63,.24);}
.style-feature__visual{position:relative;min-height:clamp(380px,42vw,650px);background:#d7c7b2;overflow:hidden;}
.style-feature__visual img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform 1s cubic-bezier(.2,.7,.2,1);}
.style-feature:hover .style-feature__visual img{transform:scale(1.045);}
.style-feature__watermark{position:absolute;left:clamp(20px,3.5vw,60px);bottom:clamp(13px,2vw,32px);color:#fff8;font:clamp(58px,10vw,150px)/1 var(--serif);pointer-events:none;}
.style-feature__copy{padding:clamp(42px,6.5vw,112px) clamp(26px,6.5vw,112px);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;}
.style-feature__copy h2{font-size:clamp(36px,4vw,70px);line-height:1.02;letter-spacing:-.025em;margin:17px 0 22px;}
.style-feature__lead{font:clamp(17px,1.5vw,23px)/1.5 var(--serif);max-width:600px;}
.style-feature__desc{font:clamp(13px,1.1vw,16px)/1.76 var(--sans);margin-top:17px;color:#756556;max-width:550px;}
.style-feature__tags{display:flex;flex-wrap:wrap;gap:7px;margin:26px 0 24px;}
.style-feature__tags span{font:12px/1.2 var(--sans);color:#796148;border:1px solid #ccbca6;padding:7px 11px;white-space:nowrap}
.style-feature__action{border-bottom:1px solid #a98b64;padding-bottom:7px;color:#80613e;font:clamp(15px,1.35vw,18px) var(--serif);transition:color .25s ease,letter-spacing .25s ease;}
.style-feature__action:hover{color:#271a10;letter-spacing:.014em;}
.style-feature__action span{display:inline-block;transition:transform .3s;}.style-feature__action:hover span{transform:translate(3px,-3px)}
.style-feature--reverse .style-feature__visual{order:2}.style-feature--reverse .style-feature__copy{order:1;background:#f2e7d7}
.style-feature:nth-child(3) .style-feature__copy{background:#f8f0e6;}
.styles-closing{background:#231a15;color:#f5e9dc;padding:clamp(45px,6vw,97px) 0;}
.styles-closing__inner{display:flex;justify-content:space-between;align-items:end;gap:35px;}
.styles-closing h2{font-size:clamp(40px,4.5vw,73px);line-height:1.01;margin:13px 0 17px;}
.styles-closing p{font:clamp(15px,1.35vw,20px)/1.5 var(--serif);color:#d4c1ae;max-width:530px;}
.styles-closing .outline{color:#efe0cc;white-space:nowrap;}
@media(max-width:900px){.style-index__top{grid-template-columns:1fr 1fr}.style-index__link{padding:18px 13px 20px}.style-feature__copy{padding:36px 34px}.style-feature__visual{min-height:480px}}
@media(max-width:650px){
 .page-styles__hero>img{width:100%;opacity:.88}
 .style-index__top{grid-template-columns:1fr}.style-index{padding-bottom:40px}
 .style-index__grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:30px}
 .style-index__link{font-size:23px;min-height:130px;padding:17px 13px}
 .style-index__link:first-child{padding-left:13px}.style-index__link:nth-child(2){border-right:0}.style-index__link:nth-child(-n+2){border-bottom:1px solid #cdb9a1}
 .style-feature{display:flex;flex-direction:column;min-height:0}
 .style-feature__visual{width:100%;min-height:0;aspect-ratio:1.35/1}
 .style-feature__copy{padding:36px 5% 50px;order:2!important}
 .style-feature--reverse .style-feature__visual{order:1!important}
 .style-feature__copy h2{font-size:clamp(36px,9vw,55px)}
 .style-feature__desc{font-size:14px}.style-feature__lead{font-size:18px}
 .styles-closing__inner{flex-direction:column;align-items:start}.styles-closing .outline{align-self:flex-start}
}
