/*
 * NAYUTA SITE v2.2 — six distinct COMPONENT SYSTEMS, not mere palettes.
 * Inspiration is described (without copying CSS/markup) in
 * docs/SITE_DESIGN_BENCHMARK_AND_COMPONENT_SYSTEM_20261011.md.
 *
 * STRUCTURE remains independent: no visibility/DOM order toggles here.
 * COLOR remains independent: theme colors use --brand/--action/--pale etc.
 * Keep customer-supplied copy, published CMS data and member gates unchanged.
 */
html[data-site-design] {
  --ny-heading-size:clamp(31px,3.4vw,52px);
  --ny-heading-family:var(--font-sans,system-ui);
  --ny-heading-weight:600;
  --ny-heading-tracking:-.025em;
  --ny-heading-rule:2px;
  --ny-section-space:clamp(54px,6.5vw,110px);
  --ny-button-radius:4px;
  --ny-button-min:52px;
  --ny-button-weight:650;
  --ny-button-tracking:.035em;
  --ny-card-radius:4px;
  --ny-card-line:1px;
  --ny-card-lift:0px;
}
html[data-site-design] :is(#property,#journal,#service,#about,#voice,#staff,#faq,#news,.section-standard) {
  scroll-margin-top:calc(var(--header-height,74px) + 24px);
}
html[data-site-design] :is(#property,#journal,#service,#about,#voice,#staff,#faq,#news,.section-standard) > .section-shell {
  padding-block:var(--ny-section-space);
}
html[data-site-design] :is(#property,#journal,#service,#about,#voice,#staff,#faq,#news,.section-standard) .section-heading h2 {
  font-family:var(--ny-heading-family);
  font-size:var(--ny-heading-size);
  font-weight:var(--ny-heading-weight);
  letter-spacing:var(--ny-heading-tracking);
  line-height:1.17;
  text-wrap:balance;
  color:var(--brand);
}
html[data-site-design] :is(#property,#journal,#service,#about,#voice,#staff,#faq,#news,.section-standard) .section-heading > p {
  margin-top:clamp(8px,1.25vw,19px);
  font-family:var(--font-sans,system-ui);
  font-size:clamp(13px,1.25vw,18px);
  font-weight:550;
  line-height:1.7;
  letter-spacing:.035em;
}
html[data-site-design] :is(#property,#journal,#service,#voice,#faq,#news,.section-standard) .section-intro {
  margin-bottom:clamp(24px,3.2vw,51px);
}
html[data-site-design] :is(#property,#journal,#service,#about,#voice,#staff,#faq,#news) .section-heading::after {
  display:block;
  width:clamp(30px,5vw,84px);
  height:var(--ny-heading-rule);
  margin-top:clamp(14px,2vw,28px);
  background:var(--brand);
  content:"";
  opacity:.8;
}
/* Existing interactive controls all retain their original route, label and
 * accessibility attributes. Shape changes, behavior does not. */
html[data-site-design] :is(.hero-actions .button,.hero-quick-submit,.page-button,.housing-button,
  #contact .contact-option,#service .service-tabs a) {
  border-radius:var(--ny-button-radius);
  font-weight:var(--ny-button-weight);
  letter-spacing:var(--ny-button-tracking);
  min-height:var(--ny-button-min);
  transition:background-color .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease;
}
html[data-site-design] :is(.hero-actions .button,.hero-quick-submit,.page-button,.housing-button,
  #contact .contact-option):focus-visible {
  outline:3px solid var(--action);
  outline-offset:3px;
}
html[data-site-design] :is(#property .property-item,#journal .journal-featured,.housing-card,.listing-card) {
  border-radius:var(--ny-card-radius);
}
html[data-site-design] :is(.section-action .text-link,.section-more a,#about .about-page-link) {
  display:inline-flex;
  align-items:center;
  gap:clamp(8px,1.2vw,18px);
  min-height:44px;
  font-weight:var(--ny-button-weight);
  letter-spacing:var(--ny-button-tracking);
  text-underline-offset:7px;
}
html[data-site-design] .hero .nayuta-template-kicker {
  font-size:clamp(11px,1.05vw,16px);
  letter-spacing:.16em;
  font-weight:var(--ny-button-weight);
  line-height:1.55;
}

/* 01 / Modern Portal: dense editorial index, practical capsule CTA. */
html[data-site-design="modern-portal"] {
  --ny-heading-size:clamp(36px,4vw,62px);
  --ny-heading-family:var(--font-sans,system-ui);
  --ny-heading-weight:850;
  --ny-heading-tracking:-.06em;
  --ny-heading-rule:5px;
  --ny-button-radius:12px;
  --ny-button-min:56px;
  --ny-button-weight:750;
  --ny-button-tracking:.005em;
  --ny-card-radius:16px;
  --ny-section-space:clamp(55px,6.5vw,105px);
}
html[data-site-design="modern-portal"] .hero .nayuta-template-kicker {
  letter-spacing:.22em;text-transform:uppercase;
}
html[data-site-design="modern-portal"] #property .section-heading::after {
  width:100%;max-width:280px;
}
html[data-site-design="modern-portal"] .hero-quick-submit {
  border-radius:12px!important;
  box-shadow:0 8px 22px #102b4340;
}
html[data-site-design="modern-portal"] :is(.section-action .text-link,.section-more a) {
  background:var(--brand);
  color:#fff;
  padding:5px 26px;
  text-decoration:none;
  border-radius:11px;
}
html[data-site-design="modern-portal"] :is(.section-action .text-link,.section-more a):hover {
  background:var(--brand-dark);
  color:#fff;
}

