/* Type hierarchy: editorial headings, readable interface, consistent prices. */
:root {
  --sans: 'Noto Sans KR', 'Noto Sans Arabic', Arial, sans-serif;
  --heading: 'Noto Serif KR', Georgia, serif;
  --type-body: 16px;
  --type-small: 12px;
  --muted: #6b6259;
}
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html[lang=en] { --heading: 'Cormorant Garamond', Georgia, serif; }
html[dir=rtl] { --sans: 'Noto Sans Arabic', 'Noto Sans KR', Arial, sans-serif; --heading: var(--sans); }
body { font-family: var(--sans); font-size: var(--type-body); font-weight: 400; line-height: 1.75; letter-spacing: -.015em; }
button, input, select, textarea, summary { font-family: var(--sans); letter-spacing: inherit; }
p, h1, h2, h3, h4, label, small, summary { overflow-wrap: anywhere; }
html[lang=ko] :is(p, h1, h2, h3, h4, label, small, summary) { word-break: keep-all; }
html[dir=rtl] body { letter-spacing: 0; }

/* Restrained serif titles; names and navigation remain practical. */
.hero h1 { font-family: var(--heading); font-weight: 500; font-size: clamp(34px,3.25vw,48px); line-height: 1.45; letter-spacing: -.04em; }
html[lang=en] .hero h1 { font-family: var(--heading); font-size: clamp(44px,4.6vw,66px); font-weight: 500; line-height: 1.12; letter-spacing: -.02em; }
html[dir=rtl] .hero h1 { font-family: var(--heading); font-size: 38px; font-weight: 500; line-height: 1.55; letter-spacing: 0; }
.custom-intro h2, .collection-section[role=tabpanel] .section-heading h2,
.concierge-content h2, .faq-section h2, .dialog-shell>h2, .detail-content-body h2 {
  font-family: var(--heading); font-weight: 500; line-height: 1.5; letter-spacing: -.025em;
}
.custom-intro h2, .collection-section[role=tabpanel] .section-heading h2, .concierge-content h2 { font-size: 32px; }
.faq-section h2, .dialog-shell>h2, .detail-content-body h2 { font-size: 30px; }
.place-body h3, .villa-grid .place-body h3, .service-card-body h3,
.room-option h4, .villa-intro h3, .room-options>h3 {
  font-family: var(--sans); font-size: 23px; font-weight: 500; line-height: 1.5; letter-spacing: -.025em;
}
.room-option h4 { font-size: 20px; }
.brand, .footer-brand { font-weight: 500; letter-spacing: .045em; }
.brand-subtitle { font-size: 12px; line-height: 1.4; letter-spacing: .1em; }
.desktop-nav, .header-journey { font-size: 15px; font-weight: 500; }
.language select { font-size: 16px; min-height: 44px; }
.count-badge { font-size: 12px; min-width: 22px; height: 22px; }
.eyebrow, .hero-kicker, .base-heading .eyebrow, .custom-intro .eyebrow,
.concierge-section .eyebrow, .collection-heading-label { font-family: var(--sans); font-size: 12px; font-weight: 500; line-height: 1.5; letter-spacing: .1em; }
.hero-kicker { letter-spacing: .12em; }
.hero-copy { font-size: 16px; line-height: 1.8; }
.vip-hero-note { font-size: 12px; line-height: 1.65; }
.hero-image-note { font-size: 12px; letter-spacing: .02em; }

.base-heading h2 { font-size: 16px; line-height: 1.65; }
.base-benefits strong, html[lang=en] .base-benefits strong, html[dir=rtl] .base-benefits strong {
  font-size: 16px; font-weight: 500; letter-spacing: -.02em; line-height: 1.55;
}
.base-benefits small, html[lang=en] .base-benefits small, html[dir=rtl] .base-benefits small,
.base-benefits .base-assistant-policy { font-size: 13px; line-height: 1.65; letter-spacing: 0; }
.base-disclosure>summary { font-size: 14px; min-height: 44px; }
.base-estimate-note, .base-disclosure .service-detail-copy, .service-detail-copy { font-size: 15px; line-height: 1.85; }
.private-service-description { font-size: 16px; line-height: 1.8; }
.service-included, .service-credential { font-size: 13px; line-height: 1.6; }
.service-days-mode small, .service-days-mode button, .service-rate>span { font-size: 12px; line-height: 1.65; }
.service-days-row, .service-configuration>summary, .service-toggle { font-size: 15px; }

