* { margin:0; padding:0; box-sizing:border-box; }
:root {
  --bg:#160d0a; --surface:#211210; --text:#f4e2d2; --paper:#736e6c;
  --accent:#e05224; --on-accent:#ffffff; --muted:#8f6c5c;
  --line:#f4e2d2; --shadow:#e05224;
}
html { scroll-behavior:smooth; }
body {
  margin:0; background:var(--paper); color:var(--text);
  font-family:Tahoma, Verdana, sans-serif; line-height:1.5; -webkit-font-smoothing:none;
}
h1,h2,h3 { font-family:Cambria, Georgia, serif; text-transform:uppercase; letter-spacing:-.02em; line-height:.95; }
a { color:inherit; text-decoration:none; }
img { display:block; width:100%; height:100%; object-fit:cover; }

.bx { border:3px solid var(--line); background:var(--surface); }
.mono { font-family:'Courier New', Courier, monospace; }

/* ---- nav ---- */
.nav {
  position:sticky; top:0; z-index:50; display:flex; align-items:center;
  justify-content:space-between; padding:14px 20px; background:var(--bg);
  border-width:0 0 4px 0; color:#ffffff;
}
.brand { font-family:Cambria, Georgia, serif; font-size:26px; font-weight:900; text-transform:uppercase; letter-spacing:-.03em; }
.blink { animation:blink 1s steps(1) infinite; }
@keyframes blink { 50% { opacity:0; } }
.links { display:flex; gap:4px; font-family:'Courier New', Courier, monospace; font-size:13px; font-weight:700; }
.links a { padding:8px 12px; border:2px solid transparent; }
.links a:hover { border-color:currentColor; background:var(--accent); color:var(--on-accent); }
.menu-btn {
  display:none; font-family:'Courier New', Courier, monospace; font-weight:700; font-size:13px;
  background:var(--accent); color:var(--on-accent); border:3px solid var(--line);
  padding:8px 14px; cursor:pointer;
}
.mobile-links { display:none; flex-direction:column; background:var(--bg); border-bottom:4px solid var(--line); }
.mobile-links.open { display:flex; }
.mobile-links a { padding:14px 20px; font-family:'Courier New', Courier, monospace; font-weight:700; border-top:2px solid var(--line); color:#ffffff; }

/* ---- marquee ---- */
.marquee { overflow:hidden; background:var(--accent); color:var(--on-accent);
  border-top:4px solid var(--line); border-bottom:4px solid var(--line); white-space:nowrap; }
.marquee-track { display:inline-block; font-family:'Courier New', Courier, monospace; font-weight:700;
  font-size:15px; padding:10px 0; animation:scroll 26s linear infinite; }
@keyframes scroll { from { transform:translateX(0); } to { transform:translateX(-50%); } }

/* ---- hero ---- */
.hero { display:grid; grid-template-columns:1.15fr .85fr; gap:0; margin:0;
  border-width:0 0 4px 0; }
.hero-copy { padding:56px 40px; border-right:4px solid var(--line); display:flex;
  flex-direction:column; justify-content:center; background:var(--paper); }
.tag { display:inline-block; align-self:flex-start; font-family:'Courier New', Courier, monospace; font-weight:700;
  font-size:13px; background:var(--text); color:var(--paper); padding:5px 10px; margin-bottom:20px; }
.hero h1 { font-size:clamp(42px,7vw,84px); margin-bottom:18px;
  text-shadow:5px 5px 0 var(--accent); }
.hero-copy p { font-size:18px; max-width:44ch; margin-bottom:28px; }
.hero-img { position:relative; background:var(--accent); min-height:340px; }
.img-tag { position:absolute; left:14px; bottom:14px; font-family:'Courier New', Courier, monospace; font-weight:700;
  font-size:13px; background:var(--text); color:var(--paper); padding:5px 9px; }

/* ---- buttons ---- */
.btns { display:flex; gap:16px; flex-wrap:wrap; }
.btn { font-family:'Courier New', Courier, monospace; font-weight:700; font-size:14px; text-transform:uppercase;
  padding:14px 22px; border:3px solid var(--line); cursor:pointer;
  transition:transform .06s, box-shadow .06s; }
.btn-fill { background:var(--accent); color:var(--on-accent); box-shadow:6px 6px 0 var(--line); }
.btn-ghost { background:var(--paper); color:var(--text); box-shadow:6px 6px 0 var(--line); }
.btn:hover { transform:translate(-2px,-2px); box-shadow:8px 8px 0 var(--line); }
.btn:active { transform:translate(3px,3px); box-shadow:2px 2px 0 var(--line); }

/* ---- section labels ---- */
.sec-label { font-family:'Courier New', Courier, monospace; font-weight:700; font-size:14px; letter-spacing:.1em;
  background:var(--text); color:var(--paper); padding:10px 20px; }

/* ---- about ---- */
.about-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr;
  border-left:4px solid var(--line); }
.about-grid > * { border-width:0 4px 4px 0; }
.about-txt { padding:34px; }
.about-txt h2 { font-size:clamp(28px,4vw,44px); margin-bottom:16px; }
.about-txt p { font-size:16px; max-width:60ch; }
.stat { display:flex; flex-direction:column; justify-content:center; align-items:center;
  padding:28px 16px; background:var(--surface); }
.stat.alt { background:var(--accent); color:var(--on-accent); }
.stat b { font-family:Cambria, Georgia, serif; font-size:clamp(34px,5vw,56px); line-height:1; }
.stat span { font-family:'Courier New', Courier, monospace; font-weight:700; font-size:13px; margin-top:8px; letter-spacing:.1em; }

/* ---- services ---- */
.svc-grid { display:grid; grid-template-columns:repeat(3,1fr);
  border-left:4px solid var(--line); border-top:4px solid var(--line); }
