:root {
  --ink: #0b0c0d;
  --panel: #121416;
  --muted: #9ca2a8;
  --line: #2a2d30;
  --gold: #d7a84b;
  --gold2: #f0cf7a;
  --white: #f7f7f4;
  --max: 1180px;
}

.trust-section {
  padding-top: 30px;
}

.trust-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.trust-card {
  min-height: 270px;
  padding: 30px 26px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: #101214;
}

.trust-card span {
  color: var(--gold);
  font: 600 14px Oswald, Arial, sans-serif;
}

.trust-card h3 {
  margin: 62px 0 14px;
  font-size: 27px;
}

.trust-card p,
.brand-disclaimer,
.about-grid p {
  color: var(--muted);
}

.brands-section {
  background: #0e0f11;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.brand-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.brand-grid span {
  min-height: 82px;
  display: flex;
  align-items: center;
  padding: 18px 22px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  color: #e5e6e3;
  font: 500 19px Oswald, Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: .025em;
}

.brand-disclaimer {
  max-width: 850px;
  margin: 22px 0 0;
  font-size: 12px;
}

.about-strip {
  padding: 86px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: linear-gradient(110deg, #141719, #0b0c0d 68%);
}

.about-grid {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 90px;
  align-items: start;
}

.about-grid h2 {
  margin-top: 16px;
  font-size: clamp(42px, 6vw, 72px);
}

.about-grid p {
  margin: 0 0 18px;
  font-size: 17px;
}

.text-link {
  display: inline-flex;
  gap: 10px;
  margin-top: 12px;
  color: var(--gold2);
  font-weight: 700;
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.form-note a {
  color: var(--gold2);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.form-status {
  padding: 11px 13px;
  border-left: 2px solid var(--gold);
  background: #151719;
  color: #dfe1df;
}

.form-status[data-state="success"] {
  border-color: #49cf77;
  color: #bde9c7;
}

.form-status[data-state="error"] {
  border-color: #d56a5d;
  color: #ffd0ca;
}

.footer-columns {
  display: grid;
  grid-template-columns: 1.7fr repeat(3, 1fr);
  gap: 46px;
}

.footer-columns > div {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.footer-columns strong {
  color: #e6e7e4;
  margin-bottom: 5px;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 12px;
}

.footer-columns a:hover {
  color: var(--gold2);
}

.footer-columns p {
  margin: 0;
}

.footer-brand {
  color: #d9dcdd;
  font-weight: 800;
  letter-spacing: .03em;
}

.whatsapp-float {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 20;
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 9px 16px 9px 9px;
  color: #07120b;
  background: #25d366;
  border: 1px solid #4be182;
  box-shadow: 0 14px 36px rgba(0, 0, 0, .34);
  font-size: 13px;
}

.whatsapp-float img {
  width: 32px;
  height: 32px;
  display: block;
  object-fit: cover;
  border-radius: 50%;
}

/* Restrained motion system */
@view-transition {
  navigation: auto;
}

::view-transition-old(root) {
  animation: page-out 180ms ease both;
}

::view-transition-new(root) {
  animation: page-in 300ms ease both;
}

@keyframes page-out {
  to {
    opacity: 0;
    transform: translateY(-4px);
  }
}

@keyframes page-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
}

@keyframes content-in {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
}

.inner-page .page-hero .shell {
  animation: content-in .65s cubic-bezier(.22, 1, .36, 1) both;
}

.inner-page .page-content > .shell {
  animation: content-in .65s cubic-bezier(.22, 1, .36, 1) 100ms both;
}

.motion-ready .hero-inner > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .7s cubic-bezier(.22, 1, .36, 1), transform .7s cubic-bezier(.22, 1, .36, 1);
}

.motion-ready.motion-loaded .hero-inner > * {
  opacity: 1;
  transform: none;
}

.motion-ready .hero-inner > :nth-child(2) {
  transition-delay: 80ms;
}

.motion-ready .hero-inner > :nth-child(3) {
  transition-delay: 150ms;
}

.motion-ready .hero-inner > :nth-child(4) {
  transition-delay: 220ms;
}

.motion-ready .reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .7s cubic-bezier(.22, 1, .36, 1), transform .7s cubic-bezier(.22, 1, .36, 1);
}

.motion-ready .reveal.is-visible {
  opacity: 1;
  transform: none;
}

.motion-ready .whatsapp-float {
  opacity: 0;
  transform: translateY(14px) scale(.96);
  transition: opacity .45s ease .35s, transform .45s cubic-bezier(.22, 1, .36, 1) .35s, box-shadow .2s ease;
}

.motion-ready.motion-loaded .whatsapp-float {
  opacity: 1;
  transform: none;
}

@media (hover: hover) {
  .trust-card,
  .step,
  .brand-grid span,
  .info-card {
    transition: transform .25s ease, background-color .25s ease, border-color .25s ease;
  }

  .trust-card:hover,
  .step:hover,
  .info-card:hover {
    transform: translateY(-5px);
  }

  .brand-grid span:hover {
    transform: translateY(-3px);
    border-color: rgba(215, 168, 75, .62);
  }

  .motion-ready.motion-loaded .whatsapp-float:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 42px rgba(0, 0, 0, .42);
    transition-delay: 0s;
  }
}