.category-tabs>[role=tab], html[lang=en] .category-tabs>[role=tab], html[dir=rtl] .category-tabs>[role=tab] {
  font-family: var(--sans); font-size: 21px; font-weight: 500; letter-spacing: -.02em; line-height: 1.4;
}
.category-tab-copy>span:first-child { font-family: var(--sans); }
.category-english { font-size: 12px; letter-spacing: .08em; line-height: 1.4; }
.category-tabs small { font-size: 12px; min-width: 20px; line-height: 20px; }
.section-description, .place-experience, .villa-features, .villa-intro>p:last-child,
.detail-description, .concierge-content p, .faqs details p {
  font-size: var(--type-body); line-height: 1.85;
}
.section-description { max-width: 42em; }
.filter-button, .stay-type { font-size: 15px; font-weight: 500; line-height: 1.5; min-height: 46px; }
.stay-type { font-size: 17px; }
.dining-status { font-size: 13px; line-height: 1.7; }
.place-category, .villa-brand, .room-tier { font-size: 12px; letter-spacing: .02em; line-height: 1.6; }
.photo-open { font-size: 12px; min-height: 40px; }
.image-label, .photo-count, .media-placeholder>small { font-size: 12px; line-height: 1.5; }
.room-options>p, .detail-notice, .dining-detail, .dining-detail strong { font-size: 15px; line-height: 1.8; }

/* All numeric prices use the same sans face and aligned figures. */
.place-price strong, .room-count, .room-price, .service-rate strong,
.service-line-total output, .estimate-total, .journey-price bdi, .journey-item-amount,
.service-item-amount, .estimate-breakdown b, .consulting-summary strong,
.service-quote-total strong, input[type=number] {
  font-family: var(--sans); font-variant-numeric: lining-nums tabular-nums; font-weight: 500; letter-spacing: -.02em;
}
.place-card .place-price strong, .place-price strong, .room-price,
.base-disclosure .service-rate strong, .service-rate strong, .service-line-total output { font-size: 19px; line-height: 1.5; }
.place-price span, .room-count span, .place-card .price-scope { font-size: 12px; line-height: 1.65; }
.estimate-total { font-size: clamp(28px,3vw,36px); line-height: 1.35; letter-spacing: -.035em; }
.estimate-panel>p:first-child { font-size: 14px; line-height: 1.6; }
.estimate-breakdown>div, .consulting-summary>div { font-size: 14px; line-height: 1.65; flex-wrap: wrap; }
.estimate-breakdown b, .consulting-summary>div>strong { margin-inline-start: auto; }
.estimate-controls label, .journey-rooms label, .visit-control { font-size: 13px; line-height: 1.6; }
.journey-category-label { font-size: 14px; letter-spacing: .02em; }
.journey-item-text { font-size: 17px; font-weight: 500; line-height: 1.6; }
.journey-item-text>small, .journey-price span, .journey-rooms small { font-size: 12px; line-height: 1.7; font-weight: 400; }
.journey-rooms strong { font-size: 15px; line-height: 1.6; }
.journey-price { font-size: 14px; font-weight: 400; }
.journey-item-amount { font-size: 20px; line-height: 1.5; }
.service-quote h3, .base-service-quote h3 { font-size: 17px; }
.service-quote-item strong { font-size: 15px; line-height: 1.65; }
.service-quote-item small, .service-quote-item .assistant-policy-inline { font-size: 12px; line-height: 1.75; }
.base-service-quote .service-item-amount { font-size: 16px; line-height: 1.6; }
.service-quote-item { flex-wrap: wrap; }
.service-quote-item>div { flex: 1 1 160px; }
.base-service-quote .service-item-amount { margin-inline-start: auto; }

/* Notes are quieter in color, never reduced below 12px. */
.collection-estimate-note, .estimate-disclaimer, .estimate-pending, .consult-exclusive { font-size: 12px!important; line-height: 1.75; }
.collection-note, .villa-collection-note, .stay-note, .estimate-assumption, .consulting-summary>p,
.room-option small, .room-source, .detail-actions>a, .detail-credit, .detail-price>p,
.dining-detail small, .official-video>a, .credit-item small, .service-quote-note, .privacy-note,
.vip-restriction, .dialog-shell>p.vip-restriction, .concierge-content p.vip-restriction,
.whatsapp-contact small, .whatsapp-contact-copy>p[data-i18n=whatsappScan], .footer-bottom, .footer-top-link {
  font-size: 12px; line-height: 1.8; letter-spacing: 0;
}
.consult-exclusive { letter-spacing: .1em; }
.footer-top p { font-size: 14px; }
.footer-bottom { align-items: flex-start; flex-wrap: wrap; }
.faqs summary { font-size: 16px; font-weight: 500; line-height: 1.7; }

