/* Shared type and spacing for product categories and procurement services. */
body.page.br-service-ui main{font-family:var(--ui-font);font-size:17px;line-height:1.75}
body.page.br-service-ui main .wrap{
  width:min(1176px,calc(100% - 64px));
  max-width:none;
  padding-inline:0;
}
body.page.br-service-ui main>section.wrap{padding-top:56px;padding-bottom:48px;column-gap:48px}
body.page.br-service-ui main>section:not(.wrap){padding-block:76px;scroll-margin-top:110px}
body.page.br-service-ui main h1{
  font-size:clamp(40px,4.4vw,56px);
  font-weight:700;
  line-height:1.15;
  letter-spacing:-.025em;
  margin:20px 0;
  overflow-wrap:break-word;
}
body.page.br-service-ui main h2{font-size:28px;line-height:1.3;letter-spacing:-.02em;margin:20px 0 16px}
body.page.br-service-ui main>section:not(.wrap) h2{
  font-size:clamp(32px,3.3vw,46px);
  line-height:1.2;
  letter-spacing:-.025em;
  margin:18px 0 22px;
}
body.page.br-service-ui main h3{font-size:24px;font-weight:600;line-height:1.35;letter-spacing:-.02em;margin-bottom:12px}
body.page.br-service-ui main .eyebrow{font-size:12px;line-height:1.6;letter-spacing:.1em}
body.page.br-service-ui main p{font-size:17px;line-height:1.75;margin-bottom:18px}
body.page.br-service-ui main li{font-size:16px;line-height:1.75}
body.page.br-service-ui main dd{font-size:16px;line-height:1.75}
body.page.br-service-ui main [class$="-deck"]{font-size:18px;line-height:1.75;margin-bottom:24px}
body.page.br-service-ui main [class$="-section-head"]{gap:32px;margin-bottom:32px}
body.page.br-service-ui main [class$="-section-head"] h2{margin-bottom:0}
body.page.br-service-ui main [class$="-section-head"]>p{font-size:16px;line-height:1.75;margin:0}

/* Card descriptions stay slightly smaller than the narrative introduction. */
body.page.br-service-ui main article{padding:24px;min-width:0}
body.page.br-service-ui main article p,
body.page.br-service-ui main article li,
body.page.br-service-ui main :is(.pricing-process,.qc-process,.ship-collection-steps,.label-process,.dev-process,.buy-process,.visit-itinerary,.why-process) p{
  font-size:16px;
  line-height:1.75;
}
body.page.br-service-ui main article>p:last-child{margin-bottom:0}
body.page.br-service-ui main :is(.cat-range-grid,.cat-guide-grid,.cat-plan-grid,.pricing-plan-grid,.pricing-cost-grid,.qc-plan-grid,.qc-check-grid,.qc-scope-grid,.ship-packing-grid,.ship-cost-grid,.ship-plan-grid,.label-brand-grid,.label-pack-grid,.label-cost-grid,.label-plan-grid,.dev-scope-grid,.dev-sample-grid,.dev-cost-grid,.dev-plan-grid,.buy-factory-grid,.buy-order-grid,.buy-plan-grid,.visit-arrival-grid,.visit-results-grid,.visit-fee-grid,.why-knowledge-grid,.why-plan-grid){gap:24px}
body.page.br-service-ui main :is(.cat-brief,.qc-brief,.ship-route-card,.label-brief,.dev-brief,.buy-brief,.visit-summary,.why-proof-panel){padding:28px;min-width:0}
body.page.br-service-ui main :is(.cat-brief,.qc-brief,.ship-route-card,.label-brief,.dev-brief,.buy-brief,.visit-summary) p{font-size:16px;line-height:1.75}
body.page.br-service-ui main [class$="-contact-card"]{padding:24px}
body.page.br-service-ui main :is(.cat-plan-grid>article,.pricing-plan,.qc-plan,.ship-plan,.label-plan,.dev-plan,.buy-plan,.visit-fee-card,.why-plan){padding:28px}
body.page.br-service-ui main :is(.cat-plan-grid,.pricing-plan,.qc-plan,.ship-plan,.label-plan,.dev-plan,.buy-plan,.visit-fee-card,.why-plan) h3{
  font-size:26px;
  line-height:1.35;
  margin:24px 0 16px;
}
body.page.br-service-ui main .cat-guide{padding:24px}
body.page.br-service-ui main .cat-guide h3{font-size:22px;line-height:1.4;letter-spacing:-.01em;margin:16px 0 24px}
body.page.br-service-ui main .cat-guide-type{font-size:12px;line-height:1.5;letter-spacing:.06em}
body.page.br-service-ui main .cat-guide-read{font-size:14px;line-height:1.65}
body.page.br-service-ui main .cat-back{font-size:14px;line-height:1.65;margin-bottom:28px}

