/* ================================================
   ACT IV — Section Illustrations
   Unique line-art SVG per section & page
   Architectural, tech, drone-line aesthetic
   Visible but tasteful — luxury background art
   ================================================ */

/* ================================================
   HOME PAGE
   ================================================ */

/* -- Philosophy: Constellation / network nodes -- */
#philosophy {
  position: relative;
  overflow: hidden;
}
#philosophy::before,
#philosophy::after {
  content: '';
  position: absolute;
  pointer-events: none;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 0;
}
#philosophy::before {
  width: 500px; height: 500px;
  right: -50px; top: -80px;
  opacity: 0.18;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 400' fill='none' stroke='%23a83262' stroke-width='1'%3E%3Ccircle cx='200' cy='200' r='4' fill='%23a83262'/%3E%3Ccircle cx='80' cy='120' r='3' fill='%23a83262'/%3E%3Ccircle cx='320' cy='90' r='3' fill='%23a83262'/%3E%3Ccircle cx='140' cy='310' r='3' fill='%23a83262'/%3E%3Ccircle cx='300' cy='280' r='3' fill='%23a83262'/%3E%3Ccircle cx='50' cy='250' r='2.5' fill='%23a83262'/%3E%3Ccircle cx='350' cy='200' r='2.5' fill='%23a83262'/%3E%3Ccircle cx='250' cy='50' r='2.5' fill='%23a83262'/%3E%3Cline x1='200' y1='200' x2='80' y2='120'/%3E%3Cline x1='200' y1='200' x2='320' y2='90'/%3E%3Cline x1='200' y1='200' x2='140' y2='310'/%3E%3Cline x1='200' y1='200' x2='300' y2='280'/%3E%3Cline x1='200' y1='200' x2='350' y2='200'/%3E%3Cline x1='80' y1='120' x2='50' y2='250'/%3E%3Cline x1='80' y1='120' x2='250' y2='50'/%3E%3Cline x1='320' y1='90' x2='250' y2='50'/%3E%3Cline x1='320' y1='90' x2='350' y2='200'/%3E%3Cline x1='300' y1='280' x2='140' y2='310'/%3E%3Cline x1='50' y1='250' x2='140' y2='310'/%3E%3Ccircle cx='200' cy='200' r='60' stroke-dasharray='4 6'/%3E%3Ccircle cx='200' cy='200' r='140' stroke-dasharray='2 10'/%3E%3C/svg%3E");
}
#philosophy::after {
  width: 250px; height: 250px;
  left: 20px; bottom: -50px;
  opacity: 0.1;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200' fill='none' stroke='%23a83262' stroke-width='1'%3E%3Cpolygon points='100,20 180,70 180,140 100,180 20,140 20,70' stroke-dasharray='3 5'/%3E%3Cline x1='100' y1='20' x2='100' y2='180'/%3E%3Cline x1='20' y1='70' x2='180' y2='140'/%3E%3Cline x1='180' y1='70' x2='20' y2='140'/%3E%3C/svg%3E");
}

