/*
 * LUESS YAPI / V5 Interior design system
 * Layered over the unchanged V2 brand and motion styles (site.css).
 * Philosophy: architectural grid, square geometry, restrained gold accents.
 * Components use one shared scale; card corners are uniformly square (0px).
 */
.page-main {
  --inner-ink: var(--text);
  --inner-soft: var(--muted);
  --inner-accent: var(--gold);
  --inner-line: var(--line);
  --inner-panel: #ffffff;
  --inner-elevated: #ede9e2;
  --inner-gutter: clamp(20px, 5.5vw, 96px);
  --inner-width: 1216px;
  --inner-section-gap: clamp(64px, 7.6vw, 108px);
  --inner-grid-gap: clamp(18px, 2.2vw, 30px);
  --inner-card-pad: clamp(24px, 2.8vw, 36px);
  --inner-radius: 0px;
  background: var(--page);
  color: var(--inner-ink);
  min-height: 65svh;
  overflow: clip;
}
html[data-theme="dark"] .page-main {
  --inner-panel: #29251f;
  --inner-elevated: #201c17;
  --inner-ink: #f2eadf;
  --inner-soft: #c9beb0;
  --inner-line: rgba(226, 188, 117, .2);
}
.page-main *, .page-main *::before, .page-main *::after { box-sizing: border-box; }
.page-main .container { width: min(var(--inner-width), calc(100% - 2 * var(--inner-gutter))); margin-inline: auto; min-width: 0; }
.page-main :where(h1,h2,h3,h4,p,ul,ol) { margin-top: 0; }
.page-main :where(p, li) { line-height: 1.75; }
.page-main :where(p,li) { overflow-wrap: break-word; }
.page-main a { color: inherit; text-decoration: none; }
.page-main img { display: block; max-width: 100%; height: auto; }
.page-main svg { flex-shrink: 0; }
.page-main .gold { color: var(--inner-accent); }
.page-main :where(.vm-card,.value-card,.why-card,.sidebar-card,.info-card,.project-card,.blog-card,.rel-card,.featured-post, .form-group input, .form-group textarea, .form-group select) { border-radius: var(--inner-radius); }

