:root { --ink:#20252a; --muted:#697178; --paper:#f5f2ec; --surface:#fffdfa; --line:#ddd8ce; --gold:#b77a32; --green:#587463; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family: Georgia, 'Times New Roman', serif; line-height:1.5; }
a { color:inherit; text-decoration:none; }
.site-header { align-items:center; display:flex; justify-content:space-between; margin:auto; max-width:1180px; padding:28px 28px 22px; }
.brand { align-items:center; display:flex; gap:12px; letter-spacing:.02em; }
.brand-mark { align-items:center; background:var(--green); border-radius:50%; color:#fff; display:flex; font-family:Arial,sans-serif; font-size:1.1rem; font-weight:700; height:38px; justify-content:center; width:38px; }
.brand strong,.brand small { display:block; }.brand strong { font-size:1.25rem; }.brand small { color:var(--muted); font-family:Arial,sans-serif; font-size:.65rem; letter-spacing:.08em; text-transform:uppercase; }
nav { align-items:center; display:flex; font-family:Arial,sans-serif; font-size:.82rem; gap:28px; }.nav-button { border:1px solid var(--ink); border-radius:3px; padding:10px 15px; }
.hero { background:radial-gradient(circle at 78% 25%,rgba(183,122,50,.16),transparent 28%),linear-gradient(120deg,#e9e3d8,#f8f5ef 60%); margin:0 18px; min-height:470px; padding:96px max(7vw,48px); position:relative; }.hero:after { border:1px solid rgba(183,122,50,.28); content:''; inset:22px; pointer-events:none; position:absolute; }.hero>* { position:relative; z-index:1; }
.eyebrow { color:var(--gold); font-family:Arial,sans-serif; font-size:.7rem; font-weight:700; letter-spacing:.16em; margin:0 0 18px; text-transform:uppercase; }.hero h1 { font-size:clamp(3rem,7vw,6.2rem); font-weight:400; letter-spacing:-.05em; line-height:.95; margin:0; max-width:720px; }.hero h1 em { color:var(--green); font-style:italic; }.hero-copy { color:#545c61; font-size:1.15rem; max-width:420px; margin:26px 0; }.hero-actions { display:flex; gap:13px; }.button { border-radius:3px; font-family:Arial,sans-serif; font-size:.8rem; padding:13px 18px; }.button-primary { background:var(--green); color:#fff; }.button-quiet { border:1px solid var(--line); }
.status-strip { display:flex; gap:clamp(24px,7vw,92px); margin:auto; max-width:1040px; padding:23px 28px; font-family:Arial,sans-serif; font-size:.78rem; }.status-strip div { display:flex; flex-direction:column; gap:2px; }.status-strip span:not(.status-dot) { color:var(--muted); }.status-dot { background:#6a9b76; border-radius:50%; display:inline-block; height:8px; margin-right:7px; width:8px; }
.intro,.path-grid { margin:auto; max-width:1040px; padding:90px 28px 30px; }.intro { display:grid; gap:60px; grid-template-columns:1fr 1fr; }.intro h2,.path-grid h2 { font-size:clamp(2rem,4vw,3.2rem); font-weight:400; letter-spacing:-.04em; line-height:1.05; margin:0; }.intro-copy { color:var(--muted); font-family:Arial,sans-serif; font-size:.98rem; max-width:470px; }.intro-copy p { margin-top:0; margin-bottom:18px; }.section-heading { margin-bottom:28px; }
.cards { display:grid; gap:14px; grid-template-columns:repeat(3,1fr); }.card { background:var(--surface); border:1px solid var(--line); min-height:245px; padding:25px; transition:border-color .15s ease,transform .15s ease; }.card:hover,.card:focus-visible { border-color:var(--gold); transform:translateY(-2px); }.card-number { color:var(--gold); font-family:Arial,sans-serif; font-size:.72rem; }.card h3 { font-size:1.45rem; font-weight:400; margin:24px 0 10px; }.card p { color:var(--muted); font-family:Arial,sans-serif; font-size:.82rem; margin:0; }.card-link { color:var(--green); display:block; font-family:Arial,sans-serif; font-size:.76rem; font-weight:700; margin-top:25px; }
footer { color:var(--muted); display:flex; font-family:Arial,sans-serif; font-size:.7rem; justify-content:space-between; margin:auto; max-width:1040px; padding:70px 28px 30px; }
@media (max-width:700px) { .site-header { align-items:flex-start; gap:20px; }.site-header nav { display:none; }.hero { margin:0 10px; min-height:500px; padding:76px 30px; }.hero:after { inset:12px; }.hero h1 { font-size:3.5rem; }.status-strip { flex-wrap:wrap; gap:18px 35px; }.intro,.cards { grid-template-columns:1fr; }.intro { gap:30px; padding-top:65px; }.path-grid { padding-top:65px; }.card { min-height:210px; } }

/* MidBorn Aesthetic reference: ivory archive, moss actions, aged-gold accents. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Playfair+Display:wght@600;700&display=swap');
:root { --ink:#1b1c1c; --muted:#484740; --paper:#fcf9f8; --surface:#ffffff; --line:#c9c6bd; --gold:#775a19; --green:#506354; }
body { background:var(--paper); font-family:Inter,Arial,sans-serif; }
.brand strong,.hero h1,.intro h2,.path-grid h2,.card h3 { font-family:'Playfair Display',Georgia,serif; }
.brand small,.site-header nav,.eyebrow,.hero-copy,.status-strip,.intro-copy,.card p,.card-link,footer { font-family:Inter,Arial,sans-serif; }
.brand-mark { background:var(--green); border-radius:4px; }
.site-header { max-width:1200px; padding:24px; }
.hero { background:linear-gradient(135deg,#f9f5f0,#fcf9f8 62%); border:1px solid #e0dcd6; border-radius:8px; margin:0 auto; max-width:1200px; min-height:490px; box-shadow:0 4px 15px rgba(45,45,45,.05); }
.hero:after { border-color:rgba(119,90,25,.24); }
.hero h1 { font-size:clamp(3rem,6vw,4.5rem); font-weight:700; letter-spacing:-.02em; line-height:1.12; }
.hero h1 em { color:var(--green); }
.button-primary { background:var(--green); border-bottom:2px solid #775a19; }
.button-quiet { border-color:var(--green); color:var(--green); }
.card { border-radius:8px; box-shadow:0 2px 10px rgba(45,45,45,.035); }
.card:hover,.card:focus-visible { border-color:var(--gold); box-shadow:0 5px 15px rgba(45,45,45,.07); }
@media (max-width:700px) { .site-header { align-items:flex-start; flex-direction:column; gap:18px; }.site-header nav { display:flex; flex-wrap:wrap; gap:12px 18px; width:100%; }.hero { margin:0 16px; padding:72px 30px; }.hero:after { inset:12px; } }

.site-home { background:#eee9df url('/stitch/site-principal-home/bg-texture.jpg') repeat; }
.site-home .site-header { background:#fcf9f8; max-width:none; padding:18px max(7vw,28px); }
.brand-word { color:#506354; font-family:'Playfair Display',Georgia,serif; font-size:1.55rem; font-weight:700; }
.site-header nav a.active { border-bottom:2px solid #775a19; color:#775a19; padding-bottom:8px; }
.stitch-hero { align-items:center; background-image:linear-gradient(180deg,rgba(252,249,248,.18) 0%,rgba(252,249,248,.44) 45%,rgba(20,24,21,.82) 100%),linear-gradient(90deg,rgba(252,249,248,.72),rgba(252,249,248,.12) 48%,rgba(252,249,248,.5)),url('/stitch/site-principal-home/hero.avif'); background-position:center,center,center 72%; background-repeat:no-repeat; background-size:cover; display:flex; justify-content:center; min-height:620px; position:relative; text-align:center; }
.stitch-hero:after { background:linear-gradient(180deg,transparent 65%,rgba(27,28,28,.32)); content:''; inset:0; pointer-events:none; position:absolute; }
.stitch-hero .hero-content { position:relative; text-shadow:0 2px 18px rgba(252,249,248,.9); z-index:1; }
.hero-content { max-width:850px; padding:70px 24px; }.hero-content h1 { color:#1b1c1c; font-family:'Playfair Display',Georgia,serif; font-size:clamp(2.7rem,5vw,4.4rem); line-height:1.12; margin:0; }.hero-content h1 em { color:#775a19; }.hero-content>p:not(.eyebrow) { color:#484740; font-size:1.08rem; line-height:1.6; margin:28px auto; max-width:680px; }.hero-actions { justify-content:center; }
.server-bar { align-items:center; background:#1b1c1c; color:#f3f0f0; display:flex; gap:clamp(20px,8vw,110px); justify-content:center; padding:18px 24px; font-family:Inter,Arial,sans-serif; font-size:.82rem; }.server-bar strong { color:#e9c176; }
.stitch-content { display:grid; gap:24px; grid-template-columns:230px minmax(0,1fr) 230px; margin:auto; max-width:1120px; padding:36px 24px 70px; }.link-card,.news { background:#fcf9f8; border:1px solid #d1cec7; }.link-card { border-top:4px solid #506354; padding:16px; }.link-card h2 { font:700 1.45rem 'Playfair Display',Georgia,serif; margin:0 0 14px; }.link-card a { border-top:1px solid #e4e2e1; display:block; font-size:.84rem; padding:10px 0; }.promo { display:block; margin-top:18px; }.promo img { border-radius:6px; display:block; width:100%; }.news { align-self:start; }.news>header { align-items:center; background:#506354; color:white; display:flex; justify-content:space-between; padding:15px 18px; }.news h2 { font:700 1.35rem 'Playfair Display',Georgia,serif; margin:0; }.news header a { font-size:.8rem; }.news article { border-bottom:1px solid #d1cec7; padding:18px; }.news article b { background:#d0e5d2; color:#394b3d; font-size:.68rem; letter-spacing:.08em; padding:4px 7px; }.news article small { color:#79776f; margin-left:8px; }.news article h3 { color:#775a19; font:400 1.1rem 'Playfair Display',Georgia,serif; margin:10px 0 3px; }.news article p { color:#484740; font-size:.84rem; margin:0; }
.site-home footer { align-items:center; background:#e4e2e1; display:flex; gap:20px; justify-content:space-between; max-width:none; padding:55px max(7vw,28px); }.site-home footer strong { color:#506354; font:700 1.5rem 'Playfair Display',Georgia,serif; }
@media(max-width:780px){.stitch-content{grid-template-columns:1fr}.stitch-content>aside{display:grid;gap:12px;grid-template-columns:1fr 1fr}.stitch-content>aside .promo{margin:0}.server-bar{flex-wrap:wrap;gap:12px 24px}.site-home footer{align-items:flex-start;flex-direction:column}}

/* Visible reference treatment: archive-like frame and stronger hierarchy. */
body { background:linear-gradient(180deg,#fcf9f8 0%,#f6f3f2 100%); }
.site-header { border-bottom:1px solid #e4e2e1; }
.brand-mark { box-shadow:inset 0 0 0 2px #c9c6bd; }
.hero { overflow:hidden; }
.hero:before { background:linear-gradient(90deg,rgba(80,99,84,.08),transparent 65%); content:''; inset:0; pointer-events:none; position:absolute; }
.status-strip { border-bottom:1px solid #e4e2e1; }
.card { background:#fff; border-color:#d1cec7; }
.card-number { font-weight:600; letter-spacing:.1em; }

/* Home refinement aligned with the Stitch composition. */
.site-home .site-header { align-items:center; box-sizing:border-box; height:70px; left:0; padding:0 max(7vw,28px); position:absolute; right:0; top:0; z-index:3; }
.site-home .brand-word { font-size:1.65rem; letter-spacing:-.03em; }
.site-home .site-header nav { align-self:stretch; gap:25px; }
.site-home .site-header nav>a { align-items:center; border-bottom:2px solid transparent; display:flex; padding:2px 0 0; transition:border-color .18s ease,color .18s ease; }
.site-home .site-header nav>a:not(.nav-button):hover { border-bottom-color:#c9a35d; color:#775a19; }
.site-home .site-header nav a.active { border-bottom-color:#775a19; padding-bottom:0; }
.site-home .site-header .nav-button { align-self:center; background:#506354; border:1px solid #506354; border-radius:2px; color:#fff; height:42px; padding:0 24px; transition:background-color .18s ease,border-color .18s ease,transform .18s ease; }
.site-home .site-header .nav-button:hover { background:#394b3d; border-color:#775a19; transform:translateY(-1px); }
.site-home .stitch-hero { background-color:#fff; background-image:linear-gradient(90deg,rgba(255,255,255,.95) 0%,rgba(255,255,255,.64) 34%,rgba(255,255,255,.28) 62%,rgba(255,255,255,.72) 100%),linear-gradient(180deg,rgba(255,255,255,.18) 0%,rgba(255,255,255,.2) 45%,rgba(255,255,255,.96) 100%),url('/stitch/site-principal-home/hero.avif'); background-position:center,center,center 60%; background-size:100% 100%,100% 100%,cover; min-height:80vh; }
.site-home .server-bar a { color:#fff; font-weight:600; padding:3px 0; transition:color .2s ease,border-color .2s ease; }
.site-home .server-bar .server-status { color:#35e06f; font-size:1rem; font-weight:800; letter-spacing:.04em; text-shadow:0 0 10px rgba(53,224,111,.28); }
.site-home .server-bar .server-status.is-offline { color:#ef9a9a; }
.site-home .server-bar a:hover { border-bottom:2px solid #c9a35d; color:#e9c176; }
.site-home .stitch-hero:after { background:linear-gradient(180deg,rgba(255,255,255,.03) 48%,rgba(255,255,255,.82) 100%); }
.site-home .stitch-hero .hero-content { text-shadow:0 1px 16px rgba(255,255,255,.95); }
.site-home .hero-actions { display:flex; gap:16px; }
.site-home .button { align-items:center; border-radius:2px; box-sizing:border-box; display:inline-flex; font-size:.86rem; font-weight:600; gap:9px; justify-content:center; min-height:52px; min-width:210px; padding:13px 22px; transition:background-color .2s ease,border-color .2s ease,box-shadow .2s ease,color .2s ease,transform .2s ease; }
.site-home .button-primary { background:#506354; border:1px solid #506354; border-bottom:3px solid #775a19; color:#fff; }
.site-home .button-primary:hover { background:#394b3d; border-color:#394b3d; border-bottom-color:#c9a35d; box-shadow:0 8px 18px rgba(57,75,61,.2); transform:translateY(-2px); }
.site-home .button-quiet { background:rgba(255,255,255,.72); border:2px solid #506354; color:#506354; }
.site-home .button-quiet:hover { background:#506354; border-color:#506354; box-shadow:0 8px 18px rgba(57,75,61,.15); color:#fff; transform:translateY(-2px); }
.site-home .promo { border-radius:7px; overflow:hidden; transition:box-shadow .2s ease,transform .2s ease; }
.site-home .promo img { transition:filter .25s ease,transform .3s ease; }
.site-home .promo:hover { box-shadow:0 8px 20px rgba(45,45,45,.16); transform:translateY(-3px); }
.site-home .promo:hover img { filter:saturate(1.06) contrast(1.03); transform:scale(1.018); }
@media(max-width:900px){.site-home .site-header nav{gap:14px}.site-home .site-header nav a:not(.nav-button){display:none}}
@media(max-width:560px){.site-home .hero-actions{align-items:stretch;flex-direction:column}.site-home .button{width:100%}.site-home .stitch-hero{min-height:80vh}}
.site-home .hero-logo { display:block; height:auto; left:50%; position:absolute; top:-32px; transform:translateX(-50%); width:clamp(190px,22vw,270px); z-index:2; }.site-home .stitch-hero .hero-content { padding-top:190px; }
@media(max-width:560px){.site-home .hero-logo{top:-24px;width:200px}.site-home .stitch-hero .hero-content{padding-top:150px}}