/* 02 / Minimal Corporate: line work, restrained English, square strokes. */
html[data-site-design="minimal-corporate"] {
  --ny-heading-size:clamp(26px,2.9vw,45px);
  --ny-heading-family:var(--font-sans,system-ui);
  --ny-heading-weight:450;
  --ny-heading-tracking:.065em;
  --ny-heading-rule:1px;
  --ny-button-radius:0;
  --ny-button-min:58px;
  --ny-button-weight:500;
  --ny-button-tracking:.07em;
  --ny-card-radius:0;
  --ny-section-space:clamp(70px,8vw,132px);
}
html[data-site-design="minimal-corporate"] :is(#property,#journal,#service,#about) .section-heading::after {
  width:min(400px,100%);background:var(--line);opacity:1;
}
html[data-site-design="minimal-corporate"] :is(.hero-actions .button,.page-button,#contact .contact-option) {
  border-radius:0!important;
  box-shadow:none!important;
}
html[data-site-design="minimal-corporate"] :is(.section-action .text-link,.section-more a) {
  border-bottom:1px solid var(--brand);padding:8px 0 6px;
  text-decoration:none;
}

/* 03 / Editorial Warm: magazine serif and restrained solid rectangular CTAs. */
html[data-site-design="editorial-warm"] {
  --ny-heading-size:clamp(44px,5vw,78px);
  --ny-heading-family:var(--font-serif,Georgia,serif);
  --ny-heading-weight:400;
  --ny-heading-tracking:-.055em;
  --ny-heading-rule:1px;
  --ny-button-radius:2px;
  --ny-button-min:56px;
  --ny-button-weight:500;
  --ny-button-tracking:.04em;
  --ny-card-radius:2px;
  --ny-section-space:clamp(68px,8vw,135px);
}
html[data-site-design="editorial-warm"] #journal .section-heading::after {
  width:min(260px,90%);background:#b8a084;
}
html[data-site-design="editorial-warm"] #journal .journal-featured .journal-copy h3 {
  font-family:var(--font-serif,Georgia,serif);
  font-size:clamp(22px,2.45vw,38px);
  line-height:1.5;letter-spacing:-.025em;
}
html[data-site-design="editorial-warm"] #journal .journal-layout {
  gap:clamp(24px,5vw,76px);
}
html[data-site-design="editorial-warm"] :is(.section-action .text-link,.section-more a) {
  padding-bottom:9px;border-bottom:1px solid var(--brand);
  text-decoration:none;font-family:var(--font-serif,Georgia,serif);
  font-size:clamp(15px,1.4vw,20px);
}

/* 04 / Lifestyle Gallery: oversized English ornaments, open cards, underlined CTA. */
html[data-site-design="lifestyle-gallery"] {
  --ny-heading-size:clamp(48px,6.1vw,96px);
  --ny-heading-family:var(--font-serif,Georgia,serif);
  --ny-heading-weight:350;
  --ny-heading-tracking:-.075em;
  --ny-heading-rule:0px;
  --ny-button-radius:0;
  --ny-button-min:54px;
  --ny-button-weight:500;
  --ny-button-tracking:.015em;
  --ny-card-radius:0;
  --ny-section-space:clamp(60px,7.4vw,124px);
}
html[data-site-design="lifestyle-gallery"] :is(#property,#journal,#about) .section-heading::after {
  display:none;
}
html[data-site-design="lifestyle-gallery"] #property .section-heading h2 {
  max-width:100%;overflow-wrap:anywhere;
}
html[data-site-design="lifestyle-gallery"] :is(.section-action .text-link,.section-more a) {
  border:0;border-bottom:2px solid var(--brand);
  border-radius:0;text-decoration:none;
  padding:10px 0;
  font-family:var(--font-sans,system-ui);
}
html[data-site-design="lifestyle-gallery"] .hero-actions .button-outline {
  background:transparent;color:#fff;
  border-color:#fff;
}