/* Shared page mastheads; existing V2 photo assets, type and visual treatment. */
.page-main :where(.page-hero,.post-hero) {
  position: relative; isolation: isolate; display: flex; align-items: center;
  min-height: clamp(325px, 32vw, 475px);
  padding: clamp(80px, 8vw, 115px) 0 clamp(64px, 7vw, 90px);
  overflow: hidden; background: #25231f; color: #fff;
}
.page-main .post-hero { min-height: clamp(390px, 34vw, 515px); }
.page-main :where(.page-hero,.post-hero) .hero-bg {
  position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(105deg,rgba(18,21,21,.82),rgba(18,21,21,.38)),url('/assets/hero-bg-1920.webp') center/cover no-repeat;
}
.page-main :where(.page-hero,.post-hero) .hero-bg[style] { background-position: center; background-size: cover; }
.page-main .hero-overlay { position: absolute; inset: 0; background: linear-gradient(95deg,rgba(10,12,12,.55),transparent); pointer-events: none; }
.page-main .hero-content { z-index: 1; position: relative; width: 100%; }
.page-main .breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 25px; font-size: 12px; line-height: 1.4; color: rgba(255,255,255,.82); }
.page-main .breadcrumb a:hover { color: #e2bc75; }
.page-main :where(.page-title,.post-title) { max-width: 1020px; margin: 0; font-size: clamp(42px, 5.9vw, 83px); font-weight: 400; line-height: 1.095; letter-spacing: -.064em; overflow-wrap: break-word; text-wrap: balance; }
.page-main .post-title { max-width: 950px; font-size: clamp(38px, 5vw, 70px); }
.page-main :where(.page-subtitle,.hero-location,.post-meta) { max-width: 760px; margin: 21px 0 0; color: rgba(255,255,255,.82); font-size: clamp(15px,1.4vw,18px); line-height: 1.65; }
.page-main .post-category, .page-main .project-category { display: inline-block; margin-bottom: 15px; color: #e8be78; font-size: 11px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.page-main .post-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 13px; }
.page-main .hero-location { display:flex; align-items: center; gap: 9px; }

/* Shared editorial rhythm and headings. */
.page-main .section { padding: var(--inner-section-gap) 0; border-top: 1px solid var(--inner-line); background: var(--page); }
.page-main :where(.page-hero,.post-hero) + .section { border-top: 0; }
.page-main .section-label { margin: 0 0 18px; font-size: 11px; font-weight: 750; letter-spacing: .21em; text-transform: uppercase; color: var(--inner-accent); }
.page-main .section-title { display: block; max-width: 840px; margin: 0 0 22px; font-size: clamp(30px, 3.5vw, 49px); font-weight: 450; line-height: 1.15; letter-spacing: -.05em; text-wrap: balance; }
.page-main h3 { margin: 0 0 13px; font-size: clamp(20px,2vw,25px); font-weight: 590; line-height: 1.3; letter-spacing: -.035em; }
.page-main .divider { display: block; width: 48px; height: 2px; margin: 21px 0 0; background: var(--inner-accent); }
.page-main .section-heading { text-align: center; margin-bottom: clamp(36px, 5vw, 58px); }
.page-main .section-heading .section-title { margin-inline: auto; }
.page-main .section-heading .divider { margin-inline: auto; }

/* Stable two- and three-column primitives. The same gap throughout interior pages. */
.page-main :where(.about-grid,.service-grid,.contact-grid,.post-layout,.detail-grid) { display: grid; gap: clamp(28px, 5.5vw, 74px); align-items: start; }
.page-main :where(.about-grid,.service-grid) { grid-template-columns: repeat(2,minmax(0,1fr)); align-items: center; }
.page-main :where(.about-grid,.service-grid,.contact-grid,.post-layout,.detail-grid) > * { min-width: 0; }
.page-main :where(.vm-grid,.values-grid,.why-grid,.projects-grid,.grid-3) { display: grid; gap: var(--inner-grid-gap); align-items: stretch; }
.page-main :where(.grid-3,.values-grid,.why-grid) { grid-template-columns: repeat(3,minmax(0,1fr)); }
.page-main .vm-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.page-main .projects-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }

/* Five facts/values: three at the top, two centered underneath, never an orphan row. */
@media (min-width: 981px) {
  .page-main :where(.values-grid,.why-grid).is-five { grid-template-columns: repeat(6,minmax(0,1fr)); }
  .page-main :where(.values-grid,.why-grid).is-five > * { grid-column: span 2; }
  .page-main :where(.values-grid,.why-grid).is-five > :nth-child(4) { grid-column: 2 / span 2; }
  .page-main :where(.values-grid,.why-grid).is-five > :nth-child(5) { grid-column: 4 / span 2; }
}

/* Cards share one border, padding, colors, transitions and square-corner geometry. */
.page-main :where(.vm-card,.value-card,.why-card,.sidebar-card,.info-card) { min-width: 0; padding: var(--inner-card-pad); background: var(--inner-panel); border: 1px solid var(--inner-line); }
.page-main :where(.value-card,.why-card,.vm-card) { display: flex; flex-direction: column; min-height: 216px; transition: border-color .28s, transform .28s var(--ease-premium); }
.page-main :where(.value-card,.why-card,.vm-card):hover { border-color: var(--inner-accent); transform: translateY(-3px); }
.page-main :where(.value-card,.why-card,.vm-card) p { margin: 0; max-width: 46ch; color: var(--inner-soft); font-size: 14px; line-height: 1.75; }
.page-main :where(.vm-icon,.value-icon) { display:grid; place-items:center; flex:0 0 auto; width:52px; height:52px; margin-bottom:23px; border-radius:50%; background:rgba(195,139,55,.12); color:var(--inner-accent); }
.page-main :where(.vm-icon,.value-icon) svg { width:26px; height:26px; }
.page-main .why-num { display:block; margin-bottom:23px; color:var(--inner-accent); font-size:12px; font-weight:800; }
.page-main :where(.value-card,.why-card,.vm-card) h3 { margin: 0 0 13px; }

/* About, services and their repeated media system. */
.page-main :where(.about-image,.service-visual,.main-image) { position: relative; min-width: 0; }
.page-main :where(.about-image > img,.service-visual img) { width: 100%; aspect-ratio: 1.17; object-fit: cover; border-radius: var(--inner-radius); }
.page-main .about-badge { position:absolute; left:20px; bottom:20px; display:flex; flex-direction:column; justify-content:center; align-items:center; width:138px; min-height:107px; padding:15px; background:var(--inner-panel); color:var(--inner-ink); border:1px solid var(--inner-line); }
.page-main .badge-number { font-size:40px; font-weight:560; letter-spacing:-.055em; line-height:1; }
.page-main .badge-text { margin-top:10px; font-size:11px; letter-spacing:.06em; text-transform:uppercase; }
.page-main :where(.about-text,.service-desc) { max-width: 66ch; margin: 0 0 17px; color: var(--inner-soft); font-size: 15px; }
.page-main .about-stats { display:grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap:18px; margin:34px 0 26px; }
.page-main .about-stat { display:flex; flex-direction:column; gap:8px; min-width:0; padding-top:14px; border-top:1px solid var(--inner-line); }
.page-main .about-stat > span:last-child { color:var(--inner-soft); font-size:11px; line-height:1.5; }
.page-main .about-stat .gold { font-family:Inter,sans-serif !important; font-size:clamp(24px,2.7vw,35px) !important; font-weight:560 !important; }
.page-main .service-grid.reverse > .service-visual { order:2; }
.page-main .service-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px 22px; margin:24px 0 30px; padding:0; list-style:none; }
.page-main .service-list li { display:flex; gap:10px; align-items:start; font-size:14px; line-height:1.55; }
.page-main .service-list li::before { content:''; flex:0 0 6px; width:6px; height:6px; margin-top:8px; background:var(--inner-accent); border-radius:50%; }

