/* ==========================================================================
   Verapex Sector — additions on top of main.css (shared with the main site).
   Colours, type and spacing all come from main.css tokens.
   ========================================================================== */

/* Header: logo with the sector name set small underneath */
.sector-mark{display:flex; flex-direction:column; align-items:center; gap:5px;}
.sector-mark-name{
  font-size:0.56rem; letter-spacing:0.34em; text-transform:uppercase;
  color:var(--gold-deep); line-height:1; padding-left:0.34em; /* optically centre tracked caps */
  transition:opacity .3s var(--ease);
}
.masthead.is-stuck .sector-mark-name{opacity:.85;}

/* Hero: no scroll cue here, so it doesn't need the extra bottom room */
.sector-hero{min-height:92vh; min-height:92svh; padding-bottom:120px;}

/* Hero emblem: the sector's line drawing inside a fine gold ring */
.sector-emblem{
  width:96px; height:96px; margin:0 auto 34px;
  border:1px solid rgba(168,128,44,.38); border-radius:50%;
  display:grid; place-items:center;
}
.sector-emblem-icon{width:54px; height:54px; display:block;}

.has-anim .sector-emblem{opacity:0; transform:scale(.94);}
.has-anim .hero.lift .sector-emblem{
  opacity:1; transform:none;
  transition:opacity 1s var(--ease) .1s, transform 1.2s var(--ease) .1s;
}
.has-anim .sector-emblem-icon *{stroke-dasharray:1; stroke-dashoffset:1;}
.has-anim .hero.lift .sector-emblem-icon *{
  stroke-dashoffset:0;
  transition:stroke-dashoffset 2s var(--ease) .45s;
}

/* Overview: right-hand copy */
.overview-copy{padding-top:6px;}
.overview-copy p{color:var(--ink-soft); line-height:1.95; margin-bottom:22px;}
.overview-copy .maison-standfirst{
  font-family:'Cormorant Garamond', Garamond, Georgia, serif;
  font-weight:500; font-size:clamp(1.35rem, 2.2vw, 1.7rem); line-height:1.42;
  color:var(--ink); max-width:34ch; margin-bottom:28px;
}

/* Services: three-column ledger of offers divided by hairlines */
.offers{
  display:grid; grid-template-columns:repeat(3, 1fr);
  border-top:1px solid var(--rule);
  margin-inline:var(--inset-x);
}
.offer{
  padding:44px 36px 48px;
  border-bottom:1px solid var(--rule);
  border-right:1px solid var(--rule);
}
.offer:nth-child(3n){border-right:0;}
.offer:nth-child(3n+1){padding-left:0;}
.offer:nth-child(3n){padding-right:0;}
.offer-index{display:block; font-size:0.66rem; letter-spacing:0.18em; color:var(--gold-deep); margin-bottom:22px;}
.offer h3{font-size:1.45rem; line-height:1.2; font-weight:500; margin-bottom:14px;}
.offer p{color:var(--ink-soft); font-size:0.94rem; line-height:1.85;}

.sector-note{
  max-width:62ch; margin:44px auto 0; text-align:center;
  font-size:0.8rem; line-height:1.8; color:var(--ink-mute);
}

/* How it works: four steps under a gold rule */
.steps{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(4, 1fr);
  gap:clamp(28px, 3.4vw, 56px);
  margin-inline:var(--inset-x);
}
.step{border-top:1px solid var(--gold); padding-top:28px;}
.step-num{
  display:block; margin-bottom:18px;
  font-family:'Cormorant Garamond', Garamond, Georgia, serif;
  font-size:2.5rem; line-height:1; color:var(--gold-deep);
}
.step h3{font-size:1.3rem; line-height:1.25; font-weight:500; margin-bottom:12px;}
.step p{color:var(--ink-soft); font-size:0.93rem; line-height:1.8;}

/* FAQ: the partners accordion, one column, smaller questions */
.faq-list{max-width:880px; margin:0 auto;}
.faq-list .houses{grid-template-columns:1fr; gap:0;}
.faq-list .house:first-child{border-top:1px solid var(--rule);}
.faq-list .house-toggle{padding:24px 0;}
.faq-list .house-toggle h3{font-size:clamp(1.2rem, 2vw, 1.45rem); line-height:1.3;}
.faq-list .house p{margin-bottom:0; max-width:70ch;}

/* Footer: the current company in the group list */
.foot-col .is-current{color:var(--gold-deep);}

/* Responsive ----------------------------------------------------------- */
@media (max-width:980px){
  .offers{grid-template-columns:repeat(2, 1fr); margin-inline:0;}
  .offer, .offer:nth-child(3n), .offer:nth-child(3n+1){padding:36px 28px 40px; border-right:1px solid var(--rule);}
  .offer:nth-child(2n){border-right:0; padding-right:0;}
  .offer:nth-child(2n+1){padding-left:0;}
  .steps{grid-template-columns:repeat(2, 1fr); margin-inline:0; row-gap:48px;}
  .overview-copy{padding-top:0;}
}

@media (max-width:620px){
  .offers{grid-template-columns:1fr;}
  .offer, .offer:nth-child(n){padding:32px 0 34px; border-right:0;}
  .steps{grid-template-columns:1fr; row-gap:40px;}
  .sector-emblem{width:80px; height:80px; margin-bottom:28px;}
  .sector-emblem-icon{width:46px; height:46px;}
  .sector-hero{padding-bottom:96px;}
}

@media (prefers-reduced-motion: reduce){
  .sector-emblem-icon *{stroke-dasharray:none !important; stroke-dashoffset:0 !important;}
}

