/* ============================================================
   RIZZIGN — Enhanced Design System v2
   style.css — All pages shared
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Syne:wght@400;600;700;800&family=IBM+Plex+Mono:wght@300;400;500;600&display=swap');

/* ---- Variables ---- */
:root {
  --cream:     #F0EBE3;
  --off-white: #E8E3DB;
  --chalk:     #D9D3CA;
  --ash:       #B8B2A8;
  --stone:     #807B72;
  --graphite:  #3C3830;
  --ink:       #1A1714;
  --rule:      2px solid #1A1714;
  --rule-lt:   1px solid #B8B2A8;
  --rule-xs:   1px solid #D9D3CA;
  --font-display: 'Bebas Neue', sans-serif;
  --font-head:    'Syne', sans-serif;
  --font-mono:    'IBM Plex Mono', monospace;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --transition: 0.35s var(--ease-out);
}

/* ---- Reset ---- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; scroll-behavior: smooth; }
body { background: var(--cream); color: var(--ink); font-family: var(--font-mono); overflow-x: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { font-family: inherit; cursor: pointer; }

/* ============================================================
   TYPOGRAPHY
   ============================================================ */
.display-xl  { font-family: var(--font-display); font-size: clamp(5rem,13vw,11rem); line-height:.88; letter-spacing:.02em; }
.display-lg  { font-family: var(--font-display); font-size: clamp(3.5rem,8vw,7rem); line-height:.9; letter-spacing:.02em; }
.display-md  { font-family: var(--font-display); font-size: clamp(2.2rem,5vw,4rem); line-height:.92; letter-spacing:.02em; }
.display-sm  { font-family: var(--font-display); font-size: clamp(1.6rem,3vw,2.6rem); line-height:.95; letter-spacing:.02em; }
.heading-lg  { font-family: var(--font-head); font-weight:800; font-size: clamp(1.5rem,3vw,2.25rem); line-height:1.1; }
.heading-md  { font-family: var(--font-head); font-weight:700; font-size: clamp(1.1rem,2vw,1.5rem); line-height:1.2; }
.label       { font-family: var(--font-mono); font-size:.65rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:var(--stone); }
.body-text   { font-family: var(--font-mono); font-size:.88rem; line-height:1.8; color:var(--graphite); }
.outlined    { -webkit-text-stroke:2px var(--ink); color:transparent; }
.outlined-lt { -webkit-text-stroke:2px var(--cream); color:transparent; }

/* ============================================================
   UTILITY
   ============================================================ */
.border-top    { border-top: var(--rule); }
.border-bottom { border-bottom: var(--rule); }
.border-right  { border-right: var(--rule); }
.section-pad   { padding: clamp(3rem,8vw,6rem) 0; }

/* ---- Buttons ---- */
.btn {
  display: inline-flex; align-items: center; gap: .5rem;
  font-family: var(--font-mono); font-size:.68rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase;
  padding:.75rem 1.75rem; border:var(--rule);
  background:var(--ink); color:var(--cream);
  transition: transform .18s, box-shadow .18s, background .18s;
  position: relative; white-space: nowrap;
}
.btn:hover { background:var(--graphite); transform:translate(-3px,-3px); box-shadow:4px 4px 0 var(--ink); }
.btn--outline { background:transparent; color:var(--ink); }
.btn--outline:hover { background:var(--ink); color:var(--cream); }
.btn--cream { background:var(--cream); color:var(--ink); border-color:var(--cream); }
.btn--cream:hover { background:var(--off-white); box-shadow:4px 4px 0 var(--chalk); }
.btn--lg { font-size:.75rem; padding:1rem 2.25rem; }
.btn svg { width:14px; height:14px; flex-shrink:0; transition:transform .2s; }
.btn:hover svg { transform:translateX(3px); }

/* ---- Tags ---- */
.tag { display:inline-block; font-family:var(--font-mono); font-size:.58rem; font-weight:500; letter-spacing:.14em; text-transform:uppercase; padding:.28rem .7rem; border:1px solid var(--ink); color:var(--ink); }
.tag--light { border-color:var(--ash); color:var(--stone); }
.tag--cream { border-color:rgba(240,235,227,.5); color:var(--cream); }

/* ---- Noise overlay ---- */
body::before {
  content:''; position:fixed; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  background-size:200px 200px; pointer-events:none; z-index:9998; opacity:.5;
}

/* ============================================================
   IMAGE UTILITIES
   ============================================================ */
.img-wrap { position:relative; overflow:hidden; }
.img-wrap img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .8s var(--ease-out), filter .5s; }
.img-wrap:hover img { transform:scale(1.04); }
.img-styled { filter:grayscale(25%) contrast(1.05); }
.img-styled:hover { filter:grayscale(0%) contrast(1); }
.img-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(26,23,20,.85) 0%, rgba(26,23,20,.25) 60%, transparent 100%);
  pointer-events:none;
}
.img-overlay--dark { background:rgba(26,23,20,.55); }
.img-overlay--mid  { background:rgba(26,23,20,.38); }

/* ============================================================
   NAVIGATION
   ============================================================ */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:500;
  background:var(--cream); border-bottom:var(--rule);
  height:66px; display:flex; align-items:center;
  transition:box-shadow .3s;
}
.nav.scrolled { box-shadow:0 4px 0 rgba(26,23,20,.08); }
.nav__inner {
  display:grid; grid-template-columns:auto 1fr auto;
  align-items:center; gap:2rem; width:100%; padding:0 clamp(1rem,3vw,2.5rem);
}
.nav__logo {
  font-family:var(--font-display); font-size:1.85rem; letter-spacing:.08em;
  display:flex; align-items:center; gap:.45rem; white-space:nowrap;
}
.nav__logo-dot { display:inline-block; width:8px; height:8px; background:var(--ink); border-radius:50%; }
.nav__links { display:flex; align-items:center; justify-content:center; gap:2.5rem; }
.nav__links a {
  font-family:var(--font-mono); font-size:.64rem; font-weight:500;
  letter-spacing:.18em; text-transform:uppercase; color:var(--stone);
  padding-bottom:2px; border-bottom:2px solid transparent;
  transition:color .15s, border-color .15s;
}
.nav__links a:hover, .nav__links a.active { color:var(--ink); border-bottom-color:var(--ink); }
.nav__actions { display:flex; align-items:center; gap:1rem; justify-content:flex-end; }
.nav__hamburger { display:none; flex-direction:column; gap:5px; background:none; border:none; padding:4px; }
.nav__hamburger span { display:block; width:26px; height:2px; background:var(--ink); transition:transform .25s, opacity .25s; }
.nav__mobile {
  display:none; position:fixed; top:66px; left:0; right:0;
  background:var(--cream); border-bottom:var(--rule); z-index:499;
  padding:1.5rem clamp(1rem,3vw,2.5rem); flex-direction:column; gap:1.25rem;
}
.nav__mobile.open { display:flex; }
.nav__mobile a { font-family:var(--font-mono); font-size:.75rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--stone); border-bottom:var(--rule-xs); padding-bottom:1.25rem; }
.nav__mobile a:hover, .nav__mobile a.active { color:var(--ink); }
.nav__mobile .btn { align-self:flex-start; margin-top:.5rem; }
.nav__hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.nav__hamburger.open span:nth-child(2) { opacity:0; }
.nav__hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
.page-wrap { padding-top:66px; min-height:100vh; }

