* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { background:#fdfcfa; color:#1e2027; font-family:Optima, Candara, 'Segoe UI', sans-serif; font-size:16px;
  line-height:1.55; -webkit-font-smoothing:antialiased; }
img { display:block; max-width:100%; }
a { color:#1e2027; text-decoration:none; }

.sheet { padding:clamp(10px,2.5vw,28px);
  background:
    linear-gradient(rgba(30,32,39,0.20) 1px, transparent 1px) 0 0/100% 88px,
    linear-gradient(90deg,rgba(30,32,39,0.20) 1px, transparent 1px) 0 0/88px 100%,
    linear-gradient(rgba(30,32,39,0.10) 1px, transparent 1px) 0 0/100% 22px,
    linear-gradient(90deg,rgba(30,32,39,0.10) 1px, transparent 1px) 0 0/22px 100%,
    #f4f3f2; }
.frame { border:2px solid rgba(30,32,39,0.55); padding:clamp(14px,3vw,36px);
  max-width:1180px; margin:0 auto; position:relative; }
.frame::before { content:""; position:absolute; inset:7px; border:1px solid rgba(30,32,39,0.20);
  pointer-events:none; }

.tbar { display:flex; justify-content:space-between; align-items:center;
  font-family:'Courier New', Courier, monospace; font-size:12px; letter-spacing:0.12em;
  border-bottom:1.5px solid rgba(30,32,39,0.55); padding-bottom:12px; margin-bottom:8px;
  color:#8c8175; }
.tbar .proj { color:#8a5a3c; font-weight:700; }

/* plan / hero */
.plan { padding:clamp(24px,5vw,60px) 0; }
.note { font-family:'Courier New', Courier, monospace; font-size:12px; letter-spacing:0.14em;
  color:#8a5a3c; margin-bottom:16px; }
.ttl { font-family:Baskerville, 'Baskerville Old Face', 'Palatino Linotype', Georgia, serif; font-weight:800; line-height:0.96;
  font-size:clamp(2.6rem,8vw,6rem); letter-spacing:-0.02em; }
.sub { font-family:'Courier New', Courier, monospace; color:#8c8175; margin-top:18px; max-width:52ch; }
.dimrow { margin-top:26px; display:flex; gap:12px; flex-wrap:wrap; }
.cta { font-family:'Courier New', Courier, monospace; font-size:12px; letter-spacing:0.14em;
  text-transform:uppercase; border:1.5px solid #8a5a3c; color:#8a5a3c;
  padding:12px 22px; border-radius:3px; }
.cta:hover { background:#8a5a3c; color:#f4f3f2; }
.cta.ghost { border-color:rgba(30,32,39,0.55); color:#1e2027; }

.viewport { position:relative; margin-top:40px; border:1.5px solid rgba(30,32,39,0.55);
  padding:10px; }
.viewport img { width:100%; height:clamp(240px,40vw,480px); object-fit:cover;
  filter:saturate(0.85); }
.dim { position:absolute; display:flex; align-items:center; gap:6px;
  font-family:'Courier New', Courier, monospace; font-size:10px; letter-spacing:0.1em; color:#8c8175; }
.dim i { flex:1; height:1px; background:rgba(30,32,39,0.55); min-width:26px; position:relative; }
.dim i::before,.dim i::after { content:""; position:absolute; top:-3px; width:1px;
  height:7px; background:rgba(30,32,39,0.55); }
.dim i::before { left:0; } .dim i::after { right:0; }
.dim-top { top:-9px; left:14px; right:14px; }
.dim-left { top:14px; bottom:14px; left:-6px; flex-direction:column; writing-mode:vertical-rl; }
.dim-left i { width:1px; height:auto; flex:1; background:rgba(30,32,39,0.55); }
.callout { position:absolute; right:16px; bottom:16px; font-family:'Courier New', Courier, monospace;
  font-size:11px; letter-spacing:0.1em; background:#8a5a3c;
  color:#f4f3f2; padding:5px 10px; }
.callout em { font-style:normal; opacity:0.85; margin-left:6px; }

/* detail */
.detail { display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(20px,4vw,48px);
  border-top:1.5px solid rgba(30,32,39,0.55); padding:clamp(28px,5vw,52px) 0; }
.col h2 { font-family:Baskerville, 'Baskerville Old Face', 'Palatino Linotype', Georgia, serif; font-weight:800; font-size:1.5rem; margin-bottom:14px;
  text-transform:uppercase; letter-spacing:0.02em; }
.col p { color:#8c8175; max-width:46ch; }
.leaders { list-style:none; margin-top:22px; }
.leaders li { display:flex; align-items:center; gap:10px; font-family:'Courier New', Courier, monospace;
  font-size:12px; padding:9px 0; border-bottom:1px dashed rgba(30,32,39,0.20); }
.leaders span { color:#8c8175; letter-spacing:0.12em; }
.leaders li::after { content:""; }
.leaders b { margin-left:auto; color:#8a5a3c; }

.spec { width:100%; border-collapse:collapse; font-family:'Courier New', Courier, monospace; font-size:13px; }
.spec th { text-align:left; padding:10px 8px; border-bottom:1.5px solid rgba(30,32,39,0.55);
  font-size:11px; letter-spacing:0.12em; color:#8c8175; }
.spec td { padding:11px 8px; border-bottom:1px solid rgba(30,32,39,0.20); vertical-align:top; }
.spec .rc { color:#8a5a3c; } .spec .rt { font-weight:700; }
.spec .rd { color:#8c8175; }

/* section b */
.section-b { display:grid; grid-template-columns:1fr 1fr 1.4fr; gap:16px;
  border-top:1.5px solid rgba(30,32,39,0.55); padding:clamp(24px,5vw,48px) 0; align-items:stretch; }
.thumb { border:1.5px solid rgba(30,32,39,0.55); padding:6px; }
.thumb img { width:100%; height:100%; min-height:180px; object-fit:cover; }
.qt { font-family:Baskerville, 'Baskerville Old Face', 'Palatino Linotype', Georgia, serif; font-size:clamp(1.2rem,2.6vw,1.7rem); line-height:1.3;
  border:1.5px solid #8a5a3c; padding:22px; display:flex; flex-direction:column;
  justify-content:center; }
.qt cite { font-family:'Courier New', Courier, monospace; font-style:normal; font-size:12px;
  color:#8c8175; margin-top:14px; letter-spacing:0.1em; }

/* title block */
.titleblock { display:grid; grid-template-columns:repeat(6,1fr);
  border:1.5px solid rgba(30,32,39,0.55); margin-top:8px; }
.tb { border-right:1px solid rgba(30,32,39,0.20); border-top:1px solid rgba(30,32,39,0.20);
  padding:12px 14px; display:flex; flex-direction:column; gap:4px; min-height:70px; }
.tb:last-child { border-right:0; }
.tb-wide { grid-column:1 / 4; }
.tb .k { font-family:'Courier New', Courier, monospace; font-size:10px; letter-spacing:0.16em;
  color:#8c8175; }
.tb .v { font-family:Baskerville, 'Baskerville Old Face', 'Palatino Linotype', Georgia, serif; font-weight:700; font-size:15px; }
.tb .vv { font-family:Optima, Candara, 'Segoe UI', sans-serif; font-weight:400; font-size:13px; color:#8c8175; }
.tb a.v:hover { color:#8a5a3c; }

@media (max-width:820px){
  .detail{ grid-template-columns:1fr; }
  .section-b{ grid-template-columns:1fr; }
  .titleblock{ grid-template-columns:1fr 1fr; }
  .tb-wide{ grid-column:1 / 3; }
  .dim-left{ display:none; }
}


.xq{box-sizing:border-box;font-family:Optima, Candara, 'Segoe UI', sans-serif;color:#1e2027;padding:56px 24px;width:100%}
.xq *{box-sizing:border-box;margin:0}
.xq .xq-wrap{max-width:1060px;margin:0 auto}
.xq h2{font-family:Baskerville, 'Baskerville Old Face', 'Palatino Linotype', Georgia, serif;font-size:1.7rem;line-height:1.2;margin-bottom:8px}
.xq .xq-kick{display:block;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:#8a5a3c;margin-bottom:10px;font-weight:700}

.xq-stats{background:rgba(30,32,39,0.05);border-top:1px solid rgba(30,32,39,0.14);border-bottom:1px solid rgba(30,32,39,0.14)}
.xq-statrow{display:flex;flex-wrap:wrap;gap:14px}
.xq-stat{flex:1 1 140px;background:#efece6;border:1px solid rgba(30,32,39,0.14);border-radius:3px;padding:20px 18px;text-align:center}
.xq-stat dt{font-family:Baskerville, 'Baskerville Old Face', 'Palatino Linotype', Georgia, serif;font-size:2rem;color:#8a5a3c;font-weight:800}
.xq-stat dd{margin-top:6px;font-size:.85rem;color:#8c8175}


.xq-cta{background:#8a5a3c;color:#ffffff}
.xq-cta h2,.xq-cta p{color:#ffffff}
.xq-cta p{opacity:.85;max-width:52ch}
.xq-cta-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px}
.xq-btn{display:inline-block;background:#fdfcfa;color:#1e2027;text-decoration:none;font-weight:700;padding:14px 30px;border-radius:3px;font-family:Baskerville, 'Baskerville Old Face', 'Palatino Linotype', Georgia, serif}
.xq-btn:hover{transform:translateY(-2px)}


.xq-checklist{list-style:none;padding:0;margin-top:20px;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px 26px}
.xq-checklist li{position:relative;padding:10px 0 10px 32px;border-bottom:1px dashed rgba(30,32,39,0.14)}
.xq-checklist li::before{content:"\2713";position:absolute;left:0;top:8px;width:22px;height:22px;line-height:22px;text-align:center;border-radius:50%;background:#8a5a3c;color:#ffffff;font-size:.75rem;font-weight:800}


/* =====================================================
   DESIGN DNA: arch-roman
   Whole-page visual system applied over the layout
   archetype. Appended last so it wins the cascade.
   ===================================================== */
html::before{content:'';position:fixed;inset:0;z-index:99980;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='100'%3E%3Cpath d='M17.5 0V100' stroke='%238a5a3c' stroke-width='1'/%3E%3C/svg%3E");opacity:.05;}
h1,h2,h3{font-family:Baskerville, 'Baskerville Old Face', Georgia, serif !important;letter-spacing:.02em !important;font-weight:600 !important}
img{border-radius:180px 180px 0 0 !important;filter:sepia(.12) contrast(1.03)}
a[class*="btn"],button,span[class*="btn"]{border-radius:999px 999px 999px 999px !important;border:1.5px solid #8a5a3c !important;letter-spacing:.1em}
div[class*="card"]:not([class*="cards"]),article[class*="card"],a[class*="card"],figure[class*="card"],li[class*="card"]{border-radius:120px 120px 0 0 !important;border:1px solid rgba(138,90,60,.4) !important;box-shadow:none !important}
h2::after{content:'\2726';display:block;color:#8a5a3c;font-size:1rem;margin-top:.5rem}