/* -- Text Reveal: City skyline silhouette -- */
.reveal-section {
  position: relative;
  overflow: hidden;
}
.reveal-section::before {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 350px;
  pointer-events: none;
  opacity: 0.12;
  z-index: 0;
  background-repeat: repeat-x;
  background-position: bottom center;
  background-size: auto 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 300' fill='none' stroke='%23a83262' stroke-width='1.2'%3E%3Cpath d='M0,300 V200 H30 V160 H60 V200 H90 V120 H100 V100 H110 V60 H120 V100 H130 V120 H160 V180 H180 V150 H200 V180 H240 V130 H250 V80 H260 V40 H275 V80 H290 V130 H330 V200 H360 V160 H380 V140 H400 V160 H430 V110 H440 V70 H460 V110 H480 V200 H500 V170 H530 V190 H560 V140 H570 V90 H580 V50 H595 V90 H610 V140 H640 V200 H680 V160 H700 V130 H720 V160 H750 V100 H760 V60 H780 V100 H800 V200 H830 V180 H860 V150 H880 V120 H890 V70 H900 V30 H915 V70 H930 V120 H960 V200 H990 V170 H1020 V190 H1050 V140 H1060 V100 H1080 V140 H1110 V200 H1140 V160 H1170 V180 H1200 V300 Z'/%3E%3Crect x='113' y='64' width='8' height='10' rx='0.5'/%3E%3Crect x='258' y='44' width='8' height='10' rx='0.5'/%3E%3Crect x='582' y='54' width='8' height='10' rx='0.5'/%3E%3Crect x='903' y='34' width='8' height='10' rx='0.5'/%3E%3Crect x='118' y='108' width='6' height='7'/%3E%3Crect x='128' y='108' width='6' height='7'/%3E%3Crect x='258' y='88' width='6' height='7'/%3E%3Crect x='268' y='88' width='6' height='7'/%3E%3Crect x='443' y='78' width='6' height='7'/%3E%3Crect x='453' y='78' width='6' height='7'/%3E%3Crect x='763' y='68' width='6' height='7'/%3E%3Crect x='773' y='68' width='6' height='7'/%3E%3Crect x='120' y='145' width='5' height='6'/%3E%3Crect x='130' y='145' width='5' height='6'/%3E%3Crect x='262' y='135' width='5' height='6'/%3E%3Crect x='272' y='135' width='5' height='6'/%3E%3Crect x='575' y='95' width='5' height='6'/%3E%3Crect x='585' y='95' width='5' height='6'/%3E%3Crect x='895' y='75' width='5' height='6'/%3E%3Crect x='907' y='75' width='5' height='6'/%3E%3C/svg%3E");
}
.reveal-section::after {
  content: '';
  position: absolute;
  right: 4%; top: 10%;
  width: 180px; height: 180px;
  pointer-events: none;
  opacity: 0.15;
  z-index: 0;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120' fill='none' stroke='%23a83262' stroke-width='1'%3E%3Cpath d='M60,10 L110,40 V90 L60,110 L10,90 V40 Z' stroke-dasharray='4 4'/%3E%3Ccircle cx='60' cy='60' r='25'/%3E%3Cline x1='60' y1='10' x2='60' y2='35'/%3E%3Cline x1='60' y1='85' x2='60' y2='110'/%3E%3Cline x1='10' y1='40' x2='35' y2='55'/%3E%3Cline x1='85' y1='55' x2='110' y2='40'/%3E%3C/svg%3E");
}

/* -- Stats: Data pulse / signal wave -- */
.stats-section {
  position: relative;
}
.stats-section::before {
  content: '';
  position: absolute;
  left: 0; right: 0; top: 50%;
  transform: translateY(-50%);
  height: 250px;
  pointer-events: none;
  opacity: 0.1;
  z-index: 0;
  background-repeat: repeat-x;
  background-size: 600px 200px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 200' fill='none' stroke='%23722141' stroke-width='1'%3E%3Cpath d='M0,100 Q50,100 75,60 T150,100 Q200,100 225,50 T300,100 Q350,100 375,70 T450,100 Q500,100 525,40 T600,100'/%3E%3Cpath d='M0,100 Q50,100 75,140 T150,100 Q200,100 225,150 T300,100 Q350,100 375,130 T450,100 Q500,100 525,160 T600,100' stroke-dasharray='3 5'/%3E%3Ccircle cx='75' cy='60' r='3' fill='%23722141'/%3E%3Ccircle cx='225' cy='50' r='3' fill='%23722141'/%3E%3Ccircle cx='375' cy='70' r='3' fill='%23722141'/%3E%3Ccircle cx='525' cy='40' r='3' fill='%23722141'/%3E%3C/svg%3E");
}
.stats-section::after {
  content: '';
  position: absolute;
  right: 4%; top: 8%;
  width: 200px; height: 200px;
  pointer-events: none;
  opacity: 0.09;
  z-index: 0;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 160' fill='none' stroke='%23722141' stroke-width='1'%3E%3Ccircle cx='80' cy='80' r='70' stroke-dasharray='2 6'/%3E%3Ccircle cx='80' cy='80' r='50' stroke-dasharray='4 4'/%3E%3Ccircle cx='80' cy='80' r='30'/%3E%3Cline x1='80' y1='10' x2='80' y2='150'/%3E%3Cline x1='10' y1='80' x2='150' y2='80'/%3E%3Cline x1='25' y1='25' x2='135' y2='135' stroke-dasharray='2 4'/%3E%3Cline x1='135' y1='25' x2='25' y2='135' stroke-dasharray='2 4'/%3E%3C/svg%3E");
}