/* ============================================================
   TICKER TAPE
   ============================================================ */
.ticker { background:var(--ink); color:var(--cream); overflow:hidden; white-space:nowrap; padding:.55rem 0; }
.ticker__track { display:inline-block; animation:ticker-scroll 30s linear infinite; }
.ticker__track:hover { animation-play-state:paused; }
.ticker__item { display:inline-block; font-family:var(--font-mono); font-size:.62rem; font-weight:500; letter-spacing:.15em; text-transform:uppercase; padding:0 2rem; }
.ticker__sep { display:inline-block; opacity:.4; font-size:.5rem; }
@keyframes ticker-scroll { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ============================================================
   HERO — PHOTO FULLSCREEN
   ============================================================ */
.hero-photo {
  position:relative; min-height:100svh;
  display:flex; flex-direction:column; justify-content:flex-end;
  overflow:hidden;
}
.hero-photo__bg {
  position:absolute; inset:-10%;
  background-image:url('https://images.unsplash.com/photo-1546519638-68e109498ffc?auto=format&fit=crop&w=1920&q=85');
  background-size:cover; background-position:center top;
  will-change:transform;
}
.hero-photo__overlay {
  position:absolute; inset:0;
  background:linear-gradient(
    160deg,
    rgba(26,23,20,.75) 0%,
    rgba(26,23,20,.45) 40%,
    rgba(26,23,20,.7) 100%
  );
}
.hero-photo__content {
  position:relative; z-index:2;
  padding:clamp(2rem,5vw,4rem) clamp(1rem,3vw,2.5rem);
  display:grid; grid-template-columns:1fr auto;
  align-items:flex-end; gap:2rem;
}
.hero-photo__headline { color:var(--cream); }
.hero-photo__headline .line { display:block; }
.hero-photo__headline .hollow { -webkit-text-stroke:2px var(--cream); color:transparent; }
.hero-photo__right { display:flex; flex-direction:column; gap:1rem; align-items:flex-end; }
.hero-photo__desc {
  font-family:var(--font-mono); font-size:.85rem; color:rgba(240,235,227,.8);
  line-height:1.8; max-width:36ch; text-align:right;
}
.hero-photo__ctas { display:flex; gap:.75rem; flex-wrap:wrap; justify-content:flex-end; }

/* Platform badges bar */
.hero-photo__platforms {
  position:relative; z-index:2; border-top:2px solid rgba(240,235,227,.2);
  display:grid; grid-template-columns:repeat(3,1fr);
}
.hero-platform {
  padding:1.25rem clamp(1rem,3vw,2.5rem);
  border-right:2px solid rgba(240,235,227,.2);
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  color:var(--cream); transition:background .25s;
  cursor:pointer;
}
.hero-platform:last-child { border-right:none; }
.hero-platform:hover { background:rgba(240,235,227,.1); }
.hero-platform__label { font-family:var(--font-mono); font-size:.6rem; letter-spacing:.18em; text-transform:uppercase; color:rgba(240,235,227,.5); }
.hero-platform__name { font-family:var(--font-display); font-size:1.5rem; letter-spacing:.06em; }
.hero-platform__arrow { font-size:1.1rem; opacity:.5; transition:opacity .2s, transform .2s; }
.hero-platform:hover .hero-platform__arrow { opacity:1; transform:translateX(4px); }

/* Scroll indicator */
.hero-photo__scroll {
  position:absolute; bottom:clamp(8rem,16vw,11rem); right:clamp(1rem,3vw,2.5rem);
  z-index:2; display:flex; flex-direction:column; align-items:center; gap:.5rem;
  color:rgba(240,235,227,.5);
}
.hero-photo__scroll-line { width:1px; height:60px; background:rgba(240,235,227,.3); animation:scrollLine 2s ease-in-out infinite; }
.hero-photo__scroll-text { font-family:var(--font-mono); font-size:.55rem; letter-spacing:.2em; text-transform:uppercase; writing-mode:vertical-rl; }
@keyframes scrollLine { 0%,100%{transform:scaleY(1);opacity:.3} 50%{transform:scaleY(.5);opacity:.8} }

/* ============================================================
   INTRO STRIP
   ============================================================ */
.intro-strip {
  display:grid; grid-template-columns:1fr 1fr 1fr;
  border-bottom:var(--rule);
}
.intro-strip__item {
  padding:clamp(1.5rem,4vw,3rem) clamp(1rem,3vw,2.5rem);
  border-right:var(--rule); display:flex; flex-direction:column; gap:.75rem;
}
.intro-strip__item:last-child { border-right:none; }
.intro-strip__num { font-family:var(--font-display); font-size:3.5rem; color:var(--chalk); line-height:1; }
.intro-strip__title { font-family:var(--font-head); font-weight:800; font-size:1.05rem; }
.intro-strip__text { font-family:var(--font-mono); font-size:.78rem; color:var(--graphite); line-height:1.7; }

/* ============================================================
   QUOTE MARQUEE
   ============================================================ */
.quote-band { background:var(--off-white); border-top:var(--rule); border-bottom:var(--rule); padding:1.25rem 0; overflow:hidden; }
.quote-band__text { font-family:var(--font-display); font-size:clamp(1.8rem,4vw,3rem); white-space:nowrap; display:inline-block; animation:marquee 26s linear infinite; letter-spacing:.04em; }
.quote-band__text:hover { animation-play-state:paused; }
.quote-band__hollow { -webkit-text-stroke:1.5px var(--ink); color:transparent; }
.quote-band__sep { display:inline-block; width:9px; height:9px; background:var(--ink); border-radius:50%; margin:0 2rem; vertical-align:middle; }
@keyframes marquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ============================================================
   PRODUCT LINES — ALTERNATING PHOTO ROWS
   ============================================================ */
.product-line {
  display:grid; grid-template-columns:1fr 1fr;
  border-bottom:var(--rule); min-height:520px;
}
.product-line--reverse { direction:rtl; }
.product-line--reverse > * { direction:ltr; }
.product-line__photo { position:relative; min-height:420px; overflow:hidden; }
.product-line__photo img { width:100%; height:100%; object-fit:cover; display:block; filter:grayscale(20%) contrast(1.05); transition:filter .6s, transform .8s var(--ease-out); }
.product-line__photo:hover img { filter:grayscale(0%) contrast(1); transform:scale(1.04); }
.product-line__photo-overlay {
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(to right, rgba(26,23,20,.15) 0%, transparent 70%);
}
.product-line--reverse .product-line__photo-overlay { background:linear-gradient(to left, rgba(26,23,20,.15) 0%, transparent 70%); }
.product-line__photo-badge {
  position:absolute; top:1.5rem; left:1.5rem;
  background:var(--cream); border:var(--rule); padding:.4rem .9rem;
  font-family:var(--font-mono); font-size:.58rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
}
.product-line--reverse .product-line__photo-badge { left:auto; right:1.5rem; }
.product-line__content {
  padding:clamp(2rem,5vw,4rem) clamp(1.5rem,4vw,3rem);
  display:flex; flex-direction:column; justify-content:center; gap:1.5rem;
  border-left:var(--rule);
}
.product-line--reverse .product-line__content { border-left:none; border-right:var(--rule); }
.product-line__platform { font-family:var(--font-mono); font-size:.62rem; letter-spacing:.2em; text-transform:uppercase; color:var(--stone); display:flex; align-items:center; gap:.75rem; }
.product-line__platform::before { content:''; display:block; width:24px; height:1.5px; background:var(--stone); }
.product-line__name { font-family:var(--font-display); font-size:clamp(2.5rem,6vw,5rem); letter-spacing:.02em; line-height:.9; }
.product-line__body { font-family:var(--font-mono); font-size:.85rem; color:var(--graphite); line-height:1.8; max-width:44ch; }
.product-line__features { display:flex; flex-direction:column; gap:.5rem; }
.product-line__feature {
  display:flex; align-items:flex-start; gap:.75rem;
  font-family:var(--font-mono); font-size:.78rem; color:var(--graphite); line-height:1.5;
}
.product-line__feature::before { content:'→'; font-size:.7rem; color:var(--stone); margin-top:.05rem; flex-shrink:0; }
.product-line__actions { display:flex; gap:.75rem; flex-wrap:wrap; padding-top:.5rem; border-top:var(--rule-xs); }

/* ============================================================
   PORTFOLIO PREVIEW
   ============================================================ */
.portfolio-section { border-bottom:var(--rule); }
.portfolio-section__header {
  display:grid; grid-template-columns:1fr auto;
  align-items:flex-end; gap:2rem;
  padding:clamp(1.5rem,4vw,3rem) clamp(1rem,3vw,2.5rem);
  border-bottom:var(--rule);
}
.portfolio-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  grid-template-rows:320px 280px;
}
.portfolio-item {
  position:relative; overflow:hidden; border-right:var(--rule); border-bottom:var(--rule); cursor:pointer;
}
.portfolio-item:nth-child(3n) { border-right:none; }
.portfolio-item:nth-child(n+4) { border-bottom:none; }
.portfolio-item img { width:100%; height:100%; object-fit:cover; filter:grayscale(30%) contrast(1.05); transition:filter .6s, transform .8s var(--ease-out); }
.portfolio-item:hover img { filter:grayscale(0%) contrast(1); transform:scale(1.06); }
.portfolio-item__overlay {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(26,23,20,.9) 0%, rgba(26,23,20,.2) 50%, transparent 100%);
  opacity:0; transition:opacity .4s;
}
.portfolio-item:hover .portfolio-item__overlay { opacity:1; }
.portfolio-item__info {
  position:absolute; bottom:0; left:0; right:0;
  padding:1.5rem; transform:translateY(12px); opacity:0; transition:transform .4s var(--ease-out), opacity .4s;
}
.portfolio-item:hover .portfolio-item__info { transform:translateY(0); opacity:1; }
.portfolio-item__cat { font-family:var(--font-mono); font-size:.58rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ash); margin-bottom:.4rem; }
.portfolio-item__title { font-family:var(--font-display); font-size:1.4rem; color:var(--cream); letter-spacing:.04em; }
.portfolio-item__num {
  position:absolute; top:1rem; right:1rem;
  font-family:var(--font-display); font-size:2.5rem; color:rgba(240,235,227,.25); line-height:1;
}

