:root { --service-text:#45413c; --service-action:#665545; --service-rule:#d5cdc0; }
body {font-family:"PingFang TC","Microsoft JhengHei",sans-serif;}
.service-header {width:min(1240px,100%);margin:auto;min-height:76px;height:auto;padding:10px 5%;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;background:white;border:0;border-bottom:1px solid var(--service-rule);}
.service-header .brand img {display:block;width:58px;height:auto;object-fit:contain;}
.service-header .brand {display:flex;align-items:center;gap:12px;letter-spacing:.04em;font-size:16px;color:var(--service-text);}
.service-nav {display:flex;align-items:center;flex-wrap:wrap;gap:20px;font-size:15px;}
.service-nav a,.mobile-nav a {display:inline-flex;align-items:center;min-height:44px;color:var(--service-text);}
.service-header .mobile-nav {display:none;}
.service-header .mobile-nav summary {font-size:16px;font-weight:650;min-height:44px;align-items:center;gap:16px;}
.mobile-nav nav {display:grid;gap:0;}
.mobile-nav a {border-top:1px solid var(--service-rule);}
:focus-visible {outline:3px solid #8c4b1d;outline-offset:4px;}
.skip-link {position:absolute;left:12px;top:-200px;z-index:50;background:white;padding:10px;}
.skip-link:focus {top:8px;}
main .hero p,main .plan p,main .step p,main section p,main section li,form input,form select,form textarea {font-size:16px;line-height:1.8;}
main .fine,main .proposal,main .bill,main small, main .buy-note, footer, footer a,form label {font-size:14px!important;line-height:1.7!important;}
main h1,main h2 {text-wrap:balance;}
main :is(.btn,.choose),button[data-cycle],.tabs button {min-height:44px;}
main .hero {align-items:center;}
.hero .hero-art,.hero .hero-media {height:auto;max-width:440px;width:100%;margin:auto;padding:0;}
.hero .hero-art img,.hero .hero-media img {display:block;width:100%;height:auto;max-height:none;aspect-ratio:4/4.3;object-fit:cover;object-position:center 40%;filter:none;border-radius:4px;}
.site-section-label {font-size:15px;letter-spacing:.08em;color:#65564a;font-weight:700;}
.service-footer {display:flex;flex-wrap:wrap;gap:16px 32px;justify-content:space-between;max-width:1160px;margin:auto;padding:28px 6%;font-size:14px;background:white;}
.service-footer a {display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-underline-offset:4px;}
@media(max-width:800px){
  .service-header {display:grid;grid-template-columns:1fr auto;min-height:70px;}
  .service-header .brand img {width:46px;height:auto;}
  .service-header .service-nav {display:none;}
  .service-header .mobile-nav {display:block;position:relative;padding:0;border:0;z-index:2;}
  .service-header .mobile-nav nav {position:absolute;right:0;min-width:190px;background:white;border:1px solid var(--service-rule);padding:8px 16px;box-shadow:0 6px 16px #44332216;}
  .service-header .mobile-nav nav a {display:flex;}
  main .hero {gap:20px;}
  .hero .hero-art,.hero .hero-media {max-width:380px;}
  .hero .hero-art img,.hero .hero-media img {aspect-ratio:1.2;}
  .hero p br {display:none;}
  .plans,.pricing-grid,main .hero>*, form, fieldset {min-width:0;}
  .dialog-actions {flex-wrap:wrap;gap:8px;}
  .service-footer {align-items:flex-start;}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
.hero-art:before,.hero-art:after {display:none;} input,select,textarea {max-width:100%;} .fine {color:#635b51;}

.hero .hero-art, .hero .hero-media {
  position: relative;
  max-width: 500px;
  padding: 10px 8px 22px;
  overflow: visible;
}
.hero .photo-slip {
  position: absolute;
  z-index: 1;
  bottom: 2px;
  left: 0;
  padding: 10px 17px;
  background: white;
  color: #525252;
  border-left: 3px solid #d5cdc0;
  box-shadow: 0 4px 14px #352d221c;
  transform: rotate(-3deg);
  font-size: 15px;
  line-height: 1.6;
}
.hero .photo-slip small { display: block; color: #73563c; }

@media (max-width: 450px) {
  #message { min-height: 10em; }
  .hero p.fine br { display: initial; }
}