/* Shared internal-page layout */
.inner-page {
  margin: 0;
  background: var(--ink);
  color: var(--white);
  font-family: Manrope, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.65;
}

.inner-page *,
.inner-page *::before,
.inner-page *::after {
  box-sizing: border-box;
}

.inner-page a {
  color: inherit;
  text-decoration: none;
}

.inner-page .shell {
  width: min(var(--max), calc(100% - 40px));
  margin: auto;
}

.inner-page .nav {
  min-height: 88px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.inner-page .brand {
  display: flex;
  align-items: center;
  gap: 14px;
  font-weight: 800;
  letter-spacing: .04em;
}

.inner-page .brand-logo {
  width: 66px;
  height: 58px;
  object-fit: contain;
}

.inner-page .brand small {
  display: block;
  color: var(--muted);
  font-size: 10px;
  letter-spacing: .18em;
}

.inner-page .links {
  display: flex;
  align-items: center;
  gap: 24px;
  color: #c9ccce;
  font-size: 14px;
}

.inner-page .links a:hover {
  color: var(--gold2);
}

.inner-page .nav-cta {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  padding: 0 18px;
  color: #13110b;
  background: var(--gold);
  font-weight: 800;
}

.page-hero {
  padding: 100px 0 72px;
  border-top: 1px solid #202326;
  border-bottom: 1px solid var(--line);
  background: radial-gradient(circle at 82% 18%, rgba(215, 168, 75, .13), transparent 28%), linear-gradient(135deg, #121416, #090a0b);
}

.page-hero .kicker,
.inner-page .kicker {
  color: var(--gold);
  text-transform: uppercase;
  letter-spacing: .18em;
  font-size: 13px;
  font-weight: 800;
}

.page-hero h1,
.inner-page h2,
.inner-page h3 {
  margin: 0;
  font-family: Oswald, Arial, sans-serif;
  text-transform: uppercase;
  line-height: 1;
}

.page-hero h1 {
  max-width: 900px;
  margin-top: 20px;
  font-size: clamp(54px, 8vw, 96px);
}

.page-hero p {
  max-width: 720px;
  margin: 28px 0 0;
  color: #b9bec2;
  font-size: 18px;
}

.page-content {
  padding: 84px 0 110px;
}

.policy-layout {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 74px;
}

.policy-aside {
  align-self: start;
  position: sticky;
  top: 26px;
  padding: 24px;
  border: 1px solid var(--line);
  background: #101214;
}

.policy-aside strong {
  display: block;
  margin-bottom: 10px;
  color: var(--gold2);
  text-transform: uppercase;
  letter-spacing: .1em;
  font-size: 12px;
}

.policy-aside p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.policy-copy {
  max-width: 780px;
}

.policy-copy h2 {
  margin: 50px 0 16px;
  font-size: 31px;
}

.policy-copy h2:first-child {
  margin-top: 0;
}

.policy-copy p,
.policy-copy li {
  color: #b7bcc0;
}

.policy-copy ul {
  padding-left: 22px;
}

.policy-copy a,
.contact-panel a {
  color: var(--gold2);
}

.info-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
}

.info-card {
  min-height: 250px;
  padding: 32px;
  background: #101214;
}

.info-card h3 {
  margin: 34px 0 14px;
  font-size: 27px;
}

.info-card p {
  color: var(--muted);
}

.contact-panel {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border: 1px solid var(--line);
}

.contact-panel > div {
  padding: 46px;
}

.contact-panel > div + div {
  border-left: 1px solid var(--line);
  background: #101214;
}

.contact-panel h2 {
  margin-bottom: 22px;
  font-size: 38px;
}

.contact-panel p {
  color: var(--muted);
}

.inner-page footer {
  padding: 34px 0;
  border-top: 1px solid var(--line);
  color: #858b90;
  font-size: 13px;
}

@media (max-width: 1050px) {
  .trust-grid,
  .brand-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .footer-columns {
    grid-template-columns: repeat(2, 1fr);
  }

  .inner-page .links a:not(.nav-cta) {
    display: none;
  }
}

@media (max-width: 760px) {
  .about-grid,
  .policy-layout,
  .contact-panel,
  .info-grid {
    grid-template-columns: 1fr;
  }

  .policy-aside {
    position: static;
  }

  .contact-panel > div + div {
    border-left: 0;
    border-top: 1px solid var(--line);
  }

  .whatsapp-float b {
    display: none;
  }

  .whatsapp-float {
    padding-right: 9px;
  }
}

@media (max-width: 1120px) {
  body:not(.inner-page) .links a:not(.nav-cta) {
    display: none;
  }
}

@media (max-width: 560px) {
  .trust-grid,
  .brand-grid,
  .form-row,
  .footer-columns {
    grid-template-columns: 1fr;
  }

  .trust-card {
    min-height: 220px;
  }

  .trust-card h3 {
    margin-top: 38px;
  }

  .about-grid {
    gap: 34px;
  }

  .inner-page .shell {
    width: min(100% - 28px, var(--max));
  }

  .inner-page .brand span:last-child {
    font-size: 12px;
  }

  .inner-page .brand-logo {
    width: 54px;
    height: 48px;
  }

  .page-hero {
    padding: 72px 0 54px;
  }

  .page-content {
    padding: 58px 0 80px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }

  .whatsapp-float {
    transition: none;
  }
}


/* Refined trade enquiry contact layout */
.contact-copy-refined .contact-intro{margin-bottom:30px}
.contact-info-grid{display:grid;grid-template-columns:1fr;gap:14px;margin:0 0 14px}
.contact-info-card{min-width:0;padding:22px 22px 20px;border:1px solid #2d3135;background:linear-gradient(145deg,#151719,#111315)}
.contact-card-label{display:block;margin-bottom:17px;color:#d7a84b;font-size:11px;font-weight:800;letter-spacing:.17em;text-transform:uppercase}
.contact-list.compact{gap:14px}
.contact-list.compact .contact-line{grid-template-columns:110px minmax(0,1fr);gap:14px}
.contact-list.compact .contact-line span{font-size:10px}
.contact-list.compact .contact-line a,.contact-list.compact .contact-line b{font-size:13px;line-height:1.45;white-space:nowrap;overflow-wrap:normal}
.direct-contact-card{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'label label' 'name email' 'role email';align-items:center;column-gap:24px;row-gap:6px;border-top:2px solid #d7a84b}
.founder-name{font-family:Oswald,Arial,sans-serif;font-size:28px;line-height:1;text-transform:uppercase;letter-spacing:.01em;color:#f7f7f4}
.founder-role{margin-top:7px;color:#8f969b;font-size:11px;text-transform:uppercase;letter-spacing:.14em}
.direct-email{margin-top:22px;color:#d8dbdc;font-size:13px;font-weight:600;overflow-wrap:anywhere}
.direct-email:hover{color:#f0cf7a}
.whatsapp-contact-btn{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;padding:15px 18px;border:1px solid #34383c;background:#0d0f10;transition:.2s}
.whatsapp-contact-btn>span:first-child{color:#d7a84b;font-size:10px;text-transform:uppercase;letter-spacing:.15em;font-weight:800}
.whatsapp-contact-btn strong{font-size:14px;color:#f2f2ef}
.whatsapp-contact-btn .arrow{color:#d7a84b}
.whatsapp-contact-btn:hover{border-color:#d7a84b;background:#141617;transform:translateY(-1px)}
@media(max-width:1080px){.contact-info-grid{grid-template-columns:1fr}.direct-contact-card{min-height:155px}}
@media(max-width:560px){.contact-info-card{padding:20px 18px}.contact-list.compact .contact-line{grid-template-columns:1fr;gap:4px}.whatsapp-contact-btn{grid-template-columns:1fr auto}.whatsapp-contact-btn>span:first-child{grid-column:1/-1}.founder-name{font-size:26px}}

.direct-contact-card .contact-card-label{grid-area:label;margin-bottom:10px}
.direct-contact-card .founder-name{grid-area:name}
.direct-contact-card .founder-role{grid-area:role;margin-top:0}
.direct-contact-card .direct-email{grid-area:email;margin-top:0;justify-self:end}
@media(max-width:720px){
  .direct-contact-card{display:flex;flex-direction:column;align-items:flex-start}
  .direct-contact-card .direct-email{margin-top:18px;justify-self:auto}
}

.coffee-note{margin-top:26px;padding:30px 18px 8px;border-top:1px solid #24282b;text-align:center;display:flex;min-height:180px;flex-direction:column;justify-content:center;align-items:center}
.coffee-note strong{display:block;font-family:Oswald,Arial,sans-serif;font-size:30px;font-weight:600;line-height:1.28;text-transform:uppercase;letter-spacing:.015em;color:#f7f7f4}
.coffee-note span{display:block;margin-top:18px;font-family:Oswald,Arial,sans-serif;font-size:30px;font-weight:600;line-height:1.28;text-transform:uppercase;letter-spacing:.015em;color:#f7f7f4}
.coffee-note em{font-style:normal;color:#d7a84b;font-weight:600}
@media(max-width:560px){.coffee-note{min-height:150px;padding:24px 10px 6px}.coffee-note strong,.coffee-note span{font-size:26px;line-height:1.32}.coffee-note span{margin-top:16px}}


/* Mobile navigation */
.nav{position:relative}
.mobile-menu{display:none;width:46px;height:42px;padding:9px;border:1px solid #34383c;background:#111315;color:#f7f7f4;align-items:center;justify-content:center;flex-direction:column;gap:5px}
.mobile-menu span{display:block;width:22px;height:2px;background:currentColor;transition:transform .22s ease,opacity .22s ease}
.mobile-menu[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.mobile-menu[aria-expanded="true"] span:nth-child(2){opacity:0}
.mobile-menu[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-nav{display:grid;position:fixed;top:88px;right:0;left:auto;z-index:60;width:min(380px,calc(100vw - 28px));max-height:calc(100dvh - 88px);overflow-y:auto;padding:12px;border:1px solid #2a2d30;border-right:0;background:rgba(13,15,16,.985);box-shadow:-20px 20px 42px rgba(0,0,0,.38);transform:translateX(105%);visibility:hidden;pointer-events:none;transition:transform .28s cubic-bezier(.22,1,.36,1),visibility 0s linear .28s}
.mobile-nav.is-open{transform:translateX(0);visibility:visible;pointer-events:auto;transition:transform .28s cubic-bezier(.22,1,.36,1)}
.mobile-nav a{min-height:48px;display:flex;align-items:center;padding:0 14px;border-bottom:1px solid #24282b;color:#d9dcdd;font-size:14px;font-weight:600}
.mobile-nav a:hover{color:#f0cf7a}
.mobile-nav a:last-child{border-bottom:0}
.mobile-nav .mobile-nav-cta{margin-top:10px;justify-content:space-between;border:1px solid #d7a84b;background:#d7a84b;color:#13110b;font-weight:800}
.mobile-nav .mobile-nav-cta:hover{background:#f0cf7a;color:#13110b}
@media(max-width:1120px){
  body:not(.inner-page) .links,
  .inner-page .links{display:none}
  .mobile-menu{display:flex}
}
@media(min-width:1121px){.mobile-nav{display:none!important}}
@media(max-width:560px){
  .mobile-menu{width:42px;height:40px}
  .mobile-nav{top:76px;right:0;left:auto;width:min(340px,calc(100vw - 18px));max-height:calc(100dvh - 76px)}
}


/* Optimized hero image sources */
.hero:before{
  background:linear-gradient(90deg,rgba(8,9,10,.98) 0%,rgba(8,9,10,.9) 43%,rgba(8,9,10,.32) 76%,rgba(8,9,10,.72) 100%),url('hero-parts.webp') center/cover no-repeat;
}
@supports (background-image: image-set(url("x.avif") type("image/avif"))){
  .hero:before{
    background:linear-gradient(90deg,rgba(8,9,10,.98) 0%,rgba(8,9,10,.9) 43%,rgba(8,9,10,.32) 76%,rgba(8,9,10,.72) 100%),image-set(url('hero-parts.avif') type('image/avif'),url('hero-parts.webp') type('image/webp')) center/cover no-repeat;
  }
}
@media(max-width:880px){
  .hero:before{
    background:linear-gradient(90deg,rgba(8,9,10,.97),rgba(8,9,10,.75)),url('hero-parts.webp') center/cover no-repeat;
  }
  @supports (background-image: image-set(url("x.avif") type("image/avif"))){
    .hero:before{
      background:linear-gradient(90deg,rgba(8,9,10,.97),rgba(8,9,10,.75)),image-set(url('hero-parts.avif') type('image/avif'),url('hero-parts.webp') type('image/webp')) center/cover no-repeat;
    }
  }
}


/* Animated brand gear */
.brand-logo-mark{
  position:relative;
  flex:0 0 auto;
  width:66px;
  height:58px;
  display:block;
  filter:drop-shadow(0 0 7px rgba(215,168,75,.2));
}
.brand-logo-layer{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
}
.brand-logo-layer img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  user-select:none;
  pointer-events:none;
}
.brand-logo-gear{
  z-index:1;
  transform-origin:50% 50%;
  animation:brand-gear-spin 14s linear infinite;
  will-change:transform;
}
.brand-logo-center{z-index:2}
@keyframes brand-gear-spin{
  to{transform:rotate(360deg)}
}
@media(max-width:560px){
  .brand-logo-mark{width:54px;height:48px}
}
@media(prefers-reduced-motion:reduce){
  .brand-logo-gear{animation:none}
}