/* M•AGNOVA / editorial brand system */
:root { --studio-ink:#203b49; --studio-blue:#5b97b2; --studio-pale:#e5f2f7; --studio-ice:#f3f8fa; --studio-cream:#f7f4ed; --studio-line:#c9d7dc; }
html { scroll-padding-top:90px; }
body { color:var(--studio-ink); background:#fff; }
h1,h2,h3 { color:var(--studio-ink); }
h2 em,h1 em { font-weight:400; color:var(--studio-blue); }
.container { width:min(1360px,calc(100% - clamp(36px,7vw,144px))); }
.eyebrow,.editorial-index,.signature-kicker { color:#477f98; font-size:.74rem; font-weight:700; line-height:1.4; letter-spacing:.16em; text-transform:uppercase; }
.button { border-radius:3px; min-height:51px; padding:0 22px; background:var(--studio-ink); border:1px solid var(--studio-ink); color:#fff; font-size:.88rem; font-weight:600; letter-spacing:.02em; box-shadow:none; }
.button:hover { background:#3a6275; border-color:#3a6275; box-shadow:none; transform:none; }
.button-light,.button-outline { background:transparent; color:var(--studio-ink); border-color:var(--studio-ink); }
.button-light:hover,.button-outline:hover { color:#fff; }
.quiet-link,.editorial-more { display:inline-flex; align-items:center; justify-content:space-between; gap:35px; width:max-content; padding:11px 0; border-bottom:1px solid currentColor; font-size:.91rem; font-weight:600; }
.quiet-link:hover,.editorial-more:hover { color:var(--studio-blue); }
.site-header { position:sticky; top:0; z-index:90; background:rgba(249,252,253,.97); border-bottom:1px solid var(--studio-line); backdrop-filter:blur(12px); }
.nav-wrap { min-height:78px; }
.brand { width:166px; }
.nav { gap:clamp(15px,2vw,34px); }
.nav a { font-size:.84rem; font-weight:600; }
.nav a:not(.button)::after { background:var(--studio-blue); }
.nav .button { min-height:40px; padding:0 17px; }
.home-page .site-header { position:absolute; left:0; right:0; top:0; background:transparent; border:0; backdrop-filter:none; }
.home-page .nav-wrap { min-height:98px; border-bottom:1px solid rgba(32,59,73,.21); }
.home-page .brand { width:168px; }
.home-page .nav .button { background:rgba(255,255,255,.3); }
.home-page .nav .button:hover { background:var(--studio-ink); }

.signature-hero { position:relative; min-height:100vh; min-height:100svh; overflow:hidden; background:var(--studio-cream); }
.signature-hero-inner { position:relative; min-height:100vh; min-height:100svh; display:flex; flex-direction:column; justify-content:space-between; padding-top:clamp(145px,20vh,215px); padding-bottom:32px; }
.signature-hero-content { width:min(100%,850px); }
.signature-kicker { margin:0 0 25px 5px; color:var(--studio-ink); }
.signature-hero h1 { margin:0; width:min(100%,820px); line-height:0; }
.signature-hero h1 img { display:block; width:100%; height:auto; }
.signature-hero-line { margin:16px 0 0 5px; color:var(--studio-ink); font-family:var(--serif); font-size:clamp(1.4rem,2.2vw,2.2rem); letter-spacing:-.015em; line-height:1.25; }
.signature-hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:24px; margin:40px 0 0 5px; }
.signature-hero-actions .button { min-width:195px; justify-content:space-between; }
.signature-hero-bottom { display:flex; align-items:center; justify-content:space-between; gap:20px; border-top:1px solid rgba(32,59,73,.3); padding:17px 0 0; color:#315263; font-size:.7rem; font-weight:700; letter-spacing:.12em; }
.signature-hero-bottom a { font-size:.78rem; letter-spacing:.05em; text-transform:none; white-space:nowrap; }
.signature-hero-bottom a span { margin-left:8px; font-size:1rem; }

.editorial-intro { background:var(--studio-cream); padding:clamp(100px,12vw,180px) 0; }
.intro-composition { display:grid; grid-template-columns:.34fr 1.4fr .18fr; gap:clamp(30px,6vw,100px); align-items:start; }
.intro-composition h2 { max-width:900px; font-size:clamp(3.6rem,6.5vw,7.8rem); letter-spacing:-.04em; }
.intro-composition p:not(.editorial-index) { max-width:610px; margin:36px 0 0 auto; color:#506571; font-size:clamp(1.06rem,1.4vw,1.24rem); line-height:1.7; }
.intro-asterisk { justify-self:end; color:#82b1c5; font-family:var(--serif); font-size:clamp(3rem,5vw,6rem); line-height:1; }
.editorial-services,.featured-work { padding:clamp(95px,11vw,160px) 0; background:#fff; }
.editorial-section-head { display:grid; grid-template-columns:.34fr 1.4fr .18fr; gap:clamp(30px,6vw,100px); align-items:start; margin-bottom:65px; }
.editorial-section-head h2 { max-width:820px; font-size:clamp(3.35rem,5.3vw,6.4rem); letter-spacing:-.04em; }
.editorial-section-head p:not(.editorial-index) { max-width:520px; margin-top:24px; color:#5b6f78; font-size:1.08rem; }
.service-line-list { border-top:1px solid var(--studio-line); }
.service-line { display:grid; grid-template-columns:.25fr 1.5fr 36px; align-items:center; gap:30px; padding:33px 0 36px; border-bottom:1px solid var(--studio-line); transition:padding .25s ease,background .25s ease; }
.service-line:hover { padding-left:20px; background:#f4f9fb; }
.service-count { align-self:start; margin-top:10px; color:#6fa0b5; font-family:var(--serif); font-size:1.25rem; }
.service-line h3 { font-size:clamp(2rem,3.2vw,3.6rem); letter-spacing:-.035em; }
.service-line p { margin-top:9px; color:#5b6f78; font-size:1rem; }
.line-arrow { align-self:center; font-size:1.65rem; font-weight:300; color:var(--studio-blue); }
.scope-note { margin-top:28px; color:#60727b; font-size:.9rem; }

.featured-work { background:var(--studio-ice); }
.featured-grid { display:grid; grid-template-columns:1.12fr .88fr; gap:24px; align-items:start; }
.feature-card { display:block; min-width:0; background:#fff; }
.feature-primary { grid-row:span 2; }
.feature-image { display:flex; align-items:center; justify-content:center; min-width:0; height:280px; padding:18px; background:#e7eff1; overflow:hidden; }
.feature-primary .feature-image { height:575px; padding:30px; }
.feature-image img { width:100%; height:100%; object-fit:contain; }
.feature-image-smoke { background:#dcecf2; }
.feature-image-smoke img { width:auto; max-width:100%; }
.feature-meta { display:flex; justify-content:space-between; gap:16px; align-items:end; padding:24px 26px 28px; border:1px solid #d8e4e8; border-top:0; }
.feature-meta small { color:#568ca4; font-size:.68rem; font-weight:700; letter-spacing:.13em; }
.feature-meta h3 { margin:9px 0 7px; font-size:clamp(1.8rem,2.6vw,3.1rem); }
.feature-meta p { color:#5c6e77; font-size:.95rem; }
.feature-meta > span { color:var(--studio-blue); font-size:1.4rem; }
.editorial-more { margin-top:36px; margin-left:auto; }

.portfolio-teaser { padding:clamp(90px,11vw,160px) 0; background:var(--studio-pale); overflow:hidden; }
.teaser-grid { display:grid; grid-template-columns:.85fr 1.15fr; align-items:center; gap:clamp(60px,9vw,150px); }
.teaser-copy h2 { margin-top:32px; font-size:clamp(3.2rem,5.7vw,6.5rem); letter-spacing:-.04em; }
.teaser-copy > p:not(.editorial-index) { max-width:480px; margin:28px 0 34px; color:#536b77; font-size:1.08rem; }
.teaser-art { position:relative; padding:30px 30px 20px; background:#fff; box-shadow:22px 26px 0 rgba(91,151,178,.21); transform:rotate(1deg); }
.teaser-art img { display:block; width:100%; height:auto; box-shadow:0 0 0 1px #e3e9e9; }
.teaser-art span { display:block; margin:19px 0 0; color:#668290; font-size:.68rem; font-weight:700; letter-spacing:.14em; }

.founder-section { padding:clamp(90px,11vw,160px) 0; background:var(--studio-cream); }
.founder-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(60px,10vw,170px); align-items:center; }
.founder-photo { max-width:500px; background:#d9e9ee; }
.founder-photo img { width:100%; height:auto; display:block; }
.founder-copy h2 { margin:32px 0 32px; font-size:clamp(3.4rem,5.7vw,6.4rem); letter-spacing:-.04em; }
.founder-copy > p:not(.editorial-index) { max-width:560px; margin-bottom:20px; color:#526671; font-size:1.12rem; }
.founder-copy .quiet-link { margin-top:18px; }
.closing-section { padding:clamp(100px,12vw,170px) 0; background:var(--studio-ink); }
.closing-grid { display:grid; grid-template-columns:.34fr 1.4fr .18fr; gap:clamp(30px,6vw,100px); }
.closing-grid .editorial-index { color:#a7d4e5; }
.closing-grid h2 { color:#fff; font-size:clamp(3.5rem,6vw,7rem); letter-spacing:-.04em; }
.closing-grid h2 em { color:#9ecde0; }
.closing-grid p:not(.editorial-index) { max-width:580px; margin:26px 0 34px; color:#d5e5ec; font-size:1.08rem; }
.closing-grid .button-light { background:#fff; color:var(--studio-ink); border-color:#fff; }
.closing-grid .button-light:hover { background:#d8edf5; color:var(--studio-ink); }
.site-footer { background:#dcecf2; border-top:0; }
.footer-main { padding:75px 0 55px; }
.site-footer .brand { width:220px; }
.footer-title { color:#426f82; }
.footer-bottom { border-color:#bfd5de; }

/* Inner pages inherit the same typography, space and surfaces. */
.portfolio-intro { padding:clamp(85px,10vw,140px) 0; background:var(--studio-cream); }
.portfolio-intro h1 { max-width:1120px; font-size:clamp(3.5rem,7vw,7.6rem); letter-spacing:-.04em; }
.portfolio-intro .lead { max-width:710px; margin-top:29px; color:#526771; font-size:1.15rem; }
.detail-list { border-top:1px solid var(--studio-line); }
.detail-card { grid-template-columns:75px .9fr 1.1fr; gap:clamp(25px,5vw,80px); padding:55px 0; border-color:var(--studio-line); }
.detail-card h3 { font-size:clamp(2.15rem,3vw,3.4rem); }
.detail-card li { margin-bottom:8px; }
.about-strip { background:var(--studio-pale); }
.about-grid { gap:clamp(50px,8vw,130px); }
.about-copy h2 { font-size:clamp(3.1rem,5vw,5.7rem); }
.about-copy > p:not(.eyebrow) { margin-top:20px; font-size:1.08rem; color:#536a75; }
.about-image img { width:100%; height:auto; }
.contact-hold { background:var(--studio-pale); border:1px solid var(--studio-line); border-radius:0; padding:clamp(28px,4vw,60px); }
.contact-hold h3 { font-size:clamp(2.1rem,3vw,3.3rem); }
.portfolio-reader { background:var(--studio-ice); }
.portfolio-reader-head h2 { font-size:clamp(3rem,5vw,5.7rem); }
.portfolio-reader-head p:not(.eyebrow) { color:#526b77; }
.portfolio-extra { border-top:1px solid var(--studio-line); }
.portfolio-extra .case-gallery figure { border-color:var(--studio-line); }
.home-last { background:var(--studio-ink); }

@media (max-width:1100px) {
  .intro-composition,.editorial-section-head,.closing-grid { grid-template-columns:180px minmax(0,1fr); gap:40px; }
  .intro-asterisk { display:none; }
  .signature-hero h1 { width:min(70vw,740px); }
  .featured-grid { grid-template-columns:1fr 1fr; }
  .feature-primary .feature-image { height:500px; }
  .teaser-grid { gap:60px; }
}
@media (max-width:980px) {
  .nav { position:fixed; inset:78px 0 auto; padding:25px clamp(18px,5vw,50px) 35px; display:none; flex-direction:column; align-items:flex-start; gap:18px; max-height:calc(100svh - 78px); overflow-y:auto; background:#f8fbfc; border-bottom:1px solid var(--studio-line); box-shadow:0 20px 30px rgba(32,59,73,.09); }
  .nav.open { display:flex; }
  .nav a { font-size:1.05rem; }
  .nav .button { margin-top:8px; }
  .menu-button { display:block; background:rgba(255,255,255,.8); border-color:#9dbac5; }
  .home-page .nav { background:#f8fbfc; }
  .signature-hero h1 { width:min(83vw,700px); }
  .teaser-grid,.founder-grid { grid-template-columns:1fr 1fr; gap:45px; }
  .detail-card { grid-template-columns:50px 1fr; }
  .detail-card p { grid-column:2; }
}
@media (max-width:760px) {
  .container { width:calc(100% - 40px); }
  .nav-wrap,.home-page .nav-wrap { min-height:70px; }
  .nav { top:70px; max-height:calc(100svh - 70px); }
  .brand,.home-page .brand { width:142px; }
  .signature-hero-inner { padding-top:clamp(150px,24vh,215px); padding-bottom:22px; }
  .signature-hero h1 { width:100%; max-width:610px; }
  .signature-kicker { margin-bottom:20px; font-size:.68rem; }
  .signature-hero-line { margin-top:16px; font-size:clamp(1.45rem,4.6vw,1.9rem); }
  .signature-hero-actions { margin-top:30px; gap:12px 24px; }
  .signature-hero-bottom { align-items:flex-end; }
  .signature-hero-bottom > span { max-width:190px; font-size:.62rem; line-height:1.5; }
  .intro-composition,.editorial-section-head,.closing-grid { grid-template-columns:1fr; gap:28px; }
  .intro-composition h2,.editorial-section-head h2,.closing-grid h2 { font-size:clamp(3rem,10vw,5.2rem); }
  .intro-composition p:not(.editorial-index) { margin:24px 0 0; }
  .editorial-section-head { margin-bottom:40px; }
  .service-line { grid-template-columns:32px minmax(0,1fr) 24px; gap:12px; padding:28px 0; }
  .service-line h3 { font-size:clamp(1.7rem,6vw,2.6rem); }
  .service-line p { font-size:.95rem; }
  .service-count { font-size:1rem; }
  .featured-grid { grid-template-columns:1fr; gap:24px; }
  .feature-primary { grid-row:auto; }
  .feature-primary .feature-image,.feature-image { height:360px; padding:17px; }
  .teaser-grid,.founder-grid { grid-template-columns:1fr; gap:55px; }
  .teaser-copy h2,.founder-copy h2 { font-size:clamp(3rem,10vw,5.2rem); }
  .teaser-art { padding:15px 15px 12px; box-shadow:12px 14px 0 rgba(91,151,178,.21); }
  .founder-photo { width:min(100%,480px); }
  .portfolio-intro { padding:80px 0 65px; }
  .portfolio-intro h1 { font-size:clamp(3rem,10vw,5rem); }
  .detail-card { gap:14px; padding:35px 0; }
  .detail-card h3 { font-size:2rem; }
  .footer-main { padding:55px 0 40px; }
}
@media (max-width:520px) {
  .signature-hero { min-height:100svh; }
  .signature-hero-inner { min-height:100svh; padding-top:clamp(137px,22vh,190px); }
  .signature-hero-actions { align-items:stretch; flex-direction:column; max-width:265px; }
  .signature-hero-actions .button { width:100%; }
  .signature-hero-line { max-width:330px; }
  .signature-hero-bottom { align-items:center; }
  .signature-hero-bottom > span { max-width:150px; }
  .signature-hero-bottom a { font-size:.7rem; }
  .editorial-intro,.editorial-services,.featured-work,.portfolio-teaser,.founder-section,.closing-section { padding:83px 0; }
  .feature-primary .feature-image,.feature-image { height:300px; }
  .feature-image-smoke { height:350px; }
  .feature-meta { padding:20px; }
  .feature-meta h3 { font-size:2rem; }
  .portfolio-reader-actions .button { width:100%; }
}
@media (max-width:360px) {
  .container { width:calc(100% - 30px); }
  .signature-hero-inner { padding-top:125px; }
  .signature-hero-actions { max-width:225px; }
  .signature-hero-bottom > span { display:none; }
  .signature-hero-bottom { justify-content:flex-end; }
}
@media (prefers-reduced-motion:reduce) {
  .service-line { transition:none; }
}

/* Brand cover: supplied blue and the original M•AGNOVA lettering. */
:root { --studio-blue:#6695af; }
.home-page .site-header { background:transparent; border:0; }
.home-page .nav-wrap { justify-content:flex-end; border-bottom:1px solid rgba(255,255,255,.34); }
.home-page .brand { display:none; }
.home-page .nav a { color:#fff; }
.home-page .nav a:not(.button)::after { background:#fff; }
.home-page .nav .button { color:#fff; border-color:#fff; background:transparent; }
.home-page .nav .button:hover { color:var(--studio-blue); background:#fff; }
.signature-hero { background:#6695af; }
.signature-hero-inner { display:grid; place-items:center; min-height:100vh; min-height:100svh; padding:95px 0 85px; }
.signature-hero-content { width:min(84vw,1020px); }
.signature-hero h1 { width:100%; margin:0; }
.signature-hero h1 img { width:100%; height:auto; filter:brightness(0) invert(.95); }
.signature-hero-bottom { position:absolute; left:0; right:0; bottom:30px; justify-content:space-between; border-color:rgba(255,255,255,.47); color:#fff; }
.signature-hero-bottom a { display:inline-flex; align-items:center; padding-top:4px; color:#fff; font-size:.71rem; letter-spacing:.14em; }
.signature-hero-bottom a:hover { opacity:.72; }
.signature-hero-bottom a span { font-size:1.2rem; }
.closing-section { background:var(--studio-blue); }
.closing-grid .editorial-index { color:#eef8fc; }
.closing-grid h2 em { color:#fff; }
.closing-grid p:not(.editorial-index) { color:#f2f8fa; }
@media (max-width:980px) {
  .home-page .nav-wrap { min-height:78px; }
  .home-page .menu-button { border-color:rgba(255,255,255,.65); color:#fff; background:transparent; }
  .home-page .nav.open { background:#f7fafb; }
  .home-page .nav.open a { color:var(--studio-ink); }
  .home-page .nav.open .button { color:var(--studio-ink); border-color:var(--studio-ink); }
  .signature-hero-content { width:min(88vw,800px); }
}
@media (max-width:760px) {
  .home-page .nav-wrap { min-height:70px; }
  .signature-hero-inner { padding:78px 0 75px; }
  .signature-hero-content { width:100%; }
  .signature-hero-bottom { bottom:22px; }
  .signature-hero-bottom a { font-size:.62rem; letter-spacing:.08em; }
}
@media (max-width:360px) {
  .signature-hero-bottom { gap:14px; }
  .signature-hero-bottom a { font-size:.57rem; }
}
