:root{
  --navy:#10192b;
  --paper:#faf9f6;
  --ink:#1c2126;
  --muted:#5b6472;
  --line:#e4e0d8;
  --accent:#c1793f;
  --good:#0ca30c;
  --warn:#fab219;
  --bad:#d03b3b;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'IBM Plex Sans',sans-serif;
  line-height:1.6;
}
h1,h2,h3{
  font-family:'Fraunces',serif;
  color:var(--navy);
  margin:0 0 0.4em;
  line-height:1.15;
}
.mono{font-family:'IBM Plex Mono',monospace;}
a{color:var(--accent);}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px;}

/* header / nav */
header.site{
  position:sticky;top:0;z-index:10;
  background:rgba(250,249,246,0.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
header.site .wrap{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:16px;padding-bottom:16px;
}
.brand{display:flex;align-items:center;gap:10px;font-family:'Fraunces',serif;font-weight:600;font-size:1.25rem;color:var(--navy);text-decoration:none;}
.brand .mark{
  width:34px;height:34px;border-radius:8px;
  background:var(--navy);color:var(--paper);
  display:flex;align-items:center;justify-content:center;
  font-family:'IBM Plex Mono',monospace;font-weight:500;font-size:0.95rem;
}
nav.primary{display:flex;gap:24px;}
nav.primary a{color:var(--ink);text-decoration:none;font-weight:500;font-size:0.95rem;padding-bottom:2px;border-bottom:2px solid transparent;}
nav.primary a:hover{color:var(--accent);}
nav.primary a.active{color:var(--accent);border-bottom-color:var(--accent);}

.btn{
  display:inline-block;
  padding:11px 22px;
  border-radius:8px;
  font-weight:600;
  text-decoration:none;
  font-size:0.95rem;
  border:1px solid transparent;
}
.btn-primary{background:var(--accent);color:#fff;}
.btn-primary:hover{background:#a6672f;}
.btn-ghost{border-color:var(--navy);color:var(--navy);}
.btn-ghost:hover{background:var(--navy);color:var(--paper);}

/* home hero */
.hero{padding:88px 0 72px;}
.hero .kicker{
  font-family:'IBM Plex Mono',monospace;
  color:var(--accent);
  text-transform:uppercase;
  letter-spacing:0.08em;
  font-size:0.8rem;
  font-weight:500;
  margin-bottom:14px;
  display:block;
}
.hero h1{font-size:2.6rem;max-width:820px;}
.hero p.lead{font-size:1.15rem;color:var(--muted);max-width:640px;margin:18px 0 30px;}
.hero .cta-row{display:flex;gap:14px;flex-wrap:wrap;}

/* sub-page header banner */
.page-head{
  padding:56px 0 44px;
  border-bottom:1px solid var(--line);
  background:#fff;
}
.page-head .kicker{
  font-family:'IBM Plex Mono',monospace;color:var(--accent);
  text-transform:uppercase;letter-spacing:0.08em;font-size:0.78rem;
  font-weight:500;margin-bottom:12px;display:block;
}
.page-head h1{font-size:2.1rem;max-width:720px;}
.page-head p{color:var(--muted);font-size:1.05rem;max-width:620px;margin:10px 0 0;}

.trust-strip{
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:#fff;
  padding:28px 0;
}
.trust-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:20px;
}
.trust-item{font-size:0.95rem;color:var(--muted);display:flex;gap:10px;align-items:flex-start;}
.trust-item .dot{
  width:8px;height:8px;border-radius:50%;background:var(--good);
  margin-top:7px;flex-shrink:0;
}

section{padding:72px 0;}
section .section-head{max-width:680px;margin:0 auto 44px;text-align:center;}
section .section-head h2{font-size:2rem;}
section .section-head p{color:var(--muted);font-size:1.05rem;}

/* homepage teaser grids */
.home-section{padding:64px 0;border-bottom:1px solid var(--line);}
.home-section:last-of-type{border-bottom:none;}
.home-head{
  display:flex;justify-content:space-between;align-items:flex-end;
  flex-wrap:wrap;gap:16px;margin-bottom:36px;
}
.home-head h2{font-size:1.8rem;margin:0;}
.home-head p{color:var(--muted);margin:6px 0 0;max-width:520px;}
.teaser-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:20px;
}
.teaser-card{
  background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:24px 22px;
}
.teaser-card.featured{border-color:var(--accent);}
.teaser-card h3{font-size:1.1rem;margin-bottom:6px;}
.teaser-card .price{font-family:'Fraunces',serif;font-size:1.6rem;color:var(--navy);font-weight:600;margin:4px 0 10px;}
.teaser-card .price span{font-family:'IBM Plex Sans',sans-serif;font-size:0.85rem;color:var(--muted);font-weight:400;}
.teaser-card p{color:var(--muted);font-size:0.9rem;margin:0;}

/* pricing tiers (plans page) */
.tiers{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:24px;
}
.tier-card{
  background:#fff;border:1px solid var(--line);border-radius:14px;
  padding:32px 28px;display:flex;flex-direction:column;
  position:relative;
}
.tier-card.featured{border-color:var(--accent);box-shadow:0 12px 32px -18px rgba(193,121,63,0.45);}
.tier-card .badge{
  position:absolute;top:-13px;right:24px;
  background:var(--accent);color:#fff;font-family:'IBM Plex Mono',monospace;
  font-size:0.72rem;letter-spacing:0.05em;text-transform:uppercase;
  padding:5px 12px;border-radius:999px;font-weight:500;
}
.tier-card h3{font-size:1.3rem;margin-bottom:6px;}
.tier-card .price{font-family:'Fraunces',serif;font-size:2.1rem;color:var(--navy);font-weight:600;margin:6px 0 4px;}
.tier-card .price span{font-family:'IBM Plex Sans',sans-serif;font-size:0.95rem;color:var(--muted);font-weight:400;}
.tier-card .tier-note{font-size:0.85rem;color:var(--muted);margin-bottom:20px;}
.tier-card ul{list-style:none;margin:0 0 26px;padding:0;flex-grow:1;}
.tier-card li{
  display:flex;gap:10px;align-items:flex-start;
  padding:8px 0;border-top:1px solid var(--line);font-size:0.93rem;
}
.tier-card li:first-child{border-top:none;}
.tier-card li::before{content:"✓";color:var(--good);font-weight:700;flex-shrink:0;}
.tier-card .btn{text-align:center;}

/* a la carte page */
.alacarte{
  background:var(--navy);color:var(--paper);
  border-radius:16px;padding:44px 40px;
}
.alacarte .section-head h2, .alacarte .section-head p{color:var(--paper);}
.alacarte .section-head p{color:#c3c9d6;}
table.rate-table{width:100%;border-collapse:collapse;margin-bottom:28px;}
table.rate-table th, table.rate-table td{
  text-align:left;padding:14px 12px;border-bottom:1px solid rgba(250,249,246,0.15);
}
table.rate-table th{
  font-family:'IBM Plex Mono',monospace;font-size:0.78rem;
  text-transform:uppercase;letter-spacing:0.06em;color:#a9b0c0;font-weight:500;
}
table.rate-table td.rate{font-family:'IBM Plex Mono',monospace;color:var(--accent);font-weight:500;white-space:nowrap;}
.alacarte .note-box{
  background:rgba(250,249,246,0.06);border:1px solid rgba(250,249,246,0.15);
  border-radius:10px;padding:20px 22px;font-size:0.95rem;color:#dfe2ea;
}
.alacarte .note-box strong{color:var(--paper);}

/* why-us page */
.why-grid{
  display:grid;grid-template-columns:1.4fr 1fr;gap:40px;
  align-items:start;
}
.why-copy p{color:var(--ink);font-size:1rem;margin:0 0 18px;}
.why-copy p:last-child{margin-bottom:0;}
.why-facts{
  display:flex;flex-direction:column;gap:16px;
  background:#fff;border:1px solid var(--line);border-radius:14px;
  padding:26px 24px;
  position:sticky;top:90px;
}
.why-fact{
  display:flex;gap:10px;align-items:flex-start;
  font-size:0.93rem;color:var(--ink);padding-bottom:16px;
  border-bottom:1px solid var(--line);
}
.why-fact:last-child{border-bottom:none;padding-bottom:0;}
.why-fact .dot{
  width:8px;height:8px;border-radius:50%;background:var(--good);
  margin-top:6px;flex-shrink:0;
}

/* contact page */
.contact-panel{
  display:grid;grid-template-columns:1.1fr 0.9fr;gap:40px;
  background:#fff;border:1px solid var(--line);border-radius:16px;
  padding:44px;
}
.contact-panel h2{font-size:1.7rem;}
.contact-panel p{color:var(--muted);}
.contact-facts{margin-top:22px;}
.contact-facts .row{
  display:flex;gap:12px;padding:10px 0;border-top:1px solid var(--line);font-size:0.95rem;
}
.contact-facts .row:first-child{border-top:none;}
.contact-facts .label{font-family:'IBM Plex Mono',monospace;color:var(--muted);font-size:0.8rem;min-width:110px;padding-top:2px;text-transform:uppercase;letter-spacing:0.04em;}
form.lead-form{display:flex;flex-direction:column;gap:14px;}
form.lead-form label{font-size:0.85rem;font-weight:500;color:var(--muted);}
form.lead-form input, form.lead-form select, form.lead-form textarea{
  width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:8px;
  font-family:'IBM Plex Sans',sans-serif;font-size:0.95rem;background:var(--paper);color:var(--ink);
}
form.lead-form textarea{resize:vertical;min-height:90px;}
form.lead-form button{margin-top:6px;}

/* cta banner (bottom of sub-pages) */
.cta-banner{
  background:var(--navy);border-radius:16px;padding:44px 40px;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:24px;
}
.cta-banner h2{color:var(--paper);font-size:1.5rem;margin:0 0 6px;}
.cta-banner p{color:#c3c9d6;margin:0;}
.cta-banner .btn-primary{white-space:nowrap;}

footer{border-top:1px solid var(--line);padding:36px 0;}
footer .wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;}
footer p{margin:0;color:var(--muted);font-size:0.85rem;}
footer nav{display:flex;gap:18px;}
footer nav a{color:var(--muted);text-decoration:none;font-size:0.85rem;}
footer nav a:hover{color:var(--accent);}

/* add-ons page */
.addon-grid{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:24px;
}
.addon-card{
  background:#fff;border:1px solid var(--line);border-radius:14px;
  padding:30px 28px;display:flex;flex-direction:column;
}
.addon-card .addon-tag{
  font-family:'IBM Plex Mono',monospace;color:var(--accent);
  text-transform:uppercase;letter-spacing:0.08em;font-size:0.72rem;font-weight:500;
  margin-bottom:10px;
}
.addon-card h3{font-size:1.25rem;margin-bottom:6px;}
.addon-card .price{font-family:'Fraunces',serif;font-size:1.8rem;color:var(--navy);font-weight:600;margin:4px 0 12px;}
.addon-card .price small{font-family:'IBM Plex Sans',sans-serif;font-size:0.85rem;color:var(--muted);font-weight:400;}
.addon-card .price span{font-family:'IBM Plex Sans',sans-serif;font-size:0.9rem;color:var(--muted);font-weight:400;}
.addon-card p{color:var(--muted);font-size:0.95rem;margin:0 0 16px;}
.addon-card ul{list-style:none;margin:0;padding:0;}
.addon-card li{
  display:flex;gap:10px;align-items:flex-start;
  padding:8px 0;border-top:1px solid var(--line);font-size:0.93rem;
}
.addon-card li::before{content:"✓";color:var(--good);font-weight:700;flex-shrink:0;}
.teaser-card .from{font-family:'IBM Plex Sans',sans-serif;font-size:0.85rem;color:var(--muted);font-weight:400;}

@media (max-width: 780px){
  .hero h1{font-size:2rem;}
  .page-head h1{font-size:1.7rem;}
  .contact-panel{grid-template-columns:1fr;padding:28px;}
  nav.primary{display:none;}
  .alacarte{padding:30px 22px;}
  .why-grid{grid-template-columns:1fr;}
  .why-facts{position:static;}
  .cta-banner{flex-direction:column;align-items:flex-start;}
  .addon-grid{grid-template-columns:1fr;}
}
.tiers-two{max-width:760px;margin:0 auto;}
table.rate-table .rate-sub{display:inline-block;margin-top:3px;font-size:0.88rem;color:#a9b0c0;}

/* 2026-10-04: three-plan layout, setup fee line, fine print, contact form status */
.tiers-three{max-width:none;}
.tier-card .setup{font-size:0.78rem;color:var(--accent);text-transform:uppercase;letter-spacing:0.05em;margin:0 0 10px;}
p.fine{color:var(--muted);font-size:0.88rem;max-width:760px;margin:22px auto 0;text-align:center;}
.why-fact a{color:var(--accent);}
footer p a{color:var(--muted);}
.form-status{margin:4px 0 0;font-size:0.92rem;color:var(--muted);min-height:1.2em;}
.form-status.ok{color:var(--good);}
.form-status.err{color:var(--bad);}
nav.primary{gap:20px;}
@media (max-width: 980px){ nav.primary{gap:14px;} nav.primary a{font-size:0.88rem;} }

/* 2026-10-04: longer brand name (Rocknet Web & AI Services) - keep header on one line at mid widths */
header.site .wrap{gap:20px;}
.brand{white-space:nowrap;}
@media (max-width: 1140px){
  .brand{font-size:1.05rem;}
  nav.primary{gap:12px;}
  nav.primary a{font-size:0.85rem;}
  header.site .btn{padding:9px 14px;font-size:0.88rem;}
}
nav.primary a{white-space:nowrap;}
@media (max-width: 980px){ header.site .btn{display:none;} }

/* 2026-10-04: RockNet Consulting brand with tagline */
.brand-text{display:flex;flex-direction:column;line-height:1.1;}
.brand-text small{font-family:'IBM Plex Mono',monospace;font-weight:400;font-size:0.68rem;color:var(--muted);letter-spacing:0.02em;margin-top:3px;}
@media (max-width: 1140px){ .brand-text small{font-size:0.62rem;} }