/* -- About Preview: Architectural building elevation -- */
#about-preview {
  position: relative;
  overflow: hidden;
}
#about-preview::before {
  content: '';
  position: absolute;
  right: -20px; top: 50%;
  transform: translateY(-50%);
  width: 550px; height: 650px;
  pointer-events: none;
  opacity: 0.09;
  z-index: 0;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 600' fill='none' stroke='%23722141' stroke-width='1'%3E%3Crect x='50' y='100' width='120' height='250' rx='1'/%3E%3Crect x='190' y='50' width='120' height='300' rx='1'/%3E%3Crect x='330' y='130' width='120' height='220' rx='1'/%3E%3Cline x1='50' y1='180' x2='170' y2='180' stroke-dasharray='3 4'/%3E%3Cline x1='50' y1='250' x2='170' y2='250' stroke-dasharray='3 4'/%3E%3Cline x1='190' y1='130' x2='310' y2='130' stroke-dasharray='3 4'/%3E%3Cline x1='190' y1='210' x2='310' y2='210' stroke-dasharray='3 4'/%3E%3Cline x1='190' y1='280' x2='310' y2='280' stroke-dasharray='3 4'/%3E%3Cline x1='330' y1='200' x2='450' y2='200' stroke-dasharray='3 4'/%3E%3Cline x1='330' y1='270' x2='450' y2='270' stroke-dasharray='3 4'/%3E%3Crect x='75' y='120' width='20' height='25' rx='1'/%3E%3Crect x='125' y='120' width='20' height='25' rx='1'/%3E%3Crect x='75' y='200' width='20' height='25' rx='1'/%3E%3Crect x='125' y='200' width='20' height='25' rx='1'/%3E%3Crect x='75' y='270' width='20' height='25' rx='1'/%3E%3Crect x='125' y='270' width='20' height='25' rx='1'/%3E%3Crect x='215' y='70' width='20' height='25' rx='1'/%3E%3Crect x='265' y='70' width='20' height='25' rx='1'/%3E%3Crect x='215' y='145' width='20' height='25' rx='1'/%3E%3Crect x='265' y='145' width='20' height='25' rx='1'/%3E%3Crect x='215' y='225' width='20' height='25' rx='1'/%3E%3Crect x='265' y='225' width='20' height='25' rx='1'/%3E%3Crect x='355' y='150' width='20' height='25' rx='1'/%3E%3Crect x='405' y='150' width='20' height='25' rx='1'/%3E%3Crect x='355' y='220' width='20' height='25' rx='1'/%3E%3Crect x='405' y='220' width='20' height='25' rx='1'/%3E%3Crect x='355' y='290' width='20' height='25' rx='1'/%3E%3Crect x='405' y='290' width='20' height='25' rx='1'/%3E%3Crect x='95' y='305' width='40' height='45' rx='2'/%3E%3Crect x='230' y='295' width='40' height='55' rx='2'/%3E%3Crect x='375' y='300' width='40' height='50' rx='2'/%3E%3Cpath d='M190,50 L250,20 L310,50' stroke-dasharray='3 3'/%3E%3Cline x1='250' y1='20' x2='250' y2='5'/%3E%3Ccircle cx='250' cy='5' r='4'/%3E%3C/svg%3E");
}
#about-preview::after {
  content: '';
  position: absolute;
  left: 3%; top: 8%;
  width: 140px; height: 140px;
  pointer-events: none;
  opacity: 0.1;
  z-index: 0;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='none' stroke='%23722141' stroke-width='1'%3E%3Cpath d='M50,5 L95,30 V70 L50,95 L5,70 V30 Z'/%3E%3Cpath d='M50,25 L75,40 V65 L50,75 L25,65 V40 Z' stroke-dasharray='2 3'/%3E%3Ccircle cx='50' cy='50' r='8'/%3E%3C/svg%3E");
}

