/* Palette and typography inspired by the supplied Dr. Rath site reference */
:root{--ink:#075f70;--green:#087b8b;--green2:#0a7180;--gold:#c3a351;--cream:#fbf0d7;--paper:#fffaf0;--line:#bfd4d8;--muted:#53666a;--serif:'Roboto Slab',Georgia,serif;--sans:'Roboto',Arial,sans-serif}
body{background:var(--cream);color:#435256;font-family:var(--sans)}
.header{background:#fff;border-bottom-color:#dce7e8}.brand-logo{display:block;width:188px;height:auto;max-height:55px;object-fit:contain}.header nav a{font-family:'Roboto Condensed',var(--sans);font-size:14px;color:#37535a}.header-button,.button{background:var(--green);border-radius:4px;font-family:'Roboto Condensed',var(--sans);font-size:14px}.button:hover{background:#075c6c}
h1,h2,h3{color:var(--ink);font-family:var(--serif);letter-spacing:-.035em}.hero{background:var(--cream)}.hero-photo{object-position:center 43%}.hero-wash{background:linear-gradient(90deg,rgba(251,240,215,.99) 0%,rgba(251,240,215,.97) 22%,rgba(251,240,215,.8) 37%,rgba(251,240,215,.25) 53%,transparent 68%)}.hero h1{font-size:clamp(43px,4.45vw,59px);line-height:1.12;color:#183f49}.hero-description{font-size:14px;color:#52656a}.overline,.section-label{font-family:'Roboto Condensed',var(--sans);color:#177d8d;font-size:11px;letter-spacing:.21em}.overline span{background:var(--gold)}.gold-rule{background:var(--gold)}.hero-audience{color:#3b555a}.line-icon{color:var(--green)}.hero-side-note{color:#39717a}
.pillars{background:#fffaf0;border-bottom-color:#d2e2e3}.pillars article{border-right-color:#c6d8db}.pillar-icon{background:#e8f0ed;color:var(--green)}.pillar-icon svg{display:block;width:31px;height:31px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.pillars h2{font:600 17px/1.25 'Roboto Slab',Georgia,serif;color:#175b68}.pillars p{font-size:12px;color:#52666b}
.why{background:#fbf0d7}.why-grid{border-color:#bfd4d8}.why-grid article{background:rgba(255,250,240,.55);border-color:#bfd4d8}.why-grid article>span{color:#258596}.why-grid h3{color:#155f6c}.why-grid p{color:#53666a}
.partner-section{background:#fbf0d7}.section-heading h2{color:#106e7d}.section-heading>p{color:#52666b}.partner-card{background:#fffaf0;border-color:#91bdc5;border-radius:4px}.partner-card>img{filter:saturate(.88)}.partner-card h3{font-family:'Roboto Slab',Georgia,serif;color:#185766}.partner-card p{color:#52666b}.partner-card a{font-family:'Roboto Condensed',var(--sans);font-size:13px;color:#087b8b;text-decoration-color:#73a9b2}
.assortment.section{width:100%;margin:0;padding:68px max(6.25%,calc((100% - 1310px)/2)) 83px;background:#cfe2e6}.assortment .section-label{color:#147b8c}.assortment .section-heading h2{color:#176e7c}.assortment .section-heading>p{color:#52656b}.assortment-grid article,.assortment-grid article:nth-child(n){background:#fff8e9;border:1px solid #268495;border-radius:4px;box-shadow:0 2px 0 rgba(16,102,118,.06)}.assortment-grid article>span{font-family:'Roboto Condensed',var(--sans);color:#1b7d8c}.assortment-icon{color:#168396}.assortment-grid h3{font-family:'Roboto Condensed',var(--sans);font-size:21px;letter-spacing:-.02em;color:#365669}.assortment-grid p{font-size:12px;color:#53656a}.legal-note{color:#5a7075}
.process{background:#c7dfe4;color:#31515a}.process-copy h2{color:#176b7b}.process-copy>p{color:#49656a}.steps article{border-color:#8db7bf}.steps article>span{color:#157c8c}.steps h3{font-family:'Roboto Slab',Georgia,serif;color:#185a67}.steps p{color:#4e656b}
.contact{background:#fbf0d7}.contact-photo:after{background:linear-gradient(0deg,rgba(7,68,77,.62),transparent 48%)}.contact-content h2{color:#126a79}.contact-intro{color:#52666b}.form-grid>label,.form-grid legend{font-family:'Roboto Condensed',var(--sans);font-size:12px;color:#35565c}.form-grid input,.form-grid select,.form-grid textarea{border-color:#bdced0;background:#fffdf8;color:#294c54;font:12px var(--sans);border-radius:3px}.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{border-color:#138397;box-shadow:0 0 0 2px rgba(19,131,151,.1)}.checks label{color:#52666b}.consent{color:#52666b}.consent a{color:#087b8b}.form-button{background:#087b8b}.form-note{color:#728084}
footer{background:#fff;border-color:#d6e4e5;color:#52666b}.footer-brand .brand-logo{width:160px;max-height:45px}
@media(max-width:650px){.brand-logo{width:153px;max-height:45px}.assortment.section{padding:52px 5% 58px}.assortment-grid h3{font-size:18px}.hero h1{font-size:clamp(39px,10.5vw,53px)}.hero-wash{background:linear-gradient(180deg,rgba(251,240,215,0) 0%,rgba(251,240,215,.12) 22%,rgba(251,240,215,.86) 42%,#fbf0d7 56%,#fbf0d7 100%)}}

/* Responsive review: close the hero-to-benefits seam and keep subjects in frame. */
.hero-photo{object-position:center 20%}
.pillars{margin:0;padding-top:30px;padding-bottom:30px}
.pillars article{align-items:center}
.pillars article>div{align-self:center}
.partner-card:nth-child(1)>img{object-position:center 0%}
.partner-card:nth-child(2)>img{object-position:center 0%}
.partner-card:nth-child(3)>img{object-position:center 0%}
.contact-photo>img{object-position:36% 0%}
@media(max-width:650px){
  .hero-photo{object-position:center 20%}
  .partner-card:nth-child(1)>img{object-position:35% 20%}
  .partner-card:nth-child(2)>img{object-position:50% 20%}
  .partner-card:nth-child(3)>img{object-position:32% 20%}
  .contact-photo>img{object-position:36% 0%}
  .pillars{padding-top:25px;padding-bottom:25px}
}


/* Rebalance the hero portrait on wide desktop canvases. */
@media (min-width:1600px){
  .hero-photo{object-position:center 25%}
}


/* Raise faces in the wide partner-card crops while keeping headroom. */
@media (min-width:651px){
  .partner-card:nth-child(1)>img{object-position:center 24%}
  .partner-card:nth-child(2)>img{object-position:center 24%}
  .partner-card:nth-child(3)>img{object-position:center 24%}
}


/* Restrained movement and soft transitions for a more considered feel. */
.hero-content{animation:hero-copy-enter .85s cubic-bezier(.2,.7,.2,1) both}
@keyframes hero-copy-enter{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.partner-card{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease,border-color .35s ease}
.partner-card:hover{transform:translateY(-3px);border-color:#5d9eaa;box-shadow:0 14px 30px rgba(18,63,73,.1)}
.button{transition:background-color .25s ease,transform .25s ease,box-shadow .25s ease}
.button:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(8,95,112,.16)}
.has-scroll-reveal .scroll-reveal{opacity:0;transform:translate3d(0,18px,0);transition:opacity .75s cubic-bezier(.2,.7,.2,1),transform .75s cubic-bezier(.2,.7,.2,1);transition-delay:var(--reveal-delay,0ms)}
.has-scroll-reveal .scroll-reveal.is-visible{opacity:1;transform:translate3d(0,0,0)}
@media(max-width:650px){.has-scroll-reveal .scroll-reveal{transform:translate3d(0,12px,0)}}
@media(prefers-reduced-motion:reduce){.hero-content{animation:none!important}.partner-card,.button{transition:none!important}.partner-card:hover,.button:hover{transform:none;box-shadow:none}.has-scroll-reveal .scroll-reveal,.has-scroll-reveal .scroll-reveal.is-visible{opacity:1!important;transform:none!important;transition:none!important}}


/* Give the contact form heading a clearer pause before the first field. */
.contact-content h2{margin-bottom:28px}
@media(max-width:650px){.contact-content h2{margin-bottom:22px}}


/* Preserve the card lift after its scroll reveal has completed. */
.has-scroll-reveal .partner-card.scroll-reveal{transition:opacity .75s cubic-bezier(.2,.7,.2,1),transform .75s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease,border-color .35s ease}
.has-scroll-reveal .partner-card.scroll-reveal.is-visible:hover{transform:translateY(-3px);border-color:#5d9eaa;box-shadow:0 14px 30px rgba(18,63,73,.1)}


/* Keep the hero face higher at common wide desktop viewport widths. */
@media (min-width:1300px){.hero-photo{object-position:center 33%}}
@media (min-width:2200px){.hero-photo{object-position:center 28%}}

/* Add clearer breathing room between benefit and partner-card headings and copy. */
.pillars h2{margin-bottom:9px}
.partner-card h3{margin-bottom:14px}
.partner-section .section-heading{margin-bottom:38px}
@media(max-width:650px){
  .partner-section .section-heading{margin-bottom:28px}
}


/* Clear, single-state confirmation after a successful partner enquiry. */
.form-success[hidden]{display:none!important}
.form-success{margin-top:22px;padding:clamp(26px,4vw,42px);background:linear-gradient(145deg,#fffdf8 0%,#f2f8f7 100%);border:1px solid #bfd4d8;border-top:4px solid #087b8b;border-radius:8px;box-shadow:0 16px 40px rgba(7,95,112,.08);animation:success-arrive .45s ease both}
.form-success-mark{display:grid;place-items:center;width:48px;height:48px;margin-bottom:20px;border-radius:50%;background:#e1f0ed;color:#087b8b;font:600 26px/1 var(--sans);box-shadow:inset 0 0 0 1px rgba(8,123,139,.12)}
.form-success-eyebrow{margin:0 0 8px;color:#087b8b;font:600 11px/1.4 'Roboto Condensed',var(--sans);letter-spacing:.16em;text-transform:uppercase}
.form-success h3{margin:0 0 14px;color:#075f70;font:600 clamp(25px,2.5vw,34px)/1.2 'Roboto Slab',Georgia,serif;letter-spacing:-.025em}
.form-success-message{max-width:540px;margin:0;color:#52666b;font:16px/1.75 var(--sans)}
@keyframes success-arrive{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.form-success{animation:none}}


/* Make the post-submission confirmation unmistakable at desktop and mobile sizes. */
.form-success{min-height:340px;display:flex;flex-direction:column;justify-content:center;padding:clamp(34px,6vw,72px)}
.form-success-mark{width:64px;height:64px;margin-bottom:26px;font-size:32px}
.form-success-eyebrow{font-size:15px;line-height:1.5;margin-bottom:12px}
.form-success h3{font-size:clamp(36px,4.2vw,50px);line-height:1.14;margin-bottom:20px}
.form-success-message{max-width:600px;font-size:clamp(20px,2vw,24px);line-height:1.65}
@media(max-width:650px){.form-success{min-height:300px;padding:32px 24px}.form-success h3{font-size:clamp(32px,9vw,40px)}.form-success-message{font-size:19px}}
