:root{--ink:#232323;--muted:#646464;--orange:#f76b43;--line:#e5e5e3;--paper:#f6f6f4}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;color:var(--ink);background:#fff;font:16px/1.6 Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--orange);outline-offset:4px}.wrap{max-width:1440px;margin:auto;padding:0 5%}.topline{background:var(--ink);color:#fff;padding:8px 5%;font-size:13px;display:flex;justify-content:space-between;gap:20px}.topline span:last-child{color:#ddd}header{position:sticky;top:0;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);z-index:10}.nav{height:78px;display:flex;align-items:center;justify-content:space-between;gap:22px}.logo img{width:153px;height:75px;object-fit:contain;display:block}nav{display:flex;gap:30px;align-items:center;font-size:14px;font-weight:600}.button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 22px;border:1px solid var(--ink);background:var(--ink);color:#fff;font-size:14px;font-weight:600;transition:background .18s}.button:hover{background:#454545}.button.orange{background:var(--orange);border-color:var(--orange);color:#171717}.button.outline{background:transparent;color:var(--ink)}.crumbs{font-size:13px;color:var(--muted);padding-top:18px}.crumbs span{padding:0 10px;color:#aaa}.hero{display:grid;grid-template-columns:1fr 1fr;gap:4%;padding-top:20px;padding-bottom:30px;align-items:center}.eyebrow{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:#a93b1d}.hero h1{font-size:clamp(42px,5.4vw,76px);letter-spacing:-3px;line-height:1.07;font-weight:500;margin:22px 0}.hero h1 em{font-style:normal;color:var(--orange)}.hero p{max-width:490px;color:var(--muted);font-size:17px;line-height:1.7}.hero .actions{display:flex;gap:12px;margin:20px 0}.hero-visual{position:relative;min-width:0;background:#f6f6f6}.hero-visual>img{width:100%;height:auto;aspect-ratio:1.05;object-fit:contain;display:block}.visual-label{position:absolute;left:20px;bottom:20px;background:#fff;padding:12px 18px;border-left:3px solid var(--orange);font-size:13px}.visual-label strong{display:block;font-size:15px}.stats{display:flex;gap:34px;margin-top:20px;font-size:12px;color:var(--muted)}.stats strong{display:block;font-size:25px;color:var(--ink);font-weight:500}.section{padding:40px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:18px}h2{font-size:clamp(30px,3.2vw,44px);letter-spacing:-1.3px;font-weight:500;line-height:1.2;margin:10px 0}h3{font-weight:500}.section-head p{max-width:440px;color:var(--muted);margin-bottom:0;font-size:15px}.catalog{background:var(--paper);border-top:1px solid var(--line)}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;border-bottom:1px solid #d7d7d5;padding-bottom:14px;flex-wrap:wrap}.search{background:#fff;border:1px solid #d4d4d0;padding:12px 15px;width:300px;max-width:100%;border-radius:0}.filters{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.filter{border:1px solid #d8d8d5;padding:9px 15px;background:#fff;font-size:14px;color:#444}.filter.active{background:var(--ink);border-color:var(--ink);color:white}.filter span{opacity:.6;margin-left:7px;font-size:12px}.category-info{max-width:880px;color:var(--muted);font-size:15px;margin:0 0 18px}.result-count{font-size:14px;color:var(--muted)}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 16px}.card{min-width:0;background:#fff;border:1px solid #e3e3df;content-visibility:auto;contain-intrinsic-size:auto 415px}.photo{display:block;width:100%;border:0;background:#fff;padding:0;position:relative;overflow:hidden}.photo img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;transition:transform .4s}.photo:hover img{transform:scale(1.035)}.zoom-tag{position:absolute;right:12px;bottom:12px;background:#fffffff0;border:1px solid #ddd;width:32px;height:32px;border-radius:50%;font-size:20px;color:#333}.card-body{padding:16px}.card .sub{font-size:12px;color:#986044}.card h3{font-size:16px;line-height:1.4;margin:7px 0 12px;min-height:44px}.card-foot{display:flex;justify-content:space-between;gap:8px;align-items:center;border-top:1px solid #eee;padding-top:12px}.ref{font-size:12px;color:#777}.inquiry{font-size:13px;font-weight:700;border-bottom:1px solid var(--orange);padding:4px 0}.empty{grid-column:1/-1;padding:60px;text-align:center;color:var(--muted)}.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:24px}.guide-card{border-top:2px solid var(--ink);padding-top:18px}.guide-card .number{color:var(--orange);font-size:14px}.guide-card h3{font-size:22px;margin:10px 0}.guide-card p{color:var(--muted);font-size:15px}.contact{background:#242424;color:#fff}.contact-inner{display:grid;grid-template-columns:1.2fr 1fr;gap:80px}.contact h2{font-size:clamp(35px,4vw,56px)}.contact p{color:#c9c9c9;max-width:500px}.contact-details{border-left:1px solid #555;padding-left:45px}.contact-details small{display:block;color:#aaa;margin:18px 0 4px;font-size:13px}.contact-details a{display:block;font-size:19px}.contact-details address{font-style:normal;color:#ccc;font-size:15px}.footer{display:flex;justify-content:space-between;gap:22px;padding:24px 0;font-size:13px;color:#777}.top-link{text-decoration:underline}dialog{padding:0;border:0;width:min(1050px,94vw);max-height:93vh;overflow:auto;color:var(--ink)}dialog::backdrop{background:#000b;backdrop-filter:blur(4px)}.modal-layout{display:grid;grid-template-columns:1.25fr 1fr}.modal-image{width:100%;height:auto;max-height:85vh;object-fit:contain;background:#f5f5f5}.modal-copy{padding:42px 24px 24px;align-self:center}.modal-copy h2{font-size:29px}.modal-copy p{color:var(--muted);font-size:15px}.close{position:absolute;right:13px;top:12px;z-index:1;background:white;border:1px solid #ccc;width:38px;height:38px;font-size:24px;line-height:1}.modal-nav{display:flex;gap:8px;margin-top:25px}.modal-nav button{padding:8px 14px;border:1px solid #ccc;background:#fff;font-size:14px}.modal-ref{font-size:13px;color:#777}.fixed-wa{position:fixed;right:22px;bottom:22px;z-index:9;background:var(--ink);color:#fff;padding:12px 19px;box-shadow:0 3px 14px #0002;font-size:14px;border:1px solid #666}.catalog-note{font-size:12px;color:#777;margin-top:25px}.mobile-label{display:none}@media(min-width:1600px){.wrap{padding:0 35px}}@media(max-width:1050px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}nav{gap:20px}.hero h1{letter-spacing:-2px}.hero p{font-size:16px}.hero .actions{flex-wrap:wrap}.contact-inner{gap:35px}}@media(max-width:700px){.topline{font-size:12px}.topline span:last-child{display:none}.nav{height:68px}.logo img{width:120px;height:63px}nav{gap:16px}nav>a:not(.button){display:none}nav .button{padding:9px 14px;min-height:40px;font-size:12px}.wrap{padding:0 5%}.crumbs{font-size:12px;padding-top:14px}.hero{grid-template-columns:1fr;padding-top:16px;padding-bottom:24px;gap:20px}.hero h1{font-size:45px;letter-spacing:-2px;margin:16px 0}.hero p{font-size:16px;margin-bottom:20px}.hero .actions{margin:20px 0}.hero-visual>img{aspect-ratio:1.3}.stats{margin-top:22px;gap:35px}.stats strong{font-size:22px}.section{padding:28px 0}.section-head{display:block}.section-head p{font-size:14px}.toolbar{align-items:start}.search{width:100%}.filters{flex-wrap:nowrap;overflow:auto;padding:0 0 9px;margin:18px 0;scrollbar-width:thin}.filter{flex:0 0 auto}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 10px}.card-body{padding:11px}.card h3{font-size:14px;min-height:40px;margin-bottom:10px}.card-foot{align-items:start;flex-direction:column;gap:5px}.card .sub{font-size:12px}.ref{font-size:12px}.inquiry{font-size:12px}.guide-grid{grid-template-columns:1fr;gap:20px}.guide-card h3{font-size:20px}.contact-inner{grid-template-columns:1fr;gap:20px}.contact-details{padding-left:0;border-left:0;border-top:1px solid #555;padding-top:15px}.footer{flex-direction:column;gap:6px;padding-bottom:80px}.modal-layout{grid-template-columns:1fr}.modal-image{max-height:50vh}.modal-copy{padding:18px}.modal-copy h2{font-size:25px}.fixed-wa{right:14px;bottom:14px;font-size:12px;padding:10px 15px}.visual-label{bottom:12px;left:12px;font-size:12px;padding:8px 12px}.visual-label strong{font-size:13px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}} 

/* Mobile layout: full-width imagery, readable controls and bounded grid tracks. */
.hero > *, .contact-inner > *, .modal-layout > * { min-width: 0; }
.card-body { display: flex; flex-direction: column; flex: 1; }
.card { display: flex; flex-direction: column; }
.card-foot { margin-top: auto; }
body:has(dialog[open]) { overflow: hidden; }
@media (max-width: 700px) {
  html { scroll-padding-top: 84px; }
  .wrap { padding-inline: 16px; }
  .hero { grid-template-columns: minmax(0, 1fr); }
  .hero h1 { font-size: clamp(34px, 9.5vw, 45px); letter-spacing: -1.5px; }
  .hero-visual { width: 100%; }
  .hero-visual > img { width: 100%; height: auto; aspect-ratio: auto; object-fit: contain; }
  .visual-label { position: static; padding: 10px 12px; font-size: 12px; }
  .visual-label strong { font-size: 14px; }
  .hero .actions { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .hero .actions .button { width: 100%; }
  .stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
  .stats strong { font-size: clamp(18px, 5.5vw, 22px); }
  nav .button { min-height: 44px; font-size: 14px; }
  .toolbar > label { display: block; width: 100%; min-width: 0; }
  .search { width: 100%; min-width: 0; font-size: 16px; }
  .filters { max-width: 100%; }
  .filter { min-height: 44px; }
  .section-head p { font-size: 16px; }
  .card { contain-intrinsic-size: auto 320px; }
  .card h3, .card .sub { overflow-wrap: anywhere; }
  .card h3 { min-height: 0; }
  .card-foot { padding-top: 8px; }
  .inquiry { display: flex; align-items: center; min-height: 44px; font-size: 14px; line-height: 1.4; }
  .zoom-tag { width: 28px; height: 28px; right: 8px; bottom: 8px; }
  .empty { padding: 24px 12px; }
  .contact-inner, .guide-grid { grid-template-columns: minmax(0, 1fr); }
  .contact-details a, .footer { overflow-wrap: anywhere; }
  .contact-details a { font-size: 18px; }
  dialog { width: calc(100% - 24px); max-width: none; max-height: 92dvh; }
  .modal-layout { grid-template-columns: minmax(0, 1fr); }
  .modal-image { max-height: 48dvh; display: block; }
  .modal-copy h2 { font-size: 24px; overflow-wrap: anywhere; }
  .modal-copy .button { width: 100%; }
  .modal-nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 16px; }
  .modal-nav button { min-height: 44px; padding: 8px; }
  .close { width: 44px; height: 44px; }
  .fixed-wa { min-height: 44px; display: flex; align-items: center; font-size: 14px; bottom: max(12px, env(safe-area-inset-bottom)); }
  .footer { padding-bottom: calc(80px + env(safe-area-inset-bottom)); }
}