/* -- CTA: Flowing abstract curves -- */
#home-cta, .page-cta {
  position: relative;
  overflow: hidden;
}
#home-cta::before, .page-cta::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.12;
  z-index: 0;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 400' fill='none' stroke='%23ffffff' stroke-width='1'%3E%3Cpath d='M-50,350 Q200,100 500,200 T1000,100 T1300,250'/%3E%3Cpath d='M-50,380 Q250,150 550,250 T1050,130 T1300,300' stroke-dasharray='6 8'/%3E%3Cpath d='M-50,200 Q150,350 400,300 T900,350 T1300,200' stroke-dasharray='3 10'/%3E%3Ccircle cx='500' cy='200' r='4' fill='%23ffffff'/%3E%3Ccircle cx='1000' cy='100' r='3' fill='%23ffffff'/%3E%3Ccircle cx='250' cy='180' r='3' fill='%23ffffff'/%3E%3C/svg%3E");
}
#home-cta::after, .page-cta::after {
  content: '';
  position: absolute;
  right: 5%; top: 10%;
  width: 220px; height: 220px;
  pointer-events: none;
  opacity: 0.08;
  z-index: 0;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 180' fill='none' stroke='%23ffffff' stroke-width='0.8'%3E%3Ccircle cx='90' cy='90' r='80' stroke-dasharray='2 5'/%3E%3Ccircle cx='90' cy='90' r='55' stroke-dasharray='3 4'/%3E%3Ccircle cx='90' cy='90' r='30'/%3E%3Ccircle cx='90' cy='90' r='6' fill='%23ffffff'/%3E%3C/svg%3E");
}

/* -- Footer: Skyline -- */
#footer {
  position: relative;
  overflow: hidden;
}
#footer::before,
#footer::after {
  content: none;
}

/* -- Parallax Text: Tech grid -- */
.parallax-text-section {
  position: relative;
}
.parallax-text-section::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.07;
  z-index: 0;
  background-repeat: repeat;
  background-size: 80px 80px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80' fill='none' stroke='%23a83262' stroke-width='0.6'%3E%3Cline x1='0' y1='40' x2='80' y2='40'/%3E%3Cline x1='40' y1='0' x2='40' y2='80'/%3E%3Ccircle cx='40' cy='40' r='2.5' fill='%23a83262'/%3E%3C/svg%3E");
}

/* ================================================
   SERVICES PAGE — Drone UAV
   ================================================ */
body[data-page="services"] .page-hero {
  position: relative;
  overflow: hidden;
}
body[data-page="services"] .page-hero::before {
  content: '';
  position: absolute;
  width: 520px; height: 420px;
  right: -30px; top: 15%;
  opacity: 0.12;
  pointer-events: none;
  z-index: 0;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 450 350' fill='none' stroke='%23722141' stroke-width='1.2'%3E%3Cellipse cx='225' cy='175' rx='60' ry='20'/%3E%3Cline x1='165' y1='175' x2='80' y2='120'/%3E%3Cline x1='285' y1='175' x2='370' y2='120'/%3E%3Cline x1='165' y1='175' x2='80' y2='230'/%3E%3Cline x1='285' y1='175' x2='370' y2='230'/%3E%3Ccircle cx='80' cy='120' r='35' stroke-dasharray='4 4'/%3E%3Ccircle cx='370' cy='120' r='35' stroke-dasharray='4 4'/%3E%3Ccircle cx='80' cy='230' r='35' stroke-dasharray='4 4'/%3E%3Ccircle cx='370' cy='230' r='35' stroke-dasharray='4 4'/%3E%3Cpath d='M55,120 Q80,95 105,120' stroke-width='1.5'/%3E%3Cpath d='M345,120 Q370,95 395,120' stroke-width='1.5'/%3E%3Cpath d='M55,230 Q80,255 105,230' stroke-width='1.5'/%3E%3Cpath d='M345,230 Q370,255 395,230' stroke-width='1.5'/%3E%3Crect x='205' y='158' width='40' height='35' rx='4'/%3E%3Ccircle cx='225' cy='175' r='8'/%3E%3Cline x1='225' y1='193' x2='225' y2='290' stroke-dasharray='5 4'/%3E%3Cpath d='M195,290 L225,340 L255,290' stroke-dasharray='3 3'/%3E%3Ccircle cx='225' cy='340' r='4' fill='%23722141'/%3E%3C/svg%3E");
}
body[data-page="services"] .page-hero::after { display: none; }

