@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/brand-1.ttf) format('truetype');
}
@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(assets/fonts/brand-2.ttf) format('truetype');
}
@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(assets/fonts/brand-3.ttf) format('truetype');
}
@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(assets/fonts/brand-4.ttf) format('truetype');
}
@font-face {
  font-family: 'Russo One';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/brand-5.ttf) format('truetype');
}

/* Logo-led typography and palette. Shared by home and service pages. */
:root{--ink:#000;--paper:#f0f5f6;--blue:#5BA9C1;--brand-red:#DE263A;--brand-blue:#5BA9C1;--line:#283238;font-family:'Barlow',Arial,sans-serif}
body{font-family:'Barlow',Arial,sans-serif;background:#000;color:#f0f5f6}
h1,h2,h3,.hero-copy h1,.showcase-card h3,.contact h2{font-family:'Russo One',Arial,sans-serif;font-weight:400;letter-spacing:-.025em}
button,input,select,textarea{font-family:'Barlow',Arial,sans-serif}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--brand-red);outline-offset:4px}
::selection{background:var(--brand-red);color:#fff}
.landing,.header{background:#000}
.header{border-bottom:1px solid #253239;position:relative}
.header::after{content:'';position:absolute;bottom:-1px;left:var(--gutter);width:70px;height:3px;background:var(--brand-red);box-shadow:70px 0 var(--brand-blue)}
.hero-copy h1{font-size:clamp(2.3rem,4.45vw,5.1rem);line-height:1.08;text-transform:uppercase;letter-spacing:-.035em}
.hero-copy h1 .hero-precision{color:var(--brand-blue)}
.hero-copy h1>span:last-child{color:var(--brand-red)}
.hero-copy>p{font-size:1.0625rem;color:#c6d1d6}
.hero-copy .hero-coverage{font-weight:600;color:var(--brand-blue);letter-spacing:.025em}
.button,.service-contact{font-family:'Barlow',Arial,sans-serif;font-weight:700;letter-spacing:.035em;border-radius:2px;background:var(--brand-blue);color:#000;transition:background .2s,color .2s,border-color .2s}
.button:hover,.service-contact:hover{background:#83c3d6;color:#000;text-decoration:none}
.hero-actions .hero-contact{background:transparent;color:#fff;border-color:var(--brand-red)}
.hero-actions .hero-contact:hover{background:var(--brand-red);border-color:var(--brand-red);color:#fff}
.coffee-hero-image{border-radius:2px}
.work,.service-folder.is-open{background:var(--paper);color:#101820}
.service-folder{background:#dce7eb;border-color:#b9cdd4}
.accordion-gallery .service-folder>button{background:#dce7eb;color:#24343c}
.accordion-gallery .service-folder>button span{font-family:'Barlow',Arial,sans-serif;font-weight:700;letter-spacing:.065em;text-transform:uppercase}
.accordion-gallery .service-folder>button[aria-selected=true],.accordion-gallery .service-folder>button[aria-selected=true]:hover{background:var(--brand-red);color:#fff}
.accordion-gallery .service-folder>button:hover{background:#c4dbe3}
.showcase-copy h3{font-size:clamp(1.5rem,2.5vw,2.8rem);line-height:1.12}
.showcase-copy .showcase-lead{font-family:'Barlow',Arial,sans-serif;font-weight:700}
.showcase-copy>p{color:#344951}
.service-details li{border-color:#c5d5db}
.service-details li::before{color:var(--brand-red)}
.service-contact{border-left:3px solid var(--brand-red)}
.coffee-service-art{background:#e4eef1;color:#14232b;border-top:3px solid var(--brand-blue)}
.coffee-art-label{color:#243f4b}
.contact{background:var(--brand-blue);color:#071219}
.contact h2{font-size:clamp(2.1rem,4.7vw,4.75rem);line-height:1.1;letter-spacing:-.035em}
.contact h2>span{color:#fff}
.contact-layout>div:first-child>p{font-size:1.1rem}
.form-intro{color:#132f39}
.inquiry-form label{font-weight:700;letter-spacing:.025em}
.inquiry-form input,.inquiry-form select,.inquiry-form textarea{background:#f1f7f9;color:#071219;border:1px solid #37788c;border-radius:2px;font-size:1rem}
.inquiry-form input:focus,.inquiry-form select:focus,.inquiry-form textarea:focus{border-color:var(--brand-red)}
.inquiry-form textarea::placeholder{color:#526971;opacity:1}
.inquiry-submit,.inquiry-submit:disabled{background:#10252d;color:#fff;opacity:1;border-radius:2px;border-left:3px solid var(--brand-red);font-family:'Barlow',Arial,sans-serif;font-weight:600}
.contact-footer{border-top-color:#37788c;color:#10252d}
.contact-footer p{font-weight:500}
.contact-footer>a:last-child{font-weight:700}
body:has(.detail-header){background:var(--paper);color:#101820}
.detail-header{background:#000;color:#fff;border-bottom:3px solid var(--brand-red)}
.detail-header>a:last-child{border-color:var(--brand-blue);font-weight:600}
.detail-intro h1{font-family:'Russo One',Arial,sans-serif;font-size:clamp(2rem,4.2vw,4.5rem);line-height:1.1;letter-spacing:-.025em}
.back-link,.coverage{color:#245d70;font-weight:600}
.capabilities article{border-top-color:var(--brand-red)}
.capabilities h2,.project-start h2{font-family:'Russo One',Arial,sans-serif;font-weight:400}
.detail-footer{background:var(--brand-blue);color:#071219}
.text-link{text-decoration:underline;text-decoration-color:var(--brand-red);text-underline-offset:6px}
@media(max-width:900px){.mobile-service-tabs{border-color:#b9cdd4}.mobile-service-tabs button{font-family:'Barlow',Arial,sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.mobile-service-tabs button[aria-selected=true]{border-color:var(--brand-red);color:#18262d}.mobile-service-tabs button:focus-visible{outline-color:var(--brand-red)}}
@media(max-width:650px){.hero-copy h1{font-size:clamp(1.7rem,7.5vw,2.8rem);line-height:1.12}.hero-copy>p{font-size:.95rem}.hero-copy .hero-coverage{font-size:.875rem}.showcase-copy h3{font-size:1.4rem}.contact h2{font-size:clamp(1.8rem,7.5vw,2.65rem)}.contact-layout>div:first-child>p{font-size:1rem}.inquiry-form label{letter-spacing:0}.header::after{width:48px;box-shadow:48px 0 var(--brand-blue)}}
@media(prefers-reduced-motion:reduce){.button,.service-contact{transition:none}}
