button,input,select,textarea{font:inherit;letter-spacing:0}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.55}[hidden]{display:none!important}.button{display:inline-flex;align-items:center;justify-content:center;padding:10px 18px;background:var(--accent);color:#faf8f3;border:1px solid var(--accent);border-radius:0;font-size:14px;line-height:1.5}.text-link{display:inline-block;margin-top:16px;text-decoration:underline;text-underline-offset:5px}.hero:has(.slideshow){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:52px;align-items:center}.hero:has(.slideshow) h1{font-size:64px}.slideshow{position:relative;aspect-ratio:4/3;min-width:0;background:var(--surface);overflow:hidden}.slide{position:absolute;inset:0;margin:0;opacity:0;transition:opacity .7s ease}.slide.current{opacity:1;z-index:1}.slide img{display:block;width:100%;height:100%;object-fit:contain}.slide-controls{position:absolute;bottom:12px;right:12px;z-index:2;display:flex;align-items:center;gap:12px;background:var(--paper);color:var(--ink);border:1px solid var(--line);padding:4px 8px;font-size:13px}.slide-controls button{width:36px;height:36px;border:0;background:transparent}.post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;margin-top:40px}.post-card{min-width:0}.post-card img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block;background:#eee}.post-card h3{font-size:22px;line-height:1.55;margin:12px 0}.post-card h3 a:hover{text-decoration:underline;text-underline-offset:5px}.post-card p{color:var(--muted)}.post-meta{font-size:14px;color:var(--muted);margin-top:20px}.page-title{font-size:44px;line-height:1.45;margin:20px 0 24px}.filters{display:flex;flex-wrap:wrap;gap:12px 28px;margin:32px 0;border-bottom:1px solid var(--line);padding-bottom:20px}.filters [aria-current]{text-decoration:underline;text-underline-offset:7px}.article{max-width:880px}.article figure{margin:36px 0}.article img{width:100%;height:auto;object-fit:contain}.article figcaption{font-size:14px;color:var(--muted);margin-top:10px}.article-lead{font-size:20px;color:var(--muted)}.article-body p{margin:24px 0}.article-body h2{margin:36px 0 20px;font-size:28px}.back-link{font-size:14px;color:var(--muted)}.article-body{overflow-wrap:anywhere}@media(max-width:1000px){.hero:has(.slideshow){gap:32px}.hero:has(.slideshow) h1{font-size:48px}.nav{gap:20px}}@media(max-width:760px){.hero:has(.slideshow){grid-template-columns:minmax(0,1fr);gap:32px}.post-grid{grid-template-columns:minmax(0,1fr);gap:36px}.page-title{font-size:32px}.hero:has(.slideshow) h1{font-size:44px}.slideshow{width:100%}.topbar{flex-wrap:wrap}.nav{gap:14px 20px}}@media(prefers-reduced-motion:reduce){.slide{transition:none}}

/* Ferry Archi: nền trung tính, điểm nhấn nâu–be theo logo đã chốt. */
.brand-logo{display:block;width:220px;max-width:100%;height:auto}.brand small{margin-top:2px;font-size:11px}.nav a:hover,.text-link:hover{color:var(--accent)}
.hero-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:32px}.hero-actions .text-link{margin-top:0;font-size:14px}.button:hover{background:#30261c;border-color:#30261c}
.hero:has(.slideshow){grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);gap:48px}.hero:has(.slideshow) h1{font-size:56px}.hero:has(.slideshow) .hero-copy>p{font-size:22px}.hero:has(.slideshow) .hero-meta{margin-top:28px;gap:12px 24px}
.hero-gallery{min-width:0}.gallery-caption{font-size:12px!important;color:var(--muted);margin-top:12px;line-height:1.6!important}.slideshow{background:var(--surface)}.slide img{object-fit:contain}.slide-controls{bottom:10px;right:10px}.slide-controls button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.eyebrow,.service-no{color:var(--accent)}.project-note{font-size:13px;margin-top:8px}.project-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:32px 24px;margin-top:40px}.project-gallery figure{margin:0;min-width:0}.project-gallery img{display:block;width:100%;height:auto;background:var(--surface)}.project-gallery figcaption{font-size:12px;color:var(--muted);margin-top:10px}.project-gallery a{display:block}.project-gallery a:hover{opacity:.94}.approach .principle span{color:var(--sand)}
@media(max-width:1000px){.hero:has(.slideshow){gap:28px}.hero:has(.slideshow) h1{font-size:46px}.nav{gap:16px}.brand-logo{width:200px}.project-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.hero:has(.slideshow){grid-template-columns:minmax(0,1fr);gap:28px}.hero:has(.slideshow) h1{font-size:44px}.hero:has(.slideshow) .hero-copy>p{font-size:20px}.hero-actions{gap:16px}.brand-logo{width:210px}.project-gallery{gap:28px 18px}}
@media(max-width:480px){.project-gallery{grid-template-columns:minmax(0,1fr)}.nav{font-size:13px;gap:12px 18px}.brand small{font-size:11px}.hero:has(.slideshow) h1{font-size:40px}}
/* Project pages: introduction first, followed by images without captions. */
.project-card img{height:auto;aspect-ratio:auto;object-fit:contain}.project-list{grid-template-columns:repeat(3,minmax(0,1fr))}.project-detail{max-width:1100px}.project-summary{margin-top:32px}.project-summary .page-title{font-size:38px}.project-introduction .post-meta{margin:0 0 20px}.project-introduction .article-lead{font-size:17px;white-space:normal}.project-specs{margin:28px 0 0}.project-specs>div{padding:14px 0;border-top:1px solid var(--line)}.project-specs dt{font-weight:500;color:var(--accent)}.project-specs dd{margin:4px 0 0;color:var(--muted)}.project-images{display:grid;gap:36px;margin-top:48px}.project-images figure{margin:0}.project-images img{display:block;width:100%;height:auto}.section-head{overflow-x:clip}
/* One-time motion, hidden only after successful observer setup. */
:root{--reveal-distance:96px}.reveal-active{animation-duration:1.7s;animation-timing-function:cubic-bezier(.25,.55,.3,1);animation-fill-mode:both}.reveal-left.reveal-active{animation-name:ferry-from-left}.reveal-right.reveal-active{animation-name:ferry-from-right;animation-delay:.22s}
@keyframes ferry-from-left{from{opacity:0;transform:translateX(calc(-1 * var(--reveal-distance)))}to{opacity:1;transform:translateX(0)}}
@keyframes ferry-from-right{from{opacity:0;transform:translateX(var(--reveal-distance))}to{opacity:1;transform:translateX(0)}}
@media(max-width:760px){:root{--reveal-distance:64px}.project-list{grid-template-columns:minmax(0,1fr)}.project-summary .page-title{font-size:30px}.project-images{gap:24px;margin-top:32px}}
@media(prefers-reduced-motion:reduce){.reveal-active{animation:none!important;opacity:1!important;transform:none!important}}

