.lower-page--first { overflow: hidden; background: linear-gradient(180deg,#fff 0,#f6fcfc 38%,#fff 100%); }
.first-icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.first-visit { position: relative; width: min(1120px,calc(100% - 48px)); margin: 0 auto; padding: clamp(76px,8vw,128px) 0 120px; color: #243b60; }
.first-visit::before { content: ""; position: absolute; z-index: 0; top: 140px; left: 50%; width: 100vw; height: 1100px; background: url(../../images/first/first-decor.svg) center top/1600px auto no-repeat; transform: translateX(-50%); pointer-events: none; }
.first-visit > * { position: relative; z-index: 1; }
.first-decor-section::after { content: ""; position: absolute; z-index: -1; width: 8px; height: 8px; border: 2px solid rgba(56,190,196,.22); border-radius: 45% 55% 48% 52%; transform: rotate(18deg); }
.first-intro { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(260px,.8fr); align-items: center; gap: clamp(36px,6vw,82px); margin-bottom: clamp(90px,10vw,150px); padding: clamp(48px,6vw,78px); border-radius: 48px 68px 52px 76px; background: rgba(255,255,255,.94); box-shadow: 0 22px 65px rgba(52,137,146,.1); }
.first-intro::after { top: -40px; right: 28%; }
.first-kicker,.first-heading>p { color: #19aebb; font-size: 13px; font-weight: 700; letter-spacing: .2em; }
.first-intro h2 { margin: 14px 0 27px; font-size: clamp(28px,3.2vw,42px); line-height: 1.55; letter-spacing: .08em; }
.first-intro__copy>p:not(.first-kicker) { font-size: 16px; line-height: 2.1; letter-spacing: .04em; }
.first-intro__copy>p+ p { margin-top: 18px; }
.first-intro .first-lead { font-weight: 700; }
.first-photo { position: relative; margin: 0; }
.first-photo img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 28px 36px 26px 40px; box-shadow: 0 16px 34px rgba(37,80,100,.14); }
.first-photo::before { content: ""; position: absolute; z-index: -1; inset: -12px 14px 12px -12px; border-radius: 34px 28px 40px 30px; background: #dff6f2; transform: rotate(-2deg); }
.first-photo--intro { width: min(100%, 390px); aspect-ratio: 1; justify-self: end; }
.first-photo--intro img { height: 100%; aspect-ratio: auto; object-position: 56% center; }
.first-photo--intro::after { content: "✦"; position: absolute; top: -17px; right: -7px; color: #f4b8c7; font-size: 18px; transform: rotate(11deg); }
.first-section { margin-top: clamp(100px,11vw,160px); }
.first-heading { margin-bottom: clamp(42px,5vw,64px); text-align: center; }
.first-heading h2 { margin-top: 10px; color: #173b72; font-size: clamp(30px,4vw,45px); letter-spacing: .11em; }
.first-heading h2::after { content: ""; display: block; width: 38px; height: 3px; margin: 20px auto 0; border-radius: 50%; background: #39c7c3; transform: rotate(-2deg); }
.first-heading>span { display: block; margin-top: 20px; color: #60708a; font-size: 16px; line-height: 1.8; }
.first-video { max-width: 900px; margin-inline: auto; }
.first-video__frame { position: relative; overflow: hidden; aspect-ratio: 16/9; border: 12px solid #fff; border-radius: 40px 55px 38px 50px; background: #dff4f5; box-shadow: 0 20px 55px rgba(42,100,120,.13); transform: rotate(-.25deg); }
.first-video__frame iframe { width: 100%; height: 100%; border: 0; }
.first-note-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.first-note { padding: 38px 30px; border-radius: 32px 42px 30px 38px; background: #fff; box-shadow: 0 14px 38px rgba(46,97,122,.08); }
.first-note:nth-child(2) { background: #fff7ea; transform: translateY(22px) rotate(.3deg); }
.first-note:nth-child(3) { background: #fff2f6; }
.first-note svg,.first-prepare__icon svg { width: 54px; height: 54px; margin-bottom: 24px; fill: none; stroke: #21b8bc; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.first-note:nth-child(2) svg { stroke: #e3a33b; }.first-note:nth-child(3) svg { stroke: #ed8eaa; }
.first-note h3 { margin-bottom: 15px; font-size: 20px; letter-spacing: .06em; }.first-note p { color: #52637d; font-size: 15px; line-height: 1.9; }
.first-prepare__inner { display: grid; grid-template-columns: 150px 1fr; align-items: center; gap: 40px; max-width: 900px; margin: auto; padding: 42px 52px; border: 2px dashed #c7e9e6; border-radius: 34px 48px 38px 44px; background: rgba(255,255,255,.88); }
.first-prepare__icon { display: grid; place-items: center; width: 130px; height: 130px; border-radius: 44% 56% 48% 52%; background: #e8f9f6; transform: rotate(-3deg); }.first-prepare__icon svg { margin: 0; width: 64px; height: 64px; }
.first-prepare ul { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px 24px; padding: 0; list-style: none; }
.first-prepare li { position: relative; padding: 18px 20px 18px 44px; border-radius: 18px; background: #fff; font-size: 15px; font-weight: 700; box-shadow: 0 8px 22px rgba(50,105,120,.06); }
.first-prepare li::before { content: "✓"; position: absolute; left: 18px; color: #29bab7; font-size: 18px; }
.first-flow-section { position: relative; padding: clamp(70px,7vw,105px) clamp(22px,5vw,72px); border-radius: 70px 90px 66px 85px; background: rgba(235,249,250,.78); }
.first-flow-section::after { top: 140px; left: -9px; }
.first-flow { position: relative; max-width: 920px; margin: auto; padding: 0; list-style: none; }
.first-flow::before { content: ""; position: absolute; top: 15px; bottom: 30px; left: 55px; width: 3px; background: repeating-linear-gradient(to bottom,#9edbd8 0 7px,transparent 7px 14px); }
.first-flow__item { display: grid; grid-template-columns: 112px minmax(0,1fr) minmax(0,240px); gap: 28px; align-items: center; position: relative; padding: 28px 0; }
.first-flow__item:nth-child(even) .first-photo { transform: rotate(1.2deg); }
.first-flow__marker { position: relative; z-index: 1; display: grid; place-items: center; width: 112px; height: 112px; border: 8px solid #e8f8f7; border-radius: 46% 54% 48% 52%; color: #fff; background: #51c8c4; box-shadow: 0 8px 22px rgba(50,157,160,.18); transform: rotate(-2deg); }
.first-flow__item:nth-child(3n+2) .first-flow__marker { background: #f4b553; transform: rotate(2deg); }.first-flow__item:nth-child(3n) .first-flow__marker { background: #ef98ad; }
.first-flow__marker b { font-size: 13px; letter-spacing: .12em; }.first-flow__marker svg { width: 42px; height: 42px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.first-flow__body h3 { margin-bottom: 13px; color: #173b72; font-size: 21px; letter-spacing: .06em; }.first-flow__body p { color: #52637d; font-size: 15px; line-height: 1.95; }.first-flow__sub { margin-top: 10px; color: #159ca8!important; font-weight: 700; }
.first-flow__item:not(:has(.first-photo)) { grid-template-columns: 112px minmax(0,1fr); }.first-flow__item .first-photo { width: 100%; max-width: 240px; }.first-flow__item .first-photo img { height: 180px; aspect-ratio: auto; object-fit: cover; border-radius: 24px 30px 22px 34px; }
.first-policy { max-width: 960px; margin-inline: auto; }
.first-policy__intro { display: flex; gap: 26px; align-items: flex-start; padding: 36px 40px; border-radius: 32px 42px 35px 45px; background: #fff8e9; }
.first-policy__intro svg { flex: 0 0 52px; width: 52px; height: 52px; fill: none; stroke: #e4a23d; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }.first-policy__intro h3 { margin-bottom: 10px; color: #bb7428; font-size: 19px; }.first-policy__intro p,.first-policy__rules p,.first-policy__closing { font-size: 15px; line-height: 1.95; }
.first-policy__rules { display: grid; grid-template-columns: repeat(2,1fr); gap: 20px; margin-top: 22px; }.first-policy__rules>div { display: flex; gap: 18px; padding: 30px; border: 1px solid #f1d7a8; border-radius: 26px; background: #fff; }.first-policy__rules span { color: #e29a38; font-size: 30px; font-weight: 700; }.first-policy__rules strong { display: block; margin-bottom: 10px; color: #b86e25; }.first-policy__closing { margin-top: 26px; padding: 0 18px; }
.first-contact { margin-top: 100px; margin-bottom: clamp(72px, 8vw, 112px); padding: 56px 24px; border-radius: 42px 58px 44px 54px; background: linear-gradient(135deg,#e5faf7,#fff0f5); text-align: center; }.first-contact>p { margin-bottom: 28px; font-size: 18px; font-weight: 700; }.first-contact>div { display: flex; justify-content: center; gap: 18px; flex-wrap: wrap; }
@media (max-width:900px){.first-intro{grid-template-columns:1fr}.first-photo--intro{width:min(100%,520px);margin:auto;aspect-ratio:3/2;justify-self:center}.first-note-grid{grid-template-columns:1fr}.first-note:nth-child(2){transform:none}.first-flow__item{grid-template-columns:90px minmax(0,1fr);gap:22px}.first-flow::before{left:44px}.first-flow__marker{width:90px;height:90px}.first-flow__item .first-photo{grid-column:2;max-width:420px}.first-flow__item .first-photo img{height:clamp(180px,32vw,280px)}.first-flow__item:not(:has(.first-photo)){grid-template-columns:90px minmax(0,1fr)}.first-policy__rules{grid-template-columns:1fr}}
@media (max-width:640px){.first-visit{width:min(100% - 28px,1120px);padding-top:52px}.first-intro{padding:38px 24px;border-radius:32px}.first-intro__copy>p:not(.first-kicker){font-size:15px}.first-video__frame{border-width:7px;border-radius:28px}.first-prepare__inner{grid-template-columns:1fr;padding:30px 22px}.first-prepare__icon{width:100px;height:100px;margin:auto}.first-prepare ul{grid-template-columns:1fr}.first-flow-section{padding:60px 16px;border-radius:42px}.first-flow::before{left:32px}.first-flow__item,.first-flow__item:not(:has(.first-photo)){grid-template-columns:65px minmax(0,1fr);gap:16px;padding:24px 0}.first-flow__marker{width:65px;height:65px;border-width:5px}.first-flow__marker svg{width:28px;height:28px}.first-flow__marker b{font-size:10px}.first-flow__body h3{font-size:18px}.first-flow__body p{font-size:14px}.first-flow__item .first-photo{grid-column:2}.first-policy__intro{display:block;padding:28px 24px}.first-policy__intro svg{margin-bottom:18px}.first-policy__rules>div{padding:24px 20px}.first-policy__rules span{font-size:24px}}

/* Page typography balance */
.first-kicker,.first-heading>p,.first-flow__marker b { font-size: 14px; }
.first-intro h2 { font-size: clamp(30px,3.5vw,44px); line-height: 1.5; letter-spacing: .07em; }
.first-heading h2 { font-size: clamp(34px,4.2vw,48px); line-height: 1.45; letter-spacing: .085em; }
.first-note h3,.first-policy__intro h3 { font-size: 21px; line-height: 1.55; }
.first-flow__body h3 { font-size: 22px; line-height: 1.55; }
.first-intro__copy>p:not(.first-kicker),
.first-heading>span,
.first-note p,
.first-prepare li,
.first-flow__body p,
.first-policy__intro p,
.first-policy__rules p,
.first-policy__closing { font-size: 16px; }
@media (max-width:640px) {
  .first-intro__copy>p:not(.first-kicker),.first-note p,.first-prepare li,.first-flow__body p,.first-policy__intro p,.first-policy__rules p,.first-policy__closing { font-size: 16px; }
  .first-flow__marker b { font-size: 14px; }
}

/* Full-bleed solid background for pre-visit guidance. */
.first-before { position: relative; padding: clamp(76px,7vw,104px) 0 clamp(88px,8vw,118px); }
.first-before::before { content: ""; position: absolute; z-index: -1; inset: 0 auto 0 50%; width: 100vw; background: #eef8f8; transform: translateX(-50%); }
.first-before .first-heading { padding-inline: 20px; }
.first-before .first-note { background: rgba(255,255,255,.94); box-shadow: 0 18px 42px rgba(51,84,107,.1); }
.first-before .first-note:nth-child(2),.first-before .first-note:nth-child(3) { background: rgba(255,255,255,.94); }
@media (max-width:640px) { .first-before { padding: 64px 14px 72px; } }

/* Clear, cheerful section rhythm using restrained solid colors. */
.first-prepare { position: relative; padding: clamp(72px,7vw,96px) 0; }
.first-prepare::before { content: ""; position: absolute; z-index: -1; inset: 0 auto 0 50%; width: 100vw; background: #fff5d9; transform: translateX(-50%); }
.first-prepare__inner { border-color: #86d7cf; background: rgba(255,255,255,.9); }
.first-flow-section { background: #e2f5f4; }
.first-policy { position: relative; padding: clamp(72px,7vw,96px) clamp(20px,4vw,52px); }
.first-policy::before { content: ""; position: absolute; z-index: -1; inset: 0; border-radius: 52px; background: #fff0e8; }
@media (max-width:640px) {
  .first-prepare { padding: 60px 14px; }
  .first-flow-section {
    margin-inline: calc(50% - 50vw);
    padding-inline: 30px;
    border-radius: 0;
  }
  .first-policy {
    margin-inline: calc(50% - 50vw);
    padding: 60px 30px;
  }
  .first-policy::before { border-radius: 0; }
}