:root{
  --navy:#0e1f33; --navy-2:#132a44; --navy-ink:#0a1626;
  --paper:#f5f2ea; --paper-2:#ece7dc;
  --ink:#16222f; --muted:#5b6673; --rule:#c9c2b3; --rule-dark:rgba(245,242,234,.22);
  --signal:#ff5a1f;
  --max:1200px; --gut:clamp(20px,4vw,48px);
  --sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Consolas,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.65}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gut)}

/* Type */
h1,h2,h3{font-weight:500;text-transform:uppercase;letter-spacing:.16em;line-height:1.2;margin:0}
h1{font-size:clamp(1.9rem,4.6vw,3.3rem);letter-spacing:.12em}
h2{font-size:clamp(1.25rem,2.4vw,1.7rem)}
h3{font-size:1rem;letter-spacing:.18em}
p{margin:0 0 1em}
.label{font-family:var(--mono);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:14px;margin-bottom:22px}
.label::before{content:"";width:28px;height:2px;background:var(--signal)}
.lead{font-size:1.1rem;color:var(--muted);max-width:620px}

/* Header */
header{background:var(--navy);color:var(--paper);border-bottom:1px solid var(--rule-dark)}
header .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:76px;flex-wrap:wrap;padding-top:14px;padding-bottom:14px}
.brand{text-decoration:none;display:flex;align-items:baseline;gap:12px}
.brand b{font-weight:600;letter-spacing:.32em;font-size:1.05rem}
.brand small{font-family:var(--mono);font-size:.68rem;letter-spacing:.24em;opacity:.6}
nav{display:flex;gap:clamp(16px,3vw,36px);flex-wrap:wrap}
nav a{text-decoration:none;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;opacity:.75;padding:6px 0;border-bottom:2px solid transparent}
nav a:hover{opacity:1}
nav a[aria-current=page]{opacity:1;border-bottom-color:var(--signal)}

