/* =========================================================
   SPIRE DIMENSIONS — PREMIUM HOMEPAGE REDESIGN
   Homepage only. Shared header/footer remain untouched.
========================================================= */
:root {
  --ph-black:#0a0a08;
  --ph-black-2:#12110e;
  --ph-ivory:#f3efe7;
  --ph-ivory-2:#e8e0d3;
  --ph-paper:#faf8f3;
  --ph-gold:#c9a45f;
  --ph-gold-2:#e0c587;
  --ph-ink:#17140f;
  --ph-muted:#746f66;
  --ph-border:rgba(24,20,14,.16);
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; background:var(--ph-black); color:#fff; font-family:"DM Sans",sans-serif; }
img { display:block; width:100%; }
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; }

.ph-section-index {
  display:inline-flex;
  align-items:center;
  gap:12px;
  font-size:9px;
  font-weight:600;
  letter-spacing:.27em;
  text-transform:uppercase;
  color:#9b814e;
}
.ph-section-index::before { content:""; width:34px; height:1px; background:currentColor; opacity:.65; }

.ph-text-link {
  display:inline-flex;
  align-items:center;
  gap:18px;
  padding-bottom:7px;
  border-bottom:1px solid rgba(255,255,255,.34);
  font-size:10px;
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  transition:.25s ease;
}
.ph-text-link:hover { color:var(--ph-gold-2); border-color:var(--ph-gold-2); gap:24px; }
.ph-text-link-dark { color:#2d2922; border-color:rgba(45,41,34,.3); }

.ph-btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:24px;
  min-height:54px;
  padding:0 26px;
  border:1px solid transparent;
  font-size:10px;
  font-weight:700;
  letter-spacing:.17em;
  text-transform:uppercase;
  transition:.28s ease;
}
.ph-btn span { font-size:16px; font-weight:400; }
.ph-btn-gold { background:var(--ph-gold); color:#15120d; border-color:var(--ph-gold); }
.ph-btn-gold:hover { background:#e1c786; border-color:#e1c786; transform:translateY(-2px); }
.ph-btn-outline { color:#fff; border-color:rgba(213,180,111,.45); background:rgba(255,255,255,.02); }
.ph-btn-outline:hover { background:var(--ph-gold); color:#17130d; }

/* ---------------- HERO ---------------- */
.ph-hero {
  position:relative;
  min-height:100svh;
  overflow:hidden;
  isolation:isolate;
  background:#0b0b09;
}

.ph-hero-media {
  position: absolute;
  inset: 0;
  z-index: -4;
  background: url("../images/image2.webp") center 56% / cover no-repeat;
  transform: scale(1.01);
}

.ph-hero-shade {
  position:absolute; inset:0; z-index:-3;
  background:
    linear-gradient(90deg,rgba(3,4,3,.89) 0%,rgba(5,6,5,.72) 35%,rgba(5,6,5,.22) 69%,rgba(5,6,5,.47) 100%),
    linear-gradient(180deg,rgba(4,4,3,.22),rgba(4,4,3,.18) 58%,rgba(4,4,3,.78));
}
.ph-hero-grid {
  position:absolute; inset:0; z-index:-2; opacity:.42;
  background:linear-gradient(90deg,transparent calc(50% - .5px),rgba(214,185,123,.18) 50%,transparent calc(50% + .5px));
  pointer-events:none;
}
.ph-hero-inner {
  width:min(1480px,88vw);
  min-height:100svh;
  margin:auto;
  padding:175px 0 115px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 310px;
  gap:90px;
  align-items:end;
}
.ph-hero-copy { max-width:790px; }
.ph-eyebrow {
  display:flex; align-items:center; gap:14px; margin-bottom:28px;
  font-size:9px; font-weight:600; letter-spacing:.32em; text-transform:uppercase; color:#d7c49c;
}
.ph-eyebrow span { width:46px; height:1px; background:#d7c49c; }
.ph-hero h1 {
  margin:0;
  font-family:"Playfair Display",serif;
  font-size:clamp(70px,8.3vw,142px);
  font-weight:400;
  line-height:.78;
  letter-spacing:-.057em;
  color:#fffdf8;
}
.ph-hero h1 em { color:var(--ph-gold-2); font-weight:400; }
.ph-hero-copy > p {
  max-width:570px;
  margin:37px 0 0;
  font-size:14px;
  line-height:1.9;
  color:rgba(255,255,255,.69);
}
.ph-hero-actions { display:flex; align-items:center; gap:30px; margin-top:38px; flex-wrap:wrap; }
.ph-hero-feature {
  align-self:end;
  margin-bottom:58px;
  padding:12px;
  background:rgba(12,12,10,.78);
  border:1px solid rgba(230,203,145,.3);
  backdrop-filter:blur(15px);
  box-shadow:0 25px 70px rgba(0,0,0,.32);
}
.ph-feature-image { height:205px; overflow:hidden; }
.ph-feature-image img { height:100%; object-fit:cover; transition:transform .65s ease; }
.ph-hero-feature:hover img { transform:scale(1.04); }
.ph-feature-meta { display:flex; align-items:end; justify-content:space-between; gap:16px; padding:18px 8px 7px; }
.ph-feature-meta div { display:grid; gap:7px; }
.ph-feature-meta small { font-size:7px; letter-spacing:.26em; color:#caae75; }
.ph-feature-meta strong { font-family:"Playfair Display",serif; font-size:20px; font-weight:400; }
.ph-feature-meta a { display:grid; place-items:center; width:34px; height:34px; border:1px solid rgba(255,255,255,.18); }
.ph-hero-foot {
  position:absolute; left:6vw; right:6vw; bottom:28px;
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:20px;
  font-size:7px; font-weight:600; letter-spacing:.25em; color:rgba(255,255,255,.48);
}
.ph-hero-rule { height:1px; background:rgba(255,255,255,.14); }

/* ---------------- CONSULTATION ---------------- */
.ph-consultation { background:var(--ph-black-2); padding:120px 0; position:relative; overflow:hidden; }
.ph-consultation::after {
  content:"PROJECT"; position:absolute; left:-25px; bottom:-45px; pointer-events:none;
  font-family:"Playfair Display",serif; font-size:clamp(120px,18vw,330px); line-height:.65; color:rgba(255,255,255,.018); letter-spacing:-.06em;
}
.ph-consultation-shell {
  width:min(1480px,90vw); margin:auto;
  display:grid; grid-template-columns:minmax(300px,.72fr) minmax(660px,1.28fr); gap:clamp(60px,7vw,125px); align-items:center;
}
.ph-consultation-intro h2 {
  margin:22px 0 24px; font-family:"Playfair Display",serif; font-weight:400;
  font-size:clamp(53px,5.4vw,88px); line-height:.91; letter-spacing:-.045em;
}
.ph-consultation-intro h2 em { color:var(--ph-gold-2); font-weight:400; }
.ph-consultation-intro > p { max-width:530px; color:rgba(255,255,255,.58); font-size:13px; line-height:1.9; }
.ph-consultation-notes { margin-top:36px; border-top:1px solid rgba(255,255,255,.11); }
.ph-consultation-notes div { display:grid; grid-template-columns:35px 1fr; gap:16px; padding:13px 0; border-bottom:1px solid rgba(255,255,255,.08); }
.ph-consultation-notes span { color:#b79659; font-size:8px; letter-spacing:.12em; }
.ph-consultation-notes p { margin:0; color:rgba(255,255,255,.72); font-size:11px; }
.ph-consultation-assurance { display:flex; align-items:center; gap:10px; margin-top:27px; font-size:8px; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.52); }
.ph-status-dot { width:7px; height:7px; border-radius:50%; background:#d1a858; box-shadow:0 0 0 5px rgba(209,168,88,.08); }

.ph-form-panel {
  position:relative;
  background:linear-gradient(135deg,#fbf8f1 0%,#f0e9dd 100%);
  color:var(--ph-ink);
  padding:clamp(28px,3.2vw,50px);
  box-shadow:0 35px 95px rgba(0,0,0,.38);
}
.ph-form-panel::before { content:""; position:absolute; inset:14px -14px -14px 14px; border:1px solid rgba(205,166,94,.46); z-index:-1; }
.ph-form-panel::after { content:""; position:absolute; width:90px; height:4px; top:0; left:0; background:var(--ph-gold); }
.ph-form-topline { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; padding-bottom:22px; border-bottom:1px solid var(--ph-border); }
.ph-form-topline small { font-size:8px; font-weight:700; letter-spacing:.26em; color:#a27f40; }
.ph-form-topline h3 { margin:8px 0 0; font-family:"Playfair Display",serif; font-size:clamp(32px,3vw,48px); line-height:1; font-weight:500; letter-spacing:-.03em; }
.ph-form-topline > span { font-size:8px; font-weight:700; letter-spacing:.19em; color:#a29a8f; padding-top:8px; }
.ph-form { margin-top:23px; }
.ph-service-choice { margin:0 0 23px; padding:0; border:0; }
.ph-service-choice legend { margin-bottom:11px; font-size:8px; font-weight:700; letter-spacing:.17em; text-transform:uppercase; color:#5d564c; }
.ph-service-choice legend b { color:#a17b3a; }
.ph-choice-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:7px; }
.ph-choice-grid label { cursor:pointer; min-width:0; }
.ph-choice-grid input { position:absolute; opacity:0; pointer-events:none; }
.ph-choice-grid span {
  display:flex; flex-direction:column; justify-content:space-between; min-height:69px; padding:11px;
  background:rgba(255,255,255,.38); border:1px solid rgba(25,21,15,.13);
  font-size:9px; font-weight:600; color:#373127; transition:.22s ease;
}
.ph-choice-grid span b { font-size:7px; font-weight:600; letter-spacing:.15em; color:#aa8a52; }
.ph-choice-grid input:checked + span { background:#17140f; color:#fff; border-color:#17140f; transform:translateY(-2px); box-shadow:0 9px 20px rgba(22,18,12,.12); }
.ph-choice-grid input:focus-visible + span { outline:2px solid #a37c38; outline-offset:2px; }
.ph-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:19px 24px; }
.ph-field { display:grid; gap:7px; min-width:0; }
.ph-field > span { font-size:7.5px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:#6c645a; }
.ph-field input,.ph-field select,.ph-field textarea {
  width:100%; border:0; border-bottom:1px solid rgba(29,24,16,.26); border-radius:0; outline:0; background:transparent;
  padding:0 0 9px; color:#19150f; font-size:12px; min-height:34px;
}
.ph-field select { cursor:pointer; }
.ph-field textarea { min-height:66px; resize:vertical; line-height:1.5; }
.ph-field input::placeholder,.ph-field textarea::placeholder { color:#a6a097; }
.ph-field input:focus,.ph-field select:focus,.ph-field textarea:focus { border-color:#9b7436; }
.ph-field-wide { grid-column:1/-1; }
.ph-form-submit-row { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:26px; padding-top:20px; border-top:1px solid var(--ph-border); }
.ph-form-submit-row p { max-width:310px; margin:0; color:#82796d; font-size:8px; line-height:1.6; }
.ph-form-submit-row p strong { color:#3d3529; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.ph-submit {
  min-height:52px; padding:0 21px; border:0; cursor:pointer; display:inline-flex; align-items:center; gap:23px;
  background:#17140f; color:#fff; font-size:9px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; transition:.25s ease;
}
.ph-submit:hover { background:#a78040; transform:translateY(-2px); }
.ph-submit span { font-size:14px; }
.ph-form-status { margin:13px 0 0; font-size:9px; line-height:1.5; color:#806431; display:none; }
.ph-form-status.is-visible { display:block; }

/* ---------------- MANIFESTO ---------------- */
.ph-manifesto { background:var(--ph-paper); color:var(--ph-ink); padding:145px 0; }
.ph-manifesto-inner { width:min(1280px,86vw); margin:auto; }
.ph-manifesto-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:120px; align-items:end; margin-top:35px; }
.ph-manifesto h2 { margin:0; font-family:"Playfair Display",serif; font-size:clamp(62px,7vw,112px); line-height:.82; font-weight:400; letter-spacing:-.055em; }
.ph-manifesto h2 em { color:#ad8950; font-weight:400; }
.ph-manifesto-grid > div p { max-width:540px; margin:0 0 33px; color:#6f685e; font-size:13px; line-height:1.95; }

/* ---------------- SECTION HEAD ---------------- */
.ph-section-head { width:min(1380px,90vw); margin:auto; display:flex; align-items:end; justify-content:space-between; gap:40px; }
.ph-section-head h2 { margin:20px 0 0; font-family:"Playfair Display",serif; font-size:clamp(50px,5.5vw,86px); line-height:.92; font-weight:400; letter-spacing:-.045em; }
.ph-section-head h2 em { color:var(--ph-gold-2); font-weight:400; }

/* ---------------- SERVICES ---------------- */
.ph-services { background:#0d0d0b; padding:130px 0 150px; }
.ph-services-grid {
  width:min(1380px,90vw); margin:62px auto 0;
  display:grid; grid-template-columns:1.2fr .8fr; grid-auto-rows:430px; gap:18px;
}
.ph-service-card { position:relative; overflow:hidden; min-height:430px; background:#171713; }
.ph-service-card img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .45s ease; }
.ph-service-shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(5,5,4,.03) 28%,rgba(6,6,5,.89) 100%); transition:.4s ease; }
.ph-service-copy { position:absolute; left:29px; right:29px; bottom:26px; z-index:2; }
.ph-service-copy small { font-size:7px; letter-spacing:.27em; color:#d7b875; }
.ph-service-copy h3 { margin:10px 0 13px; font-family:"Playfair Display",serif; font-size:clamp(30px,3vw,48px); line-height:.95; font-weight:400; }
.ph-service-copy span { font-size:9px; color:rgba(255,255,255,.62); letter-spacing:.04em; }
.ph-service-card:hover img { transform:scale(1.045); filter:saturate(.85); }
.ph-service-card:hover .ph-service-shade { background:linear-gradient(180deg,rgba(5,5,4,.13),rgba(6,6,5,.94)); }
.ph-service-wide { grid-column:1/-1; }

/* ---------------- PROJECTS ---------------- */
.ph-projects { background:var(--ph-paper); color:var(--ph-ink); padding:140px 0 155px; }
.ph-projects .ph-section-head h2 em { color:#a7834b; }
.ph-project-list { width:min(1380px,90vw); margin:75px auto 0; display:grid; gap:100px; }
.ph-project { display:grid; grid-template-columns:1.35fr .65fr; gap:70px; align-items:center; }
.ph-project-reverse { grid-template-columns:.65fr 1.35fr; }
.ph-project-reverse .ph-project-image { order:2; }
.ph-project-reverse .ph-project-info { order:1; }
.ph-project-image { height:min(62vw,690px); max-height:690px; overflow:hidden; background:#ddd6ca; }
.ph-project-image img { height:100%; object-fit:cover; transition:transform .7s ease; }
.ph-project:hover img { transform:scale(1.025); }
.ph-project-info span { font-size:8px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:#9a7944; }
.ph-project-info h3 { margin:18px 0 23px; font-family:"Playfair Display",serif; font-weight:400; font-size:clamp(44px,4.5vw,72px); line-height:.92; letter-spacing:-.04em; }
.ph-project-info p { max-width:430px; margin:0; color:#766f64; font-size:12px; line-height:1.9; }

/* ---------------- PROCESS ---------------- */
.ph-process { background:#11110e; padding:145px max(5vw,24px); display:grid; grid-template-columns:.7fr 1.3fr; gap:90px; }
.ph-process-intro { max-width:520px; }
.ph-process-intro h2 { margin:23px 0 25px; font-family:"Playfair Display",serif; font-size:clamp(51px,5vw,80px); line-height:.92; font-weight:400; letter-spacing:-.045em; }
.ph-process-intro h2 em { color:var(--ph-gold-2); font-weight:400; }
.ph-process-intro p { color:rgba(255,255,255,.55); font-size:12px; line-height:1.9; margin:0 0 31px; }
.ph-process-steps { border-top:1px solid rgba(255,255,255,.14); }
.ph-step { display:grid; grid-template-columns:52px 180px 1fr; gap:24px; align-items:center; padding:27px 0; border-bottom:1px solid rgba(255,255,255,.1); }
.ph-step > span { font-size:8px; letter-spacing:.18em; color:#b38d50; }
.ph-step h3 { margin:0; font-family:"Playfair Display",serif; font-size:26px; font-weight:400; }
.ph-step p { margin:0; color:rgba(255,255,255,.48); font-size:10px; line-height:1.65; }

/* ---------------- CLOSING ---------------- */
.ph-closing { min-height:720px; position:relative; display:grid; place-items:center; overflow:hidden; isolation:isolate; text-align:center; }
.ph-closing-media { position:absolute; inset:0; z-index:-2; background:url("../images/image10.webp") center/cover no-repeat; }
.ph-closing::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(7,7,6,.56),rgba(7,7,6,.82)); }
.ph-closing-inner { width:min(760px,86vw); padding:90px 0; }
.ph-closing-inner > span { font-size:8px; letter-spacing:.29em; color:#dac28e; }
.ph-closing h2 { margin:20px 0 23px; font-family:"Playfair Display",serif; font-size:clamp(65px,8vw,120px); line-height:.82; font-weight:400; letter-spacing:-.055em; }
.ph-closing h2 em { color:var(--ph-gold-2); font-weight:400; }
.ph-closing p { width:min(520px,100%); margin:0 auto 31px; color:rgba(255,255,255,.65); font-size:12px; line-height:1.9; }

/* ---------------- REVEAL ---------------- */
.ph-reveal { opacity:0; transform:translateY(24px); transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1); }
.ph-reveal.is-visible { opacity:1; transform:none; }

/* ---------------- RESPONSIVE ---------------- */
@media (max-width:1180px) {
  .ph-hero-inner { grid-template-columns:1fr 270px; gap:45px; width:min(92vw,1200px); }
  .ph-consultation-shell { grid-template-columns:1fr; width:min(94vw,980px); }
  .ph-consultation-intro { max-width:720px; }
  .ph-consultation-notes { display:grid; grid-template-columns:1fr 1fr; gap:0 22px; }
  .ph-manifesto-grid { gap:60px; }
  .ph-process { grid-template-columns:1fr; gap:55px; }
  .ph-process-intro { max-width:760px; }
}

@media (max-width:820px) {
  .ph-hero { min-height:940px; }
  .ph-hero-inner { min-height:940px; padding:150px 0 95px; grid-template-columns:1fr; align-content:end; }
  .ph-hero h1 { font-size:clamp(64px,16vw,104px); }
  .ph-hero-feature { display:none; }
  .ph-hero-copy > p { max-width:500px; }
  .ph-hero-foot { bottom:19px; }
  .ph-consultation { padding:90px 0; }
  .ph-consultation-shell { width:min(92vw,720px); gap:50px; }
  .ph-choice-grid { grid-template-columns:repeat(2,1fr); }
  .ph-choice-grid label:last-child { grid-column:1/-1; }
  .ph-form-grid { grid-template-columns:1fr; }
  .ph-field-wide { grid-column:auto; }
  .ph-form-submit-row { align-items:flex-start; flex-direction:column; }
  .ph-submit { width:100%; justify-content:space-between; }
  .ph-manifesto { padding:100px 0; }
  .ph-manifesto-grid { grid-template-columns:1fr; gap:40px; }
  .ph-section-head { align-items:flex-start; flex-direction:column; }
  .ph-services { padding:100px 0 110px; }
  .ph-services-grid { grid-template-columns:1fr; grid-auto-rows:auto; }
  .ph-service-card,.ph-service-wide { grid-column:auto; min-height:500px; }
  .ph-projects { padding:100px 0 110px; }
  .ph-project-list { gap:70px; margin-top:50px; }
  .ph-project,.ph-project-reverse { grid-template-columns:1fr; gap:32px; }
  .ph-project-reverse .ph-project-image,.ph-project-reverse .ph-project-info { order:initial; }
  .ph-project-image { height:68vw; min-height:390px; }
  .ph-process { padding:105px 6vw; }
  .ph-step { grid-template-columns:40px 145px 1fr; }
  .ph-closing { min-height:620px; }
}

@media (max-width:560px) {
  .ph-hero { min-height:860px; }
  .ph-hero-inner { min-height:860px; width:88vw; padding:135px 0 82px; }
  .ph-eyebrow { font-size:7px; letter-spacing:.22em; line-height:1.5; }
  .ph-eyebrow span { width:27px; }
  .ph-hero h1 { font-size:clamp(55px,17vw,77px); line-height:.84; }
  .ph-hero-copy > p { font-size:12px; margin-top:27px; line-height:1.75; }
  .ph-hero-actions { align-items:flex-start; flex-direction:column; gap:22px; margin-top:30px; }
  .ph-btn { width:100%; justify-content:space-between; }
  .ph-hero-foot { left:6vw; right:6vw; gap:10px; font-size:6px; letter-spacing:.13em; }
  .ph-consultation-shell { width:90vw; }
  .ph-consultation-intro h2 { font-size:50px; }
  .ph-consultation-notes { grid-template-columns:1fr; }
  .ph-form-panel { padding:27px 20px; }
  .ph-form-panel::before { display:none; }
  .ph-form-topline h3 { font-size:35px; }
  .ph-form-topline > span { display:none; }
  .ph-choice-grid { grid-template-columns:1fr 1fr; gap:6px; }
  .ph-choice-grid span { min-height:62px; padding:10px 8px; font-size:8px; }
  .ph-form-grid { gap:17px; }
  .ph-manifesto-inner { width:88vw; }
  .ph-manifesto h2 { font-size:58px; }
  .ph-section-head,.ph-services-grid,.ph-project-list { width:88vw; }
  .ph-section-head h2 { font-size:49px; }
  .ph-service-card,.ph-service-wide { min-height:430px; }
  .ph-service-copy { left:20px; right:20px; bottom:20px; }
  .ph-service-copy h3 { font-size:35px; }
  .ph-project-image { height:92vw; min-height:360px; }
  .ph-project-info h3 { font-size:43px; }
  .ph-process { padding:90px 6vw; }
  .ph-process-intro h2 { font-size:50px; }
  .ph-step { grid-template-columns:38px 1fr; gap:10px 14px; padding:22px 0; }
  .ph-step p { grid-column:2; }
  .ph-closing { min-height:560px; }
  .ph-closing h2 { font-size:66px; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .ph-reveal { opacity:1; transform:none; transition:none; }
  .ph-service-card img,.ph-project-image img,.ph-btn,.ph-text-link { transition:none; }
}