/* Controls, forms and consultation copy retain the same hierarchy. */
.button, .button.text-button, .card-select, .category-next .button,
.concierge-options .button, .detail-actions .button, .whatsapp-contact .button,
.consult-dialog .form-actions .button, .form-actions>.button {
  font-size: 16px; font-weight: 500; line-height: 1.6; letter-spacing: -.01em; min-height: 50px;
}
.recommend-link, .estimate-edit, .journey-item .journey-rooms button, .journey-rooms .estimate-edit,
.reset-button { font-size: 14px; line-height: 1.6; min-height: 44px; }
.dialog-shell>p, .consult-dialog .dialog-intro, .whatsapp-auto-note,
.dialog-shell>p.whatsapp-auto-note, .whatsapp-contact .whatsapp-auto-note,
.whatsapp-contact-copy>p:not([class]) { font-size: 15px; line-height: 1.85; }
.assistant-policy, .dialog-shell>p.assistant-policy { font-size: 13px; line-height: 1.8; }
.whatsapp-person { font-size: 14px; line-height: 1.7; }
.whatsapp-wordmark { font-weight: 500; font-size: 32px; }
.whatsapp-contact small { display: block; }
.form-disclosure>summary, .official-video>summary { font-size: 16px; line-height: 1.65; }
.form-grid label, .notes-label, .preferences label, .consult-summary-row { font-size: 14px; line-height: 1.75; }
.connection-notice p { font-size: 13px; line-height: 1.85; }
.form-grid input, .form-grid select, textarea, .estimate-controls input, .visit-control input,
.journey-rooms input, .service-stepper input { font-size: 16px; line-height: 1.5; }
.toast { font-size: 14px; line-height: 1.65; }

@media(max-width:1000px) and (min-width:701px) {
  .header { padding-inline: 24px; gap: 16px; }
  .desktop-nav { gap: 20px; }
  .brand { font-size: 29px; }
  .brand-subtitle { font-size: 12px; letter-spacing: .03em; }
  .hero h1 { font-size: 34px; }
  .hero-content { padding-inline: 32px; }
  .hero-copy { max-width: 47%; }
}