.services-section {
  position: relative;
  overflow: hidden;
}
.services-section:nth-child(odd)::after {
  content: '';
  position: absolute;
  right: 0; top: 0;
  width: 400px; height: 400px;
  pointer-events: none;
  opacity: 0.06;
  z-index: 0;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 350 350' fill='none' stroke='%23722141' stroke-width='1'%3E%3Cpath d='M50,50 H150 V100 H200 V50 H300'/%3E%3Cpath d='M50,150 H100 V200 H200 V150 H250 V250 H300'/%3E%3Cpath d='M50,300 H100 V250 H150 V300 H250 V250 H300'/%3E%3Ccircle cx='50' cy='50' r='4' fill='%23722141'/%3E%3Ccircle cx='300' cy='50' r='4' fill='%23722141'/%3E%3Ccircle cx='150' cy='100' r='3' fill='%23722141'/%3E%3Ccircle cx='200' cy='200' r='4' fill='%23722141'/%3E%3Ccircle cx='300' cy='250' r='4' fill='%23722141'/%3E%3Ccircle cx='100' cy='250' r='3' fill='%23722141'/%3E%3Crect x='140' y='130' width='70' height='50' rx='3' stroke-dasharray='3 3'/%3E%3C/svg%3E");
}

/* ================================================
   PROJECTS PAGE — Camera lens
   ================================================ */
body[data-page="projects"] .page-hero {
  position: relative;
  overflow: hidden;
}
body[data-page="projects"] .page-hero::before {
  display: none;
}
body[data-page="projects"] .page-hero::after { display: none; }

/* ================================================
   ABOUT PAGE — Building elevation
   ================================================ */
body[data-page="about"] .page-hero {
  position: relative;
  overflow: hidden;
}
body[data-page="about"] .page-hero::before {
  content: '';
  position: absolute;
  width: 550px; height: 500px;
  right: -40px; top: 10%;
  opacity: 0.1;
  pointer-events: none;
  z-index: 0;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 400' fill='none' stroke='%23722141' stroke-width='1'%3E%3Crect x='30' y='120' width='130' height='230' rx='1'/%3E%3Crect x='180' y='60' width='140' height='290' rx='1'/%3E%3Crect x='340' y='100' width='130' height='250' rx='1'/%3E%3Cline x1='30' y1='190' x2='160' y2='190' stroke-dasharray='3 4'/%3E%3Cline x1='30' y1='250' x2='160' y2='250' stroke-dasharray='3 4'/%3E%3Cline x1='180' y1='140' x2='320' y2='140' stroke-dasharray='3 4'/%3E%3Cline x1='180' y1='220' x2='320' y2='220' stroke-dasharray='3 4'/%3E%3Cline x1='180' y1='290' x2='320' y2='290' stroke-dasharray='3 4'/%3E%3Cline x1='340' y1='180' x2='470' y2='180' stroke-dasharray='3 4'/%3E%3Cline x1='340' y1='250' x2='470' y2='250' stroke-dasharray='3 4'/%3E%3Crect x='55' y='140' width='22' height='28' rx='1'/%3E%3Crect x='100' y='140' width='22' height='28' rx='1'/%3E%3Crect x='55' y='210' width='22' height='28' rx='1'/%3E%3Crect x='100' y='210' width='22' height='28' rx='1'/%3E%3Crect x='55' y='270' width='22' height='28' rx='1'/%3E%3Crect x='100' y='270' width='22' height='28' rx='1'/%3E%3Crect x='205' y='80' width='22' height='28' rx='1'/%3E%3Crect x='260' y='80' width='22' height='28' rx='1'/%3E%3Crect x='205' y='155' width='22' height='28' rx='1'/%3E%3Crect x='260' y='155' width='22' height='28' rx='1'/%3E%3Crect x='205' y='235' width='22' height='28' rx='1'/%3E%3Crect x='260' y='235' width='22' height='28' rx='1'/%3E%3Crect x='365' y='125' width='22' height='28' rx='1'/%3E%3Crect x='420' y='125' width='22' height='28' rx='1'/%3E%3Crect x='365' y='200' width='22' height='28' rx='1'/%3E%3Crect x='420' y='200' width='22' height='28' rx='1'/%3E%3Crect x='365' y='270' width='22' height='28' rx='1'/%3E%3Crect x='420' y='270' width='22' height='28' rx='1'/%3E%3Crect x='75' y='310' width='40' height='40' rx='2'/%3E%3Crect x='230' y='305' width='40' height='45' rx='2'/%3E%3Crect x='385' y='310' width='40' height='40' rx='2'/%3E%3Cpath d='M180,60 L250,25 L320,60' stroke-dasharray='3 3'/%3E%3Cline x1='250' y1='25' x2='250' y2='8'/%3E%3Ccircle cx='250' cy='5' r='4'/%3E%3C/svg%3E");
}
body[data-page="about"] .page-hero::after { display: none; }

