/* A tighter, consistent vertical rhythm across the site. */
.brand { font-family:"DFKai-SB","BiauKai","KaiTi",serif; font-size:22px; font-weight:700; letter-spacing:.1em; }
.brand small { font-family:"DFKai-SB","BiauKai","KaiTi",serif; font-size:10px; font-weight:700; letter-spacing:.18em; }
.nav-links a { font-weight:700; }
.section { padding-block:88px; }
.achievement { padding-block:76px; }
.cases__panel { min-height:510px; }
.cta { padding-block:72px; }

.intro--rich { padding-block:48px; }
.services { padding-block:38px; }
.showcase { padding-block:38px; }
.about-principles { padding-block:42px; }
.about-works { padding-block:52px; }
.about-cta { padding-block:56px; }

.cases-hero { padding-block:70px; }
.case-gallery { padding-block:62px 72px; }
.cases-cta { padding-block:70px; }

.service-intro { padding-block:64px; }
.service-menu { padding-block:52px; }
.service-feature { padding-block:60px; }
.services-cta { padding-block:58px; }
.performance-menu { padding-block:52px; }
.performance-detail { padding-block:46px; }

.contact-main { padding-block:72px; }
.contact-guide { padding-block:72px; }

@media (max-width:760px) {
  .brand { font-size:18px; }.brand small { font-size:8px; }
  .section { padding-block:60px; }
  .achievement { padding-block:58px; }
  .cases__panel { min-height:460px; }
  .cta { padding-block:54px; }
  .intro--rich { padding-block:46px; }
  .services { padding-block:34px; }
  .showcase { padding-block:30px; }
  .about-principles { padding-block:34px; }
  .about-works { padding-block:42px; }
  .about-cta { padding-block:46px; }
  .cases-hero { padding-block:54px; }
  .case-gallery { padding-block:48px 58px; }
  .cases-cta { padding-block:58px; }
  .service-intro,.service-feature,.services-cta { padding-block:48px; }
  .service-menu { padding-block:44px; }
  .performance-menu { padding-block:44px; }
  .performance-detail { padding-block:38px; }
  .contact-main,.contact-guide { padding-block:54px; }
}

/* Homepage cover: cropped photo above a preserved information panel. */
.home-page .site-header { position:relative; background:#26231e; backdrop-filter:none; }
.home-page .site-header .brand,.home-page .site-header .nav-links a { text-shadow:0 2px 5px rgba(0,0,0,.86); }
.home-page .nav-links { gap:25px; }
.home-page .nav-links a { padding:0; border-color:transparent; background:transparent; }
.home-page .nav-links a:hover,.home-page .nav-links a[aria-current] { background:transparent; border-color:transparent; color:#efd092; }
.floating-contact { top:50%; right:18px; bottom:auto; gap:9px; transform:translateY(-50%); }
.floating-contact a { display:grid; width:54px; height:54px; place-items:center; padding:0; border:1.5px solid #d7b45e; border-radius:50%; box-shadow:0 5px 15px rgba(0,0,0,.22); overflow:hidden; }
.floating-contact img { display:none; }
.floating-contact__line { background:#19c437; color:#fff; font-family:Arial,sans-serif; font-size:10px; font-weight:800; }
.floating-contact__line span { display:grid; width:29px; height:23px; place-items:center; border-radius:50%; background:#fff; color:#19a939; }
.floating-contact__phone { background:#3169e8; color:#fff; font-family:Arial,sans-serif; font-size:29px; font-weight:700; }
.floating-contact__phone span { transform:rotate(-13deg); }
.floating-contact__facebook { background:#1877f2; color:#fff; font-family:Arial,sans-serif; font-size:34px; font-weight:800; line-height:1; }
.floating-contact__facebook span { margin-top:8px; }
.floating-contact__instagram { background:radial-gradient(circle at 30% 108%,#ffdc80 0 18%,#fcaf45 19% 34%,#f77737 35% 49%,#e1306c 50% 68%,#c13584 69% 82%,#833ab4 83%); }
.floating-contact__instagram span { position:relative; width:25px; height:25px; border:3px solid #fff; border-radius:8px; }
.floating-contact__instagram span::before { content:""; position:absolute; inset:5px; border:3px solid #fff; border-radius:50%; }
.floating-contact__instagram span::after { content:""; position:absolute; top:3px; right:3px; width:4px; height:4px; border-radius:50%; background:#fff; }
.hero { display:block; min-height:0; height:650px; background:#26231e; }
.hero__slides { inset:0; width:auto; height:auto; }
.hero__slide { background-size:cover; background-position:center 42%; }
.hero__slide::after { background:linear-gradient(0deg,rgba(18,16,13,.88) 0%,rgba(18,16,13,.46) 34%,rgba(18,16,13,.04) 70%); }
.hero__content { position:absolute; right:0; bottom:0; left:0; box-sizing:border-box; width:100%; min-height:250px; padding:28px 24px 24px; justify-content:flex-end; background:transparent; }
@media (max-width:760px) { .floating-contact { right:12px; }.floating-contact a { width:48px; height:48px; padding:0; }.hero { height:620px; }.hero__slides { inset:0; height:auto; }.hero__slide { background-position:center 34%; }.hero__content { width:100%; min-height:250px; padding:18px 20px 22px; } }

@media (max-width:760px) {
  html, body { width:100%; max-width:100%; overflow-x:hidden; }
  .container, .intro__grid, .intro__image, .intro__image img { min-width:0; max-width:100%; }
  .intro__image { width:100%; }
  .site-header { z-index:50; }
  .nav { position:relative; }
  .nav-toggle { position:relative; z-index:3; display:grid; width:48px; height:48px; place-items:center; border:0; border-radius:50%; background:rgba(20,18,14,.76); color:#fff; font-size:29px; line-height:1; cursor:pointer; }
  .nav-links.is-open { position:absolute; top:calc(100% - 6px); right:0; left:0; z-index:2; display:flex; flex-direction:column; gap:0; padding:10px 20px 18px; background:rgba(28,25,20,.97); box-shadow:0 12px 25px rgba(0,0,0,.22); }
  .nav-links.is-open a { display:block; padding:14px 4px; border-bottom:1px solid rgba(255,255,255,.13); color:#fff; font-size:16px; font-weight:700; }
  .nav-links.is-open a:last-child { border-bottom:0; }
  .nav-toggle { position:fixed !important; top:calc(env(safe-area-inset-top, 0px) + 12px) !important; right:14px !important; z-index:9999 !important; display:grid !important; width:52px !important; height:52px !important; min-width:52px !important; min-height:52px !important; padding:0 !important; aspect-ratio:1 / 1; border-radius:50% !important; pointer-events:auto !important; }
  .nav-links.is-open { position:fixed; top:68px; right:12px; left:12px; z-index:9998; max-height:calc(100vh - 88px); overflow-y:auto; }
}
