/**
 * ar-house.css
 * AR-HOUSE project page
 * Extracted from ar-house.html (head chrome block)
 */
:root {
  --black: #0a0a0a; --white: #f7f5f2;
  --gray-100: #edeae5; --gray-300: #bfb9b0;
  --gray-500: #857f77; --gray-700: #3f3b37;
  --accent: #b8956a;
  --nav-height: 68px;
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body: 'Jost', 'Helvetica Neue', Arial, sans-serif;
  --pad: 80px;
}
body { background: var(--white) !important; font-family: var(--font-body) !important; font-weight: 300 !important; color: var(--gray-700) !important; letter-spacing: 0.02em; -webkit-font-smoothing: antialiased; }
h1,h2,h3,h4,h5,h6 { font-family: var(--font-display) !important; font-weight: 300 !important; letter-spacing: 0.02em; }
p,li,td,th,address { font-family: var(--font-body) !important; font-weight: 300 !important; letter-spacing: 0.02em; }
.project-gallery .gallery-head h1 { font-family: var(--font-display) !important; font-weight: 300 !important; letter-spacing: 0.04em !important; font-size: clamp(26px, 4vw, 40px) !important; line-height: 1.1; }
.project-gallery .gallery-head p { font-family: var(--font-body) !important; font-weight: 300 !important; letter-spacing: 0.28em !important; font-size: clamp(9px, 1.15vw, 11px) !important; text-transform: uppercase; }
a,a:link,a:visited { color: var(--gray-700); text-decoration: none; }
a:hover { opacity: 0.6; }
img { display: block; }

/* 旧ナビ非表示 */
.navbar,.navbar-default,.navbar-fixed-top,.navbar-collapse,.navbar-header { display: none !important; }
body { padding-top: var(--nav-height) !important; }

/* 新ナビ */
#site-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 9999;
  height: var(--nav-height);
  background: rgba(247,245,242,0.97);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(184,149,106,0.15);
  display: flex; align-items: center; padding: 0 var(--pad);
}
.nav-brand { font-family: var(--font-display) !important; font-size: 15px; font-weight: 400; letter-spacing: 0.2em; color: var(--black) !important; flex-shrink: 0; }
.nav-links { display: flex; list-style: none; gap: 28px; margin: 0 0 0 auto; padding: 0; }
.nav-links a { font-size: 9px; font-weight: 300; letter-spacing: 0.26em; text-transform: uppercase; color: var(--gray-500) !important; font-family: var(--font-body) !important; }
.nav-links a:hover { color: var(--accent) !important; opacity: 1; }
.nav-toggle { display: none; flex-direction: column; gap: 5px; cursor: pointer; margin-left: auto; padding: 8px; background: none; border: none; }
.nav-toggle span { display: block; width: 22px; height: 1px; background: var(--black); }
#mobile-menu { display: none; position: fixed; top: var(--nav-height); left: 0; right: 0; bottom: 0; background: var(--white); z-index: 9998; padding: 32px 40px; overflow-y: auto; }
#mobile-menu.open { display: block; }
#mobile-menu ul { list-style: none; margin: 0; padding: 0; }
#mobile-menu li { border-bottom: 1px solid var(--gray-100); }
#mobile-menu a { display: block; padding: 16px 0; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gray-500); }

/* jumbotron */
.jumbotron { background: transparent !important; text-align: center; padding: 72px 40px !important; margin-bottom: 0 !important; border-radius: 0; }
.jumbotron h1 { font-family: var(--font-display) !important; font-size: clamp(24px,3vw,44px) !important; font-weight: 300; letter-spacing: 0.2em; color: var(--black) !important; margin: 0; }
.jumbotron p { font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--gray-500) !important; }

/* carousel */
.carousel-inner > .item > img,
.carousel-inner > .item > a > img { width: 100%; height: 85vh; object-fit: cover; }
[class*="col-"] .carousel-inner > .item > img,
[class*="col-"] .carousel-inner > .item > a > img { height: auto !important; object-fit: unset !important; }
.carousel-caption h3 { font-family: var(--font-display) !important; font-size: clamp(20px,4vw,52px); font-weight: 300; letter-spacing: 0.14em; }
.carousel-caption p { font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase; }
.carousel-control { background: none !important; }

/* セクションラベル */
.col-lg-12.text-center {
  display: block !important; width: 100% !important; float: none !important; clear: both !important;
  padding: 32px 80px 12px !important; box-sizing: border-box !important;
  font-family: var(--font-body) !important; font-size: 9px !important;
  letter-spacing: 0.32em !important; text-transform: uppercase !important;
  color: var(--accent) !important; border-top: 1px solid var(--gray-100) !important; margin-top: 8px !important;
}
.col-lg-12.text-center hr { display: none !important; }
.col-lg-12.text-center span { font-size: 9px !important; font-family: var(--font-body) !important; }
.container-fluid::after, .row::after { content: ""; display: table; clear: both; }

main.project-gallery { padding-top: var(--nav-height) !important; }

