/*
Theme Name: North & Noble
Theme URI: https://northandnoblemoving.com
Author: North & Noble Moving Solutions
Description: Custom premium WordPress theme for North & Noble Moving Solutions.
Version: 0.1.0
Text Domain: north-noble
Requires at least: 6.0
Requires PHP: 8.0
License: Proprietary
*/

:root {
  --nn-forest: #0F2D22;
  --nn-gold: #C8A15A;
  --nn-ivory: #F4F1E8;
  --nn-charcoal: #1C1C1C;
  --nn-stone: #D9D6CE;
  --nn-white: #FFFFFF;
  --nn-muted: #6C716E;
  --nn-shadow: 0 18px 50px rgba(15,45,34,.12);
  --nn-radius: 18px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--nn-charcoal);
  background: var(--nn-ivory);
  font-family: "Montserrat", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
}
img { max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
.nn-container { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }

.nn-topbar {
  background: #0a2119;
  color: rgba(255,255,255,.78);
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.nn-topbar-inner {
  min-height: 38px; display:flex; align-items:center; justify-content:space-between; gap:20px;
}
.nn-site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(15,45,34,.96);
  backdrop-filter: blur(12px);
  color: var(--nn-white);
  border-bottom: 1px solid rgba(200,161,90,.18);
}
.nn-header-inner {
  min-height: 84px; display:flex; align-items:center; justify-content:space-between; gap:32px;
}
.nn-brand { display:flex; align-items:center; gap:13px; }
.nn-mark {
  width:46px; height:46px; border:1px solid var(--nn-gold); border-radius:50%;
  display:grid; place-items:center; font-family:"Playfair Display", serif;
  color:var(--nn-gold); font-size:18px; letter-spacing:-.06em;
}
.nn-wordmark strong {
  display:block; font-family:"Playfair Display", serif; font-size:21px; letter-spacing:.04em;
}
.nn-wordmark span {
  display:block; margin-top:-2px; color:var(--nn-gold); font-size:9px; letter-spacing:.3em; text-transform:uppercase;
}
.nn-nav { display:flex; align-items:center; gap:26px; font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.nn-nav a { opacity:.92; }
.nn-nav a:hover { color:var(--nn-gold); }
.nn-button {
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:48px; padding:0 24px; border:1px solid var(--nn-gold);
  background:var(--nn-gold); color:#10251d; font-size:12px; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; transition:.2s ease;
}
.nn-button:hover { transform:translateY(-1px); filter:brightness(1.04); }
.nn-button--ghost { background:transparent; color:var(--nn-white); }

.nn-menu-toggle { display:none; background:none; border:0; color:#fff; font-size:26px; }

.nn-hero {
  position:relative; min-height:690px; display:grid; align-items:center; color:white; overflow:hidden;
  background:
    linear-gradient(90deg, rgba(7,27,20,.92) 0%, rgba(15,45,34,.82) 48%, rgba(15,45,34,.35) 72%, rgba(15,45,34,.1) 100%),
    radial-gradient(circle at 78% 26%, rgba(200,161,90,.25), transparent 22%),
    linear-gradient(135deg, #1f4939 0%, #0d261d 60%, #243d35 100%);
}
.nn-hero::after {
  content:""; position:absolute; inset:auto -10% -180px 40%; height:420px;
  border:1px solid rgba(200,161,90,.18); border-radius:50%; transform:rotate(-8deg);
}
.nn-hero-grid { position:relative; z-index:2; display:grid; grid-template-columns:1.05fr .75fr; gap:70px; align-items:end; padding:105px 0 95px; }
.nn-eyebrow { color:var(--nn-gold); font-size:12px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; margin-bottom:18px; }
.nn-hero h1 {
  margin:0; font-family:"Playfair Display", serif; font-weight:500;
  font-size:clamp(58px, 7.4vw, 106px); line-height:.9; letter-spacing:-.035em;
}
.nn-hero h1 em { color:var(--nn-gold); font-style:normal; }
.nn-hero-copy {
  align-self:end; padding-bottom:10px; max-width:430px; color:rgba(255,255,255,.9);
  font-size:18px;
}
.nn-hero-actions { display:flex; gap:14px; flex-wrap:wrap; margin-top:28px; }

.nn-trust-strip { background:var(--nn-forest); color:white; border-top:1px solid rgba(200,161,90,.18); }
.nn-trust-grid { display:grid; grid-template-columns:repeat(5,1fr); }
.nn-trust-item { padding:25px 18px; border-right:1px solid rgba(255,255,255,.1); text-align:center; }
.nn-trust-item:last-child { border-right:0; }
.nn-trust-icon { color:var(--nn-gold); font-size:19px; margin-bottom:7px; }
.nn-trust-item strong { display:block; font-size:11px; letter-spacing:.1em; text-transform:uppercase; }
.nn-trust-item span { display:block; color:rgba(255,255,255,.6); font-size:11px; margin-top:4px; }

.nn-section { padding:92px 0; }
.nn-section--white { background:#fff; }
.nn-section--forest { background:var(--nn-forest); color:white; }
.nn-section-title { text-align:center; max-width:720px; margin:0 auto 46px; }
.nn-section-title h2 {
  margin:0; font-family:"Playfair Display", serif; font-weight:500;
  font-size:clamp(38px,5vw,62px); line-height:1.02;
}
.nn-section-title p { color:var(--nn-muted); margin:16px auto 0; max-width:620px; }
.nn-section--forest .nn-section-title p { color:rgba(255,255,255,.68); }

.nn-services { display:grid; grid-template-columns:repeat(5,1fr); background:#fff; border:1px solid #e8e4dc; box-shadow:var(--nn-shadow); }
.nn-service { padding:34px 24px 30px; min-height:265px; border-right:1px solid #e8e4dc; display:flex; flex-direction:column; }
.nn-service:last-child { border-right:0; }
.nn-service-icon { width:42px; height:42px; color:var(--nn-gold); font-size:26px; margin-bottom:28px; }
.nn-service h3 { font-size:13px; letter-spacing:.08em; text-transform:uppercase; margin:0 0 13px; }
.nn-service p { color:#666; font-size:13px; margin:0 0 20px; }
.nn-service a { margin-top:auto; color:var(--nn-gold); font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }

.nn-standard-grid { display:grid; grid-template-columns:.85fr 1fr; gap:80px; align-items:center; }
.nn-standard-copy h2 { font-family:"Playfair Display", serif; font-size:54px; font-weight:500; line-height:1.02; margin:0 0 20px; }
.nn-standard-copy p { color:#5f655f; font-size:17px; }
.nn-checks { display:grid; grid-template-columns:1fr 1fr; gap:14px 28px; margin-top:34px; }
.nn-check { display:flex; align-items:flex-start; gap:12px; font-size:14px; }
.nn-check b { color:var(--nn-gold); }
.nn-photo-panel {
  min-height:520px; border-radius:var(--nn-radius); overflow:hidden; position:relative;
  background:
    linear-gradient(180deg, rgba(15,45,34,.08), rgba(15,45,34,.78)),
    linear-gradient(135deg, #d8d0c1 0%, #9ba99f 48%, #2e5546 100%);
  box-shadow:var(--nn-shadow);
}
.nn-photo-panel::before {
  content:"N&N"; position:absolute; right:24px; bottom:20px;
  font-family:"Playfair Display",serif; color:rgba(255,255,255,.88); font-size:42px;
}
.nn-photo-note {
  position:absolute; left:26px; bottom:28px; right:100px; color:white;
  font-family:"Playfair Display",serif; font-size:27px; line-height:1.15;
}

.nn-quote { display:grid; grid-template-columns:.85fr 1.15fr; background:#fff; box-shadow:var(--nn-shadow); }
.nn-quote-intro { background:var(--nn-forest); color:white; padding:58px; }
.nn-quote-intro h2 { font-family:"Playfair Display",serif; font-weight:500; font-size:49px; margin:0 0 18px; line-height:1; }
.nn-quote-intro p { color:rgba(255,255,255,.7); }
.nn-quote-form { padding:48px 52px; }
.nn-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.nn-field label { display:block; margin-bottom:7px; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.nn-field input, .nn-field select, .nn-field textarea {
  width:100%; border:1px solid #d9d6ce; background:#fbfaf7; padding:14px 15px;
  min-height:50px; font:inherit; color:#222; outline:none;
}
.nn-field input:focus, .nn-field select:focus, .nn-field textarea:focus { border-color:var(--nn-gold); }
.nn-field--full { grid-column:1 / -1; }

.nn-area-band {
  padding:44px 0; background:#0a2119; color:white; text-align:center; position:relative; overflow:hidden;
}
.nn-area-band::before {
  content:""; position:absolute; width:680px; height:180px; left:50%; bottom:-120px; transform:translateX(-50%);
  border:1px solid rgba(200,161,90,.26); border-radius:50%;
}
.nn-area-band small { display:block; color:var(--nn-gold); letter-spacing:.18em; text-transform:uppercase; margin-bottom:8px; }
.nn-area-band strong { font-family:"Playfair Display",serif; font-size:28px; font-weight:500; }

.nn-footer { background:#071a14; color:white; padding:62px 0 28px; }
.nn-footer-grid { display:grid; grid-template-columns:1.4fr repeat(3,1fr); gap:48px; }
.nn-footer h4 { color:var(--nn-gold); font-size:11px; letter-spacing:.12em; text-transform:uppercase; margin:0 0 17px; }
.nn-footer p, .nn-footer li, .nn-footer a { color:rgba(255,255,255,.63); font-size:13px; }
.nn-footer ul { list-style:none; padding:0; margin:0; }
.nn-footer li { margin:8px 0; }
.nn-footer-bottom {
  border-top:1px solid rgba(255,255,255,.1); margin-top:44px; padding-top:22px;
  display:flex; justify-content:space-between; color:rgba(255,255,255,.42); font-size:11px;
}

.nn-page-hero { padding:90px 0 70px; background:var(--nn-forest); color:white; }
.nn-page-hero h1 { font-family:"Playfair Display",serif; font-size:60px; font-weight:500; margin:0; }
.nn-content { padding:70px 0; background:white; }
.nn-content article { max-width:820px; margin:auto; }

@media (max-width: 980px) {
  .nn-nav { display:none; position:absolute; left:0; right:0; top:84px; background:var(--nn-forest); padding:24px 20px; flex-direction:column; align-items:flex-start; }
  .nn-nav.is-open { display:flex; }
  .nn-menu-toggle { display:block; }
  .nn-topbar { display:none; }
  .nn-hero-grid { grid-template-columns:1fr; gap:35px; padding:82px 0 78px; }
  .nn-hero-copy { max-width:620px; }
  .nn-trust-grid { grid-template-columns:1fr 1fr; }
  .nn-trust-item:nth-child(5) { grid-column:1 / -1; }
  .nn-services { grid-template-columns:1fr 1fr; }
  .nn-service { border-bottom:1px solid #e8e4dc; }
  .nn-standard-grid, .nn-quote { grid-template-columns:1fr; }
  .nn-footer-grid { grid-template-columns:1fr 1fr; }
}

@media (max-width: 640px) {
  .nn-container { width:min(100% - 26px, 1180px); }
  .nn-header-inner { min-height:72px; }
  .nn-wordmark strong { font-size:17px; }
  .nn-wordmark span { font-size:8px; }
  .nn-mark { width:40px; height:40px; }
  .nn-nav { top:72px; }
  .nn-hero { min-height:auto; }
  .nn-hero-grid { padding:66px 0 58px; }
  .nn-hero h1 { font-size:56px; }
  .nn-hero-copy { font-size:15px; }
  .nn-button { width:100%; }
  .nn-trust-grid { grid-template-columns:1fr; }
  .nn-trust-item { border-right:0; border-bottom:1px solid rgba(255,255,255,.1); }
  .nn-trust-item:nth-child(5) { grid-column:auto; }
  .nn-section { padding:68px 0; }
  .nn-services { grid-template-columns:1fr; }
  .nn-service { border-right:0; min-height:220px; }
  .nn-standard-grid { gap:38px; }
  .nn-standard-copy h2 { font-size:42px; }
  .nn-checks { grid-template-columns:1fr; }
  .nn-photo-panel { min-height:390px; }
  .nn-quote-intro, .nn-quote-form { padding:36px 24px; }
  .nn-form-grid { grid-template-columns:1fr; }
  .nn-field--full { grid-column:auto; }
  .nn-footer-grid { grid-template-columns:1fr; }
  .nn-footer-bottom { flex-direction:column; gap:8px; }
}