/* Supporting copy has one readable scale; prices and experience figures keep their own sizes. */
body.page.br-service-ui main p:is([class$="-location"],[class$="-small"],[class$="-note"]),
body.page.br-service-ui main .pricing-selector>p,
body.page.br-service-ui main .why-proof-panel p,
body.page.br-service-ui main .why-proof-panel dd,
body.page.br-service-ui main .visit-summary>p,
body.page.br-service-ui main .cat-guide-note{font-size:14px;line-height:1.65}
body.page.br-service-ui main [class$="-contact-card"] p{font-size:16px;line-height:1.75}
body.page.br-service-ui main :is(.cat-checks,.qc-record-list,.ship-documents-grid,.label-checks-grid,.dev-tooling-list,.dev-handover-grid,.why-scope-list) dt{
  font-size:17px;line-height:1.5;font-weight:600;margin-bottom:8px;
}
body.page.br-service-ui main nav:is([class$="-jumps"],.cat-siblings){gap:8px 24px;font-size:14px;line-height:1.65;padding-block:16px}
body.page.br-service-ui main nav:is([class$="-jumps"],.cat-siblings) a{display:inline-flex;align-items:center;min-height:44px;font-size:14px;line-height:1.65;padding-block:8px}
body.page.br-service-ui main .cat-siblings>span{font-size:12px;line-height:1.6}
body.page.br-service-ui main details{padding-block:20px}
body.page.br-service-ui main summary{font-size:17px;font-weight:500;line-height:1.65}
body.page.br-service-ui main details p{font-size:16px;line-height:1.75;margin:12px 0 0}

body.page.br-service-ui main table{font-size:15px;line-height:1.6}
body.page.br-service-ui main :is(th,td){font-size:inherit;line-height:1.6;padding:14px 16px;vertical-align:top}
body.page.br-service-ui main table :is(p,li){font-size:inherit;line-height:inherit}
body.page.br-service-ui main caption{font-size:14px;line-height:1.65;padding:14px 16px}
body.page.br-service-ui main :is(.pricing-table-scroll,.qc-product-table,.ship-table-scroll,.label-table-scroll,.dev-table-scroll,.buy-table-scroll){max-width:100%;overflow-x:auto}

@media(max-width:1000px){
  body.page.br-service-ui main>section.wrap{grid-template-columns:minmax(0,1fr);gap:28px}
}
@media(max-width:720px){
  body.page.br-service-ui main .wrap{width:calc(100% - 40px)}
  body.page.br-service-ui main{font-size:16px}
  body.page.br-service-ui main>section.wrap{padding-top:36px;padding-bottom:36px}
  body.page.br-service-ui main>section:not(.wrap){padding-block:50px;scroll-margin-top:96px}
  body.page.br-service-ui main h1{font-size:36px;line-height:1.2}
  body.page.br-service-ui main h2{font-size:24px}
  body.page.br-service-ui main>section:not(.wrap) h2{font-size:32px;line-height:1.25}
  body.page.br-service-ui main h3{font-size:22px}
  body.page.br-service-ui main .eyebrow{font-size:11px}
  body.page.br-service-ui main p{font-size:16px;margin-bottom:16px}
  body.page.br-service-ui main [class$="-deck"]{font-size:16px}
  body.page.br-service-ui main [class$="-section-head"]{gap:16px;margin-bottom:24px}
  body.page.br-service-ui main [class$="-section-head"]>p{margin-top:16px}
  body.page.br-service-ui main article,
  body.page.br-service-ui main .cat-guide,
  body.page.br-service-ui main [class$="-contact-card"],
  body.page.br-service-ui main :is(.cat-brief,.qc-brief,.ship-route-card,.label-brief,.dev-brief,.buy-brief,.visit-summary,.why-proof-panel){padding:20px}
  body.page.br-service-ui main :is(.cat-plan-grid>article,.pricing-plan,.qc-plan,.ship-plan,.label-plan,.dev-plan,.buy-plan,.visit-fee-card,.why-plan){padding:20px}
  body.page.br-service-ui main :is(.cat-plan-grid,.pricing-plan,.qc-plan,.ship-plan,.label-plan,.dev-plan,.buy-plan,.visit-fee-card,.why-plan) h3{font-size:24px}
  body.page.br-service-ui main .cat-guide h3{font-size:20px;margin:14px 0 20px}
  body.page.br-service-ui main .cat-guide-type{font-size:11px}
  body.page.br-service-ui main :is(.cat-range-grid,.cat-guide-grid,.cat-plan-grid,.pricing-plan-grid,.pricing-cost-grid,.qc-plan-grid,.qc-check-grid,.qc-scope-grid,.ship-packing-grid,.ship-cost-grid,.ship-plan-grid,.label-brand-grid,.label-pack-grid,.label-cost-grid,.label-plan-grid,.dev-scope-grid,.dev-sample-grid,.dev-cost-grid,.dev-plan-grid,.buy-factory-grid,.buy-order-grid,.buy-plan-grid,.visit-arrival-grid,.visit-results-grid,.visit-fee-grid,.why-knowledge-grid,.why-plan-grid){gap:16px}
  body.page.br-service-ui main summary{font-size:16px}
  body.page.br-service-ui main table{font-size:14px}
  body.page.br-service-ui main :is(th,td){padding:12px}
  body.page.br-service-ui main .btn{white-space:normal;text-align:left}
}
@media(max-width:360px){
  body.page.br-service-ui main .wrap{width:calc(100% - 32px)}
}