.svc-grid > * { border-width:0 4px 4px 0; }
.svc { position:relative; padding:34px 26px 30px; background:var(--surface); }
.svc:hover { background:var(--accent); color:var(--on-accent); }
.svc .num { font-family:'Courier New', Courier, monospace; font-weight:700; font-size:13px;
  border:2px solid currentColor; padding:2px 7px; }
.svc h3 { font-size:22px; margin:16px 0 10px; }
.svc p { font-size:15px; }

/* ---- work ---- */
.work-grid { display:grid; grid-template-columns:repeat(3,1fr);
  border-left:4px solid var(--line); border-top:4px solid var(--line); }
.work-grid > * { border-width:0 4px 4px 0; }
.tile { position:relative; aspect-ratio:1/1; overflow:hidden; background:var(--surface); }
.tile figcaption { position:absolute; left:0; bottom:0; font-family:'Courier New', Courier, monospace; font-weight:700;
  font-size:12px; background:var(--text); color:var(--paper); padding:5px 9px; }
.tile img { transition:transform .2s, filter .2s; filter:grayscale(1) contrast(1.1); }
.tile:hover img { transform:scale(1.06); filter:grayscale(0); }

/* ---- testimonial ---- */
.testi { padding:0; }
.quote { background:var(--accent); color:var(--on-accent); padding:56px 40px;
  border-width:0 0 4px 0; position:relative; }
.qmark { font-family:Cambria, Georgia, serif; font-size:120px; line-height:.6; display:block; }
.quote blockquote { font-family:Cambria, Georgia, serif; font-size:clamp(24px,4vw,44px);
  max-width:22ch; margin:0 0 18px; line-height:1.05; }
.quote cite { font-family:'Courier New', Courier, monospace; font-weight:700; font-style:normal; font-size:15px; }

/* ---- contact ---- */
.contact-grid { display:grid; grid-template-columns:1fr 1fr;
  border-left:4px solid var(--line); border-top:4px solid var(--line); }
.contact-grid > * { border-width:0 4px 4px 0; }
.contact-txt { padding:34px; background:var(--surface); }
.contact-txt h2 { font-size:clamp(28px,4vw,44px); margin-bottom:14px; }
.contact-txt p { margin-bottom:22px; max-width:40ch; }
.contact-txt ul { list-style:none; font-family:'Courier New', Courier, monospace; font-size:15px; }
.contact-txt li { padding:10px 0; border-bottom:2px solid var(--line); }
.contact-txt li span { display:inline-block; width:48px; font-weight:700; color:var(--accent2); }
.contact-form { padding:34px; display:flex; flex-direction:column; gap:16px; background:var(--paper); }
.contact-form label { font-family:'Courier New', Courier, monospace; font-weight:700; font-size:13px;
  display:flex; flex-direction:column; gap:6px; letter-spacing:.08em; }
.contact-form input, .contact-form textarea {
  font-family:'Courier New', Courier, monospace; font-size:15px; padding:12px; border:3px solid var(--line);
  background:var(--surface); color:var(--text); }
.contact-form input:focus, .contact-form textarea:focus { outline:none; background:var(--accent); color:var(--on-accent); }
.contact-form button { align-self:flex-start; margin-top:6px; }

/* ---- footer ---- */
.foot { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
  padding:24px 30px; background:var(--bg); color:#ffffff; border-width:4px 0 0 0;
  font-family:'Courier New', Courier, monospace; font-weight:700; font-size:13px; }

/* ---- responsive ---- */
@media (max-width:860px) {
  .links { display:none; }
  .menu-btn { display:block; }
  .hero { grid-template-columns:1fr; }
  .hero-copy { border-right:0; border-bottom:4px solid var(--line); }
  .about-grid { grid-template-columns:1fr 1fr; }
  .about-txt { grid-column:1 / -1; }
  .svc-grid, .work-grid { grid-template-columns:1fr 1fr; }
  .contact-grid { grid-template-columns:1fr; }
  .foot { flex-direction:column; }
}
@media (max-width:520px) {
  .about-grid, .svc-grid, .work-grid { grid-template-columns:1fr; }
  .hero-copy { padding:38px 22px; }
}


.xq{box-sizing:border-box;font-family:Tahoma, Verdana, sans-serif;color:#f4e2d2;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:Cambria, 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:#e05224;margin-bottom:10px;font-weight:700}

.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:14px;display:block}


/* =====================================================
   DESIGN DNA: deco-gold
   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='56' height='56'%3E%3Cpath d='M28 0L56 28L28 56L0 28Z' fill='none' stroke='%23e05224' stroke-width='1'/%3E%3C/svg%3E");opacity:.07;}
html::after{content:'';position:fixed;inset:0;z-index:99990;pointer-events:none;border:4px double #e05224;background:none;outline:1px solid rgba(224,82,36,.55);outline-offset:-14px}
h1,h2,h3{font-family:Copperplate, 'Copperplate Gothic Light', 'Segoe UI', sans-serif !important;text-transform:uppercase !important;letter-spacing:.24em !important;font-weight:600 !important}
img{filter:sepia(.22) contrast(1.05);border-radius:0 !important;border:1px solid rgba(224,82,36,.8) !important;outline:1px solid rgba(224,82,36,.45);outline-offset:5px}
a[class*="btn"],button,span[class*="btn"]{border-radius:0 !important;border:1px solid #e05224 !important;letter-spacing:.22em;text-transform:uppercase}
div[class*="card"]:not([class*="cards"]),article[class*="card"],a[class*="card"],figure[class*="card"],li[class*="card"]{border:1px solid rgba(224,82,36,.5) !important;border-radius:0 !important}