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

.sheet { padding:clamp(10px,2.5vw,28px);
  background:
    linear-gradient(rgba(52,56,51,0.20) 1px, transparent 1px) 0 0/100% 88px,
    linear-gradient(90deg,rgba(52,56,51,0.20) 1px, transparent 1px) 0 0/88px 100%,
    linear-gradient(rgba(52,56,51,0.10) 1px, transparent 1px) 0 0/100% 22px,
    linear-gradient(90deg,rgba(52,56,51,0.10) 1px, transparent 1px) 0 0/22px 100%,
    #e7e9e7; }
.frame { border:2px solid rgba(52,56,51,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(52,56,51,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(52,56,51,0.55); padding-bottom:12px; margin-bottom:8px;
  color:#87908b; }
.tbar .proj { color:#6f8f8a; 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:#6f8f8a; margin-bottom:16px; }
.ttl { font-family:'Palatino Linotype', Palatino, 'Book Antiqua', 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:#87908b; 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 #6f8f8a; color:#6f8f8a;
  padding:12px 22px; border-radius:18px; }
.cta:hover { background:#6f8f8a; color:#e7e9e7; }
.cta.ghost { border-color:rgba(52,56,51,0.55); color:#343833; }

.viewport { position:relative; margin-top:40px; border:1.5px solid rgba(52,56,51,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:#87908b; }
.dim i { flex:1; height:1px; background:rgba(52,56,51,0.55); min-width:26px; position:relative; }
.dim i::before,.dim i::after { content:""; position:absolute; top:-3px; width:1px;
  height:7px; background:rgba(52,56,51,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(52,56,51,0.55); }
.callout { position:absolute; right:16px; bottom:16px; font-family:'Courier New', Courier, monospace;
  font-size:11px; letter-spacing:0.1em; background:#6f8f8a;
  color:#e7e9e7; 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(52,56,51,0.55); padding:clamp(28px,5vw,52px) 0; }
.col h2 { font-family:'Palatino Linotype', Palatino, 'Book Antiqua', Georgia, serif; font-weight:800; font-size:1.5rem; margin-bottom:14px;
  text-transform:uppercase; letter-spacing:0.02em; }
.col p { color:#87908b; 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(52,56,51,0.20); }
.leaders span { color:#87908b; letter-spacing:0.12em; }
.leaders li::after { content:""; }
.leaders b { margin-left:auto; color:#6f8f8a; }

.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(52,56,51,0.55);
  font-size:11px; letter-spacing:0.12em; color:#87908b; }
.spec td { padding:11px 8px; border-bottom:1px solid rgba(52,56,51,0.20); vertical-align:top; }
.spec .rc { color:#6f8f8a; } .spec .rt { font-weight:700; }
.spec .rd { color:#87908b; }

/* section b */
.section-b { display:grid; grid-template-columns:1fr 1fr 1.4fr; gap:16px;
  border-top:1.5px solid rgba(52,56,51,0.55); padding:clamp(24px,5vw,48px) 0; align-items:stretch; }
.thumb { border:1.5px solid rgba(52,56,51,0.55); padding:6px; }
.thumb img { width:100%; height:100%; min-height:180px; object-fit:cover; }
.qt { font-family:'Palatino Linotype', Palatino, 'Book Antiqua', Georgia, serif; font-size:clamp(1.2rem,2.6vw,1.7rem); line-height:1.3;
  border:1.5px solid #6f8f8a; 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:#87908b; margin-top:14px; letter-spacing:0.1em; }

/* title block */
.titleblock { display:grid; grid-template-columns:repeat(6,1fr);
  border:1.5px solid rgba(52,56,51,0.55); margin-top:8px; }
.tb { border-right:1px solid rgba(52,56,51,0.20); border-top:1px solid rgba(52,56,51,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:#87908b; }
.tb .v { font-family:'Palatino Linotype', Palatino, 'Book Antiqua', Georgia, serif; font-weight:700; font-size:15px; }
.tb .vv { font-family:Candara, Optima, 'Segoe UI', sans-serif; font-weight:400; font-size:13px; color:#87908b; }
.tb a.v:hover { color:#6f8f8a; }

@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:Candara, Optima, 'Segoe UI', sans-serif;color:#343833;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:'Palatino Linotype', Palatino, 'Book Antiqua', 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:#6f8f8a;margin-bottom:10px;font-weight:700}

.xq-promo{padding:34px 24px}
.xq-promo-card{border:2px dashed #6f8f8a;border-radius:18px;padding:26px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;background:rgba(52,56,51,0.05)}
.xq-promo-tag{background:#6f8f8a;color:#ffffff;font-family:'Palatino Linotype', Palatino, 'Book Antiqua', Georgia, serif;font-weight:800;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;padding:8px 14px;border-radius:999px}
.xq-promo-card p{flex:1 1 260px;font-size:1.02rem}
.xq-promo-card a{color:#6f8f8a;font-weight:700;text-decoration:none;white-space:nowrap}
.xq-promo-card a:hover{text-decoration:underline}


.xq-strip{padding-left:0;padding-right:0}
.xq-strip .xq-wrap{padding:0 24px}
.xq-striprail{list-style:none;display:flex;gap:12px;overflow-x:auto;padding:14px 24px;scroll-snap-type:x mandatory}
.xq-striprail li{flex:0 0 min(64vw,300px);scroll-snap-align:start}
.xq-striprail img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:18px;display:block}


/* =====================================================
   DESIGN DNA: tabloid-print
   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='14' height='14'%3E%3Ccircle cx='3' cy='3' r='1.5' fill='%23343833'/%3E%3C/svg%3E");opacity:.12;}
h1,h2,h3{font-family:'Arial Black', 'Arial Bold', Arial, sans-serif !important;text-transform:uppercase !important;letter-spacing:-0.02em !important;font-weight:900 !important}
h2{border-top:3px double #343833;border-bottom:3px double #343833;padding:.28em 0;display:inline-block}
img{filter:grayscale(1) contrast(1.32);border-radius:0 !important;border:2px solid #343833 !important}
a[class*="btn"],button,span[class*="btn"]{border-radius:0 !important;background:#343833 !important;color:#eef0ee !important;border:none !important;text-transform:uppercase;font-weight:900;letter-spacing:.04em}
div[class*="card"]:not([class*="cards"]),article[class*="card"],a[class*="card"],figure[class*="card"],li[class*="card"]{border-radius:0 !important;border:2px solid #343833 !important;box-shadow:none !important}