/* Buttons */
.btn{display:inline-block;text-decoration:none;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;font-weight:500;padding:15px 26px;border:1px solid currentColor;background:transparent;color:inherit;cursor:pointer;font-family:inherit;transition:background .15s,color .15s,border-color .15s}
.btn.primary{background:var(--signal);border-color:var(--signal);color:#fff}
.btn.primary:hover{background:#e84a12;border-color:#e84a12}
.btn:not(.primary):hover{background:var(--paper);color:var(--navy)}
.on-paper .btn:not(.primary):hover{background:var(--navy);color:var(--paper)}
.actions{display:flex;gap:14px;flex-wrap:wrap}

/* Blueprint grid backgrounds */
.grid-dark{background-color:var(--navy);color:var(--paper);
  background-image:linear-gradient(rgba(245,242,234,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(245,242,234,.05) 1px,transparent 1px),
  linear-gradient(rgba(245,242,234,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(245,242,234,.025) 1px,transparent 1px);
  background-size:120px 120px,120px 120px,24px 24px,24px 24px}
.grid-light{background-color:var(--paper);
  background-image:linear-gradient(rgba(14,31,51,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(14,31,51,.055) 1px,transparent 1px),
  linear-gradient(rgba(14,31,51,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(14,31,51,.025) 1px,transparent 1px);
  background-size:120px 120px,120px 120px,24px 24px,24px 24px}
.grid-dark .label{color:rgba(245,242,234,.6)}
.grid-dark .lead{color:rgba(245,242,234,.72)}

/* Drawing-border frame */
.frame{position:relative;border:1px solid var(--rule);padding:clamp(28px,5vw,64px)}
.grid-dark .frame{border-color:var(--rule-dark)}
.frame::before,.frame::after{content:"";position:absolute;width:14px;height:14px;border-color:var(--signal);border-style:solid}
.frame::before{top:-1px;left:-1px;border-width:2px 0 0 2px}
.frame::after{bottom:-1px;right:-1px;border-width:0 2px 2px 0}

section{padding:clamp(72px,11vw,140px) 0}
.hero{padding:clamp(88px,13vw,168px) 0}
.hero .lead{margin:28px 0 40px}
.hero h1{max-width:900px}

/* Full-width photography */
.shot{margin:0;position:relative;background:var(--navy-2);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.shot img{width:100%;height:clamp(320px,62vw,760px);object-fit:cover}
.shot.short img{height:clamp(260px,42vw,560px)}
.shot figcaption{position:absolute;left:var(--gut);bottom:20px;font-family:var(--mono);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--paper);background:rgba(10,22,38,.78);padding:8px 12px;border-left:2px solid var(--signal)}
/* Placeholder until real photos are added */
.shot.empty{display:flex;align-items:center;justify-content:center;height:clamp(320px,56vw,720px);color:rgba(245,242,234,.55);font-family:var(--mono);font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;text-align:center;padding:24px;
  background-color:var(--navy-2);background-image:linear-gradient(rgba(245,242,234,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(245,242,234,.05) 1px,transparent 1px);background-size:40px 40px}
.shot.empty.short{height:clamp(260px,40vw,520px)}

/* Spec rows */
.specs{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));border-top:1px solid var(--rule);margin-top:56px}
.grid-dark .specs{border-color:var(--rule-dark)}
.spec{padding:36px 32px 36px 0;border-bottom:1px solid var(--rule)}
.grid-dark .spec{border-color:var(--rule-dark)}
.spec + .spec{padding-left:32px;border-left:1px solid var(--rule)}
.grid-dark .spec + .spec{border-left-color:var(--rule-dark)}
.spec .no{font-family:var(--mono);font-size:.72rem;letter-spacing:.2em;color:var(--signal);display:block;margin-bottom:14px}
.spec h3{margin-bottom:12px}
.spec p{color:var(--muted);margin:0}
.grid-dark .spec p{color:rgba(245,242,234,.7)}
@media (max-width:860px){.spec + .spec{padding-left:0;border-left:0}}

/* Tiers */
.tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:0;border:1px solid var(--rule);margin-top:56px;background:var(--paper)}
.tier{padding:clamp(32px,4vw,52px)}
.tier + .tier{border-left:1px solid var(--rule)}
@media (max-width:720px){.tier + .tier{border-left:0;border-top:1px solid var(--rule)}}
.tier .no{font-family:var(--mono);font-size:.72rem;letter-spacing:.22em;color:var(--signal);text-transform:uppercase}
.tier h2{margin:14px 0 18px}
.tier p{color:var(--muted)}
.tier ul{list-style:none;padding:0;margin:26px 0 0;border-top:1px solid var(--rule)}
.tier li{padding:13px 0;border-bottom:1px solid var(--rule);font-size:.95rem;display:flex;gap:14px}
.tier li::before{content:"";flex:0 0 7px;height:7px;margin-top:.62em;background:var(--signal)}

.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:clamp(32px,7vw,110px);align-items:start}
@media (max-width:820px){.two{grid-template-columns:1fr}}
.prose p{color:var(--ink)}
.prose h2{margin:56px 0 18px}
.prose h2:first-child{margin-top:0}
.cta{display:flex;justify-content:space-between;align-items:end;gap:32px;flex-wrap:wrap}
.cta .lead{margin:18px 0 0}

/* Page head */
.page-head{padding:clamp(72px,10vw,128px) 0 clamp(56px,8vw,96px)}
.page-head .lead{margin-top:22px}

/* Form */
form{display:grid;gap:22px}
.field label{display:block;font-family:var(--mono);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
input,textarea,select{width:100%;padding:13px 0;border:0;border-bottom:1px solid var(--ink);background:transparent;font:inherit;color:var(--ink);border-radius:0}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 12px) 55%,calc(100% - 7px) 55%;background-size:5px 5px;background-repeat:no-repeat}
input:focus,textarea:focus,select:focus{outline:none;border-bottom:2px solid var(--signal)}
textarea{min-height:140px;resize:vertical}
.side{border-left:1px solid var(--rule);padding-left:clamp(24px,4vw,48px)}
@media (max-width:820px){.side{border-left:0;padding-left:0;border-top:1px solid var(--rule);padding-top:40px}}
.side h3{margin:0 0 12px}
.side p{color:var(--muted)}
.side .block + .block{margin-top:44px}

/* Footer title block */
footer{background:var(--navy-ink);color:rgba(245,242,234,.7);padding:56px 0 40px;font-size:.9rem}
.titleblock{display:grid;grid-template-columns:2fr repeat(3,1fr);border:1px solid var(--rule-dark)}
.titleblock div{padding:16px 18px;border-left:1px solid var(--rule-dark)}
.titleblock div:first-child{border-left:0}
.titleblock span{display:block;font-family:var(--mono);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;opacity:.55;margin-bottom:6px}
.titleblock b{font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--paper);font-size:.85rem}
.titleblock a{text-decoration:none;border-bottom:1px solid var(--signal)}
@media (max-width:720px){.titleblock{grid-template-columns:1fr 1fr}.titleblock div:nth-child(3){border-left:0}.titleblock div:nth-child(n+3){border-top:1px solid var(--rule-dark)}.titleblock div:first-child{grid-column:1/-1;border-bottom:1px solid var(--rule-dark)}.titleblock div:nth-child(2){border-left:0}}