/* フッター */
#site-footer {
  background: var(--black) !important; color: var(--gray-300);
  padding: 80px 0 48px !important; display: block !important;
  width: 100vw !important; position: relative !important;
  left: 50% !important; transform: translateX(-50%) !important;
  clear: both !important; box-sizing: border-box !important;
}
.footer-inner { padding: 0 var(--pad); box-sizing: border-box; }
.footer-logo { font-family: var(--font-display) !important; font-size: 28px; font-weight: 300; color: var(--white) !important; letter-spacing: 0.1em; margin-bottom: 56px; display: block; }
.footer-grid { display: grid !important; grid-template-columns: 2fr 1fr; gap: 60px; margin-bottom: 56px; }
.footer-col-title { font-size: 9px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--accent); margin-bottom: 20px; display: block; }
.footer-col a { display: block; font-size: 12px; color: var(--gray-500) !important; margin-bottom: 12px; }
.footer-col a:hover { color: var(--white) !important; opacity: 1 !important; }
#site-footer .footer-col a:focus,
#site-footer .footer-col a:active {
  outline: none !important;
  outline-offset: 0 !important;
  color: inherit !important;
  text-decoration: none !important;
  -webkit-tap-highlight-color: transparent;
  border: none !important;
  box-shadow: none !important;
}
#site-footer .office-addr a:focus,
#site-footer .office-addr a:active {
  outline: none !important;
  outline-offset: 0 !important;
  color: inherit !important;
  text-decoration: none !important;
  -webkit-tap-highlight-color: transparent;
  border: none !important;
  box-shadow: none !important;
}
.office-name { font-size: 9px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--accent); display: block; margin-bottom: 6px; }
.office-item { margin-bottom: 28px; }
.office-addr,.office-tel { font-size: 12px; color: var(--gray-500); line-height: 1.9; }
.footer-divider { border: none; border-top: 1px solid rgba(255,255,255,0.07); margin-bottom: 32px; }
.footer-copy { font-size: 10px; letter-spacing: 0.18em; color: var(--gray-700); text-align: center; }

/* コンタクトフォーム */
.mailform {
  width: 100% !important; border-collapse: collapse !important;
  max-width: 800px !important; margin: 0 auto !important;
}
.mailform th {
  width: 200px !important; text-align: left !important;
  padding: 20px 24px 20px 0 !important; vertical-align: top !important;
  font-family: var(--font-body) !important; font-size: 11px !important;
  font-weight: 400 !important; letter-spacing: 0.12em !important;
  color: var(--black) !important; border-bottom: 1px solid var(--gray-100) !important;
}
.mailform th p { font-size: 9px !important; letter-spacing: 0.2em !important; color: var(--gray-500) !important; margin: 2px 0 0 !important; text-transform: uppercase !important; }
.mailform th span { color: var(--accent) !important; margin-left: 2px; }
.mailform td {
  padding: 16px 0 !important; vertical-align: middle !important;
  border-bottom: 1px solid var(--gray-100) !important;
}
.mailform input[type="text"],
.mailform input[type="email"],
.mailform textarea,
.mailform .mf {
  width: 100% !important; max-width: 480px !important;
  padding: 12px 16px !important; border: 1px solid var(--gray-100) !important;
  border-radius: 0 !important; background: var(--white) !important;
  font-family: var(--font-body) !important; font-size: 13px !important;
  color: var(--black) !important; outline: none !important;
  box-sizing: border-box !important; transition: border-color 0.2s !important;
  -webkit-appearance: none !important;
}
.mailform input[type="text"]:focus,
.mailform input[type="email"]:focus,
.mailform textarea:focus,
.mailform .mf:focus { border-color: var(--accent) !important; }
.mailform textarea { rows: 10; min-height: 160px !important; resize: vertical !important; width: 100% !important; max-width: 480px !important; }
.mailform input[type="radio"] { accent-color: var(--accent); margin-right: 6px; }
.mailform input[type="submit"] {
  background: var(--black) !important; color: var(--white) !important;
  border: none !important; padding: 14px 40px !important;
  font-family: var(--font-body) !important; font-size: 10px !important;
  letter-spacing: 0.28em !important; text-transform: uppercase !important;
  cursor: pointer !important; transition: background 0.2s !important;
}
.mailform input[type="submit"]:hover { background: var(--accent) !important; }
.mailform input[type="reset"],
.mailform input[type="button"] {
  background: transparent !important; color: var(--gray-500) !important;
  border: 1px solid var(--gray-100) !important; padding: 14px 24px !important;
  font-family: var(--font-body) !important; font-size: 10px !important;
  letter-spacing: 0.2em !important; cursor: pointer !important; margin-left: 12px !important;
}

@media (max-width: 768px) {
  :root { --pad: 20px; }
  .nav-links { display: none !important; }
  .nav-toggle { display: flex !important; }
  .footer-grid { grid-template-columns: 1fr !important; }
  .carousel-inner > .item > img,
  .carousel-inner > .item > a > img { height: 56vw; }
  /* フォームレスポンシブ */
  .mailform th, .mailform td { display: block !important; width: 100% !important; padding: 8px 0 !important; border-bottom: none !important; }
  .mailform th { border-top: 1px solid var(--gray-100) !important; padding-top: 20px !important; }
  .mailform td { padding-bottom: 0 !important; }
  .mailform input[type="text"],
  .mailform input[type="email"],
  .mailform textarea,
  .mailform .mf { max-width: 100% !important; }
  .mailform input[type="submit"] { width: 100% !important; margin-bottom: 12px; }
  .mailform input[type="reset"] { width: 100% !important; margin-left: 0 !important; }
}