.reveal-pending{opacity:0}.reveal-left.reveal-pending{transform:translateX(calc(-1 * var(--reveal-distance)))}.reveal-right.reveal-pending{transform:translateX(var(--reveal-distance))}
.contact-links{min-width:0}.contact-row{display:grid;grid-template-columns:minmax(0,1fr) 48px;align-items:center;gap:18px;padding:14px 0;border-bottom:1px solid var(--line);min-height:76px}.contact-copy{display:grid;gap:3px;min-width:0}.contact-label{font-size:12px;color:var(--muted)}.contact-value{font-size:15px;color:var(--ink);overflow-wrap:anywhere}.contact-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:transparent;border:0}.contact-icon img{display:block;width:36px;height:36px;object-fit:contain}.contact-icon--phone img,.contact-icon--zalo img{width:40px;height:40px}.contact-icon--youtube img{width:54px;max-width:none;height:auto}.contact-icon--maps img{width:28px;height:40px}a.contact-row:hover .contact-copy{text-decoration:underline;text-underline-offset:4px}.contact-address{font-size:14px;margin-top:20px;overflow-wrap:anywhere}
@media(max-width:480px){.contact-row{gap:12px}.contact-value{font-size:14px}}
@media(prefers-reduced-motion:reduce){.reveal-pending{opacity:1!important;transform:none!important}}
@media print{.reveal-pending,.reveal-active{opacity:1!important;transform:none!important;animation:none!important}}

