    *,
    *::before,
    *::after {
      box-sizing: border-box;
      margin: 0;
      padding: 0
    }

    :root {
      --dk: #000000;
      --dk2: #080808;
      --dk3: #0e0e0e;
      --dks: #141414;
      --dks2: #1c1c1c;
      --dkb: #1e1e1e;
      --dkb2: #2a2a2a;
      --dkt1: #f0f0f0;
      --dkt2: #888;
      --dkt3: #8a8a8a;
      --lt: #ffffff;
      --lt2: #f6f6f6;
      --lt3: #eeeeee;
      --ltb: #e0e0e0;
      --ltb2: #ccc;
      --ltt1: #111;
      --ltt2: #555;
      --ltt3: #717171;
      --accent: #F5C518;
      --a2: #c9a000;
    }

    html {
      scroll-behavior: smooth
    }

    /* anchor offset: clear the fixed header + sticky sub-nav on in-page jumps */
    :target,
    section[id] {
      scroll-margin-top: 120px
    }

    /* keyboard focus visibility (WCAG 2.4.7) */
    a:focus-visible,
    button:focus-visible,
    input:focus-visible,
    select:focus-visible,
    textarea:focus-visible,
    .ham:focus-visible,
    [tabindex]:focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: 2px;
      border-radius: 2px
    }

    body {
      background: var(--dk);
      color: var(--dkt1);
      font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
      font-size: 1rem;
      overflow-x: hidden;
      padding-bottom: 56px
    }

    /* ── FADE-IN ── */
    .fi {
      opacity: 0;
      transform: translateY(20px);
      transition: opacity .65s ease, transform .65s ease
    }

    .fi.vis {
      opacity: 1;
      transform: none
    }

    .d1 {
      transition-delay: .1s
    }

    .d2 {
      transition-delay: .2s
    }

    .d3 {
      transition-delay: .3s
    }

    .d4 {
      transition-delay: .4s
    }

    .d5 {
      transition-delay: .5s
    }

    /* ── LAYOUT ── */
    .wrap {
      max-width: 1280px;
      margin: 0 auto;
      padding: 0 20px
    }

    .sec {
      padding: 72px 20px
    }

    /* ── EYEBROWS & HEADINGS ── */
    .ey-d {
      font-size: 0.6875rem;
      letter-spacing: .28em;
      text-transform: uppercase;
      color: var(--dkt3);
      margin-bottom: 10px
    }

    .ey-d::before {
      content: '— ';
      color: var(--accent)
    }

    .sh-d {
      font-size: clamp(1.625rem, 6vw, 3.25rem);
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: .02em;
      line-height: 1.04;
      color: var(--dkt1);
      margin-bottom: 36px
    }

    .ey-l {
      font-size: 0.6875rem;
      letter-spacing: .28em;
      text-transform: uppercase;
      color: var(--ltt3);
      margin-bottom: 10px
    }

    .ey-l::before {
      content: '— ';
      color: var(--a2)
    }

    .sh-l {
      font-size: clamp(1.625rem, 6vw, 3.25rem);
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: .02em;
      line-height: 1.04;
      color: var(--ltt1);
      margin-bottom: 36px
    }

    /* ── BUTTONS ── */
    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      height: 52px;
      padding: 0 36px;
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .18em;
      text-transform: uppercase;
      text-decoration: none;
      border: none;
      cursor: pointer;
      transition: all .22s
    }

    .btn-y {
      background: var(--accent);
      color: #000
    }

    .btn-y:hover {
      background: var(--a2)
    }

    .btn-od {
      background: transparent;
      color: var(--dkt1);
      border: 1px solid rgba(255, 255, 255, .3)
    }

    .btn-od:hover {
      border-color: var(--accent);
      color: var(--accent)
    }

    .btn-ol {
      background: transparent;
      color: var(--ltt1);
      border: 2px solid var(--ltt1)
    }

    .btn-ol:hover {
      background: var(--ltt1);
      color: #fff
    }

    .sec-cta {
      text-align: center;
      margin-top: 36px
    }

    .sec-cta-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      height: 48px;
      padding: 0 32px;
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .18em;
      text-transform: uppercase;
      text-decoration: none;
      border: 1.5px solid var(--accent);
      color: var(--accent);
      background: transparent;
      transition: all .25s
    }

    .sec-cta-btn:hover {
      background: var(--accent);
      color: #000
    }

    /* ── HEADER ── */
    .hdr {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 100;
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: 60px;
      padding: 0 20px;
      background: rgba(0, 0, 0, .85);
      backdrop-filter: blur(10px);
      border-bottom: 1px solid var(--dkb);
      transition: all .3s
    }

    .hdr.lite {
      background: rgba(255, 255, 255, .96);
      border-bottom-color: var(--ltb);
      border-bottom-width: 2px
    }

    .logo {
      font-size: 0.9375rem;
      font-weight: 900;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--dkt1);
      text-decoration: none;
      transition: color .2s
    }

    .hdr.lite .logo {
      color: var(--ltt1)
    }

    .logo em {
      color: var(--accent);
      font-style: normal
    }

    .hdr-r {
      display: flex;
      align-items: center;
      gap: 16px
    }

    .hdr-icon {
      color: rgba(255, 255, 255, .6);
      text-decoration: none;
      font-size: 1.125rem;
      transition: opacity .2s;
      opacity: .85
    }

    .hdr.lite .hdr-icon {
      opacity: .7
    }

    .hdr-icon:hover {
      opacity: 1
    }

    .ham {
      background: none;
      border: none;
      cursor: pointer;
      display: flex;
      flex-direction: column;
      gap: 5px;
      padding: 4px
    }

    .ham span {
      display: block;
      width: 24px;
      height: 2px;
      background: var(--dkt1);
      transition: all .3s
    }

    .hdr.lite .ham span {
      background: var(--ltt1)
    }

    /* DRAWER */
    .drawer {
      position: fixed;
      top: 0;
      right: -100%;
      bottom: 0;
      width: min(300px, 88vw);
      z-index: 200;
      background: var(--dk2);
      border-left: 1px solid var(--dkb);
      transition: right .35s ease;
      display: flex;
      flex-direction: column;
      overflow: hidden
    }

    .drawer.open {
      right: 0
    }

    .scrim {
      position: fixed;
      inset: 0;
      z-index: 190;
      background: rgba(0, 0, 0, .6);
      opacity: 0;
      pointer-events: none;
      transition: opacity .3s
    }

    .scrim.on {
      opacity: 1;
      pointer-events: auto
    }

    .d-hdr {
      display: flex;
      align-items: center;
      padding: 0 16px;
      height: 54px;
      border-bottom: 1px solid var(--dkb);
      flex-shrink: 0
    }

    .d-hdr-logo {
      font-size: 0.8125rem;
      font-weight: 900;
      letter-spacing: .15em;
      color: var(--dkt1)
    }

    .drawer-close {
      background: none;
      border: 1px solid var(--dkb2);
      border-radius: 4px;
      cursor: pointer;
      color: var(--dkt2);
      font-size: 0.8125rem;
      width: 30px;
      height: 30px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-left: auto;
      flex-shrink: 0
    }

    .d-lang-row {
      padding: 11px 16px;
      border-bottom: 1px solid var(--dkb);
      display: flex;
      align-items: center;
      gap: 10px;
      flex-shrink: 0
    }

    .d-lang {
      display: inline-flex;
      height: 26px;
      border: 1.5px solid var(--dkb2);
      border-radius: 4px;
      overflow: hidden;
      opacity: .42
    }

    .d-lang-btn {
      height: 100%;
      padding: 0 9px;
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .1em;
      color: var(--dkt3);
      display: flex;
      align-items: center;
      cursor: default
    }

    .d-lang-btn.active {
      background: var(--dks);
      color: var(--dkt2)
    }

    .d-lang-sep {
      width: 1px;
      background: var(--dkb2)
    }

    .d-lang-badge {
      font-size: 0.625rem;
      font-weight: 700;
      background: var(--dks);
      color: var(--dkt3);
      border-radius: 2px;
      padding: 2px 5px;
      letter-spacing: .08em;
      border: 1px solid var(--dkb)
    }

    .d-lang-note {
      font-size: 0.6875rem;
      color: var(--dkt3)
    }

    .d-nav {
      flex: 1;
      overflow-y: auto
    }

    .d-nav-item {
      display: flex;
      align-items: center;
      height: 52px;
      padding: 0 16px;
      border-bottom: 1px solid var(--dkb);
      cursor: pointer;
      user-select: none
    }

    .d-nav-item.current {
      border-left: 3px solid var(--accent);
      padding-left: 13px;
      background: rgba(255, 255, 255, .015)
    }

    .d-nav-item.open {
      background: rgba(255, 255, 255, .02)
    }

    .d-nav-label {
      font-size: 0.75rem;
      font-weight: 800;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--dkt2);
      flex: 1;
      text-decoration: none
    }

    .d-nav-item.current .d-nav-label {
      color: var(--dkt1)
    }

    .d-chevron {
      font-size: 0.6875rem;
      color: var(--dkt3);
      transition: transform .25s
    }

    .d-nav-item.open .d-chevron {
      transform: rotate(180deg)
    }

    .d-sub {
      max-height: 0;
      overflow: hidden;
      transition: max-height .3s ease
    }

    .d-sub.open {
      max-height: 400px
    }

    .d-sub-row {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 12px 16px;
      border-bottom: 1px solid rgba(255, 255, 255, .04);
      text-decoration: none
    }

    .d-sub-dash {
      width: 12px;
      height: 1px;
      background: var(--dkt3);
      flex-shrink: 0
    }

    .d-sub-label {
      font-size: 0.6875rem;
      color: var(--dkt3);
      letter-spacing: .08em
    }

    .d-footer {
      border-top: 1px solid var(--dkb);
      padding: 14px 16px;
      flex-shrink: 0
    }

    .d-sns {
      display: flex;
      gap: 12px;
      margin-bottom: 12px
    }

    .d-sns-btn {
      font-size: 0.75rem;
      font-weight: 700;
      color: var(--dkt3);
      border: 1px solid var(--dkb2);
      border-radius: 3px;
      padding: 4px 10px;
      text-decoration: none
    }

    .d-contact-txt {
      font-size: 0.6875rem;
      color: var(--dkt3);
      line-height: 2
    }

    /* ── ICONS ── */
    .ic-phone {
      width: 20px;
      height: 20px;
      vertical-align: middle;
      filter: none !important;
      flex-shrink: 0
    }

    .ic-messenger {
      width: 20px;
      height: 20px;
      vertical-align: middle;
      filter: none !important;
      flex-shrink: 0
    }

    .ic-clock {
      width: 20px;
      height: 20px;
      vertical-align: middle;
      filter: none !important;
      flex-shrink: 0
    }

    .ic-envelope {
      width: 18px;
      height: 18px;
      filter: none !important
    }

    .s-ic .ic-phone,
    .s-ic .ic-envelope {
      width: 18px;
      height: 18px;
      filter: none !important
    }

    /* ── DESKTOP HEADER ── */
    .hdr-nav {
      display: none
    }

    .hdr-phone {
      display: none
    }

    .lang-tog {
      display: none
    }

    .hdr-messenger {
      display: none
    }

    /* ── STICKY BAR ── */
    .sticky {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      z-index: 90;
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      height: 56px;
      background: var(--dk2);
      border-top: 1px solid var(--dkb)
    }

    .s-btn {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 3px;
      text-decoration: none;
      color: var(--dkt2);
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .2em;
      text-transform: uppercase;
      border-right: 1px solid var(--dkb);
      transition: background .2s, color .2s
    }

    .s-btn:last-child {
      border-right: none
    }

    .s-btn:hover,
    .s-btn.hi {
      background: var(--accent);
      color: #000
    }

    .s-ic {
      font-size: 1rem
    }

    /* ── PAGE HERO ── */
    .page-hero {
      position: relative;
      min-height: 260px;
      display: flex;
      align-items: flex-end;
      overflow: hidden;
      padding-top: 60px
    }

    .page-hero-bg {
      position: absolute;
      inset: 0;
      background-image: url('../images/faq-hero.jpg');
      background-size: cover;
      background-position: center 42%;
      transform-origin: center
    }

    .page-hero-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(90deg, rgba(0, 0, 0, .82) 0%, rgba(0, 0, 0, .5) 60%, rgba(0, 0, 0, .3) 100%),
        linear-gradient(180deg, rgba(0, 0, 0, .3) 0%, rgba(0, 0, 0, .7) 100%)
    }

    .page-hero-content {
      position: relative;
      z-index: 2;
      width: 100%;
      padding: 36px 20px 44px
    }

    .breadcrumb {
      font-size: 0.6875rem;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: rgba(255, 255, 255, .4);
      margin-bottom: 10px
    }

    .breadcrumb span {
      color: rgba(255, 255, 255, .7)
    }

    .page-title {
      font-size: clamp(2.25rem, 10vw, 4.5rem);
      font-weight: 900;
      letter-spacing: .03em;
      color: #fff;
      text-transform: uppercase;
      line-height: 1;
      margin-bottom: 10px;
      text-shadow: 0 2px 20px rgba(0, 0, 0, .7)
    }

    .page-sub {
      font-size: 0.6875rem;
      color: rgba(255, 255, 255, .45);
      letter-spacing: .1em;
      text-transform: uppercase
    }

    /* ── SUB-NAV ── */
    .sub-nav {
      position: sticky;
      top: 60px;
      z-index: 90;
      background: var(--dk);
      border-bottom: 2px solid var(--dkb2);
      overflow-x: auto;
      -webkit-overflow-scrolling: touch
    }

    .sub-nav::-webkit-scrollbar {
      display: none
    }

    .sub-nav-inner {
      display: flex;
      white-space: nowrap;
      padding: 0 20px
    }

    .sub-nav-item {
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--dkt3);
      padding: 14px 16px;
      display: block;
      text-decoration: none;
      border-bottom: 2px solid transparent;
      margin-bottom: -2px;
      white-space: nowrap;
      transition: color .2s, border-color .2s;
      flex-shrink: 0
    }

    .sub-nav-item:hover {
      color: var(--dkt2)
    }

    .sub-nav-item.active {
      color: var(--dkt1);
      border-bottom-color: var(--accent)
    }

    /* ── CARRY INTRO ── */
    .carry-intro {
      font-size: 0.9375rem;
      color: var(--dkt2);
      line-height: 1.75;
      max-width: 760px;
      margin-bottom: 28px
    }

    .carry-intro strong {
      color: var(--accent)
    }

    /* ── CUSTOM & UPHOLSTERY — LIGHT ── */
    .custom-svc-sec {
      background: var(--lt);
      padding: 72px 20px;
      border-top: 3px solid var(--ltt1)
    }

    .custom-svc-lead {
      font-size: 0.9375rem;
      color: var(--ltt2);
      line-height: 1.75;
      max-width: 760px;
      margin-bottom: 40px
    }

    .custom-svc-grid {
      display: grid;
      gap: 20px
    }

    .custom-svc-pair {}

    .custom-svc-img-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 3px;
      margin-bottom: 10px
    }

    .custom-svc-half {
      position: relative;
      overflow: hidden
    }

    .custom-svc-half img {
      width: 100%;
      aspect-ratio: 4/3;
      object-fit: cover;
      display: block
    }

    .custom-svc-label {
      position: absolute;
      top: 8px;
      left: 8px;
      z-index: 2;
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .16em;
      text-transform: uppercase;
      background: rgba(0, 0, 0, .75);
      color: rgba(255, 255, 255, .85);
      padding: 3px 8px
    }

    .custom-svc-label.after {
      background: var(--accent);
      color: #000
    }

    .custom-svc-caption {
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .1em;
      text-transform: uppercase;
      color: var(--ltt2)
    }

    /* ── YAHOO AUCTIONS — DARK ── */
    .yahoo-sec {
      background: var(--dk3);
      padding: 72px 20px;
      border-top: 3px solid var(--accent)
    }


    .yahoo-fee-badge {
      display: inline-block;
      background: var(--accent);
      color: #000;
      font-size: 0.875rem;
      font-weight: 900;
      letter-spacing: .1em;
      text-transform: uppercase;
      padding: 10px 22px;
      margin-bottom: 32px
    }

    .yahoo-fee-badge small {
      display: block;
      font-size: 0.75rem;
      font-weight: 400;
      color: rgba(0, 0, 0, .6);
      letter-spacing: .06em;
      margin-top: 2px
    }

    .yahoo-steps {
      margin-bottom: 32px
    }

    .yahoo-step {
      padding: 28px 0;
      border-bottom: 1px solid var(--dkb)
    }

    .yahoo-step:last-of-type {
      border-bottom: none
    }

    .yahoo-step-header {
      display: flex;
      align-items: center;
      gap: 14px;
      margin-bottom: 16px
    }

    .yahoo-step-num {
      flex-shrink: 0;
      width: 38px;
      height: 38px;
      background: var(--accent);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0.875rem;
      font-weight: 900;
      color: #000
    }

    .yahoo-step-title {
      font-size: 0.9375rem;
      font-weight: 700;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--dkt1);
      margin: 0
    }

    .yahoo-step-content {
      display: flex;
      flex-direction: column;
      gap: 14px
    }

    .yahoo-step-desc {
      font-size: 0.8125rem;
      color: var(--dkt2);
      line-height: 1.65
    }

    .yahoo-step-desc strong {
      color: var(--dkt1);
      font-weight: 700
    }

    .yahoo-step-img {
      width: 100%;
      height: 200px;
      background: var(--dks);
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      font-size: 0.6875rem;
      color: var(--dkt3);
      letter-spacing: .06em;
      text-align: center;
      line-height: 1.5;
      margin-top: 2px
    }

    .yahoo-step-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block
    }

    .yahoo-info-panel {
      margin-top: 8px
    }

    .yahoo-info-label {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: var(--dkt3);
      margin-bottom: 18px;
      padding-bottom: 12px;
      border-bottom: 1px solid var(--dkb)
    }

    .yahoo-info-label svg {
      width: 22px;
      height: 22px;
      flex-shrink: 0;
      stroke: var(--accent);
      stroke-width: 2
    }

    .yahoo-info-row {
      display: flex;
      gap: 14px;
      padding: 14px 0;
      border-bottom: 1px solid var(--dkb);
      align-items: flex-start
    }

    .yahoo-info-row:last-of-type {
      border-bottom: none
    }

    .yahoo-info-key {
      font-size: 0.75rem;
      font-weight: 700;
      color: var(--dkt3);
      letter-spacing: .1em;
      text-transform: uppercase;
      width: 96px;
      flex-shrink: 0;
      padding-top: 2px
    }

    .yahoo-info-val {
      font-size: 0.8125rem;
      color: var(--dkt2);
      line-height: 1.65
    }

    /* ── WHAT WE CARRY — DARK ── */
    .carry-sec {
      background: var(--dk2);
      padding: 72px 20px
    }

    .carry-note {
      font-size: 0.8125rem;
      color: var(--dkt3);
      line-height: 1.65;
      margin-bottom: 32px;
      padding-bottom: 24px;
      border-bottom: 1px solid var(--dkb)
    }

    .carry-note strong {
      color: var(--accent)
    }

    .carry-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 14px
    }

    .carry-card {
      overflow: hidden;
      display: block;
      background: var(--dks)
    }

    .carry-img {
      position: relative;
      padding-top: 65%;
      overflow: hidden;
      background: var(--dks2)
    }

    .carry-img img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover
    }

    .carry-body {
      padding: 14px 16px 18px
    }

    .carry-tag {
      display: block;
      width: fit-content;
      font-size: 0.625rem;
      font-weight: 700;
      letter-spacing: .14em;
      text-transform: uppercase;
      padding: 3px 8px;
      margin-bottom: 8px
    }

    .carry-tag.in-stock {
      background: var(--accent);
      color: #000
    }

    .carry-tag.to-order {
      background: rgba(255, 255, 255, .12);
      color: rgba(255, 255, 255, .6)
    }

    .carry-brand {
      display: block;
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: var(--accent);
      margin-bottom: 4px
    }

    .carry-name {
      font-size: 0.75rem;
      font-weight: 700;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--dkt1);
      line-height: 1.3;
      margin-bottom: 0
    }

    /* ── INTRO — DARK ── */
    .intro-sec {
      background: var(--dk3);
      padding: 72px 20px
    }

    .intro-lead {
      font-size: 0.9375rem;
      color: var(--dkt2);
      line-height: 1.8;
      max-width: 760px
    }

    /* ── GALLERY — DARK ── */
    .gallery-sec {
      background: var(--dk);
      padding: 72px 20px;
      border-top: 1px solid var(--dkb)
    }

    .gcards {
      display: grid;
      gap: 24px
    }

    .gcard {
      background: var(--dks);
      border: 1px solid var(--dkb);
      overflow: hidden
    }

    .gcard-imgs {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 2px
    }

    .ghalf {
      position: relative
    }

    .ghalf img {
      width: 100%;
      aspect-ratio: 4/3;
      object-fit: cover;
      display: block
    }

    .gcard.no-before .ghalf-after {
      grid-column: 1 / -1
    }

    .gcard.no-before .ghalf-after img {
      aspect-ratio: 2/1
    }

    .glbl {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 4px 0;
      text-align: center;
      font-size: 0.625rem;
      font-weight: 700;
      letter-spacing: .2em
    }

    .glbl-b {
      background: rgba(0, 0, 0, .65);
      color: var(--dkt2)
    }

    .glbl-a {
      background: var(--accent);
      color: #000
    }

    .gthumbs {
      display: flex;
      gap: 6px;
      padding: 10px 12px 0;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch
    }

    .gthumb {
      flex-shrink: 0;
      width: 84px;
      height: 56px;
      padding: 0;
      border: 1px solid var(--dkb2);
      background: none;
      cursor: pointer;
      position: relative
    }

    .gthumb img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block
    }

    .gthumb.selected {
      border: 2px solid var(--accent)
    }

    .gthumb-lbl {
      position: absolute;
      top: 2px;
      left: 2px;
      font-size: 0.5rem;
      font-weight: 700;
      letter-spacing: .1em;
      padding: 1px 5px
    }

    .gthumb-lbl.b {
      background: rgba(0, 0, 0, .75);
      color: var(--dkt2)
    }

    .gthumb-lbl.a {
      background: var(--accent);
      color: #000
    }

    .gcard-body {
      padding: 16px 18px 20px
    }

    .sample-tag {
      display: inline-block;
      background: #a33;
      color: #fff;
      font-size: 0.625rem;
      font-weight: 700;
      letter-spacing: .14em;
      padding: 3px 9px;
      margin-bottom: 8px
    }

    .gcard-t {
      font-size: 0.8125rem;
      font-weight: 700;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--dkt1);
      line-height: 1.4
    }

    .gcard-d {
      font-size: 0.8125rem;
      color: var(--dkt2);
      line-height: 1.65;
      margin-top: 8px
    }

    .gpag {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      margin-top: 36px
    }

    .gpag-btn {
      width: 38px;
      height: 38px;
      border: 1.5px solid var(--dkb2);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0.75rem;
      font-weight: 700;
      color: var(--dkt3)
    }

    .gpag-btn.current {
      background: var(--accent);
      color: #000;
      border-color: var(--accent)
    }

    .gpag-note {
      margin-top: 12px;
      font-size: 0.6875rem;
      color: var(--dkt3);
      text-align: center;
      letter-spacing: .04em
    }

    /* ── ORDER & PAYMENT — LIGHT ── */
    .order-sec {
      background: var(--lt2);
      padding: 72px 20px;
      border-top: 3px solid var(--ltt1)
    }

    .order-sec .wrap {
      padding-left: 0;
      padding-right: 0
    }

    .order-steps {
      margin-bottom: 48px
    }

    .order-step {
      padding: 28px 0;
      border-bottom: 1px solid var(--ltb)
    }

    .order-step:last-of-type {
      border-bottom: none
    }

    /* step header: number badge + title */
    .order-step-header {
      display: flex;
      align-items: center;
      gap: 14px;
      margin-bottom: 16px
    }

    .order-step-num {
      flex-shrink: 0;
      width: 40px;
      height: 40px;
      background: var(--ltt1);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0.9375rem;
      font-weight: 900;
      color: var(--accent)
    }

    .order-step-title {
      font-size: 0.9375rem;
      font-weight: 700;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--ltt1);
      margin: 0
    }

    /* step content: image + description */
    .order-step-content {
      display: flex;
      flex-direction: column;
      gap: 14px
    }

    .order-step-img {
      width: 100%;
      height: 200px;
      background: var(--lt3);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0.6875rem;
      color: var(--ltt3);
      letter-spacing: .06em;
      text-align: center;
      line-height: 1.5;
      overflow: hidden
    }

    .order-step-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block
    }

    .order-step-desc {
      font-size: 0.8125rem;
      color: var(--ltt2);
      line-height: 1.65
    }

    /* service details block (below steps) */
    .service-details {
      margin-top: 8px
    }

    .service-details-lbl {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: var(--ltt3);
      margin-bottom: 18px;
      padding-bottom: 12px;
      border-bottom: 2px solid var(--ltt1)
    }

    .service-details-lbl svg {
      width: 22px;
      height: 22px;
      flex-shrink: 0;
      stroke: var(--accent);
      stroke-width: 2
    }

    .payment-block {
      background: var(--ltt1);
      padding: 28px 24px
    }

    .payment-label {
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .22em;
      text-transform: uppercase;
      color: var(--accent);
      margin-bottom: 20px
    }

    .payment-grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: 10px;
      margin-bottom: 16px
    }

    .payment-item {
      background: var(--dks);
      border: 1px solid var(--dkb2);
      padding: 14px 16px;
      display: flex;
      align-items: center;
      gap: 12px
    }

    .payment-icon {
      flex-shrink: 0;
      width: 48px;
      height: 48px;
      border-radius: 50%;
      background: rgba(245, 197, 24, .08);
      border: 1.5px solid rgba(245, 197, 24, .45);
      display: flex;
      align-items: center;
      justify-content: center
    }

    .payment-icon img,
    .payment-icon .payment-svg {
      width: 24px;
      height: 24px;
      display: block
    }

    .payment-name {
      font-size: 0.75rem;
      font-weight: 700;
      letter-spacing: .06em;
      color: var(--dkt1)
    }

    .payment-note {
      font-size: 0.6875rem;
      color: var(--dkt3);
      letter-spacing: .04em;
      margin-top: 2px
    }

    .payment-caveat {
      font-size: 0.75rem;
      color: var(--dkt3);
      line-height: 1.65;
      padding-top: 14px;
      border-top: 1px solid var(--dkb)
    }

    /* ── CONTACT CTA — lightweight ── */
    .cta-sec {
      background: var(--dk2);
      padding: 72px 20px;
      text-align: center;
      border-top: 1px solid var(--dkb)
    }

    .cta-lead {
      font-size: 0.8125rem;
      color: var(--dkt2);
      letter-spacing: .06em;
      margin-bottom: 28px;
      line-height: 1.65
    }

    .cta-btns {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 12px
    }

    .cta-divider {
      display: none
    }

    .cta-divider-line {
      flex: 1;
      height: 1px;
      background: var(--dkb2)
    }

    .cta-divider-txt {
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .2em;
      color: var(--dkt3)
    }

    .btn-call {
      background: transparent;
      color: #fff;
      border: 1.5px solid var(--accent)
    }

    .btn-call:hover {
      background: var(--accent);
      color: #000
    }

    .btn-messenger {
      background: transparent;
      color: #fff;
      border: 1.5px solid #1877F2
    }

    .btn-messenger:hover {
      background: #1877F2
    }

    .btn-inquiry {
      background: transparent;
      color: #fff;
      border: 1.5px solid rgba(255, 255, 255, .45)
    }

    .btn-inquiry:hover {
      background: #fff;
      border-color: #fff;
      color: #000
    }

    .btn-inquiry:hover img {
      filter: brightness(0)
    }

    .btn-call:hover .ic-phone {
      filter: brightness(0) !important
    }

    .cta-btns .btn {
      width: 100%;
      justify-content: center
    }

    /* ── FIND US — DARK (shared) ── */
    .findus-sec {
      background: var(--dk2);
      padding: 64px 20px;
      border-top: 1px solid var(--dkb)
    }

    .findus-grid {
      display: grid;
      gap: 28px
    }

    .fi-info dt {
      font-size: 0.625rem;
      letter-spacing: .22em;
      text-transform: uppercase;
      color: var(--dkt3);
      margin-bottom: 4px
    }

    .fi-info dd {
      font-size: 0.875rem;
      color: var(--dkt1);
      line-height: 1.65;
      margin-bottom: 20px
    }

    .fi-info dd a {
      color: inherit;
      text-decoration: none;
      transition: color .2s
    }

    .fi-info dd a:hover {
      color: var(--accent)
    }

    .fi-contact-row {
      display: flex;
      flex-direction: column;
      gap: 6px
    }

    .map-ph {
      width: 100%;
      padding-top: 65%;
      background: var(--dks);
      border: 1px solid var(--dkb);
      position: relative;
      overflow: hidden;
      min-height: 240px
    }

    .map-ph span {
      position: absolute;
      inset: 0;
      display: block
    }

    .map-ph iframe {
      width: 100%;
      height: 100%;
      border: 0;
      display: block
    }

    @media(min-width:600px) {
      .map-ph {
        padding-top: 55%;
        min-height: 0
      }
    }

    @media(min-width:1024px) {
      .findus-grid {
        grid-template-columns: 1fr 1fr;
        gap: 48px;
        align-items: start
      }

      .fi-contact-row {
        flex-direction: row;
        align-items: center;
        gap: 0
      }

      .fi-contact-row span+span::before {
        content: ' / ';
        padding: 0 8px;
        color: var(--dkt3)
      }
    }

    /* ── ABOUT: lead facts ── */
    .about-facts {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 22px
    }

    .about-fact {
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .1em;
      text-transform: uppercase;
      color: var(--dkt2);
      border: 1px solid var(--dkb2);
      border-radius: 4px;
      padding: 8px 14px
    }

    /* ── ABOUT: The Shop ── */
    .shop-sec {
      background: var(--dk);
      padding: 72px 20px;
      border-top: 1px solid var(--dkb)
    }

    .shop-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
      margin-top: 28px
    }

    .shop-photo {
      overflow: hidden;
      background: var(--dks)
    }

    .shop-photo img {
      width: 100%;
      aspect-ratio: 4/3;
      object-fit: cover;
      display: block
    }

    .shop-photo.wide {
      grid-column: 1 / -1
    }

    .shop-photo.wide img {
      aspect-ratio: 2/1
    }

    /* ── ABOUT: Visit Us ── */
    .visit-sec {
      background: var(--dk3);
      padding: 72px 20px;
      border-top: 1px solid var(--dkb)
    }

    .way {
      margin-top: 44px
    }

    .way-title {
      font-size: 0.875rem;
      font-weight: 700;
      letter-spacing: .1em;
      text-transform: uppercase;
      color: var(--dkt1);
      margin-bottom: 4px
    }

    .way-sub {
      font-size: 0.8125rem;
      color: var(--dkt2);
      margin-bottom: 18px
    }

    .way-steps {
      display: grid;
      gap: 16px
    }

    .way-img {
      position: relative;
      width: 100%;
      aspect-ratio: 3/4;
      overflow: hidden;
      background: var(--dks);
      border: 1px solid var(--dkb)
    }

    .way-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block
    }

    .way-num {
      position: absolute;
      top: 8px;
      left: 8px;
      width: 26px;
      height: 26px;
      background: var(--accent);
      color: #000;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0.75rem;
      font-weight: 900
    }

    .way-cap {
      font-size: 0.8125rem;
      color: var(--dkt2);
      line-height: 1.6;
      margin-top: 10px
    }

    .visit-detail {
      margin-top: 32px;
      display: grid;
      gap: 16px
    }

    .vd-row {
      display: flex;
      gap: 12px;
      align-items: flex-start
    }

    .vd-ico {
      flex-shrink: 0;
      width: 34px;
      height: 34px;
      border: 1px solid var(--dkb2);
      border-radius: 6px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 15px
    }

    .vd-label {
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--dkt1);
      margin-bottom: 4px
    }

    .vd-text {
      font-size: 0.8125rem;
      color: var(--dkt2);
      line-height: 1.6
    }

    /* ── ABOUT: Community ── */
    .comm-sec {
      background: var(--dk);
      padding: 72px 20px;
      border-top: 1px solid var(--dkb)
    }

    .comm-feature {
      margin-top: 28px;
      margin-bottom: 10px;
      text-align: center
    }

    .comm-feature img {
      width: 100%;
      max-width: 440px;
      aspect-ratio: 1;
      object-fit: contain;
      border: 1px solid var(--dkb);
      background: #f3f3f3
    }

    .comm-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px
    }

    .comm-cell {
      overflow: hidden;
      background: var(--dks)
    }

    .comm-cell img {
      width: 100%;
      aspect-ratio: 1;
      object-fit: cover;
      display: block
    }

    .comm-fb {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      height: 48px;
      padding: 0 26px;
      background: #1877F2;
      color: #fff;
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .14em;
      text-transform: uppercase;
      text-decoration: none
    }

    /* ── ANTI-COUNTERFEIT ── */
    .anti-sec {
      background: var(--dk2);
      padding: 80px 24px;
      border-top: 1px solid var(--dkb);
      border-bottom: 3px solid var(--accent)
    }

    .anti-inner {
      max-width: 960px;
      margin: 0 auto;
      text-align: center
    }

    .anti-badge {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      background: var(--accent);
      color: #000;
      font-size: 0.75rem;
      font-weight: 700;
      letter-spacing: .22em;
      text-transform: uppercase;
      padding: 8px 22px;
      margin-bottom: 20px
    }

    .anti-h {
      font-size: clamp(1.625rem, 5.5vw, 2.875rem);
      font-weight: 900;
      text-transform: uppercase;
      letter-spacing: .03em;
      color: var(--dkt1);
      line-height: 1.05;
      margin-bottom: 16px
    }

    .anti-h em {
      color: var(--accent);
      font-style: normal
    }

    .anti-lead {
      font-size: 0.875rem;
      color: var(--dkt2);
      line-height: 1.75;
      max-width: 580px;
      margin: 0 auto 48px
    }

    .anti-grid {
      display: grid;
      gap: 1px;
      text-align: left
    }

    .anti-point {
      background: var(--dks);
      padding: 28px 24px;
      position: relative;
      overflow: hidden
    }

    .anti-pi {
      font-size: 1.75rem;
      margin-bottom: 14px;
      display: block
    }

    .anti-pt {
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: var(--accent);
      margin-bottom: 10px
    }

    .anti-pd {
      font-size: 0.8125rem;
      color: var(--dkt2);
      line-height: 1.65
    }

    /* ── INSTAGRAM ── */
    .ig-sec {
      background: var(--lt);
      padding: 72px 20px
    }

    .ig-hdr {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      margin-bottom: 24px;
      flex-wrap: wrap;
      gap: 14px
    }

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

    .ig-item {
      display: block;
      aspect-ratio: 1;
      overflow: hidden
    }

    .ig-item img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: transform .35s ease
    }

    .ig-item:hover img {
      transform: scale(1.04)
    }

    /* ── FOOTER ── */
    .footer {
      background: var(--dk);
      padding: 48px 24px 32px;
      border-top: 1px solid var(--dkb)
    }

    .f-inner {
      max-width: 1280px;
      margin: 0 auto
    }

    .f-logo {
      font-size: 0.875rem;
      font-weight: 900;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--dkt1);
      text-decoration: none;
      display: block;
      margin-bottom: 10px
    }

    .f-logo em {
      color: var(--accent);
      font-style: normal
    }

    .f-tag {
      font-size: 0.6875rem;
      letter-spacing: .22em;
      text-transform: uppercase;
      color: var(--dkt3);
      margin-bottom: 36px
    }

    .f-grid {
      display: grid;
      gap: 32px;
      margin-bottom: 40px
    }

    .f-col h3 {
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .26em;
      text-transform: uppercase;
      color: var(--accent);
      margin-bottom: 14px
    }

    .f-list {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 10px
    }

    .f-list a {
      font-size: 0.75rem;
      color: var(--dkt2);
      text-decoration: none;
      letter-spacing: .08em;
      transition: color .2s
    }

    .f-list a:hover {
      color: var(--accent)
    }

    .f-sns-row {
      display: flex;
      gap: 14px;
      align-items: center;
      margin-top: 4px
    }

    .f-sns-row a {
      display: flex;
      align-items: center;
      opacity: .85;
      transition: opacity .2s
    }

    .f-sns-row a:hover {
      opacity: 1
    }

    .f-sns-icon {
      width: 26px;
      height: 26px;
      filter: none !important;
      display: block
    }

    .f-sns-icon.fb {
      border-radius: 50%
    }

    .f-sns-icon.yt {
      width: 30px;
      height: 26px;
      border-radius: 6px
    }

    .f-info {
      font-size: 0.8125rem;
      color: var(--dkt2);
      line-height: 1.75
    }

    .f-hours-lbl {
      font-size: 0.6875rem;
      font-weight: 700;
      letter-spacing: .22em;
      text-transform: uppercase;
      color: var(--accent);
      margin-top: 10px;
      margin-bottom: 4px
    }

    .f-btm {
      border-top: 1px solid var(--dkb);
      padding-top: 24px;
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 8px
    }

    .f-copy {
      font-size: 0.6875rem;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--dkt3)
    }


    /* ════════════════════════════════════
       RESPONSIVE — TABLET 600px+
    ════════════════════════════════════ */
    @media(min-width:600px) {
      .ig-grid {
        grid-template-columns: repeat(6, 1fr)
      }

      .anti-grid {
        grid-template-columns: repeat(3, 1fr)
      }

      .carry-grid {
        grid-template-columns: repeat(3, 1fr)
      }

      .payment-grid {
        grid-template-columns: repeat(3, 1fr)
      }
    }

    /* ════════════════════════════════════
       RESPONSIVE — DESKTOP 1024px+
    ════════════════════════════════════ */
    @media(min-width:1024px) {
      body {
        padding-bottom: 0
      }

      .sticky {
        display: none
      }

      .ham {
        display: none
      }

      .hdr-icon {
        display: none
      }

      .hdr {
        padding: 0 40px
      }

      .hdr-nav {
        display: flex;
        align-items: center;
        gap: 28px;
        flex: 1;
        margin-left: 36px
      }

      .hdr-nav a {
        font-size: 0.6875rem;
        font-weight: 600;
        letter-spacing: .12em;
        text-transform: uppercase;
        color: var(--dkt2);
        text-decoration: none;
        white-space: nowrap;
        transition: color .2s
      }

      .hdr-nav a:hover {
        color: var(--dkt1)
      }

      .hdr-nav a.active {
        color: var(--dkt1)
      }

      .hdr.lite .hdr-nav a {
        color: var(--ltt2)
      }

      .hdr.lite .hdr-nav a:hover,
      .hdr.lite .hdr-nav a.active {
        color: var(--ltt1)
      }

      .hdr-nav a.has-sub::after {
        content: ' ▾';
        font-size: 0.6875rem;
        color: var(--dkt3)
      }

      .hdr.lite .hdr-nav a.has-sub::after {
        color: var(--ltt3)
      }

      /* ── DESKTOP DROPDOWN ── */
      .nav-grp {
        position: relative;
        display: flex;
        align-items: center;
        height: 60px
      }

      .nav-drop {
        position: absolute;
        top: 100%;
        left: -20px;
        min-width: 230px;
        background: rgba(0, 0, 0, .95);
        backdrop-filter: blur(10px);
        border: 1px solid var(--dkb2);
        padding: 6px 0;
        opacity: 0;
        visibility: hidden;
        transform: translateY(6px);
        transition: opacity .2s ease, transform .2s ease, visibility .2s
      }

      .nav-grp:hover .nav-drop {
        opacity: 1;
        visibility: visible;
        transform: none
      }

      .hdr-nav .nav-drop a {
        display: block;
        padding: 11px 20px;
        font-size: 0.625rem;
        letter-spacing: .14em;
        color: var(--dkt2);
        border-bottom: 1px solid rgba(255, 255, 255, .06)
      }

      .hdr-nav .nav-drop a:last-child {
        border-bottom: none
      }

      .hdr-nav .nav-drop a:hover {
        color: var(--accent);
        background: rgba(255, 255, 255, .04)
      }

      .hdr.lite .nav-drop {
        background: rgba(255, 255, 255, .97);
        border-color: var(--ltb)
      }

      .hdr.lite .hdr-nav .nav-drop a {
        color: var(--ltt2);
        border-bottom-color: rgba(0, 0, 0, .06)
      }

      .hdr.lite .hdr-nav .nav-drop a:hover {
        color: var(--a2);
        background: rgba(0, 0, 0, .03)
      }

      .hdr-phone {
        display: block;
        font-size: 0.75rem;
        font-weight: 700;
        color: var(--dkt2);
        letter-spacing: .06em;
        white-space: nowrap;
        text-decoration: none;
        transition: color .2s
      }

      .hdr-phone:hover {
        color: var(--dkt1)
      }

      .hdr.lite .hdr-phone {
        color: var(--ltt2)
      }

      .hdr.lite .hdr-phone:hover {
        color: var(--ltt1)
      }

      .hdr-messenger {
        display: block;
        font-size: 0.75rem;
        font-weight: 700;
        color: var(--dkt2);
        letter-spacing: .06em;
        white-space: nowrap;
        text-decoration: none;
        transition: color .2s;
        margin-left: 12px
      }

      .hdr-messenger:hover {
        color: var(--accent)
      }

      .lang-tog {
        display: flex;
        align-items: center;
        border: 1px solid var(--dkb2);
        border-radius: 3px;
        overflow: hidden
      }

      .lang-btn {
        font-size: 0.6875rem;
        font-weight: 700;
        padding: 5px 10px;
        letter-spacing: .1em;
        color: var(--dkt3);
        cursor: default
      }

      .lang-btn.active {
        background: var(--dks);
        color: var(--dkt2)
      }

      .hdr.lite .lang-tog {
        border-color: var(--ltb)
      }

      .hdr.lite .lang-btn {
        color: var(--ltt3)
      }

      .hdr.lite .lang-btn.active {
        background: var(--lt2);
        color: var(--ltt1)
      }

      /* page hero desktop */
      .page-hero {
        min-height: 380px
      }

      .page-hero-content {
        padding: 60px 60px 56px;
        max-width: 1280px;
        margin: 0 auto
      }

      /* sub-nav desktop */
      .sub-nav-inner {
        padding: 0 60px;
        max-width: 1280px;
        margin: 0 auto
      }

      .sub-nav-item {
        padding: 16px 20px;
        font-size: 0.75rem
      }

      /* sections */
      .sec {
        padding: 96px 60px
      }

      .custom-svc-sec {
        padding: 96px 60px
      }

      .custom-svc-grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px
      }

      .yahoo-sec {
        padding: 96px 60px
      }

      .carry-sec {
        padding: 96px 60px
      }

      .order-sec {
        padding: 96px 60px
      }

      .cta-sec {
        padding: 96px 60px
      }

      .cta-btns {
        flex-direction: row;
        justify-content: center;
        gap: 16px
      }

      .cta-btns .btn {
        width: auto;
        min-width: 200px
      }

      .cta-divider {
        display: none
      }

      .anti-sec {
        padding: 96px 60px
      }

      .ig-sec {
        padding: 96px 60px
      }

      /* yahoo: single column, steps in 2×2 grid */
      .yahoo-inner {
        display: block
      }

      .yahoo-steps {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 32px;
        margin-bottom: 0
      }

      .yahoo-step {
        padding: 0;
        border-bottom: none;
        border: 1px solid var(--dkb2)
      }

      .yahoo-step-header {
        padding: 20px 24px 16px
      }

      .yahoo-step-content {
        flex-direction: column;
        gap: 0
      }

      .yahoo-step-img {
        width: 100%;
        height: 220px
      }

      .yahoo-step-desc {
        padding: 16px 24px 24px
      }

      .yahoo-info-panel {
        margin-top: 32px
      }

      /* carry desktop 5-column */
      .carry-grid {
        grid-template-columns: repeat(5, 1fr);
        gap: 16px
      }

      /* about desktop grids */
      .shop-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 16px
      }

      .way-steps {
        grid-template-columns: repeat(3, 1fr);
        gap: 24px
      }

      .comm-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 14px
      }

      /* gallery desktop: 1-column full width (トップページのカード構造を大きく見せる) */
      .gcards {
        gap: 44px
      }

      .ghalf img {
        aspect-ratio: 16/9
      }

      .gcard.no-before .ghalf-after img {
        aspect-ratio: 21/9
      }

      .gcard-body {
        padding: 22px 26px 26px
      }

      .gcard-t {
        font-size: 0.9375rem
      }

      .gcard-d {
        font-size: 0.875rem;
        max-width: 860px
      }

      .gthumb {
        width: 112px;
        height: 66px
      }

      /* order desktop: 2×2 grid */
      .order-inner {
        display: block
      }

      .order-steps {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 32px;
        margin-bottom: 48px
      }

      .order-step {
        padding: 0;
        border-bottom: none;
        border: 1px solid var(--ltb)
      }

      .order-step-header {
        padding: 20px 24px 16px
      }

      .order-step-content {
        flex-direction: column;
        gap: 0
      }

      .order-step-img {
        width: 100%;
        height: 220px
      }

      .order-step-desc {
        flex: none;
        padding: 16px 24px 24px;
        font-size: 0.875rem
      }


      /* anti-counterfeit desktop */
      .anti-point {
        padding: 44px 40px;
        border-top: 3px solid var(--accent);
        margin: 0 10px 0 0
      }

      .anti-point:last-child {
        margin: 0
      }

      .anti-pd {
        font-size: 0.9375rem;
        line-height: 1.7
      }

      .anti-lead {
        font-size: 1rem;
        line-height: 1.8
      }

      /* footer desktop */
      .f-grid {
        grid-template-columns: repeat(4, 1fr)
      }

      /* faq desktop */
      .faq-sec {
        padding: 96px 60px
      }

      .faq-q-txt {
        font-size: 0.875rem
      }

      .faq-a-inner {
        font-size: 0.875rem
      }
    }

    /* ── FAQ ACCORDION ── */
    .faq-sec {
      background: var(--dk3);
      padding: 72px 20px
    }

    .faq-groups {
      max-width: 920px
    }

    .faq-group {
      margin-bottom: 44px;
      scroll-margin-top: 120px
    }

    .faq-group:last-child {
      margin-bottom: 0
    }

    .faq-cat {
      font-size: 0.75rem;
      font-weight: 700;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: var(--accent);
      margin-bottom: 16px;
      padding-bottom: 10px;
      border-bottom: 1px solid var(--dkb)
    }

    .faq-cat .faq-cat-cnt {
      color: var(--dkt3);
      font-weight: 400;
      letter-spacing: .1em;
      margin-left: 8px
    }

    .faq-list {
      display: flex;
      flex-direction: column;
      gap: 10px
    }

    .faq-item {
      border: 1px solid var(--dkb);
      background: var(--dks);
      overflow: hidden;
      transition: border-color .2s
    }

    .faq-item.open {
      border-color: var(--dkb2)
    }

    .faq-q {
      width: 100%;
      background: none;
      border: none;
      cursor: pointer;
      text-align: left;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      padding: 18px 20px;
      color: var(--dkt1)
    }

    .faq-q-txt {
      font-size: 0.8125rem;
      font-weight: 700;
      letter-spacing: .04em;
      text-transform: uppercase;
      line-height: 1.4
    }

    .faq-ico {
      position: relative;
      flex-shrink: 0;
      width: 22px;
      height: 22px;
      border: 1.5px solid var(--dkb2);
      border-radius: 4px;
      transition: background .2s, border-color .2s
    }

    .faq-ico::before,
    .faq-ico::after {
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      background: var(--dkt2);
      transition: transform .25s, opacity .25s, background .2s
    }

    .faq-ico::before {
      width: 10px;
      height: 2px;
      transform: translate(-50%, -50%)
    }

    .faq-ico::after {
      width: 2px;
      height: 10px;
      transform: translate(-50%, -50%)
    }

    .faq-item.open .faq-ico {
      background: var(--accent);
      border-color: var(--accent)
    }

    .faq-item.open .faq-ico::before {
      background: #000
    }

    .faq-item.open .faq-ico::after {
      transform: translate(-50%, -50%) scaleY(0);
      opacity: 0
    }

    .faq-a {
      max-height: 0;
      overflow: hidden;
      transition: max-height .3s ease
    }

    .faq-a-inner {
      padding: 0 20px 18px;
      font-size: 0.8125rem;
      color: var(--dkt2);
      line-height: 1.7
    }

    .faq-a-inner .faq-flag {
      display: inline-block;
      font-size: 0.625rem;
      font-weight: 700;
      letter-spacing: .1em;
      text-transform: uppercase;
      color: var(--a2);
      border: 1px dashed rgba(245, 197, 24, .35);
      border-radius: 3px;
      padding: 3px 8px;
      margin-top: 12px
    }

    /* ── BACK TO TOP ── */
    .to-top {
      position: fixed;
      right: 18px;
      bottom: 70px;
      z-index: 95;
      width: 44px;
      height: 44px;
      border-radius: 50%;
      background: var(--accent, #F5C518);
      color: #000;
      border: none;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 4px 14px rgba(0, 0, 0, .35);
      opacity: 0;
      visibility: hidden;
      transform: translateY(10px);
      transition: opacity .25s, transform .25s, visibility .25s, background .2s
    }

    .to-top.show {
      opacity: 1;
      visibility: visible;
      transform: none
    }

    .to-top:hover {
      background: var(--a2, #c9a000)
    }

    @media(min-width:1024px) {
      .to-top {
        right: 28px;
        bottom: 28px;
        width: 48px;
        height: 48px
      }
    }

/* MMF overrides ------------------------------------------------------
   1) Remove the white divider line leaking from main.css home-FAQ
      (.faq-item:last-child border, light color).
   2) Let the FAQ list fill the content width (demo capped at 920px). */
.faq-groups { max-width: none; }
/* Closed items: a 2px transparent border (invisible, no layout shift, clean).
   Open item: full gold box — consistent for every item, including the last. */
.faq-groups .faq-item,
.faq-groups .faq-item:last-child { border: 2px solid transparent; }
.faq-groups .faq-item.open { border-color: var(--accent); }

/* ===== Unified button hover (lift + soft shadow) — 2026-06-26 ===== */
.btn,
.sec-cta-btn {
  transition: all .2s ease
}
.btn:hover,
.sec-cta-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, .25)
}

/* ===== Language switcher hover/active — 2026-06-26 =====
   Inactive: gold text on hover. Active: keep gold bg + black text (even on hover). */
a.lang-btn:not(.active):hover,
.hdr.lite a.lang-btn:not(.active):hover,
a.d-lang-btn:not(.active):hover {
  color: var(--accent)
}
a.lang-btn.active:hover,
.hdr.lite a.lang-btn.active:hover,
a.d-lang-btn.active:hover {
  color: var(--ltt1)
}

/* Active language button = gold (override the stale per-page grey .lang-btn.active
   that was winning over main.css because page CSS loads last) — 2026-06-26 */
.lang-btn.active,
.hdr.lite .lang-btn.active,
.d-lang-btn.active {
  background: var(--accent);
  color: var(--ltt1);
  font-weight: 800
}

/* WCAG 2.5.8 target size: enlarge the EN/JA buttons to >=24px tall — 2026-06-26 */
.lang-btn {
  padding: 8px 12px
}