/* ============================================================
   LIGHTBOX
   ============================================================ */
.lightbox {
  position:fixed; inset:0; z-index:900;
  background:rgba(26,23,20,.97);
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity .35s;
  padding:1.5rem;
}
.lightbox.active { opacity:1; pointer-events:all; }
.lightbox__inner { position:relative; max-width:900px; max-height:90svh; width:100%; }
.lightbox__img { width:100%; height:auto; max-height:80svh; object-fit:contain; border:var(--rule); border-color:var(--graphite); }
.lightbox__close {
  position:absolute; top:-2.5rem; right:0;
  background:none; border:none; color:var(--cream);
  font-family:var(--font-mono); font-size:.65rem; letter-spacing:.18em; text-transform:uppercase;
  cursor:pointer; display:flex; align-items:center; gap:.5rem; opacity:.7; transition:opacity .2s;
}
.lightbox__close:hover { opacity:1; }
.lightbox__nav { display:flex; gap:.75rem; justify-content:center; margin-top:1rem; }
.lightbox__nav button {
  background:none; border:1px solid var(--graphite); color:var(--cream);
  font-family:var(--font-mono); font-size:.62rem; letter-spacing:.14em; text-transform:uppercase;
  padding:.5rem 1.25rem; transition:background .2s, border-color .2s;
}
.lightbox__nav button:hover { background:var(--graphite); border-color:var(--ash); }
.lightbox__caption { font-family:var(--font-mono); font-size:.7rem; color:var(--ash); text-align:center; margin-top:.75rem; letter-spacing:.1em; text-transform:uppercase; }