/* Buttons: V2's architectural square geometry is consistent throughout. */
.page-main :where(.btn-primary,.btn-outline,.cta-button) { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:48px; padding:14px 22px; border:1px solid var(--inner-ink); border-radius:0; background:var(--inner-ink); color:var(--page); font-size:12px; font-weight:750; line-height:1.25; letter-spacing:.04em; text-align:center; cursor:pointer; transition:color .25s,background .25s,transform .25s; }
.page-main :where(.btn-primary,.btn-outline,.cta-button):hover { background:transparent; color:var(--inner-ink); transform:translateY(-2px); }
.page-main .btn-outline { background:transparent; color:var(--inner-ink); }
.page-main .btn-outline:hover { color:var(--page); background:var(--inner-ink); }
.page-main a.btn-primary,.page-main a.cta-button,.page-main button.btn-primary { color:var(--page); }
.page-main a.btn-primary:hover,.page-main a.cta-button:hover,.page-main button.btn-primary:hover { color:var(--inner-ink); }
.page-main a.btn-outline { color:var(--inner-ink); }
.page-main a.btn-outline:hover { color:var(--page); }
.page-main .cta-band { padding:var(--inner-section-gap) 0; background:#1a1917; color:#f5f0e8; }
.page-main .cta-band-inner { display:flex; align-items:center; justify-content:space-between; gap:36px; }
.page-main .cta-band .section-title { max-width:690px; }
.page-main .cta-band p { max-width:66ch; color:rgba(245,240,232,.75)!important; }
.page-main .cta-band .btn-primary { flex-shrink:0; color:#151515!important; background:#f5f0e8; border-color:#f5f0e8; }
.page-main .cta-band .btn-primary:hover { color:#fff!important; background:transparent; }

/* Projects, blog cards, article recommendations. */
.page-main :where(.project-card,.blog-card,.featured-post,.rel-card) { min-width:0; overflow:hidden; background:var(--inner-panel); border:1px solid var(--inner-line); transition:transform .32s var(--ease-premium),border-color .32s; }
.page-main :where(.project-card,.blog-card,.featured-post,.rel-card):hover { transform:translateY(-3px); border-color:var(--inner-accent); }
.page-main :where(.card-link,.featured-link,.rel-card) { display:block; height:100%; }
.page-main :where(.card-image,.featured-image,.rel-image) { position:relative; overflow:hidden; background:var(--inner-elevated); }
.page-main :where(.card-image img,.rel-image img) { display:block; width:100%; aspect-ratio:1.56; object-fit:cover; transition:transform .55s var(--ease-premium); }
.page-main .blog-card .card-image img { aspect-ratio:1.55; }
.page-main :where(.project-card,.blog-card,.featured-post,.rel-card):hover img { transform:scale(1.025); }
.page-main .card-overlay { position:absolute; left:16px; top:16px; right:16px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.page-main :where(.card-overlay span,.card-image > .card-category,.featured-badge) { display:inline-flex; padding:8px 11px; background:rgba(245,241,233,.93); color:#151515; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.page-main :where(.card-image > .card-category,.featured-badge) { position:absolute; bottom:16px; left:16px; }
.page-main .card-hover-btn { display:none; }
.page-main :where(.card-body,.rel-body) { padding:clamp(22px,2.5vw,30px); }
.page-main .card-title { margin-bottom:14px; }
.page-main .card-location { display:flex; align-items:center; gap:8px; margin:0 0 11px; color:var(--inner-soft); font-size:13px; }
.page-main :where(.card-desc,.card-excerpt) { margin:0 0 15px; color:var(--inner-soft); font-size:14px; line-height:1.75; }
.page-main .card-meta { color:var(--inner-soft); font-size:12px; }
.page-main .card-more { display:inline-block; margin-top:18px; color:var(--inner-accent); font-size:12px; font-weight:750; }
/* A single published project is a complete featured presentation, not half a grid. */
.page-main .projects-grid.is-single { grid-template-columns: minmax(0,1fr); }
@media(min-width:781px) {
  .page-main .projects-grid.is-single .project-card .card-link { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); }
  .page-main .projects-grid.is-single .project-card .card-image img { height:100%; min-height:375px; aspect-ratio:auto; }
  .page-main .projects-grid.is-single .project-card .card-body { display:flex; flex-direction:column; justify-content:center; }
}
.page-main .featured-post { margin-bottom:clamp(54px,7vw,82px); }
.page-main .featured-link { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); }
.page-main .featured-image img { width:100%; height:100%; min-height:340px; object-fit:cover; transition:transform .55s var(--ease-premium); }
.page-main .featured-content { display:flex; flex-direction:column; justify-content:center; padding:clamp(28px,4vw,55px); }
.page-main .featured-content p { color:var(--inner-soft); }
.page-main .featured-content .post-meta { color:var(--inner-soft); font-size:12px; margin-top:10px; }
.page-main .posts-header { margin-bottom:clamp(24px,3vw,34px); }
.page-main .rel-body h3 { font-size:clamp(17px,1.6vw,21px); line-height:1.32; }
.page-main .rel-body p { margin:0; color:var(--inner-soft); font-size:12px; }

/* Actual editorial semantics. Strong hierarchy: display H1 > article H2 > H3 > body. */
.page-main .post-layout { grid-template-columns:minmax(0,2.12fr) minmax(260px,.92fr); }
.page-main .post-body { min-width:0; max-width:850px; color:var(--inner-soft); }
.page-main .post-lead { max-width:75ch; margin:0 0 25px; color:var(--inner-ink); font-size:clamp(18px,1.7vw,21px); font-weight:460; line-height:1.65; }
.page-main .post-content { max-width:74ch; color:var(--inner-soft); font-size:16px; }
.page-main .post-content :where(.article-paragraph,p) { margin:0 0 22px; font-size:16px; font-weight:400; line-height:1.85; letter-spacing:0; }
.page-main .post-content h2.article-heading { margin:42px 0 15px; color:var(--inner-ink); font-size:clamp(26px,2.5vw,35px); font-weight:570; line-height:1.25; letter-spacing:-.035em; text-wrap:balance; }
.page-main .post-content h3.article-heading { margin:30px 0 11px; color:var(--inner-ink); font-size:clamp(19px,2vw,24px); font-weight:600; line-height:1.35; letter-spacing:-.02em; }
.page-main .post-content :where(.article-paragraph,h2.article-heading,h3.article-heading) { display:block; }
.page-main .article-list { margin:20px 0 30px; padding:0 0 0 29px; font-size:16px; }
.page-main .article-list li { padding-left:7px; margin:0 0 14px; line-height:1.8; }
.page-main .article-list li::marker { color:var(--inner-accent); font-weight:700; }
.page-main .post-content strong { color:var(--inner-ink); font-weight:650; }
.page-main .post-sidebar { display:grid; align-content:start; gap:var(--inner-grid-gap); }
.page-main .sidebar-card h3 { font-size:20px; }
.page-main .sidebar-card p { margin:0; color:var(--inner-soft); font-size:14px; }
.page-main .sidebar-card :where(.btn-primary,.btn-outline) { width:100%; margin-top:19px!important; }

/* Project detail and contact use exactly the same content rhythm. */
.page-main .detail-grid { grid-template-columns:minmax(0,1.92fr) minmax(270px,.94fr); }
.page-main .main-image img { width:100%; aspect-ratio:1.58; object-fit:cover; }
.page-main .detail-section { margin-top:40px; }
.page-main .detail-section h2 { margin:0 0 18px; font-size:clamp(27px,2.8vw,38px); font-weight:530; letter-spacing:-.04em; }
.page-main .detail-section > p { font-size:16px; color:var(--inner-soft); }
.page-main .feature-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:22px 0 0; padding:0; list-style:none; }
.page-main .feature-list li { display:flex; align-items:center; gap:10px; font-size:14px; }
.page-main .feature-list svg { color:var(--inner-accent); }
.page-main .info-list { margin-top:20px; }
.page-main .info-row { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:12px; padding:13px 0; border-bottom:1px solid var(--inner-line); font-size:14px; }
.page-main .info-row > :first-child { color:var(--inner-soft); }
.page-main .detail-sidebar .btn-primary { width:100%; }
.page-main .contact-grid { grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); }
.page-main .contact-form { display:grid; gap:17px; }
.page-main .form-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:17px; }
.page-main .form-group { min-width:0; }
.page-main .form-group label { display:block; margin:0 0 8px; font-size:12px; font-weight:670; }
.page-main .form-group :is(input:not([type="checkbox"]),textarea,select) { display:block; width:100%; min-width:0; margin:0; padding:14px 16px; border:1px solid var(--inner-line); border-radius:0; background:var(--inner-panel); color:var(--inner-ink); font:inherit; font-size:14px; }
.page-main .form-group textarea { min-height:138px; resize:vertical; }
.page-main .form-check { display:flex; align-items:start; gap:12px; }
.page-main .form-check label { font-weight:400; line-height:1.65; }
.page-main .form-check input { flex:0 0 18px; width:18px; height:18px; margin:1px 0 0; accent-color:var(--inner-accent); }
.page-main .info-block { display:flex; align-items:start; gap:16px; padding:20px 0; border-bottom:1px solid var(--inner-line); }
.page-main .info-icon { display:grid; place-items:center; flex:0 0 44px; height:44px; background:rgba(195,139,55,.12); color:var(--inner-accent); }
.page-main .info-block h3 { margin:0 0 6px; font-size:18px; }
.page-main .info-block p { margin:0; color:var(--inner-soft); font-size:14px; }
.page-main .map-placeholder { position:relative; display:grid; place-items:center; min-height:260px; margin-top:30px; background:linear-gradient(140deg,#c9c9c0,#e7e4d8); color:#111; text-align:center; }
.page-main .map-overlay { padding:20px; }
.page-main .form-note { color:var(--inner-soft); font-size:12px; line-height:1.6; }
.page-main .form-success,.page-main .field-error { display:none!important; }
.page-main [data-form-status] { color:var(--inner-accent); font-size:13px; }
.page-main a:focus-visible, .page-main button:focus-visible, .page-main :is(input,select,textarea):focus-visible { outline:2px solid var(--inner-accent); outline-offset:3px; }
/* Inner pages must never be hidden by the V2 one-page reveal observer. */
.page-main .reveal { opacity:1!important; transform:none!important; }

@media(max-width:980px) {
  .page-main :where(.values-grid,.why-grid,.grid-3) { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .page-main :where(.values-grid,.why-grid).is-five > :last-child { grid-column:1/-1; justify-self:center; width:50%; }
  .page-main :where(.post-layout,.detail-grid) { grid-template-columns:minmax(0,1fr); }
  .page-main .post-sidebar { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:780px) {
  .page-main :where(.page-hero,.post-hero) { min-height:300px; padding:74px 0 67px; }
  .page-main .post-hero { min-height:350px; }
  .page-main :where(.page-title,.post-title) { font-size:clamp(36px,9vw,62px); }
  .page-main :where(.about-grid,.service-grid,.contact-grid,.featured-link) { grid-template-columns:minmax(0,1fr); }
  .page-main .service-grid.reverse > .service-visual { order:initial; }
  .page-main :where(.vm-grid,.projects-grid) { grid-template-columns:minmax(0,1fr); }
  .page-main :where(.about-image > img,.service-visual img) { aspect-ratio:1.5; }
  .page-main .featured-image img { height:auto; min-height:0; aspect-ratio:1.65; }
  .page-main .cta-band-inner { flex-direction:column; align-items:flex-start; }
}
@media(max-width:560px) {
  .page-main { --inner-section-gap:58px; --inner-gutter:20px; --inner-grid-gap:18px; }
  .page-main :where(.values-grid,.why-grid,.grid-3,.feature-list,.service-list,.post-sidebar,.form-row) { grid-template-columns:minmax(0,1fr); }
  .page-main :where(.values-grid,.why-grid).is-five > :last-child { grid-column:auto; justify-self:stretch; width:auto; }
  .page-main .section-heading { margin-bottom:36px; }
  .page-main .post-content h2.article-heading { margin-top:35px; }
  .page-main .post-content :where(.article-paragraph,p) { font-size:15.5px; }
  .page-main .about-stats { gap:9px; }
  .page-main .about-badge { left:12px; bottom:12px; width:112px; min-height:84px; }
  .page-main .badge-number { font-size:32px; }
  .page-main .breadcrumb { margin-bottom:20px; font-size:11px; }
  .page-main .post-hero { min-height:315px; }
}
@media(prefers-reduced-motion:reduce) {
  .page-main *, .page-main *::before, .page-main *::after { animation-duration:.01ms!important; transition-duration:.01ms!important; }
}

/* Repeated utility details — no per-page inline spacing magic numbers. */
.page-main .rel-body > .gold { display:block; margin-bottom:10px; font-size:11px; font-weight:750; letter-spacing:.12em; text-transform:uppercase; }
.page-main .service-grid :where(a.btn-primary,a.btn-outline) { margin-top:12px; }
.page-main .cta-band p { margin:14px 0 0; }
.page-main .section-heading + * { margin-top:0; }