/* 05 / Performance Tech: tabular captions, clear dividers and clipped corners. */
html[data-site-design="performance-tech"] {
  --ny-heading-size:clamp(34px,3.8vw,61px);
  --ny-heading-family:var(--font-sans,system-ui);
  --ny-heading-weight:850;
  --ny-heading-tracking:-.045em;
  --ny-heading-rule:4px;
  --ny-button-radius:0;
  --ny-button-min:56px;
  --ny-button-weight:750;
  --ny-button-tracking:.035em;
  --ny-card-radius:0;
  --ny-section-space:clamp(56px,6vw,100px);
}
html[data-site-design="performance-tech"] :is(.hero-actions .button,.page-button,#contact .contact-option) {
  clip-path:polygon(0 0,calc(100% - 13px) 0,100% 13px,100% 100%,0 100%);
}
html[data-site-design="performance-tech"] .hero .nayuta-template-kicker {
  font-family:ui-monospace,Consolas,monospace;
  letter-spacing:.12em;
}
html[data-site-design="performance-tech"] #property .section-heading::after {
  width:100%;max-width:420px;
}
html[data-site-design="performance-tech"] #service .service-item {
  border-block-start:1px solid #d4e4ed44;
}
html[data-site-design="performance-tech"] :is(.section-action .text-link,.section-more a) {
  border:1px solid var(--brand);
  padding:8px 22px;
  background:var(--pale);text-decoration:none;
}

/* 06 / Trust Premium: monumental classical titling and fine outline buttons. */
html[data-site-design="trust-premium"] {
  --ny-heading-size:clamp(42px,5vw,84px);
  --ny-heading-family:var(--font-serif,Georgia,serif);
  --ny-heading-weight:400;
  --ny-heading-tracking:.06em;
  --ny-heading-rule:1px;
  --ny-button-radius:0;
  --ny-button-min:60px;
  --ny-button-weight:450;
  --ny-button-tracking:.13em;
  --ny-card-radius:0;
  --ny-section-space:clamp(78px,9vw,148px);
}
html[data-site-design="trust-premium"] .section-heading h2 {
  text-transform:uppercase;
}
html[data-site-design="trust-premium"] .hero .nayuta-template-kicker {
  letter-spacing:.28em;
}
html[data-site-design="trust-premium"] #about .section-heading::after {
  width:160px;
}
html[data-site-design="trust-premium"] :is(.section-action .text-link,.section-more a) {
  min-height:54px;
  border-bottom:1px solid var(--brand);
  padding-bottom:13px;
  color:var(--brand);
  font-family:var(--font-serif,Georgia,serif);
  font-size:clamp(16px,1.6vw,24px);
  text-decoration:none;
}
html[data-site-design="trust-premium"] .hero-actions .button-primary {
  border-radius:0!important;
}
html[data-site-design="trust-premium"] #contact .contact-option {
  border-radius:0;
  border:1px solid var(--line);
}
/* On phones, ornamentation cannot displace the real Japanese heading. */
@media(max-width:760px){
  html[data-site-design] {
    --ny-section-space:clamp(40px,9vw,68px);
    --ny-button-min:48px;
  }
  html[data-site-design] :is(#property,#journal,#service,#about,#voice,#staff,#faq,#news,.section-standard) .section-heading h2 {
    font-size:clamp(28px,8.7vw,46px);
    line-height:1.15;
  }
  html[data-site-design="lifestyle-gallery"] :is(#property,#journal,#service,#about,#voice,#staff,#faq,#news) .section-heading h2 {
    font-size:clamp(37px,10vw,52px);
  }
  html[data-site-design] :is(#property,#journal,#service,#about,#voice,#staff,#faq,#news) .section-heading > p{
    margin-top:9px;font-size:13px;letter-spacing:0;
  }
  html[data-site-design] .hero .nayuta-template-kicker{
    font-size:11px;letter-spacing:.12em;
  }
  html[data-site-design] :is(.hero-actions .button,.hero-quick-submit,.page-button,.housing-button,#contact .contact-option) {
    min-height:48px;
    font-size:clamp(12px,3.4vw,15px);
  }
  html[data-site-design] :is(.section-action .text-link,.section-more a) {
    min-height:44px;font-size:14px;
  }
}
@media(prefers-reduced-motion:reduce) {
  html[data-site-design] :is(.hero-actions .button,.hero-quick-submit,.page-button,.housing-button,#contact .contact-option,
    #service .service-tabs a,.listing-card,.housing-card){
    transition:none!important;
  }
}

/*
 * Section order is chosen by the owner, not by the design. Never leave
 * original O-LAND's hardcoded visual numbers (03/04/05...) on a reordered
 * self-service page. Count the sections in actual rendered DOM order.
 * The original numeric text is aria-hidden in the O-LAND source shell.
 */
html[data-site-design] main#main {counter-reset:nayuta-home-section}
html[data-site-design] main#main > :is(section.section,section.section-standard){
  counter-increment:nayuta-home-section;
}
html[data-site-design] main#main .section-index[aria-hidden="true"] {
  font-size:0;
}
html[data-site-design] main#main .section-index[aria-hidden="true"]::before {
  content:counter(nayuta-home-section,decimal-leading-zero);
  font:500 clamp(13px,1.4vw,20px)/1.4 var(--font-sans,system-ui);
  letter-spacing:.08em;
  color:var(--brand);
}