/* ============================================================
   TESTIMONIALS CAROUSEL
   ============================================================ */
.testimonials { border-bottom:var(--rule); background:var(--off-white); overflow:hidden; }
.testimonials__header { padding:clamp(1.5rem,4vw,2.5rem) clamp(1rem,3vw,2.5rem); border-bottom:var(--rule); display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.testimonials__viewport { overflow:hidden; }
.testimonials__track { display:flex; transition:transform .6s var(--ease-out); }
.testimonial-card {
  flex:0 0 100%; padding:clamp(2rem,5vw,4rem) clamp(1rem,3vw,2.5rem);
  display:grid; grid-template-columns:1fr auto; gap:2rem; align-items:start;
}
.testimonial-card__quote { font-family:var(--font-display); font-size:clamp(1.6rem,4vw,3rem); line-height:1.05; letter-spacing:.02em; max-width:22ch; }
.testimonial-card__quote-mark { font-family:var(--font-display); font-size:5rem; line-height:1; color:var(--chalk); margin-bottom:-.5rem; display:block; }
.testimonial-card__meta { display:flex; flex-direction:column; gap:.4rem; }
.testimonial-card__stars { color:var(--graphite); font-size:.75rem; letter-spacing:.2em; }
.testimonial-card__name { font-family:var(--font-head); font-weight:700; font-size:.95rem; }
.testimonial-card__role { font-family:var(--font-mono); font-size:.68rem; color:var(--stone); text-transform:uppercase; letter-spacing:.12em; }
.testimonial-card__platform { display:inline-block; margin-top:.75rem; }
.testimonial-card__right { text-align:right; display:flex; flex-direction:column; align-items:flex-end; gap:1rem; padding-top:.5rem; }
.testimonial-card__rating-big { font-family:var(--font-display); font-size:5rem; line-height:1; color:var(--chalk); }
.testimonials__controls { display:flex; align-items:center; gap:1rem; }
.testimonials__btn { background:none; border:var(--rule); width:38px; height:38px; display:flex; align-items:center; justify-content:center; font-size:1rem; transition:background .2s, color .2s; }
.testimonials__btn:hover { background:var(--ink); color:var(--cream); }
.testimonials__dots { display:flex; gap:.5rem; }
.testimonials__dot { width:8px; height:8px; border-radius:50%; border:1.5px solid var(--ink); background:transparent; cursor:pointer; transition:background .2s; padding:0; }
.testimonials__dot.active { background:var(--ink); }

/* ============================================================
   SOCIAL FEED MOCK
   ============================================================ */
.social-feed { border-bottom:var(--rule); }
.social-feed__header {
  padding:clamp(1.5rem,4vw,2.5rem) clamp(1rem,3vw,2.5rem);
  border-bottom:var(--rule);
  display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;
}
.social-feed__handle { font-family:var(--font-display); font-size:clamp(1.2rem,3vw,2rem); letter-spacing:.06em; }
.social-feed__grid { display:grid; grid-template-columns:repeat(3,1fr); }
.social-item { position:relative; aspect-ratio:1/1; overflow:hidden; cursor:pointer; border-right:var(--rule); border-bottom:var(--rule); }
.social-item:nth-child(3n) { border-right:none; }
.social-item:nth-child(n+7) { border-bottom:none; }
.social-item img { width:100%; height:100%; object-fit:cover; filter:grayscale(40%); transition:filter .5s, transform .7s var(--ease-out); }
.social-item:hover img { filter:grayscale(0%); transform:scale(1.08); }
.social-item__overlay {
  position:absolute; inset:0;
  background:rgba(26,23,20,.6);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5rem;
  opacity:0; transition:opacity .35s;
}
.social-item:hover .social-item__overlay { opacity:1; }
.social-item__likes { font-family:var(--font-display); font-size:1.5rem; color:var(--cream); letter-spacing:.04em; }
.social-item__label { font-family:var(--font-mono); font-size:.58rem; letter-spacing:.18em; text-transform:uppercase; color:rgba(240,235,227,.7); }
.social-feed__footer { padding:1.5rem clamp(1rem,3vw,2.5rem); border-top:var(--rule); display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; }
.social-feed__note { font-family:var(--font-mono); font-size:.72rem; color:var(--stone); }

/* ============================================================
   NEWSLETTER
   ============================================================ */
.newsletter { background:var(--ink); color:var(--cream); border-bottom:var(--rule); }
.newsletter__inner {
  display:grid; grid-template-columns:1fr 1fr;
  align-items:stretch; min-height:280px;
}
.newsletter__left { padding:clamp(2rem,5vw,4rem) clamp(1rem,3vw,2.5rem); border-right:2px solid var(--graphite); display:flex; flex-direction:column; justify-content:center; gap:1rem; }
.newsletter__headline { font-family:var(--font-display); font-size:clamp(2.5rem,6vw,5rem); line-height:.9; letter-spacing:.02em; }
.newsletter__headline .hollow { -webkit-text-stroke:2px var(--cream); color:transparent; }
.newsletter__sub { font-family:var(--font-mono); font-size:.8rem; color:rgba(240,235,227,.6); line-height:1.7; max-width:40ch; }
.newsletter__right { padding:clamp(2rem,5vw,4rem) clamp(1rem,3vw,2.5rem); display:flex; flex-direction:column; justify-content:center; gap:1.5rem; }
.newsletter__form { display:flex; flex-direction:column; gap:1rem; }
.newsletter__input {
  background:transparent; border:1px solid var(--graphite); border-bottom:2px solid var(--ash);
  color:var(--cream); font-family:var(--font-mono); font-size:.85rem; padding:.85rem 1rem;
  outline:none; transition:border-color .2s;
}
.newsletter__input::placeholder { color:rgba(240,235,227,.3); }
.newsletter__input:focus { border-color:var(--cream); }
.newsletter__perks { display:flex; flex-direction:column; gap:.5rem; }
.newsletter__perk { font-family:var(--font-mono); font-size:.72rem; color:rgba(240,235,227,.55); display:flex; align-items:center; gap:.6rem; }
.newsletter__perk::before { content:'✓'; color:var(--ash); }
.newsletter__success { display:none; flex-direction:column; align-items:flex-start; gap:.75rem; }
.newsletter__success.show { display:flex; }
.newsletter__success-head { font-family:var(--font-display); font-size:2rem; letter-spacing:.04em; }
.newsletter__success-text { font-family:var(--font-mono); font-size:.78rem; color:rgba(240,235,227,.65); }

/* ============================================================
   FAQ ACCORDION
   ============================================================ */
.faq { border-bottom:var(--rule); }
.faq__header { padding:clamp(1.5rem,4vw,2.5rem) clamp(1rem,3vw,2.5rem); border-bottom:var(--rule); display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; flex-wrap:wrap; }
.faq__items { display:grid; grid-template-columns:1fr 1fr; }
.faq__col { border-right:var(--rule); }
.faq__col:last-child { border-right:none; }
.faq__item { border-bottom:var(--rule); }
.faq__item:last-child { border-bottom:none; }
.faq__question {
  width:100%; background:none; border:none; text-align:left;
  padding:1.5rem clamp(1rem,3vw,2.5rem);
  display:flex; align-items:flex-start; justify-content:space-between; gap:1rem;
  cursor:pointer; transition:background .2s;
}
.faq__question:hover { background:var(--off-white); }
.faq__question-text { font-family:var(--font-head); font-weight:700; font-size:.95rem; line-height:1.35; text-align:left; }
.faq__icon {
  width:28px; height:28px; border:var(--rule); flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-size:1rem; transition:transform .3s, background .2s;
}
.faq__item.open .faq__question { background:var(--off-white); }
.faq__item.open .faq__icon { background:var(--ink); color:var(--cream); transform:rotate(45deg); }
.faq__answer { max-height:0; overflow:hidden; transition:max-height .5s var(--ease-out); }
.faq__answer-inner { padding:0 clamp(1rem,3vw,2.5rem) 1.5rem; }
.faq__answer-inner p { font-family:var(--font-mono); font-size:.82rem; color:var(--graphite); line-height:1.8; }
.faq__answer-inner a { color:var(--ink); border-bottom:1px solid currentColor; }

/* ============================================================
   PHILOSOPHY
   ============================================================ */
.philosophy { display:grid; grid-template-columns:1fr 2fr; border-bottom:var(--rule); }
.philosophy__left { border-right:var(--rule); padding:clamp(2rem,5vw,4rem) clamp(1rem,3vw,2.5rem); background:var(--off-white); display:flex; flex-direction:column; justify-content:space-between; gap:3rem; }
.philosophy__right { padding:clamp(2rem,5vw,4rem) clamp(1rem,3vw,2.5rem); display:flex; flex-direction:column; justify-content:center; gap:2rem; }
.philosophy__quote { font-family:var(--font-display); font-size:clamp(2rem,4.5vw,3.8rem); line-height:1; letter-spacing:.02em; }
.philosophy__attr { font-family:var(--font-mono); font-size:.65rem; letter-spacing:.2em; text-transform:uppercase; color:var(--stone); display:flex; align-items:center; gap:.75rem; }
.philosophy__attr::before { content:''; display:block; width:20px; height:1px; background:var(--stone); }
.philosophy__pillars { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--chalk); border:var(--rule-xs); }
.philosophy__pillar { background:var(--cream); padding:1.25rem; display:flex; flex-direction:column; gap:.5rem; }
.philosophy__pillar-num { font-family:var(--font-display); font-size:1.5rem; color:var(--ash); }
.philosophy__pillar-text { font-family:var(--font-mono); font-size:.78rem; color:var(--graphite); line-height:1.65; }