/* Clip horizontal entrances without creating a sideways scrollbar. */
body{overflow-x:clip}.studio-action{margin-top:24px}.consultation-page{max-width:880px}.consultation-lead{color:var(--muted);max-width:650px}.consultation-form{margin-top:32px}.consultation-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 28px}.consultation-fields label{display:block;font-size:14px;min-width:0}.consultation-fields input,.consultation-fields select,.consultation-fields textarea{display:block;width:100%;min-width:0;margin-top:8px;padding:12px;border:1px solid var(--line);border-radius:0;background:white;color:var(--ink);font-size:16px;line-height:1.6}.consultation-fields textarea{resize:vertical}.consultation-wide{grid-column:1/-1}.consultation-form :focus-visible{outline:2px solid var(--accent);outline-offset:3px}.consultation-consent{display:flex;align-items:start;gap:12px;margin:28px 0 20px;font-size:14px;color:var(--muted)}.consultation-consent input{width:20px;height:20px;flex-shrink:0;margin-top:3px}.consultation-hint{font-size:14px;color:var(--muted);margin:20px 0}.consultation-status{margin-top:16px;overflow-wrap:anywhere}.consultation-status.error{color:#a51c1c}.consultation-trap{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.consultation-success{padding:28px;border:1px solid var(--sand);margin-top:32px}.consultation-success h2{margin:0 0 16px}.consultation-success a{display:inline-block;margin-top:20px;text-decoration:underline;text-underline-offset:4px}
@media(max-width:640px){.consultation-fields{grid-template-columns:minmax(0,1fr);gap:20px}.studio-action .button{width:100%;padding:14px}.consultation-form>.button{width:100%;min-height:48px}}

.contact-pending .contact-value{color:var(--muted)}

/* Center topic headings inside their own columns; keep long body copy readable. */
.hero-copy{text-align:center}.hero-copy>p{margin-inline:auto}.hero-meta{justify-content:center}.hero-actions{justify-content:center}.section-head>:first-child{text-align:center}.section-head>:first-child h2{margin-inline:auto}.service-no,.service h3{text-align:center}.approach-grid>:first-child>.eyebrow,.approach-grid h2{text-align:center}.approach-grid h2{margin-inline:auto}
/* Tiêu đề trong bài viết */
.section.article .article-body h2 {
  max-width: none;
  font-size: 28px;
  line-height: 1.5;
  text-wrap: wrap;
}

@media (max-width: 640px) {
  .section.article .article-body h2 {
    font-size: 24px;
  }
}
/* Tăng logo và chỉnh bố cục bài viết */
.topbar .brand-logo {
  width: 275px;
}

.topbar .brand small {
  font-size: 14px;
  line-height: 1.5;
  margin-top: 4px;
}

.post-grid:not(.project-list) {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 1000px) {
  .topbar .brand-logo {
    width: 245px;
  }
}

@media (max-width: 760px) {
  .post-grid:not(.project-list) {
    grid-template-columns: minmax(0, 1fr);
  }
}
.hero .eyebrow,
.section .eyebrow {
  font-size: 16px;
  font-weight: 500;
}

@media (max-width: 760px) {
  .hero .eyebrow,
  .section .eyebrow {
    font-size: 15px;
  }
}

/* Form tư vấn ngắn gọn; thông số bổ sung mở khi cần. */
.consultation-heading{text-align:center;margin-top:24px}.consultation-heading .consultation-lead{margin-inline:auto}.consultation-heading .page-title{font-size:36px;line-height:1.5;margin:12px 0 16px}
.consultation-needs{border:0;padding:0;margin:0;min-width:0}.consultation-needs legend{font-size:14px;font-weight:500}.field-hint{font-size:13px;color:var(--muted)}.consultation-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}.consultation-options label{display:flex;align-items:center;gap:12px;border:1px solid var(--line);background:#fff;padding:12px;cursor:pointer}.consultation-options input{width:18px;min-height:0;height:18px;padding:0;margin:0;flex-shrink:0;accent-color:#282828}.consultation-options label:has(input:checked){border-color:#282828;background:#efefef}
.consultation-details{border-block:1px solid var(--line);padding-block:16px}.consultation-details summary{cursor:pointer;font-size:15px;font-weight:500}.consultation-details summary span{font-weight:400;font-size:13px;color:var(--muted);margin-left:8px}.consultation-details>.consultation-fields{margin-top:20px}.consultation-form [hidden],.consultation-success[hidden]{display:none}.consultation-form .button{cursor:pointer}.consultation-form .button:disabled{opacity:.6;cursor:wait}
@media(max-width:640px){.consultation-heading .page-title{font-size:28px}.consultation-options{grid-template-columns:minmax(0,1fr)}}

/* Trên điện thoại, ảnh dự án luôn hiện; kể cả khi đổi kích thước màn hình. */
@media(max-width:760px){
  .project-list.reveal-pending,.project-list.reveal-active,
  .project-images.reveal-pending,.project-images.reveal-active{
    opacity:1!important;transform:none!important;animation:none!important;
  }
}

.estimate-page{max-width:1000px}.consultation-fields label.estimate-toggle{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:500}.estimate-toggle input{width:20px;height:20px;min-width:20px;margin:0;padding:0;accent-color:#282828}
.estimate-result{margin-top:40px;scroll-margin-top:24px}.estimate-result h2{margin:0 0 12px}.estimate-result>p{color:var(--muted)}.estimate-total{display:grid;gap:8px;padding:24px;background:#efefef;margin:24px 0}.estimate-total strong{font-size:clamp(26px,5vw,38px);line-height:1.4;overflow-wrap:anywhere}.estimate-total>span:last-child{font-size:14px;color:var(--muted)}
.estimate-table-wrap{overflow-x:auto;max-width:100%;border:1px solid var(--line);margin-bottom:20px}.estimate-table{border-collapse:collapse;width:100%;min-width:740px;font-size:13px}.estimate-table th,.estimate-table td{padding:12px;text-align:right;border-bottom:1px solid var(--line);vertical-align:middle}.estimate-table th:first-child,.estimate-table td:first-child{text-align:left}.estimate-table thead,.estimate-table tfoot{background:#ededed}.estimate-table tfoot{font-weight:500}.estimate-table tfoot th{text-align:left}.estimate-page .button{cursor:pointer}.estimate-result .hero-actions{justify-content:flex-start}.estimate-result:focus-visible,.estimate-table-wrap:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
@media(max-width:640px){.estimate-page .hero-actions{align-items:stretch;flex-direction:column}.estimate-table-wrap::before{content:'Vuốt ngang để xem đủ bảng →';display:block;font-size:12px;padding:10px;color:var(--muted)}}