/* ================================================
   CONTACT PAGE — Map pin
   ================================================ */
body[data-page="contact"] .page-hero {
  position: relative;
  overflow: hidden;
}
body[data-page="contact"] .page-hero::before {
  content: '';
  position: absolute;
  width: 440px; height: 440px;
  right: -20px; top: 12%;
  opacity: 0.12;
  pointer-events: none;
  z-index: 0;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 380 380' fill='none' stroke='%23722141' stroke-width='1.2'%3E%3Cpath d='M190,50 C245,50 290,95 290,150 C290,225 190,320 190,320 C190,320 90,225 90,150 C90,95 135,50 190,50 Z'/%3E%3Ccircle cx='190' cy='145' r='40'/%3E%3Ccircle cx='190' cy='145' r='18' stroke-dasharray='3 3'/%3E%3Ccircle cx='190' cy='145' r='5' fill='%23722141'/%3E%3Cpath d='M40,330 Q100,305 190,345 Q280,305 340,330' stroke-dasharray='5 5'/%3E%3Cline x1='120' y1='355' x2='260' y2='355' stroke-dasharray='3 6'/%3E%3Cline x1='150' y1='370' x2='230' y2='370' stroke-dasharray='3 6'/%3E%3Ccircle cx='95' cy='270' r='5' stroke-dasharray='2 2'/%3E%3Ccircle cx='285' cy='260' r='5' stroke-dasharray='2 2'/%3E%3Cline x1='95' y1='270' x2='190' y2='320' stroke-dasharray='4 6'/%3E%3Cline x1='285' y1='260' x2='190' y2='320' stroke-dasharray='4 6'/%3E%3C/svg%3E");
}
body[data-page="contact"] .page-hero::after { display: none; }

.contact-wrapper {
  position: relative;
}
.contact-wrapper::before {
  content: '';
  position: absolute;
  left: -40px; top: 0; bottom: 0;
  width: 300px;
  pointer-events: none;
  opacity: 0.06;
  z-index: 0;
  background-repeat: repeat;
  background-size: 40px 40px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='20' r='1.5' fill='%23722141'/%3E%3C/svg%3E");
}

/* ================================================
   RESPONSIVE
   ================================================ */
@media (max-width: 768px) {
  body[data-page="services"] .page-hero::before,
  body[data-page="projects"] .page-hero::before,
  body[data-page="about"] .page-hero::before,
  body[data-page="contact"] .page-hero::before {
    width: 280px; height: 280px;
    opacity: 0.06;
    right: -40px;
  }
  #about-preview::before {
    width: 280px; height: 350px;
    opacity: 0.06;
  }
  .reveal-section::before {
    height: 180px;
  }
  #philosophy::before {
    width: 280px; height: 280px;
  }
  .stats-section::after {
    display: none;
  }
}