/* ============================================================
   PROCESS
   ============================================================ */
.process { border-bottom:var(--rule); }
.process__header { padding:clamp(1.5rem,3vw,2rem) clamp(1rem,3vw,2.5rem); border-bottom:var(--rule); display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.process__steps { display:grid; grid-template-columns:repeat(4,1fr); }
.process__step { padding:clamp(2rem,5vw,3.5rem) clamp(1rem,3vw,2.5rem); border-right:var(--rule); display:flex; flex-direction:column; gap:1rem; }
.process__step:last-child { border-right:none; }
.process__num { font-family:var(--font-display); font-size:5rem; line-height:1; -webkit-text-stroke:1px var(--chalk); color:transparent; }
.process__title { font-family:var(--font-head); font-weight:700; font-size:1rem; }
.process__body { font-family:var(--font-mono); font-size:.78rem; color:var(--graphite); line-height:1.75; }

/* ============================================================
   CTA BAND
   ============================================================ */
.cta-band {
  display:grid; grid-template-columns:1fr auto; align-items:center;
  gap:2rem; padding:clamp(2rem,6vw,5rem) clamp(1rem,3vw,2.5rem);
  background:var(--ink); color:var(--cream);
}
.cta-band__text { font-family:var(--font-display); font-size:clamp(2.5rem,6vw,5rem); line-height:.92; letter-spacing:.02em; }
.cta-band__text .hollow { -webkit-text-stroke:1.5px var(--cream); color:transparent; }
.cta-band__actions { display:flex; flex-direction:column; gap:.75rem; align-items:flex-end; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer { border-top:var(--rule); background:var(--off-white); }
.footer__top { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; border-bottom:var(--rule); }
.footer__col { padding:clamp(2rem,4vw,3rem) clamp(1rem,3vw,2.5rem); border-right:var(--rule); }
.footer__col:last-child { border-right:none; }
.footer__brand { font-family:var(--font-display); font-size:3rem; letter-spacing:.08em; line-height:1; }
.footer__brand-sub { font-family:var(--font-mono); font-size:.6rem; letter-spacing:.22em; text-transform:uppercase; color:var(--stone); margin-top:.4rem; }
.footer__tagline { font-family:var(--font-mono); font-size:.78rem; color:var(--graphite); line-height:1.75; margin-top:1.5rem; max-width:30ch; }
.footer__social-links { display:flex; gap:1rem; margin-top:1.5rem; flex-wrap:wrap; }
.footer__social-link { font-family:var(--font-mono); font-size:.6rem; letter-spacing:.15em; text-transform:uppercase; border:1.5px solid var(--chalk); padding:.35rem .9rem; transition:border-color .2s, color .2s; color:var(--stone); }
.footer__social-link:hover { border-color:var(--ink); color:var(--ink); }
.footer__col-title { font-family:var(--font-mono); font-size:.6rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:var(--stone); margin-bottom:1.25rem; padding-bottom:.75rem; border-bottom:var(--rule-xs); }
.footer__links { display:flex; flex-direction:column; gap:.7rem; }
.footer__links a { font-family:var(--font-mono); font-size:.8rem; color:var(--graphite); transition:color .15s, padding-left .2s; display:flex; align-items:center; gap:.4rem; }
.footer__links a:hover { color:var(--ink); padding-left:.5rem; }
.footer__marketplace { display:flex; flex-direction:column; gap:.75rem; }
.footer__mp-item { display:flex; align-items:center; gap:.75rem; padding:.75rem; border:var(--rule-xs); background:var(--cream); transition:border-color .2s, background .2s; }
.footer__mp-item:hover { border-color:var(--ink); background:var(--off-white); }
.footer__mp-icon { width:30px; height:30px; background:var(--ink); color:var(--cream); display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-size:.9rem; flex-shrink:0; }
.footer__mp-name { font-family:var(--font-head); font-weight:700; font-size:.82rem; }
.footer__mp-sub { font-family:var(--font-mono); font-size:.6rem; color:var(--stone); }
.footer__mp-arrow { margin-left:auto; font-size:.8rem; opacity:.4; }
.footer__bottom { display:flex; align-items:center; justify-content:space-between; padding:1rem clamp(1rem,3vw,2.5rem); flex-wrap:wrap; gap:.5rem; border-top:var(--rule-xs); }
.footer__copy { font-family:var(--font-mono); font-size:.62rem; letter-spacing:.1em; color:var(--stone); }

/* ============================================================
   FLOATING CTA
   ============================================================ */
.float-cta {
  position:fixed; bottom:2rem; right:2rem; z-index:400;
  opacity:0; transform:translateY(20px); pointer-events:none;
  transition:opacity .35s, transform .35s;
}
.float-cta.visible { opacity:1; transform:translateY(0); pointer-events:all; }
.float-cta__btn {
  background:var(--ink); color:var(--cream); border:var(--rule);
  font-family:var(--font-mono); font-size:.62rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase;
  padding:.75rem 1.5rem; display:flex; align-items:center; gap:.5rem;
  box-shadow:4px 4px 0 var(--graphite); transition:transform .2s, box-shadow .2s;
  cursor:pointer;
}
.float-cta__btn:hover { transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--graphite); }
.float-cta__close { background:none; border:none; color:var(--stone); font-size:.7rem; cursor:pointer; margin-left:.25rem; opacity:.6; }
.float-cta__close:hover { opacity:1; }

/* ============================================================
   ABOUT PAGE
   ============================================================ */
.about-hero { position:relative; min-height:60vh; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; border-bottom:var(--rule); }
.about-hero__bg { position:absolute; inset:0; }
.about-hero__bg img { width:100%; height:100%; object-fit:cover; filter:grayscale(20%); }
.about-hero__bg::after { content:''; position:absolute; inset:0; background:linear-gradient(to top, rgba(26,23,20,.9) 0%, rgba(26,23,20,.35) 100%); }
.about-hero__content { position:relative; z-index:2; padding:clamp(2rem,5vw,4rem) clamp(1rem,3vw,2.5rem); }
.about-hero__content .label { color:rgba(240,235,227,.6); }
.about-hero__content h1 { color:var(--cream); margin-top:.75rem; }
.about-stats { display:grid; grid-template-columns:repeat(4,1fr); border-bottom:var(--rule); }
.about-stat { padding:2rem clamp(1rem,3vw,2.5rem); border-right:var(--rule); display:flex; flex-direction:column; gap:.4rem; }
.about-stat:last-child { border-right:none; }
.about-stat__num { font-family:var(--font-display); font-size:3rem; line-height:1; }
.about-stat__label { font-family:var(--font-mono); font-size:.62rem; letter-spacing:.18em; text-transform:uppercase; color:var(--stone); }
.about-mission { display:grid; grid-template-columns:1fr 1fr; border-bottom:var(--rule); }
.about-mission__photo { position:relative; min-height:400px; overflow:hidden; }
.about-mission__photo img { width:100%; height:100%; object-fit:cover; filter:grayscale(20%); transition:filter .6s; }
.about-mission__photo:hover img { filter:grayscale(0%); }
.about-mission__content { padding:clamp(2rem,5vw,4rem) clamp(1.5rem,4vw,3rem); border-left:var(--rule); display:flex; flex-direction:column; justify-content:center; gap:1.5rem; }
.about-values__grid { display:grid; grid-template-columns:repeat(4,1fr); border-bottom:var(--rule); }
.value-card { padding:clamp(2rem,4vw,3rem) clamp(1rem,3vw,2.5rem); border-right:var(--rule); display:flex; flex-direction:column; gap:1rem; }
.value-card:last-child { border-right:none; }
.value-card__icon { width:44px; height:44px; background:var(--off-white); border:var(--rule); display:flex; align-items:center; justify-content:center; }
.value-card__title { font-family:var(--font-display); font-size:1.6rem; letter-spacing:.04em; }
.value-card__text { font-family:var(--font-mono); font-size:.8rem; color:var(--graphite); line-height:1.7; }
.about-pull { border-bottom:var(--rule); padding:clamp(2rem,6vw,5rem) clamp(1rem,3vw,2.5rem); display:flex; flex-direction:column; gap:1.5rem; align-items:center; text-align:center; }
.about-pull__quote { font-family:var(--font-display); font-size:clamp(2rem,5vw,4rem); line-height:1; letter-spacing:.02em; max-width:22ch; }

/* ============================================================
   CONTACT PAGE
   ============================================================ */
.contact-hero { position:relative; min-height:35vh; display:flex; align-items:flex-end; overflow:hidden; border-bottom:var(--rule); }
.contact-hero__bg { position:absolute; inset:0; }
.contact-hero__bg img { width:100%; height:100%; object-fit:cover; filter:grayscale(30%); }
.contact-hero__bg::after { content:''; position:absolute; inset:0; background:linear-gradient(to top, rgba(26,23,20,.92) 0%, rgba(26,23,20,.3) 100%); }
.contact-hero__content { position:relative; z-index:2; padding:clamp(2rem,4vw,3rem) clamp(1rem,3vw,2.5rem); width:100%; }
.contact-hero__content .label { color:rgba(240,235,227,.6); }
.contact-hero__content h1 { color:var(--cream); margin-top:.75rem; }
.contact-layout { display:grid; grid-template-columns:1fr 1.5fr; border-bottom:var(--rule); }
.contact-info { border-right:var(--rule); padding:clamp(2rem,5vw,4rem) clamp(1rem,3vw,2.5rem); background:var(--off-white); display:flex; flex-direction:column; gap:2.5rem; }
.contact-info__item { border-bottom:var(--rule-xs); padding-bottom:1.5rem; }
.contact-info__item-label { font-family:var(--font-mono); font-size:.6rem; letter-spacing:.22em; text-transform:uppercase; color:var(--stone); display:block; margin-bottom:.4rem; }
.contact-info__item-val { font-family:var(--font-head); font-weight:700; font-size:1rem; display:block; }
.contact-info__item-sub { font-family:var(--font-mono); font-size:.75rem; color:var(--graphite); display:block; margin-top:.2rem; }
.contact-platform { display:flex; align-items:center; gap:.75rem; padding:1rem; border:var(--rule-xs); background:var(--cream); transition:border-color .2s, background .2s; margin-bottom:.6rem; }
.contact-platform:last-child { margin-bottom:0; }
.contact-platform:hover { border-color:var(--ink); background:var(--off-white); }
.contact-platform__icon { width:36px; height:36px; background:var(--ink); color:var(--cream); display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-size:1rem; flex-shrink:0; }
.contact-platform__name { font-family:var(--font-head); font-weight:700; font-size:.9rem; }
.contact-platform__sub { font-family:var(--font-mono); font-size:.62rem; color:var(--stone); }
.contact-platform__arrow { margin-left:auto; font-size:.8rem; opacity:.4; transition:opacity .2s; }
.contact-platform:hover .contact-platform__arrow { opacity:1; }
.contact-form-wrap { padding:clamp(2rem,5vw,4rem) clamp(1.5rem,4vw,3rem); display:flex; flex-direction:column; gap:2rem; }
/* Form */
.form { display:flex; flex-direction:column; gap:1.5rem; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; }
.form-group { display:flex; flex-direction:column; gap:.4rem; }
.form-label { font-family:var(--font-mono); font-size:.6rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--graphite); }
.form-input, .form-select, .form-textarea {
  font-family:var(--font-mono); font-size:.85rem; color:var(--ink);
  background:var(--cream); border:var(--rule); padding:.75rem 1rem;
  width:100%; outline:none; transition:background .15s, box-shadow .15s;
  appearance:none; -webkit-appearance:none;
}
.form-input:focus, .form-select:focus, .form-textarea:focus { background:var(--off-white); box-shadow:3px 3px 0 var(--ink); }
.form-input::placeholder, .form-textarea::placeholder { color:var(--ash); font-size:.8rem; }
.form-textarea { resize:vertical; min-height:130px; }
.form-select-wrap { position:relative; }
.form-select-wrap::after { content:'↓'; position:absolute; right:1rem; top:50%; transform:translateY(-50%); pointer-events:none; font-family:var(--font-mono); font-size:.8rem; color:var(--stone); }
.form-notice { font-family:var(--font-mono); font-size:.65rem; color:var(--stone); line-height:1.65; }
.form-success { display:none; background:var(--off-white); border:var(--rule); padding:2rem; flex-direction:column; gap:1rem; align-items:flex-start; }
.form-success.show { display:flex; }
.form-success__title { font-family:var(--font-display); font-size:2.5rem; letter-spacing:.04em; }
.form-success__text { font-family:var(--font-mono); font-size:.8rem; color:var(--graphite); }

