/* Top-page redesign, with shared header/footer styling for the reasons page. */
.renewal {overflow:hidden;}
.renewal h2,.renewal p {font-weight:400;}
.renewal-inner {width:min(68%,1300px);margin-inline:auto;}
.renewal-hero {position:relative;background:linear-gradient(#d4d2c7,#b4b3a9);aspect-ratio:1920 / 1111;}
.hero-copy {position:relative;z-index:1;}
.hero-lead {font-size:clamp(20px,1.8vw,35px);letter-spacing:.3em;color:#161510;}
.renewal #renewal-title {font-family:Georgia,'Times New Roman',serif;font-size:clamp(22px,3.2vw,62px);letter-spacing:.15em;color:#a39a85;line-height:1.4;}
.hero-sub {font-size:clamp(13px,1.3vw,24px);letter-spacing:.2em;color:#161510;}
.hero-building {display:block;width:100%;max-width:100%;height:0;min-height:0;flex:1 1 0%;object-fit:contain;object-position:center bottom;margin:0;}
.renewal-hero {overflow:hidden;isolation:isolate;}
.hero-slide {position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity 1.2s ease;z-index:0;}
.hero-slide:first-child {display:flex;flex-direction:column;padding-top:clamp(16px,3vw,58px);}
.hero-slide:first-child .hero-copy {flex:none;}
.hero-slide.is-active {opacity:1;pointer-events:auto;z-index:1;}
.hero-slide-photo {position:absolute;inset:0;background:linear-gradient(#d4d2c7,#b4b3a9);}
.hero-slide-photo picture {display:block;width:100%;height:100%;}
.hero-slide-photo img {display:block;width:100%;height:100%;object-fit:contain;}
.hero-slider-controls:not([hidden]) {position:absolute;z-index:3;bottom:var(--hero-controls-bottom,12px);left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;padding:5px 12px;border-radius:24px;background:#302b26b3;}
.hero-slider-controls button {display:grid;place-items:center;width:28px;height:30px;padding:0;border:0;background:none;color:#fff;cursor:pointer;}
.hero-slider-controls [data-hero-slide]::before {content:'';width:8px;height:8px;border:1px solid #fff;border-radius:50%;}
.hero-slider-controls [aria-pressed="true"]::before {background:#fff;}
.hero-slider-controls .hero-slider-toggle {width:auto;min-width:58px;font-size:11px;white-space:nowrap;}
@media (prefers-reduced-motion:reduce) { .hero-slide {transition:none;} }
.renewal-points {background:#c8c6bc;display:grid;grid-template-columns:1fr 1fr 1fr 1fr .8fr;padding:26px 3%;align-items:center;font-size:clamp(13px,1.4vw,26px);line-height:1.5;letter-spacing:.08em;}
.renewal-points li {padding:0 12px;border-right:1px solid #726d64; line-height: 135%;}
.renewal-points li:last-child {border:0;}
.renewal-points em {font-style:normal;color:#870e0c;}
.renewal-points li:nth-child(3) {line-height:1.1;}
.renewal-points small {}
.renewal-announcement {background:var(--renewal-brown);color:white;padding:75px 20px 85px;}
.renewal-announcement.reveal-ready > * {opacity:0;transition:opacity 1s ease;}
.renewal-announcement.reveal-ready > :nth-child(2) {transition-delay:.12s;}
.renewal-announcement.reveal-ready > :nth-child(3) {transition-delay:.24s;}
.renewal-announcement.reveal-ready > :nth-child(4) {transition-delay:.36s;}
.renewal-announcement.reveal-ready.is-revealed > * {opacity:1;}
.renewal-announcement.reveal-ready:focus-within > * {opacity:1;transition:none;}
@media (prefers-reduced-motion:reduce) {
  .renewal-announcement.reveal-ready > * {opacity:1;transition:none;}
}
.property-name {font-size:clamp(18px,2.1vw,36px);letter-spacing:.15em;}
.renewal-announcement h2 {color:var(--renewal-gold);font-size:clamp(26px,3.7vw,66px);letter-spacing:.04em;}
.modelroom-message {font-size:clamp(21px,2.9vw,48px);letter-spacing:.15em;}
.renewal-actions {display:flex;justify-content:center;gap:28px;margin-top:42px;}
.renewal-button {position:relative;display:flex;align-items:center;justify-content:center;min-height:56px;width:320px;max-width:100%;padding:14px 30px 14px 22px;background:#a88e79;color:#fff;text-decoration:none;font-size:16px;letter-spacing:.1em;transition:filter .2s;}
.renewal-button.appointment {background:var(--renewal-red);}
:is(#toppage, #reasons) #mainContentsBox .renewal-button {color:#fff;}
:is(#toppage, #reasons) #mainContentsBox .feature-link {color:#d3d0c9;}
.renewal-button::after {content:'';position:absolute;right:23px;width:16px;height:28px;border-right:1px solid #fff;transform:skew(-32deg);}
.renewal-button:hover {filter:brightness(1.15);}
.renewal-updates {padding:50px 0 80px;background:#e2d8cf url('../img/renewal/background.webp') center/cover;}
.renewal-payment h2 {display:flex;align-items:center;gap:24px;font-size:26px;letter-spacing:.4em;}
.renewal-payment h2::before,.renewal-payment h2::after {content:'';flex:1;border-top:1px solid #bdb5a5;}
.payment-lead {font-size:20px;margin:12px 0 22px;}
.payment-table {margin:auto;box-shadow:4px 4px 4px #8d8179;letter-spacing:.05em;}
.payment-property {display:grid;grid-template-columns:1.1fr 1fr 1fr;background:white;align-items:center;padding:10px 0;color:#171611;}
.payment-property p {border-right:1px solid #333;font-size:22px;line-height:1.4;}
.payment-property p:last-child {border:0;}
.payment-property strong {font-size:36px;font-weight:400;}
.payment-property small {font-size:14px;}
.payment-property b {font-size:30px;font-weight:400;line-height: 90%;}
.payment-monthly {background:var(--renewal-brown);color:#fff;display:flex;justify-content:center;align-items:center;gap:24px;padding:16px;}
.payment-monthly p {font-size:24px;white-space:nowrap;}
.payment-monthly strong {font-size:clamp(38px,4.4vw,82px);font-weight:400;line-height:1.2;margin:0 5px;}
.payment-monthly .payment-bonus {font-size:16px;line-height:1.5;text-align:left;}
.payment-bonus b {font-size:30px;font-weight:400; line-height: 100%;}
.payment-notes {font-size:11px;text-align:left;line-height:1.8;margin:45px 0 55px;}
.renewal-information {background:#fff;display:grid;grid-template-columns:34% 66%;align-items:center;padding:30px 0;}
.renewal-information h2 {font-family:Georgia,serif;font-size:22px;letter-spacing:.3em;}
.news-content {text-align:left;}
.news-item {display:flex;gap:20px;padding:18px 16px;border-bottom:1px solid #777;font-size:13px;letter-spacing:.08em;line-height:1.8;}
.news-item time {white-space:nowrap;}
.news-item a {color:inherit;}
.news-archive summary {font-size:11px;cursor:pointer;text-align:right;padding:10px 20px 0;}
.news-archive[open] {max-height:200px;overflow:auto;}
.renewal-topics {padding-top:46px;}
.renewal-topics h2 {font-family:Georgia,serif;letter-spacing:.35em;font-size:23px;margin-bottom:26px;}
.topics-track {display:flex;gap:30px;padding-left:16%;padding-right:16%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;scroll-padding-left:16%;}
.topics-track::-webkit-scrollbar {display:none;}
.topics-track {cursor:grab;user-select:none;-webkit-user-select:none;}
.topics-track .topic-card {cursor:grab;}
.topics-track.is-dragging {scroll-snap-type:none;scroll-behavior:auto;}
.topics-track.is-repositioning {scroll-snap-type:none;scroll-behavior:auto;}
.topics-track.is-dragging,.topics-track.is-dragging .topic-card {cursor:grabbing;}
.topic-card {flex:0 0 calc((100vw * .68 - 60px)/3);width:calc((100vw * .68 - 60px)/3);aspect-ratio:1;scroll-snap-align:start;display:block;color:inherit;text-decoration:none;overflow:hidden;}
.topic-card img {display:block;width:100%;height:100%;object-fit:cover;transition:filter .2s;}
a.topic-card:hover img {filter:brightness(1.08);}
.topic-owners {background:#536189;color:#fff;padding:0 15px 20px;display:flex;flex-direction:column;justify-content:space-between;line-height:1.6;font-size:clamp(9px,1vw,18px);}
.owners-en {color:#b6b080;font-family:Georgia,serif;font-size:clamp(15px,2vw,36px);white-space:nowrap;letter-spacing:0;}
.owners-title {font-size:clamp(26px,3vw,54px);}
.owners-title span {color:#e4d17a;}
.topics-controls {display:flex;justify-content:center;gap:22px;margin-top:30px;}
.topics-controls button {border:0;background:transparent;width:24px;height:30px;cursor:pointer;display:grid;place-items:center;}
.topics-controls button::before {content:'';width:12px;height:12px;border-radius:50%;background:white;}
.topics-controls button[aria-pressed="true"]::before {background:#777;}
.renewal-lifestyle {margin-top:32px;font-size:13px;scroll-margin-top:140px;}
.renewal-lifestyle summary {cursor:pointer;}
.renewal-lifestyle .lps {margin-top:30px;background:#fff;letter-spacing:normal;}
.renewal-lifestyle .contets {margin:25px auto;}
.renewal-lifestyle .tabs input {position:absolute;opacity:0;}
.renewal-lifestyle .tab-buttons {display:flex;gap:10px;}
.renewal-lifestyle .tab-buttons label {flex:1;padding:16px 5px;background:#eee;color:#222;cursor:pointer;}
.renewal-lifestyle #tab1:checked~.tab-buttons label[for="tab1"] {background:#b7cbb2;}
.renewal-lifestyle #tab2:checked~.tab-buttons label[for="tab2"] {background:#a9c4cf;}
.renewal-lifestyle #tab3:checked~.tab-buttons label[for="tab3"] {background:#cbbf97;}
.renewal-lifestyle .content {display:none;}
.renewal-lifestyle #tab1:checked~.tab-contents .content1,.renewal-lifestyle #tab2:checked~.tab-contents .content2,.renewal-lifestyle #tab3:checked~.tab-contents .content3 {display:block;}
.renewal-lifestyle .pc {display:block;}
.renewal-lifestyle .sp {display:none;}
.renewal-features {background:var(--renewal-brown);color:#d3d0c9;padding:80px 0 100px;position:relative;}
.renewal-features::before {content:'';position:absolute;left:11%;right:11%;top:125px;bottom:0;border:1px solid #dfd9d0;pointer-events:none;}
.renewal-features section {position:relative;}
.feature-copy {text-align:left;position:relative;z-index:1;}
.feature-copy h2 {font-family:Georgia,serif;font-size:clamp(26px,2.6vw,48px);letter-spacing:.35em;line-height:1.4;margin-bottom:25px;}
.feature-copy .feature-lead {font-size:clamp(15px,1.3vw,24px);letter-spacing:.3em;margin-bottom:28px;}
.feature-copy>p:not(.feature-lead) {font-size:clamp(11px,1vw,18px);line-height:2;letter-spacing:.23em;}
.feature-link {display:flex;align-items:center;gap:22px;color:inherit;font-size:10px;letter-spacing:.2em;text-decoration:none;margin-top:25px;width:260px;max-width:100%;min-height:40px;}
.feature-link span {height:1px;background:#aaa298;flex:1;position:relative;}
.feature-link span::after {content:'';height:15px;width:1px;background:#aaa298;position:absolute;right:0;bottom:0;transform:rotate(-60deg);transform-origin:bottom;}
.feature-link:hover {color:white;}
.feature-image {display:block;position:relative;z-index:1;}
.feature-image img {display:block;width:100%;height:100%;object-fit:cover;}
.feature-image.reveal-ready img {opacity:0;transform:translateX(var(--image-reveal-offset));transition:transform 1.1s cubic-bezier(.22,1,.36,1),opacity 1.1s ease;}
.feature-location .feature-image,.feature-room .feature-image {--image-reveal-offset:clamp(-120px,-8vw,-36px);}
.feature-design .feature-image {--image-reveal-offset:clamp(36px,8vw,120px);}
.feature-image.reveal-ready.is-revealed img {opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce) {
  .feature-image.reveal-ready img {opacity:1;transform:none;transition:none;}
}
.feature-location .feature-copy {margin-left:16%;padding-bottom:48px;}
.feature-location .feature-image {width:93%;height:auto;}
.feature-location .feature-image {aspect-ratio:2.45;}
.feature-room {display:grid;grid-template-columns:59% 41%;align-items:center;margin-top:110px;}
.feature-room .feature-copy {padding:35px;}
.feature-design {display:grid;grid-template-columns:47% 53%;align-items:center;margin-top:110px;}
.feature-design .feature-copy {padding-left:34%;padding-right:35px;}
.feature-design .feature-image {aspect-ratio:1.46;}
.renewal-bottom {background:#ececec;padding:70px 20px 65px;}
.renewal-bottom .renewal-actions {margin-top:0;}
:is(#toppage, #reasons) .renewal-bottom #attention {background:transparent;margin:50px auto 0;padding:0;max-width:1000px;text-align:left;}
:is(#toppage, #reasons) .renewal-bottom #attention .inlineBox {width:100%;}
:is(#toppage, #reasons) .renewal-bottom #attention .cautionUl {font-size:10px;}
.renewal-partners {display:grid;grid-template-columns:repeat(3,1fr);gap:30px;padding:60px 0;}
.renewal-partners img {width:100%;height:auto;}
:is(.renewal-bottom .renewal-button, .renewal-partners > a).reveal-ready {opacity:0;transition:opacity 1s ease,filter .2s;}
:is(.renewal-bottom .renewal-button, .renewal-partners > a).reveal-ready:nth-child(2) {transition-delay:.12s,0s;}
.renewal-partners > a.reveal-ready:nth-child(3) {transition-delay:.24s,0s;}
:is(.renewal-bottom .renewal-button, .renewal-partners > a).reveal-ready.is-revealed {opacity:1;}
:is(.renewal-bottom .renewal-button, .renewal-partners > a).reveal-ready:focus-visible {opacity:1;transition:none;}
@media (prefers-reduced-motion:reduce) {
  :is(.renewal-bottom .renewal-button, .renewal-partners > a).reveal-ready {opacity:1;transition:none;}
}
.renewal-campaign {position:fixed;right:18px;bottom:24px;max-width:30vw;z-index:6;}
.renewal-campaign a {display:block;overflow:hidden;border:0;border-radius:8px;box-shadow:0 2px 12px #0003;}
.renewal-campaign img {display:block;width:100%;height:auto;}
.campaign-close {position:absolute;right:0;top:-39px;width:32px;height:32px;border:0;border-radius:50%;color:#fff;background:#302720;font:26px/1 sans-serif;cursor:pointer;}
:is(#toppage, #reasons) :is(a,button,summary,input):focus-visible {outline:3px solid #be9953;outline-offset:4px;}
@media (max-width:1200px) and (min-width:961px) {
  .renewal-inner {width:80%;}
  .payment-monthly {gap:16px;}
  .payment-monthly p {font-size:19px;}
  .news-item {display:block;}
  .news-item time {display:block;}
  .renewal-information h2 {font-size:18px;}
}
@media (max-width:960px) {
  .renewal-inner {width:88%;}
  .renewal-points {padding:22px 4%;font-size:13px;grid-template-columns:repeat(6,1fr);gap:20px 0;}
  .renewal-points li {grid-column:span 2;}
  .renewal-points li:nth-child(3) {border:0;}
  .renewal-points li:nth-child(4),.renewal-points li:nth-child(5) {grid-column:span 3;}
  .renewal-announcement {padding:50px 20px;}
  .renewal-announcement h2 {margin-top:24px;}
  .renewal-button {width:280px;font-size:14px;}
  .renewal-actions {gap:16px;}
  .payment-table {width:100%;}
  .payment-monthly p {font-size:20px;}
  .payment-monthly strong {font-size:48px;}
  .renewal-information {grid-template-columns:1fr;padding:25px;}
  .renewal-information h2 {font-size:16px;}
  .news-item {font-size:12px;}
  .topics-track {padding-left:6%;padding-right:6%;scroll-padding-left:6%;gap:20px;}
  .topic-card {flex-basis:34vw;width:34vw;}
  .topic-owners {font-size:13px;}
  .owners-en {font-size:26px;}
  .owners-title {font-size:36px;}
  .renewal-features {padding:55px 0 65px;}
  .renewal-features::before {left:6%;right:6%;top:100px;}
  .feature-location .feature-copy {margin-left:10%;}
  .feature-room,.feature-design {margin-top:65px;grid-template-columns:55% 45%;}
  .feature-room .feature-copy {padding:25px;}
  .feature-design {grid-template-columns:45% 55%;}
  .feature-design .feature-copy {padding-left:20%;padding-right:20px;}
  .feature-copy h2 {font-size:23px;letter-spacing:.23em;}
  .feature-copy .feature-lead {font-size:14px;letter-spacing:.12em;}
  .feature-copy>p:not(.feature-lead) {font-size:11px;letter-spacing:.1em;}
  .renewal-campaign {bottom:76px;max-width:42vw;width:320px;}
  .renewal-partners {gap:18px;padding:40px 0;}
  .renewal-lifestyle {scroll-margin-top:80px;}
}
@media (max-width:600px) {
  .hero-lead {font-size:17px;letter-spacing:.16em;}
  .renewal #renewal-title {font-size:24px;max-width:340px;letter-spacing:.1em;margin:16px auto;line-height:1.5;overflow-wrap:normal;}
  .hero-sub {font-size:11px;letter-spacing:.08em;}
  .renewal-points {font-size:11px;padding:20px 3%;align-items:stretch;grid-auto-rows:1fr;}
  .renewal-points li {padding:6px;min-height:64px;min-width:0;display:flex;align-items:center;justify-content:center;box-sizing:border-box;}
  .renewal-points li:nth-child(3) {line-height:1.35;}
  .renewal-points .point-copy {text-align:center;}
  .renewal-points .point-distance {display:block;white-space:nowrap;}
  .renewal-points li:nth-child(3) em {white-space:nowrap;letter-spacing:0;font-size:clamp(9px,2.6vw,11px);}
  .property-name {font-size:15px;letter-spacing:.05em;}
  .renewal-announcement h2 {font-size:25px;line-height:1.7;letter-spacing:0;}
  .modelroom-message {font-size:20px;letter-spacing:.06em;}
  .renewal-announcement .property-name {margin:0;}
  .renewal-announcement h2 {margin:1px 0 0 0;}
  .renewal-announcement .modelroom-message {margin:0;}
  .renewal-actions {flex-direction:column;align-items:center;gap:12px;margin-top:28px;}
  .renewal-button {width:300px;min-height:52px;}
  .renewal-updates {padding:35px 0 45px;}
  .renewal-payment h2 {font-size:22px;gap:18px;}
  .payment-lead {font-size:15px;margin:12px 0 20px;}
  .payment-property {grid-template-columns:1fr 1fr;padding:12px 0;}
  .payment-property p {font-size:14px;}
  .payment-property p:first-child {grid-column:1/-1;border:0;border-bottom:1px solid #ddd;padding:0 0 10px;margin-bottom:10px;font-size:20px;}
  .payment-property strong {font-size:26px;}
  .payment-property b {font-size:25px;}
  .payment-property small {font-size:12px;}
  .payment-monthly {flex-wrap:wrap;gap:8px 12px;padding:18px 8px;}
  .payment-monthly p {font-size:16px;}
  .payment-monthly strong {font-size:38px;margin:0 3px;}
  .payment-monthly .payment-bonus {width:100%;text-align:center;font-size:13px;}
  .payment-bonus br {display:none;}
  .payment-bonus b {font-size:21px;margin-left:10px;}
  .payment-notes {font-size:10px;letter-spacing:0;margin:24px 0 32px;}
  .renewal-information {padding:25px 16px;}
  .news-item {display:block;padding: 10px;px 0;font-size:12px;}
  .news-item time {display:block;color:#8c7d6f;font-size:11px;}
  .renewal-topics {padding-top:35px;}
  .topics-track {gap:18px;padding-left:16vw;padding-right:16vw;scroll-padding-left:0;scroll-padding-right:0;}
  .topic-card {flex-basis:68vw;width:68vw;scroll-snap-align:center;}
  .topic-owners {font-size:13px;}
  .owners-en {font-size:27px;}
  .owners-title {font-size:40px;}
  .renewal-lifestyle summary {font-size:11px;letter-spacing:0;}
  .renewal-lifestyle .pc {display:none;}
  .renewal-lifestyle .sp {display:block;}
  .renewal-lifestyle .tab-buttons {gap:4px;}
  .renewal-lifestyle .tab-buttons label {font-size:11px;}
  .renewal-features {padding:45px 0 55px;}
  .renewal-features::before {top:84px;}
  .feature-copy h2 {font-size:20px;letter-spacing:.24em;margin-bottom:20px;}
  .feature-copy .feature-lead {font-size:14px;margin-bottom:5px;}
  .feature-copy>p:not(.feature-lead) {font-size:10px;line-height:1.5;}
  .feature-location .feature-copy {padding-bottom:25px;}
  .feature-location .feature-image {width:94%;aspect-ratio:1.65;}
  .feature-location .feature-image img {object-position:62% center;}
  .feature-room,.feature-design {display:flex;flex-direction:column;align-items:stretch;margin-top:45px;}
  .feature-room .feature-copy,.feature-design .feature-copy {order:0;padding:0 10% 25px;}
  .feature-room .feature-image,.feature-design .feature-image {order:1;width:94%;aspect-ratio:1.5;}
  .feature-room .feature-image {margin-left:auto;}
  .feature-design .feature-image {margin:0;}
  .feature-link {margin-top:0;width:215px;}
  .renewal-bottom {padding:45px 6%;}
  :is(#toppage, #reasons) .renewal-bottom #attention {margin-top:30px;}
  .renewal-partners {grid-template-columns:1fr;gap:18px;width:66%;padding:35px 0;}
  .renewal-campaign {right:12px;bottom:75px;width:calc(100% - 24px);max-width:none;}
  .campaign-close {width:30px;height:30px;top:-35px;}
}
@media (prefers-reduced-motion:reduce) { .renewal * {scroll-behavior:auto!important;transition:none!important;} }
@media (min-width:961px) {
}
@media (max-width:960px) {
}
/* Match the second slide's existing smartphone artwork ratio. */
@media (max-width:768px) {
  .renewal-hero {aspect-ratio:1466 / 1265;}
  .hero-slider-controls:not([hidden]) {gap:2px;padding:2px 8px;}
  .hero-slider-controls button {width:24px;height:24px;}
  .hero-slider-controls [data-hero-slide]::before {width:6px;height:6px;}
  .hero-slider-controls .hero-slider-toggle {min-width:46px;font-size:10px;}
  .hero-slide-photo:nth-child(n+3) img {object-fit:cover;}
  .hero-slide:first-child {padding-top:20px;}
  .hero-slide:first-child .hero-copy {position:relative;top:20px;}
  .hero-slide:first-child .hero-building {width:125%;max-width:none;align-self:center;}
  .hero-slide:first-child .hero-lead {font-size:clamp(13px,2.8vw,20px);letter-spacing:.16em;}
  .renewal .hero-slide:first-child #renewal-title {font-size:clamp(17px,4.3vw,32px);max-width:none;margin:0;letter-spacing:.08em;line-height:1.35;}
  .hero-slide:first-child .hero-sub {font-size:clamp(9px,2.3vw,16px);letter-spacing:.08em;}
}
@media (max-width:360px) {
  .hero-slide:first-child .hero-building {width:130%;}
}