@media(max-width:700px) {
  :root { --type-body: 15px; }
  .header { height: 64px; padding-inline: 20px; gap: 12px; }
  .brand { font-size: 28px; gap: 0; }
  .brand-subtitle { display: none; }
  .header-actions { gap: 8px; }
  .hero, html[dir=rtl] .hero { min-height: 0; }
  .hero-content, html[dir=rtl] .hero-content { padding: 18px 20px; }
  .hero h1 { font-size: clamp(28px,7.7vw,32px); font-weight: 500; line-height: 1.4; letter-spacing: -.04em; }
  html[lang=en] .hero h1 { font-size: 32px; line-height: 1.15; max-width: 11em; }
  html[dir=rtl] .hero h1 { font-size: 28px; line-height: 1.45; max-width: 100%; }
  .hero-kicker { font-size: 12px; letter-spacing: .06em; margin-bottom: 9px; }
  .hero-copy, html[lang=en] .hero-copy, html[dir=rtl] .hero-copy { font-size: 15px; line-height: 1.65; max-width: 100%; margin-top: 10px; }
  .vip-hero-note, html[dir=rtl] .vip-hero-note { font-size: 12px; line-height: 1.6; margin-top: 8px; padding: 0; }
  .hero-image-note { display: none; }
  .base-package { padding: 12px 20px 0; }
  .base-heading .eyebrow { font-size: 12px; line-height: 1.5; letter-spacing: .02em; }
  .base-benefits { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px 12px; margin-top: 8px; }
  .base-benefits>div { min-width: 0; }
  .base-benefits>div+div { padding-inline-start: 12px; }
  .base-benefits strong, html[lang=en] .base-benefits strong, html[dir=rtl] .base-benefits strong { font-size: 14px; line-height: 1.45; letter-spacing: -.02em; }
  .base-benefits small, html[lang=en] .base-benefits small, html[dir=rtl] .base-benefits small,
  .base-benefits .base-assistant-policy { font-size: 12px; line-height: 1.5; margin-top: 2px; letter-spacing: 0; }
  .base-benefits .base-assistant { display: grid; grid-column: 1/-1; grid-template-columns: 1fr 1.65fr; gap: 0 10px; border-inline-start: 0; border-top: 1px solid var(--line); padding: 8px 0 0; }
  .base-benefits .base-assistant strong { grid-column: 1; grid-row: 1/3; align-self: center; }
  .base-benefits .base-assistant small { grid-column: 2; }
  .base-benefits .base-assistant-policy { white-space: normal; margin: 0; }
  .base-disclosure { margin-top: 8px; }
  .base-disclosure>summary { font-size: 13px; min-height: 38px; }
  .custom-intro, html[dir=rtl] .custom-intro { padding: 14px 20px 12px; }
  .custom-intro h2 { font-size: 22px; line-height: 1.4; }
  .category-tabs { padding-inline: 10px; }
  .category-tabs>[role=tab], html[lang=en] .category-tabs>[role=tab], html[dir=rtl] .category-tabs>[role=tab] { font-size: 20px; min-height: 64px; padding: 10px 8px; gap: 8px; }
  .category-english { display: none; }
  .category-thumb, html[dir=rtl] .category-thumb { width: 30px; height: 38px; }
  .category-tabs small { min-width: 18px; line-height: 18px; font-size: 12px; inset-inline-end: 3px; top: 2px; }
  .collection-section[role=tabpanel] .section-heading h2, .concierge-content h2, .faq-section h2 { font-size: 27px; line-height: 1.5; }
  .place-body h3, .villa-grid .place-body h3, .service-card-body h3 { font-size: 23px; }
  .filter-bar { gap: 12px; }
  .filter-button { padding: 10px 8px; }
  .stay-type { font-size: 16px; padding-inline: 12px; }
  .room-option h4 { font-size: 20px; }
  .mobile-journey { min-height: 68px; }
  .mobile-journey>button:last-child { font-size: 16px; font-weight: 500; min-height: 48px; }
  .mobile-journey b { font-size: 12px; }
  .dialog-shell { padding: 54px 20px 28px; }
  .dialog-shell>h2, .consult-dialog .dialog-shell>h2, .detail-content-body h2 { font-size: 27px; line-height: 1.45; padding-inline-end: 20px; }
  .dialog-close { width: 40px; height: 40px; }
  .estimate-panel { padding: 20px 16px; }
  .estimate-total { font-size: clamp(27px,7.6vw,32px); }
  .estimate-controls { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  .journey-item { display: grid; grid-template-columns: 44px minmax(0,1fr) 32px; gap: 10px; align-items: start; }
  .journey-item img { width: 44px; height: 58px; }
  .journey-item-text { font-size: 16px; overflow-wrap: anywhere; }
  .journey-item-amount { font-size: 19px; }
  .journey-item>button { width: 32px; min-height: 40px; }
  .journey-rooms input { width: 58px; }
  .consult-summary-row { grid-template-columns: 1fr; gap: 4px; }
  .form-grid { grid-template-columns: 1fr; }
  .whatsapp-contact { gap: 16px; }
  .whatsapp-contact .button { font-size: 16px; }
  .whatsapp-contact small { display: block; }
  .whatsapp-wordmark { font-size: 30px; }
  .footer-top { flex-wrap: wrap; }
  .toast { bottom: 86px; }
}
@media(max-width:360px) {
  .header { padding-inline: 16px; }
  .hero-content, html[dir=rtl] .hero-content { padding: 16px; }
  .hero h1 { font-size: 28px; }
  .hero-kicker { letter-spacing: .035em; }
  .base-package { padding-inline: 16px; }
  .base-benefits .base-assistant { grid-template-columns: 1fr 1.5fr; gap: 0 8px; }
  .category-tabs { padding-inline: 4px; }
  .category-tabs>[role=tab], html[lang=en] .category-tabs>[role=tab], html[dir=rtl] .category-tabs>[role=tab] { font-size: 18px; gap: 5px; padding-inline: 6px; }
  .category-thumb, html[dir=rtl] .category-thumb { width: 24px; height: 32px; }
  .dialog-shell { padding-inline: 16px; }
  .journey-item { grid-template-columns: minmax(0,1fr) 32px; }
  .journey-item img, .journey-item .journey-photo-placeholder { display: none; }
}
@media(max-width:700px) and (max-height:740px) {
  .hero-content, html[dir=rtl] .hero-content { padding-block: 14px; }
  .custom-intro, html[dir=rtl] .custom-intro { padding-block: 4px; }
  .custom-intro h2 { font-size: 20px; }
}
@media(max-width:360px) and (max-height:740px) {
  .hero-content, html[dir=rtl] .hero-content { padding-block: 12px; }
}