/* ============================================================
   PORTFOLIO PAGE
   ============================================================ */
.portfolio-page-hero { border-bottom:var(--rule); padding:clamp(2rem,5vw,4rem) clamp(1rem,3vw,2.5rem); display:grid; grid-template-columns:1fr auto; align-items:flex-end; gap:2rem; background:var(--off-white); }
.portfolio-filters { border-bottom:var(--rule); padding:1rem clamp(1rem,3vw,2.5rem); display:flex; align-items:center; gap:1rem; flex-wrap:wrap; background:var(--cream); position:sticky; top:66px; z-index:10; }
.filter-btn { background:none; border:var(--rule-lt); font-family:var(--font-mono); font-size:.62rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; padding:.45rem 1rem; color:var(--stone); cursor:pointer; transition:all .2s; }
.filter-btn:hover { border-color:var(--ink); color:var(--ink); }
.filter-btn.active { background:var(--ink); border-color:var(--ink); color:var(--cream); }
.portfolio-full-grid { display:grid; grid-template-columns:repeat(3,1fr); border-bottom:var(--rule); }
.portfolio-full-item { position:relative; overflow:hidden; aspect-ratio:3/4; border-right:var(--rule); border-bottom:var(--rule); cursor:pointer; }
.portfolio-full-item:nth-child(3n) { border-right:none; }
.portfolio-full-item img { width:100%; height:100%; object-fit:cover; filter:grayscale(25%); transition:filter .5s, transform .7s var(--ease-out); }
.portfolio-full-item:hover img { filter:grayscale(0%); transform:scale(1.06); }
.portfolio-full-item__overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(26,23,20,.88) 0%, transparent 55%); opacity:0; transition:opacity .4s; }
.portfolio-full-item:hover .portfolio-full-item__overlay { opacity:1; }
.portfolio-full-item__info { position:absolute; bottom:0; left:0; right:0; padding:1.5rem; transform:translateY(10px); opacity:0; transition:transform .4s var(--ease-out), opacity .4s; }
.portfolio-full-item:hover .portfolio-full-item__info { transform:translateY(0); opacity:1; }
.portfolio-full-item__cat { font-family:var(--font-mono); font-size:.56rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ash); display:block; margin-bottom:.35rem; }
.portfolio-full-item__title { font-family:var(--font-display); font-size:1.3rem; color:var(--cream); letter-spacing:.04em; }
.portfolio-full-item[data-cat] { transition:opacity .4s, transform .4s; }
.portfolio-full-item.hidden { opacity:0; pointer-events:none; transform:scale(.96); }