/* Signed-in staff: keep the fixed header below the WordPress admin bar. */
.admin-bar .masthead{top:32px;}
@media screen and (max-width:782px){ .admin-bar .masthead{top:46px;} }
@media screen and (max-width:600px){ .admin-bar .masthead{top:0;} .admin-bar #wpadminbar{position:fixed;} .admin-bar .masthead{top:46px;} }

/* ==========================================================================
   Home page rhythm: sections alternate bone / white whatever extras a sector
   adds (hero is the first <section>, so the first content section is white).
   ========================================================================== */
.is-front #main > section.section:nth-of-type(odd){background:var(--bone);}
.is-front #main > section.section:nth-of-type(even){background:var(--paper);}

/* ==========================================================================
   Request form: sector-specific details
   ========================================================================== */
.form .optional{text-transform:none; letter-spacing:0.02em; font-size:0.72rem; color:var(--ink-mute); opacity:.8;}
.form-part{border-top:1px solid var(--rule); padding-top:30px;}
.form-part-h{
  font-family:'Cormorant Garamond', Garamond, Georgia, serif;
  font-size:1.45rem; line-height:1.2; color:var(--ink); margin:0 0 26px;
}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:30px 34px;}
.form-grid .field-wide{grid-column:1 / -1;}
.field[hidden]{display:none !important;}
.field input[type="date"], .field input[type="time"]{min-height:44px;}
.field input[type="number"]{-moz-appearance:textfield;}
.checks{border:0; margin:0; padding:0; min-width:0;}
.checks legend{
  font-size:0.66rem; letter-spacing:0.18em; text-transform:uppercase;
  color:var(--ink-mute); margin-bottom:14px; padding:0;
}
.field .check{
  display:inline-flex; align-items:center; gap:10px;
  margin:0 22px 12px 0; font-size:0.92rem; color:var(--ink-soft); cursor:pointer;
  text-transform:none; letter-spacing:0;
}
.field .check input{
  -webkit-appearance:none; appearance:none; flex:none;
  width:18px; height:18px; margin:0; padding:0;
  border:1px solid var(--rule); border-radius:0; background:var(--paper) center/12px no-repeat;
  cursor:pointer; transition:border-color .25s var(--ease), background-color .25s var(--ease);
}
.field .check input:checked{
  background-color:var(--gold-deep); border-color:var(--gold-deep);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.3l2.6 2.4L10 3.3' fill='none' stroke='%23fff' stroke-width='1.6'/%3E%3C/svg%3E");
}
.field .check input:focus-visible{outline:2px solid var(--gold); outline-offset:2px;}
.form-warn{
  font-size:0.8rem; line-height:1.7; color:var(--ink-soft);
  border-left:2px solid var(--gold); padding:4px 0 4px 16px; margin:0;
}
.form.is-prefilled .form-part{animation:vpxs-glow 1.6s var(--ease);}
@keyframes vpxs-glow{0%{background:rgba(168,128,44,.10);}100%{background:transparent;}}

/* ==========================================================================
   Across Verapex: sister-company cards
   ========================================================================== */
.journey{display:grid; grid-template-columns:repeat(3, 1fr); gap:clamp(20px, 2.4vw, 34px); margin-inline:var(--inset-x);}
.journey-card{
  display:flex; flex-direction:column; gap:14px;
  padding:34px 32px 30px; background:var(--paper);
  border:1px solid var(--rule-soft); color:inherit; text-decoration:none;
  transition:border-color .35s var(--ease), transform .5s var(--ease);
}
.journey-card:hover{border-color:var(--gold); transform:translateY(-2px);}
.journey-icon{width:40px; height:40px;}
.journey-name{font-family:'Cormorant Garamond', Garamond, Georgia, serif; font-size:1.55rem; line-height:1.1; color:var(--ink);}
.journey-text{color:var(--ink-soft); font-size:0.93rem; line-height:1.75; flex:1;}
.journey-card .arrow-link{align-self:flex-start;}
#main > section.section:nth-of-type(even) .journey-card{background:var(--bone);}

@media (max-width:980px){
  .journey{grid-template-columns:1fr; margin-inline:0;}
}
@media (max-width:620px){
  .form-grid{grid-template-columns:1fr; gap:30px;}
  .journey-card{padding:28px 24px 26px;}
}

/* Hero line art (sector modules): behind the text, faded out in the middle
   so it never crosses the headline. Drawn in, then moves slowly. */
.hero-art{position:absolute; inset:0; width:100%; height:100%; z-index:1; pointer-events:none; overflow:visible;}
.hero-art .art-line{fill:none; stroke:#A8802C; stroke-width:1; vector-effect:non-scaling-stroke;}
.hero-art .art-soft{opacity:.45;}
.hero-art .art-dash{stroke-dasharray:4 7;}
.has-anim .hero-art .art-draw{stroke-dasharray:1; stroke-dashoffset:1;}
.has-anim .hero.lift .hero-art .art-draw{stroke-dashoffset:0; transition:stroke-dashoffset 3.2s var(--ease) .6s;}
.has-anim .hero-art .art-fade{opacity:0;}
.has-anim .hero.lift .hero-art .art-fade{opacity:1; transition:opacity 1.6s var(--ease) 2.4s;}
@media (prefers-reduced-motion: reduce){
  .hero-art .art-draw{stroke-dasharray:none !important; stroke-dashoffset:0 !important;}
  .hero-art .art-move{display:none;}
}