/* ============================================================
   ANIMATIONS
   ============================================================ */
.fade-up { opacity:0; transform:translateY(28px); transition:opacity .6s var(--ease-out), transform .6s var(--ease-out); }
.fade-up.visible { opacity:1; transform:translateY(0); }
.fade-up-delay-1 { transition-delay:.1s; }
.fade-up-delay-2 { transition-delay:.2s; }
.fade-up-delay-3 { transition-delay:.3s; }
.fade-up-delay-4 { transition-delay:.4s; }
.fade-up-delay-5 { transition-delay:.5s; }

/* ============================================================
   RESPONSIVE — TABLET 1024px
   ============================================================ */
@media (max-width:1024px) {
  .hero-photo__content { grid-template-columns:1fr; }
  .hero-photo__right { align-items:flex-start; }
  .hero-photo__desc { text-align:left; }
  .hero-photo__ctas { justify-content:flex-start; }
  .hero-photo__platforms { grid-template-columns:1fr; }
  .hero-platform { border-right:none; border-bottom:2px solid rgba(240,235,227,.2); }
  .hero-platform:last-child { border-bottom:none; }
  .intro-strip { grid-template-columns:1fr; }
  .intro-strip__item { border-right:none; border-bottom:var(--rule); }
  .intro-strip__item:last-child { border-bottom:none; }
  .product-line, .product-line--reverse { grid-template-columns:1fr; direction:ltr; }
  .product-line__photo { min-height:320px; }
  .product-line__content { border-left:none; border-right:none; border-top:var(--rule); }
  .portfolio-grid { grid-template-rows:260px 220px; }
  .testimonial-card { grid-template-columns:1fr; }
  .testimonial-card__right { align-items:flex-start; text-align:left; flex-direction:row; align-items:center; }
  .newsletter__inner { grid-template-columns:1fr; }
  .newsletter__left { border-right:none; border-bottom:2px solid var(--graphite); }
  .faq__items { grid-template-columns:1fr; }
  .faq__col { border-right:none; }
  .philosophy { grid-template-columns:1fr; }
  .philosophy__left { border-right:none; border-bottom:var(--rule); }
  .process__steps { grid-template-columns:1fr 1fr; }
  .process__step:nth-child(2) { border-right:none; }
  .process__step:nth-child(3) { border-top:var(--rule); }
  .process__step:nth-child(4) { border-top:var(--rule); border-right:none; }
  .footer__top { grid-template-columns:1fr 1fr; }
  .footer__col:nth-child(2) { border-right:none; }
  .footer__col:nth-child(3) { border-top:var(--rule); }
  .footer__col:nth-child(4) { border-top:var(--rule); border-right:none; }
  .about-stats { grid-template-columns:1fr 1fr; }
  .about-stat:nth-child(2) { border-right:none; }
  .about-stat:nth-child(3) { border-top:var(--rule); }
  .about-stat:nth-child(4) { border-top:var(--rule); border-right:none; }
  .about-mission { grid-template-columns:1fr; }
  .about-mission__content { border-left:none; border-top:var(--rule); }
  .about-values__grid { grid-template-columns:1fr 1fr; }
  .value-card:nth-child(2) { border-right:none; }
  .value-card:nth-child(3) { border-top:var(--rule); }
  .value-card:nth-child(4) { border-top:var(--rule); border-right:none; }
  .contact-layout { grid-template-columns:1fr; }
  .contact-info { border-right:none; border-bottom:var(--rule); }
  .portfolio-full-grid { grid-template-columns:1fr 1fr; }
  .portfolio-full-item:nth-child(3n) { border-right:var(--rule); }
  .portfolio-full-item:nth-child(2n) { border-right:none; }
  .cta-band { grid-template-columns:1fr; gap:1.5rem; }
  .cta-band__actions { align-items:flex-start; flex-direction:row; flex-wrap:wrap; }
  .portfolio-page-hero { grid-template-columns:1fr; }
}

/* ============================================================
   RESPONSIVE — MOBILE 768px
   ============================================================ */
@media (max-width:768px) {
  .nav__links, .nav__actions { display:none; }
  .nav__hamburger { display:flex; }
  .nav__inner { grid-template-columns:1fr auto; }
  .portfolio-grid { grid-template-columns:1fr 1fr; grid-template-rows:220px 200px 200px; }
  .portfolio-item:nth-child(3n) { border-right:var(--rule); }
  .portfolio-item:nth-child(2n) { border-right:none; }
  .portfolio-item:nth-child(n+5) { border-bottom:none; }
  .portfolio-item:nth-child(n+3) { border-bottom:var(--rule); }
  .social-feed__grid { grid-template-columns:repeat(3,1fr); }
  .process__steps { grid-template-columns:1fr; }
  .process__step { border-right:none; border-bottom:var(--rule); }
  .process__step:last-child { border-bottom:none; }
  .footer__top { grid-template-columns:1fr; }
  .footer__col { border-right:none; border-bottom:var(--rule); }
  .footer__col:last-child { border-bottom:none; }
  .footer__bottom { flex-direction:column; align-items:flex-start; }
  .about-values__grid { grid-template-columns:1fr; }
  .value-card { border-right:none; border-bottom:var(--rule); }
  .value-card:last-child { border-bottom:none; }
  .form-row { grid-template-columns:1fr; }
  .float-cta { bottom:1.25rem; right:1.25rem; }
  .portfolio-full-grid { grid-template-columns:1fr 1fr; }
  .social-feed__grid { grid-template-columns:repeat(3,1fr); }
}

@media (max-width:480px) {
  .portfolio-grid { grid-template-columns:1fr; grid-template-rows:auto; }
  .portfolio-item { aspect-ratio:4/3; border-right:none !important; }
  .portfolio-item:nth-child(n+4) { border-bottom:var(--rule) !important; }
  .portfolio-item:last-child { border-bottom:none !important; }
  .portfolio-full-grid { grid-template-columns:1fr; }
  .portfolio-full-item { border-right:none !important; }
  .social-feed__grid { grid-template-columns:1fr 1fr; }
  .social-item:nth-child(2n) { border-right:none; }
  .social-item:nth-child(3n) { border-right:var(--rule); }
}