:root{--teal:#087f72;--teal-dark:#076c5d;--navy:#17342e;--blue:#e5f6ef;--mist:#f8faf9;--peach:#f6df55;--white:#fff;--text:#171928;--muted:#65726d;--line:#e4ebe8;--radius:18px;--shadow:0 20px 50px rgba(8,127,114,.1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;background:#fff;line-height:1.8;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}h1,h2,h3,p{margin-top:0}button,a{touch-action:manipulation}.site-header{height:88px;display:flex;align-items:center;gap:34px;padding:0 clamp(22px,4vw,72px);background:rgba(255,255,255,.96);backdrop-filter:blur(15px);position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:18px;margin-right:auto}.brand-lockup>img{width:126px;height:auto}.company-lockup{padding-left:18px;border-left:1px solid #dfe5e2}.company-lockup b{display:block;font-size:.76rem;line-height:1.2;letter-spacing:.05em}.company-lockup small{display:block;font-size:.5rem;color:#7a8782;letter-spacing:.12em;margin-top:5px}.brand b{display:block}.brand small{display:block}.site-header nav{display:flex;gap:28px;font-size:.84rem;font-weight:600}.site-header nav a{transition:.2s}.site-header nav a:hover{color:var(--teal)}.button{display:inline-flex;align-items:center;justify-content:center;gap:22px;min-height:60px;padding:0 28px;border-radius:9px;background:linear-gradient(110deg,#79bf20,#0ab89f 52%,#087ce0);color:#fff;font-weight:700;box-shadow:0 14px 34px rgba(8,165,176,.27);transition:transform .2s,box-shadow .2s}.button:hover{transform:translateY(-2px);box-shadow:0 17px 38px rgba(8,165,176,.34)}.button-small{min-height:46px;padding:0 22px;font-size:.84rem;box-shadow:none}.hero{min-height:720px;display:grid;grid-template-columns:minmax(0,.88fr) minmax(480px,1.12fr);padding:clamp(54px,7vw,92px) max(22px,calc((100vw - 1180px)/2));gap:44px;align-items:center;background:#fff;overflow:hidden}.hero-copy{position:relative;z-index:2}.eyebrow{font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;font-weight:700;letter-spacing:.13em;font-size:.76rem;color:var(--teal);display:flex;align-items:center;gap:12px;text-transform:uppercase}.eyebrow span{width:28px;height:1px;background:#0aacac;display:inline-block}.hero h1{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(2.75rem,4.8vw,4.25rem);line-height:1.34;letter-spacing:-.03em;margin:24px 0 32px;font-weight:500}.hero h1 em{font-style:normal;color:var(--teal);position:relative;background:linear-gradient(transparent 78%,rgba(246,223,85,.8) 0)}.hero h1 em:after{display:none}.hero-lead{font-size:1rem;line-height:2;color:#59655f}.hero-actions{display:flex;align-items:center;gap:28px;margin-top:34px}.text-link{font-size:.9rem;font-weight:700;border-bottom:1px solid #9aada6;padding:8px 0}.hero-points{display:flex;gap:0;margin:38px 0 0;padding:0;list-style:none;border-top:0;max-width:560px}.hero-points li{flex:1;padding:14px 14px;border-right:10px solid #fff;background:#edf9f5;border-left:3px solid #08a98f}.hero-points li:first-child{padding-left:14px}.hero-points li:last-child{border-right:0}.hero-points b{display:block;color:var(--teal);font-size:1.22rem}.hero-points span{font-size:.7rem;color:var(--muted)}.hero-visual{position:relative;isolation:isolate}.hero-visual:before{display:none}.hero-visual:after{content:"";position:absolute;inset:-1px;background:linear-gradient(90deg,#fff 0,rgba(255,255,255,.1) 18%,transparent 42%),linear-gradient(0deg,#fff 0,transparent 17%);pointer-events:none}.hero-visual img{height:560px;width:100%;object-fit:cover;border-radius:0;box-shadow:none}.hero-note{position:absolute;left:0;bottom:28px;background:rgba(255,255,255,.94);border-radius:0;padding:17px 22px;box-shadow:0 12px 30px rgba(23,52,46,.1);display:flex;gap:16px;align-items:center;z-index:2;border-left:3px solid var(--teal)}.hero-note span{writing-mode:vertical-rl;font-size:.64rem;letter-spacing:.12em;color:var(--teal);font-weight:700;border-left:1px solid var(--line);padding-left:10px}.hero-note b{font-size:.88rem;line-height:1.65}.trust-strip{background:linear-gradient(100deg,#17342e,#087f72);color:#fff;min-height:98px;display:flex;align-items:center;gap:60px;padding:20px max(22px,calc((100vw - 1180px)/2))}.trust-strip>p{font:700 .72rem "Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;letter-spacing:.2em;color:#add4ca;margin:0}.trust-strip ul{display:flex;align-items:center;gap:48px;list-style:none;margin:0;padding:0;flex:1;justify-content:space-between}.trust-strip li{font-size:.86rem;font-weight:600}.trust-strip li span{font:700 .72rem "Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;color:#dff26b;margin-right:12px}.section{padding:110px max(22px,calc((100vw - 1120px)/2))}.section-heading h2,.experience h2,.price-intro h2,.area h2,.cta-section h2{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-weight:500;letter-spacing:-.025em}.section-heading h2{font-size:clamp(2.05rem,3.5vw,3.25rem);line-height:1.45;margin:13px 0 0}.split-heading{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:80px}.split-heading>p{color:var(--muted);margin-bottom:8px;max-width:500px}.centered{text-align:center}.centered .eyebrow{justify-content:center}.centered>p:last-child{color:var(--muted)}.concerns{background:var(--mist)}.concern-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:55px}.concern-grid article{background:#fff;padding:32px 26px;border-radius:0;min-height:250px;border:1px solid var(--line);border-top:3px solid var(--teal);transition:.25s}.concern-grid article:hover{transform:translateY(-4px);border-color:#a8cec3;background:#fff;box-shadow:0 18px 40px rgba(15,63,73,.08)}.concern-grid article>span{font:700 .78rem "Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;color:var(--teal)}.concern-grid h3{font-size:1.12rem;margin:32px 0 10px}.concern-grid p{font-size:.88rem;color:var(--muted);line-height:1.8;margin:0}.bridge{margin:42px auto 0;background:linear-gradient(100deg,#79bf20,#0ab89f 55%,#087ce0);color:#fff;max-width:740px;border-radius:9px;text-align:center;padding:19px 30px;box-shadow:0 14px 32px rgba(8,121,104,.15)}.bridge span{font-size:.73rem;margin-right:20px;opacity:.8}.bridge b{font-size:1.05rem}.features{background:#fff}.feature-list{margin-top:68px;display:grid;gap:0;border-top:1px solid var(--line)}.feature-list>article{display:grid;grid-template-columns:72px 1.3fr .75fr;gap:32px;align-items:center;border-radius:0;background:#fff;padding:42px 24px;box-shadow:none;border:0;border-bottom:1px solid var(--line)}.feature-no{font:700 1.05rem "Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;color:var(--teal);align-self:start}.feature-copy>p:first-child{font:700 .68rem "Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;letter-spacing:.16em;color:#82a99e}.feature-copy h3{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-weight:600;font-size:1.62rem;line-height:1.5;margin:6px 0 10px}.feature-copy>p:last-child{font-size:.92rem;color:var(--muted);margin:0}.mini-graphic{height:145px;border-radius:0;background:#edf7f3;display:flex;align-items:center;justify-content:center}.schedule{gap:10px;color:#66827a;font-size:.72rem;font-weight:700}.schedule i{height:1px;width:26px;background:#9bbab2}.schedule strong{width:48px;height:48px;background:var(--teal);color:#fff;border-radius:50%;display:grid;place-items:center;font:700 1.4rem sans-serif}.calendar{flex-direction:column;gap:13px}.calendar>b{font:700 .65rem sans-serif;letter-spacing:.15em;color:#6e9387}.calendar>div{width:126px;display:grid;grid-template-columns:repeat(6,1fr);gap:7px}.calendar span{height:9px;border-radius:1px;background:#c8ded7}.calendar span.on{background:#79bf20}.shield{gap:14px}.shield span{width:58px;height:68px;clip-path:polygon(50% 0,96% 18%,87% 72%,50% 100%,13% 72%,4% 18%);background:var(--teal);color:#fff;display:grid;place-items:center;font-size:1.45rem}.shield b{font-size:.8rem;line-height:1.6}.experience{padding-top:20px;padding-bottom:20px}.experience-card{min-height:380px;background:linear-gradient(100deg,rgba(23,52,46,.96),rgba(8,127,114,.82)),url('./assets/ribicle-hero.png') center/cover;border-radius:0;color:#fff;padding:70px;display:grid;grid-template-columns:1.1fr .9fr;gap:80px;align-items:end;box-shadow:none}.eyebrow.light{color:#d7f4ea}.experience h2{font-size:clamp(2rem,3.2vw,3.1rem);line-height:1.45;margin:13px 0 0}.experience-card>p{margin:0;color:#def0ea}.flow{background:#f8faf9}.flow-list{counter-reset:step;display:grid;grid-template-columns:repeat(5,1fr);padding:0;margin:55px 0 0;list-style:none;border-top:2px solid #cbe1db}.flow-list li{padding:30px 22px 0;position:relative}.flow-list li:before{content:"";position:absolute;top:-9px;left:22px;width:16px;height:16px;background:#f8faf9;border:4px solid var(--teal);border-radius:50%}.flow-list span{font:700 .7rem sans-serif;color:var(--teal);letter-spacing:.1em}.flow-list b{display:block;font-size:1rem;margin:13px 0 8px}.flow-list p{font-size:.82rem;color:var(--muted);line-height:1.75}.standards{background:#fff}.standard-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:50px}.standard-grid article{background:#f8faf9;border-radius:0;padding:26px 30px;display:grid;grid-template-columns:120px 1fr;align-items:center;border-left:3px solid var(--teal)}.standard-grid b{font-size:.96rem}.standard-grid p{font-size:.85rem;color:var(--muted);margin:0}.price{padding-top:90px;padding-bottom:90px;background:#f8faf9}.price-box{background:#fff;border-radius:0;color:var(--text);padding:64px;display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;position:relative;overflow:hidden;border:1px solid var(--line);box-shadow:0 18px 45px rgba(23,52,46,.06)}.price-box:after{display:none}.price-intro h2{font-size:clamp(2rem,3vw,2.85rem);line-height:1.45;margin:13px 0 20px}.price-intro>p:last-child{color:var(--muted);font-size:.9rem}.price-main{background:#edf7f3;color:var(--text);border-radius:0;padding:34px 40px;position:relative;z-index:1;border-left:4px solid var(--teal)}.price-main>p:first-child{font-weight:700;margin:0}.price-main strong{display:flex;align-items:end;gap:8px;margin:3px 0 20px;color:var(--teal)}.price-main strong small{font-size:.75rem;margin-bottom:16px;color:var(--muted)}.price-main strong b{font:700 4.6rem/1 sans-serif;letter-spacing:-.05em}.price-main strong em{font-style:normal;font-size:1rem;margin-bottom:12px}.price-main ul{display:flex;gap:8px;list-style:none;padding:0;margin:0}.price-main li{background:#fff;border-radius:2px;padding:7px 10px;color:var(--teal-dark);font-size:.72rem;font-weight:700}.price-main .note{font-size:.68rem;line-height:1.7;color:#7e918a;margin:22px 0 0}.area{display:grid;grid-template-columns:1.1fr .9fr;gap:80px;align-items:center;background:#fff}.area h2{font-size:clamp(2rem,3.3vw,3.1rem);line-height:1.45;margin:13px 0 20px}.area>div>p:not(.eyebrow){color:var(--muted);max-width:610px}.area-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}.area-tags span{border:1px solid #b7d5cb;color:var(--teal-dark);background:#fff;padding:8px 15px;border-radius:2px;font-size:.78rem;font-weight:600}.area-visual{height:360px;border-radius:50% 50% 44% 56%/57% 44% 56% 43%;background:linear-gradient(140deg,#79bf20,#0ab89f 55%,#087ce0);display:flex;flex-direction:column;justify-content:center;align-items:center;color:#fff;position:relative}.area-visual span{font:700 .72rem sans-serif;letter-spacing:.2em;opacity:.8}.area-visual b{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-weight:500;font-size:1.85rem;text-align:center;line-height:1.5;margin-top:8px}.area-visual i{position:absolute;width:60px;height:60px;border:13px solid rgba(255,255,255,.55);border-radius:50%;right:18px;top:20px}.faq{max-width:1120px;margin:auto;background:#f8faf9}.faq-list{margin-top:42px;border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line)}summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:20px;padding:25px 5px;font-weight:700}summary::-webkit-details-marker{display:none}summary>span{font:700 1.05rem sans-serif;color:var(--teal)}summary i{width:18px;height:18px;margin-left:auto;position:relative}summary i:before,summary i:after{content:"";position:absolute;background:var(--teal);left:0;top:8px;width:18px;height:2px;transition:.2s}summary i:after{transform:rotate(90deg)}details[open] summary i:after{transform:rotate(0)}details>p{padding:0 48px 25px;color:var(--muted);font-size:.9rem}.cta-section{background:linear-gradient(100deg,#63bd2f,#08a18a 55%,#1687d5);color:#fff;text-align:center;padding:100px 22px;position:relative;overflow:hidden}.cta-section .eyebrow{justify-content:center}.cta-section h2{font-size:clamp(2.2rem,4vw,3.7rem);line-height:1.4;margin:18px 0}.cta-section>p:not(.eyebrow){color:#e8fff7}.button-white{background:#fff;color:var(--teal);margin-top:22px;box-shadow:none}.cta-section>small{display:block;margin-top:16px;color:#dbf2eb}.cta-orb{position:absolute;width:420px;height:420px;border:90px solid rgba(255,255,255,.08);border-radius:50%;right:-140px;top:-180px}footer{padding:50px max(22px,calc((100vw - 1120px)/2));display:grid;grid-template-columns:1fr 1.2fr auto;align-items:center;gap:30px;background:#17342e;color:#c8d8d2;font-size:.74rem}.footer-brand img{width:140px;filter:brightness(0) invert(1)}footer p{margin:2px 0}footer nav{display:flex;gap:18px}footer nav a:hover{color:#fff}.copyright{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.12);padding-top:20px;text-align:center}.mobile-cta{display:none}.reveal{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:980px){.site-header nav{display:none}.hero{grid-template-columns:1fr;min-height:auto;padding-top:70px}.hero-visual{max-width:700px}.hero-visual img{height:470px}.concern-grid{grid-template-columns:repeat(2,1fr)}.feature-list>article{grid-template-columns:52px 1fr}.mini-graphic{grid-column:2;height:110px}.flow-list{grid-template-columns:1fr;border-top:0;border-left:2px solid #cee1e2;margin-left:10px}.flow-list li{padding:5px 20px 30px 34px}.flow-list li:before{top:9px;left:-9px}.experience-card,.price-box{grid-template-columns:1fr}.area{gap:35px}.area-visual{height:300px}.trust-strip{align-items:flex-start;gap:20px}.trust-strip ul{gap:14px;flex-wrap:wrap}.standard-grid article{grid-template-columns:100px 1fr}footer{grid-template-columns:1fr 1fr}footer nav{grid-column:1/-1}}
@media(max-width:680px){body{padding-bottom:68px}.site-header{height:68px;padding:0 18px}.site-header .brand-mark{width:36px;height:36px}.site-header .brand small{display:none}.site-header .button{display:none}.hero{padding:47px 20px 56px;gap:38px;background:linear-gradient(160deg,#f8fcfc 0%,#e6f5f4 100%)}.hero h1{font-size:2.45rem;line-height:1.35;margin-top:15px}.hero-lead{font-size:.94rem}.hero-lead br{display:none}.hero-actions{align-items:stretch;flex-direction:column;gap:10px}.hero-actions .button{width:100%}.text-link{text-align:center;border:0}.hero-points{margin-top:25px}.hero-points li{padding:15px 8px 0}.hero-points b{font-size:1.05rem}.hero-points span{font-size:.63rem}.hero-visual img{height:340px;border-radius:70px 16px 70px 16px}.hero-note{left:12px;bottom:-20px;padding:12px 15px}.hero-note span{display:none}.trust-strip{display:block;padding:22px}.trust-strip>p{margin-bottom:12px}.trust-strip ul{display:grid;gap:7px}.section{padding:76px 20px}.split-heading{grid-template-columns:1fr;gap:22px}.section-heading h2{font-size:2rem}.concern-grid{grid-template-columns:1fr 1fr;gap:8px;margin-top:32px}.concern-grid article{padding:20px 16px;min-height:220px}.concern-grid h3{font-size:.95rem;margin-top:22px}.concern-grid p{font-size:.77rem}.bridge{border-radius:15px;padding:15px}.bridge span{display:block;margin:0}.bridge b{font-size:.9rem}.features{padding-left:14px;padding-right:14px}.feature-list{margin-top:38px}.feature-list>article{display:block;padding:25px}.feature-no{margin-bottom:15px}.feature-copy h3{font-size:1.25rem}.mini-graphic{margin-top:22px;height:100px}.experience{padding:0 14px}.experience-card{padding:45px 28px;min-height:420px;gap:35px;border-radius:24px}.experience h2{font-size:1.85rem}.standard-grid{grid-template-columns:1fr}.standard-grid article{grid-template-columns:90px 1fr;padding:22px 20px}.price{padding-left:14px;padding-right:14px}.price-box{padding:35px 22px;gap:30px;border-radius:24px}.price-main{padding:27px 20px}.price-main strong b{font-size:3.8rem}.price-main ul{flex-wrap:wrap}.area{grid-template-columns:1fr}.area-visual{height:290px;max-width:320px;margin:auto;width:100%}.faq{padding-left:20px;padding-right:20px}summary{font-size:.9rem;gap:12px}details>p{padding-left:38px}.cta-section{padding:76px 20px}.cta-section>p:not(.eyebrow) br{display:none}footer{grid-template-columns:1fr;padding:42px 22px}footer nav{grid-column:auto}.mobile-cta{display:flex;position:fixed;bottom:0;left:0;right:0;height:68px;background:var(--peach);color:#173142;align-items:center;justify-content:center;gap:25px;font-weight:800;z-index:30;box-shadow:0 -8px 25px rgba(17,49,62,.14)}}

/* Contact CTA: invert the section and keep the primary CTA treatment consistent. */
.cta-section {
  background: #fff;
  color: #17342e;
  border-top: 1px solid var(--line);
}
.cta-section .eyebrow { color: var(--teal); }
.cta-section > p:not(.eyebrow) { color: #59655f; }
.cta-section > small { color: #6d8179; }
.cta-section .button-white {
  background: linear-gradient(110deg, #79bf20, #0ab89f 52%, #087ce0);
  color: #fff;
  box-shadow: 0 14px 34px rgba(8,165,176,.27);
}
.cta-section .button-white:hover {
  box-shadow: 0 17px 38px rgba(8,165,176,.34);
}
.cta-orb { border-color: rgba(8,127,114,.06); }
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.button{transition:none}}
@media(max-width:680px){.site-header .brand-lockup>img{width:108px}.site-header .company-lockup{display:none}.hero{background:#fff}.hero-visual img{border-radius:0}.hero-points li{padding:13px 8px;border-right:5px solid #fff}.bridge{border-radius:9px}.experience-card,.price-box{border-radius:0}.mobile-cta{background:linear-gradient(110deg,#79bf20,#0ab89f 52%,#087ce0);color:#fff}}

/* Completion pass: navigation, focus, local assets, and resilient layout. */
html {
  scroll-padding-top: 100px;
}

.skip-link {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 100;
  transform: translateY(-150%);
  padding: 10px 16px;
  border: 2px solid var(--teal);
  border-radius: 6px;
  background: #fff;
  color: var(--teal-dark);
  font-weight: 700;
}

.skip-link:focus {
  transform: none;
}

.anchor-target {
  position: absolute;
}

:where(a, summary):focus-visible {
  outline: 3px solid #f6df55;
  outline-offset: 4px;
}

.hero-visual picture {
  display: block;
}

.experience-card {
  background-image: linear-gradient(100deg, rgba(23, 52, 46, .96), rgba(8, 127, 114, .82)), url('./assets/ribicle-hero-1200.jpg');
}

@media (max-width: 680px) {
  html {
    scroll-padding-top: 78px;
  }

  .hero h1 {
    font-size: clamp(2rem, 10vw, 2.45rem);
    margin: 12px 0 10px;
  }

  .hero-lead {
    margin-bottom: 0;
    line-height: 1.8;
  }

  .cta-section h2 {
    font-size: clamp(1.5rem, 7.2vw, 1.9rem);
    white-space: nowrap;
  }

  .price-intro h2 {
    font-size: clamp(1.45rem, 7.2vw, 1.9rem);
    white-space: nowrap;
  }

  .price-main strong {
    display: grid;
    grid-template-columns: auto auto;
    justify-content: start;
    align-items: end;
    column-gap: 8px;
  }

  .price-main strong small {
    grid-column: 1 / -1;
    margin-bottom: 2px;
  }

  .price-main strong em {
    white-space: nowrap;
  }
}

/* Let the pricing content sit directly on the section background. */
.price-box {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

/* Ribicle privacy policy */
.privacy-body {
  background: #f7faf9;
}

.privacy-page {
  padding: 0 max(22px, calc((100vw - 960px) / 2)) 110px;
}

.privacy-hero {
  padding: 86px 0 56px;
  border-bottom: 1px solid var(--line);
}

.privacy-hero h1 {
  margin: 18px 0 22px;
  color: var(--navy);
  font: 500 clamp(2.35rem, 5vw, 4rem) / 1.35 "Yu Mincho", "Hiragino Mincho ProN", serif;
  letter-spacing: -.035em;
}

.privacy-hero > p:not(.eyebrow):not(.privacy-date) {
  max-width: 680px;
  margin-bottom: 16px;
  color: var(--muted);
}

.privacy-date {
  margin: 0;
  color: #70847d;
  font-size: .82rem;
  font-weight: 600;
}

.privacy-content {
  margin-top: 48px;
  padding: clamp(34px, 6vw, 68px);
  border: 1px solid var(--line);
  background: #fff;
  box-shadow: 0 18px 48px rgba(23, 52, 46, .06);
}

.privacy-content > p:first-child {
  margin-bottom: 42px;
  color: #45564f;
}

.privacy-content section {
  padding: 30px 0;
  border-top: 1px solid var(--line);
}

.privacy-content h2 {
  margin: 0 0 14px;
  color: var(--navy);
  font-size: 1.18rem;
  line-height: 1.6;
}

.privacy-content p,
.privacy-content li,
.privacy-content dd {
  color: #53635d;
  font-size: .92rem;
  line-height: 2;
}

.privacy-content section > p:last-child,
.privacy-content li:last-child {
  margin-bottom: 0;
}

.privacy-content ul {
  margin: 14px 0 0;
  padding-left: 1.5em;
}

.privacy-content li + li {
  margin-top: 7px;
}

.privacy-content a:not(.privacy-back) {
  color: var(--teal);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.privacy-contact dl {
  margin: 20px 0 0;
  border-top: 1px solid var(--line);
}

.privacy-contact dl > div {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  border-bottom: 1px solid var(--line);
}

.privacy-contact dt,
.privacy-contact dd {
  margin: 0;
  padding: 13px 16px;
}

.privacy-contact dt {
  color: var(--teal-dark);
  background: #edf7f3;
  font-size: .82rem;
  font-weight: 700;
}

.privacy-back {
  margin-top: 36px;
  min-height: 56px;
  color: #fff;
  border: 0;
}

.privacy-back span {
  font-size: 1.1rem;
}

@media (max-width: 680px) {
  .privacy-page {
    padding-bottom: 72px;
  }

  .privacy-hero {
    padding: 54px 0 36px;
  }

  .privacy-hero h1 {
    font-size: clamp(2rem, 10vw, 2.65rem);
  }

  .privacy-content {
    margin-top: 28px;
    padding: 28px 20px;
  }

  .privacy-content > p:first-child {
    margin-bottom: 26px;
  }

  .privacy-content section {
    padding: 24px 0;
  }

  .privacy-contact dl > div {
    grid-template-columns: 1fr;
  }

  .privacy-contact dt,
  .privacy-contact dd {
    padding: 10px 12px;
  }
}

/* Ribicle company profile */
.company-body {
  background: #f7faf9;
}

.company-page-header .brand-lockup > img {
  width: 142px;
}

.company-page {
  padding: 0 max(22px, calc((100vw - 1000px) / 2)) 110px;
}

.company-hero {
  padding: 72px 0 44px;
}

.company-hero h1 {
  margin: 18px 0 18px;
  color: var(--text);
  font: 500 clamp(2.8rem, 6vw, 4.7rem) / 1.2 "Yu Mincho", "Hiragino Mincho ProN", serif;
  letter-spacing: -.045em;
}

.company-hero > p:last-child {
  margin: 0;
  color: var(--muted);
  font-size: 1rem;
}

.company-profile {
  padding: clamp(32px, 5vw, 52px);
  border: 1px solid var(--line);
  background: #fff;
  box-shadow: 0 18px 48px rgba(23, 52, 46, .05);
}

.company-profile dl {
  margin: 0;
}

.company-profile dl > div {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 28px;
  padding: 24px 0;
  border-bottom: 1px solid var(--line);
}

.company-profile dt,
.company-profile dd {
  margin: 0;
}

.company-profile dt {
  color: #687b74;
  font-size: .82rem;
  font-weight: 700;
}

.company-profile dd {
  color: var(--text);
  font-size: .94rem;
  line-height: 1.9;
}

.company-profile dd a {
  color: var(--teal);
  text-decoration: underline;
  text-underline-offset: 4px;
}

.company-contact {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 34px;
  margin-top: 40px;
  padding: 32px;
  background: #eef7f4;
}

.company-contact p {
  margin: 0;
  color: #53665f;
  font-size: .96rem;
  line-height: 1.9;
}

.company-contact .button {
  min-width: 210px;
}

@media (max-width: 680px) {
  .company-page-header {
    gap: 12px;
  }

  .company-page-header .brand-lockup > img {
    width: 106px;
  }

  .company-page-header .button-small {
    display: inline-flex;
    min-height: 42px;
    padding: 0 14px;
    font-size: .7rem;
  }

  .company-page {
    padding-bottom: 72px;
  }

  .company-hero {
    padding: 52px 0 32px;
  }

  .company-hero h1 {
    font-size: clamp(2.6rem, 14vw, 3.4rem);
  }

  .company-hero > p:last-child {
    font-size: .92rem;
  }

  .company-profile {
    padding: 26px 20px;
  }

  .company-profile dl > div {
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 20px 0;
  }

  .company-profile dt {
    color: var(--teal-dark);
  }

  .company-profile dd {
    font-size: .9rem;
  }

  .company-contact {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 28px;
    padding: 24px 20px;
  }

  .company-contact p br {
    display: none;
  }

  .company-contact .button {
    width: 100%;
    min-width: 0;
  }
}

/* Footer: align the content and match the primary CTA palette. */
footer {
  grid-template-columns: minmax(0, 1fr) auto;
  padding-top: 44px;
  padding-bottom: 30px;
  gap: 30px 56px;
  background: linear-gradient(110deg, #79bf20, #0ab89f 52%, #087ce0);
  color: rgba(255, 255, 255, .9);
  font-size: .78rem;
}

footer > div:first-child {
  align-self: center;
}

footer p {
  margin: 0;
  line-height: 1.75;
}

footer nav {
  align-self: center;
  justify-self: end;
  gap: 26px;
  font-weight: 600;
}

.copyright {
  margin-top: 4px;
  padding-top: 22px;
  border-top-color: rgba(255, 255, 255, .3);
  color: rgba(255, 255, 255, .8);
}

@media (max-width: 680px) {
  footer {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 38px 22px 30px;
  }

  footer nav {
    justify-self: start;
    flex-wrap: wrap;
  }

  .copyright {
    grid-column: 1;
    text-align: left;
  }
}

/* Turn the concerns section into a direct, outcome-led appeal. */
.concerns {
  background:
    radial-gradient(circle at 92% 8%, rgba(8, 169, 143, .09), transparent 27%),
    #f4f8f7;
}

.concerns .split-heading {
  grid-template-columns: 1.2fr .8fr;
  gap: 56px;
}

.concerns .section-heading h2 {
  font-size: clamp(2.05rem, 3.35vw, 3.15rem);
}

.concerns .section-heading h2 em {
  color: #087f72;
  font-style: normal;
  background: linear-gradient(transparent 80%, rgba(246, 223, 85, .72) 0);
}

.concerns-mobile-break {
  display: none;
}

.concerns .split-heading > p {
  padding-left: 22px;
  border-left: 3px solid #08a98f;
  color: #43554f;
  font-size: 1rem;
  font-weight: 600;
}

.concern-grid {
  gap: 16px;
  margin-top: 48px;
}

.concern-grid article {
  position: relative;
  min-height: 236px;
  padding: 28px 26px 30px;
  overflow: hidden;
  border: 1px solid rgba(8, 127, 114, .13);
  border-radius: 15px;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 16px 38px rgba(23, 52, 46, .07);
}

.concern-grid article::after {
  content: "";
  position: absolute;
  right: -34px;
  bottom: -44px;
  width: 110px;
  height: 110px;
  border: 22px solid rgba(8, 169, 143, .055);
  border-radius: 50%;
  pointer-events: none;
}

.concern-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.concern-grid .concern-card-head > span {
  color: #087f72;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .1em;
}

.concern-card-head strong {
  padding: 4px 11px;
  border-radius: 999px;
  background: #e5f6f1;
  color: #087f72;
  font-size: .72rem;
  letter-spacing: .08em;
}

.concern-grid h3 {
  max-width: 245px;
  margin: 32px 0 12px;
  font-size: 1.08rem;
  line-height: 1.55;
}

.concern-grid p {
  position: relative;
  z-index: 1;
  color: #53645e;
  font-size: .82rem;
}

.concerns .bridge {
  max-width: 880px;
  margin-top: 34px;
  padding: 21px 30px;
  border-radius: 12px;
  box-shadow: 0 18px 42px rgba(8, 121, 104, .2);
}

.concerns .bridge span {
  display: inline-block;
  margin-right: 18px;
  padding: 4px 10px;
  border: 1px solid rgba(255, 255, 255, .48);
  border-radius: 999px;
  color: #fff;
  font-weight: 700;
}

@media (max-width: 980px) {
  .concerns .split-heading {
    grid-template-columns: 1fr;
    gap: 25px;
  }

  .concerns .split-heading > p {
    max-width: 650px;
  }
}

@media (max-width: 680px) {
  .concern-grid {
    grid-template-columns: 1fr;
  }

  .concern-grid article {
    min-height: 0;
    padding: 24px 22px 26px;
  }

  .concern-grid h3 {
    max-width: none;
    margin-top: 22px;
    font-size: 1.05rem;
  }

  .concerns .bridge span {
    margin: 0 0 8px;
  }
}

/* All CTA buttons: soft pulse and a restrained passing highlight. */
.button,
.mobile-cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  box-shadow:
    0 14px 34px rgba(8, 165, 176, .32),
    0 0 0 0 rgba(65, 203, 120, .36);
  animation: cta-glow 2.8s ease-in-out infinite;
}

.button::before,
.mobile-cta::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -55%;
  bottom: -55%;
  left: -42%;
  width: 24%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .72), transparent);
  transform: skewX(-20deg);
  animation: cta-shine 3.6s ease-in-out infinite;
  pointer-events: none;
}

.button-white::before {
  background: linear-gradient(90deg, transparent, rgba(8, 127, 114, .24), transparent);
}

@keyframes cta-glow {
  0%, 100% {
    box-shadow:
      0 14px 34px rgba(8, 165, 176, .28),
      0 0 0 0 rgba(65, 203, 120, .32);
  }
  50% {
    box-shadow:
      0 18px 42px rgba(8, 165, 176, .42),
      0 0 0 7px rgba(65, 203, 120, 0);
  }
}

@keyframes cta-shine {
  0%, 24% { left: -42%; }
  58%, 100% { left: 118%; }
}

@media (prefers-reduced-motion: reduce) {
  .button,
  .button::before,
  .mobile-cta,
  .mobile-cta::before {
    animation: none;
  }
}

/* Hero image caption: a quiet, editorial overlay instead of a floating white card. */
.hero-note {
  left: 24px;
  bottom: 24px;
  display: block;
  width: min(390px, calc(100% - 48px));
  padding: 20px 24px 21px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .18);
  border-left: 0;
  border-radius: 2px 14px 14px 2px;
  background: linear-gradient(115deg, rgba(18, 58, 51, .94), rgba(8, 127, 114, .82));
  color: #fff;
  box-shadow: 0 18px 42px rgba(9, 43, 37, .24);
  backdrop-filter: blur(12px);
}

.hero-note::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: linear-gradient(180deg, #dff26b, #16c5ae);
}

.hero-note span {
  display: inline-flex;
  align-items: center;
  writing-mode: horizontal-tb;
  padding: 3px 9px;
  border: 1px solid rgba(223, 242, 107, .45);
  border-radius: 999px;
  color: #efffa6;
  font-size: .68rem;
  line-height: 1.6;
  letter-spacing: .1em;
}

.hero-note b {
  display: block;
  margin-top: 9px;
  font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.75;
  letter-spacing: .015em;
}

@media (max-width: 680px) {
  .hero-note {
    right: 14px;
    bottom: 14px;
    left: 14px;
    width: auto;
    padding: 16px 18px 17px;
    border-radius: 2px 12px 12px 2px;
  }

  .hero-note span {
    display: inline-flex;
  }

  .hero-note b {
    margin-top: 7px;
    font-size: .92rem;
    line-height: 1.65;
  }
}

/* Service area map */
.area {
  background: #fcfcfc;
}

.area-map {
  margin: 0;
  padding: 0;
  border: 0;
  background: #fcfcfc;
  box-shadow: none;
}

.area-map img {
  width: 100%;
  height: auto;
}

.area-map figcaption {
  margin-top: 10px;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-align: center;
}

@media (max-width: 680px) {
  .area-map figcaption {
    font-size: .74rem;
  }
}

/* Hero facts: higher contrast, less visual noise. */
.hero-points {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 36px;
  border-top: 1px solid #cbded8;
  border-bottom: 1px solid #cbded8;
}

.hero-points > li,
.hero-points > li:first-child {
  padding: 16px 20px;
  border: 0;
  border-right: 1px solid #cbded8;
  background: transparent;
}

.hero-points > li:last-child {
  border-right: 0;
}

.hero-points b {
  color: var(--teal-dark);
  font-size: 1.3rem;
  line-height: 1.35;
  letter-spacing: .02em;
}

.hero-points span {
  display: block;
  margin-top: 3px;
  color: #45534e;
  font-size: .8rem;
  font-weight: 600;
  line-height: 1.55;
}

@media (max-width: 680px) {
  .hero-points {
    margin-top: 26px;
  }

  .hero-points > li,
  .hero-points > li:first-child {
    padding: 13px 9px;
  }

  .hero-points b {
    font-size: 1.08rem;
  }

  .hero-points span {
    font-size: .76rem;
  }
}

/* Integrate the service photo into the first view. */
@media (min-width: 981px) {
  .hero {
    gap: 0;
    padding-right: 0;
  }

  .hero-copy {
    padding-right: clamp(36px, 4vw, 64px);
  }

  .hero-visual,
  .hero-visual picture,
  .hero-visual img {
    height: 100%;
    min-height: 720px;
  }
}

@media (max-width: 980px) {
  .hero {
    gap: 0;
    padding: 64px 0 0;
  }

  .hero-copy {
    width: min(100%, 748px);
    margin: 0 auto;
    padding: 0 24px 36px;
  }

  .hero-visual {
    width: 100%;
    max-width: none;
  }

  .hero-visual img {
    height: 460px;
  }

  .hero-visual::after {
    background: linear-gradient(180deg, #fff 0, rgba(255, 255, 255, .06) 18%, transparent 40%), linear-gradient(0deg, #fff 0, transparent 14%);
  }
}

@media (max-width: 680px) {
  .hero {
    padding-top: 44px;
  }

  .hero-copy {
    padding: 0 20px 28px;
  }

  .hero-visual img {
    height: 340px;
  }
}

/* Final hero composition: the service photo is the first-view background. */
.hero {
  position: relative;
  isolation: isolate;
  display: block;
  min-height: 720px;
  padding: clamp(58px, 7vw, 92px) max(22px, calc((100vw - 1180px) / 2));
}

.hero-copy {
  position: relative;
  z-index: 3;
  width: min(760px, 66vw);
  padding-right: 0;
}

.hero h1 {
  font-size: clamp(2.15rem, 3.45vw, 3.25rem);
  font-weight: 600;
}

.hero-title-line {
  display: block;
  width: fit-content;
  white-space: nowrap;
}

.hero-title-part {
  display: inline;
}

.hero-keep {
  white-space: nowrap;
}

.hero-visual {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  max-width: none;
  height: 100%;
}

.hero-visual picture,
.hero-visual img {
  width: 100%;
  height: 100%;
  min-height: 0;
}

.hero-visual img {
  object-position: 66% center;
}

.hero-visual::after {
  z-index: 1;
  background: linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, .98) 31%, rgba(255, 255, 255, .84) 48%, rgba(255, 255, 255, .32) 68%, rgba(255, 255, 255, .05) 100%), linear-gradient(0deg, rgba(255, 255, 255, .72) 0%, transparent 22%);
}

.hero-note {
  right: max(22px, calc((100vw - 1180px) / 2));
  left: auto;
  bottom: 30px;
  z-index: 2;
}

.hero-points {
  background: rgba(255, 255, 255, .76);
  backdrop-filter: blur(10px);
}

@media (max-width: 980px) {
  .hero {
    min-height: 680px;
    padding: 58px 24px;
  }

  .hero-copy {
    width: min(620px, 78vw);
    margin: 0;
    padding: 0;
  }

  .hero-visual img {
    height: 100%;
    object-position: 64% center;
  }

  .hero-visual::after {
    background: linear-gradient(90deg, rgba(255, 255, 255, .98) 0%, rgba(255, 255, 255, .93) 48%, rgba(255, 255, 255, .46) 76%, rgba(255, 255, 255, .18) 100%), linear-gradient(0deg, rgba(255, 255, 255, .68) 0%, transparent 24%);
  }

  .hero-note {
    right: 24px;
    left: auto;
  }
}

@media (max-width: 680px) {
  .hero {
    min-height: 540px;
    padding: 42px 20px 38px;
    background: #fff;
  }

  .hero .eyebrow {
    gap: 10px;
    font-size: .72rem;
    letter-spacing: .05em;
  }

  .hero-copy {
    width: 100%;
  }

  .hero h1 {
    font-size: clamp(1.85rem, 8.6vw, 2.3rem);
  }

  .hero-title-line {
    width: fit-content;
    white-space: normal;
    word-break: normal;
    overflow-wrap: normal;
  }

  .hero-title-part {
    display: block;
    white-space: nowrap;
  }

  .hero-visual {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
  }

  .hero-visual picture {
    position: absolute;
    right: 0;
    bottom: 80px;
    width: 680px;
    height: auto;
  }

  .hero-visual img {
    width: 100%;
    height: auto;
    max-width: none;
    object-fit: contain;
  }

  .hero-visual::after {
    background:
      linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, .98) 34%, rgba(255, 255, 255, .68) 52%, rgba(255, 255, 255, .28) 76%, rgba(255, 255, 255, .12) 100%),
      linear-gradient(90deg, rgba(255, 255, 255, .36) 0%, rgba(255, 255, 255, .08) 72%, transparent 100%);
  }

  .hero-note {
    display: none;
  }

  .hero-points {
    background: rgba(255, 255, 255, .82);
  }
}

/* Hero proof points: lead with the facility benefit, then support it. */
.hero-points {
  max-width: 620px;
  margin-top: 34px;
  padding: 5px;
  overflow: hidden;
  border: 1px solid rgba(8, 127, 114, .18);
  border-radius: 14px;
  background: rgba(255, 255, 255, .9);
  box-shadow: 0 18px 48px rgba(23, 52, 46, .12);
  backdrop-filter: blur(14px);
}

.hero-points > li,
.hero-points > li:first-child {
  position: relative;
  min-width: 0;
  padding: 14px 18px 15px;
  border: 0;
  border-right: 1px solid rgba(8, 127, 114, .16);
  background: transparent;
}

.hero-points > li:last-child {
  border-right: 0;
}

.hero-points small {
  display: block;
  margin-bottom: 3px;
  color: #39776b;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .08em;
}

.hero-points b {
  color: #076f63;
  font-size: 1.28rem;
  line-height: 1.35;
  letter-spacing: -.03em;
}

.hero-points b em {
  margin-right: 2px;
  color: #087f72;
  font-size: 2rem;
  font-style: normal;
  line-height: 1;
}

.hero-points b,
.hero-points b em {
  background: linear-gradient(110deg, #79bf20, #0ab89f 52%, #087ce0);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.hero-points span {
  display: block;
  margin-top: 3px;
  color: #4f615b;
  font-size: .72rem;
  font-weight: 600;
  line-height: 1.55;
}

@media (max-width: 680px) {
  .hero-copy {
    display: flex;
    flex-direction: column;
  }

  .hero-points {
    order: 1;
    margin-top: 6px;
    padding: 4px;
    border-radius: 11px;
  }

  .hero-actions {
    order: 2;
    margin-top: 8px;
  }

  .hero-points > li,
  .hero-points > li:first-child {
    padding: 12px 8px 13px;
  }

  .hero-points small {
    font-size: .58rem;
    letter-spacing: .03em;
  }

  .hero-points b {
    font-size: .98rem;
  }

  .hero-points b em {
    font-size: 1.55rem;
  }

  .hero-points span {
    font-size: .6rem;
  }
}

/* Draw the headline underline into view. */
.hero h1 em {
  background-image: linear-gradient(rgba(246, 223, 85, .88), rgba(246, 223, 85, .88));
  background-position: left 88%;
  background-repeat: no-repeat;
  background-size: 0 .22em;
  animation: hero-underline-draw 1.8s cubic-bezier(.22, 1, .36, 1) .45s forwards;
}

@keyframes hero-underline-draw {
  to { background-size: 100% .22em; }
}

@media (prefers-reduced-motion: reduce) {
  .hero h1 em {
    animation: none;
    background-size: 100% .22em;
  }
}

/* Make the assurance strip self-explanatory at a glance. */
.trust-strip {
  min-height: 124px;
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 30px;
  padding-top: 22px;
  padding-bottom: 22px;
}

.trust-strip > .trust-heading {
  margin: 0;
  letter-spacing: 0;
}

.trust-heading small,
.trust-heading strong {
  display: block;
}

.trust-heading small {
  color: #add4ca;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .12em;
}

.trust-heading strong {
  margin-top: 3px;
  color: #fff;
  font-size: 1.32rem;
  line-height: 1.35;
}

.trust-strip ul {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  width: 100%;
}

.trust-strip li {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 11px;
  align-items: center;
  padding: 0 22px;
  border-left: 1px solid rgba(255, 255, 255, .18);
}

.trust-strip li > span {
  display: grid;
  width: 30px;
  height: 30px;
  margin: 0;
  place-items: center;
  border: 1px solid rgba(223, 242, 107, .55);
  border-radius: 50%;
  color: #dff26b;
  font-size: .68rem;
}

.trust-strip li b,
.trust-strip li small {
  display: block;
}

.trust-strip li b {
  color: #fff;
  font-size: .86rem;
  line-height: 1.5;
}

.trust-strip li small {
  margin-top: 2px;
  color: #b9d7cf;
  font-size: .68rem;
  font-weight: 500;
  line-height: 1.45;
}

@media (max-width: 980px) {
  .trust-strip {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .trust-strip > .trust-heading {
    display: flex;
    align-items: baseline;
    gap: 10px;
  }

  .trust-heading strong {
    margin: 0;
  }
}

@media (max-width: 680px) {
  .trust-strip {
    padding: 28px 22px;
  }

  .trust-strip ul {
    display: grid;
    gap: 0;
    align-items: stretch;
  }

  .trust-strip li {
    grid-template-columns: 32px minmax(0, 1fr);
    align-items: start;
    padding: 15px 0;
    border-left: 0;
    border-top: 1px solid rgba(255, 255, 255, .16);
  }

  .trust-strip li > span {
    margin-top: 1px;
  }

  .trust-strip li b {
    font-size: .9rem;
  }

  .trust-strip li small {
    font-size: .72rem;
  }
}

/* Reveal the concerns headline underline when this section enters view. */
.concerns .section-heading h2 em.underline-reveal {
  background-image: linear-gradient(rgba(246, 223, 85, .78), rgba(246, 223, 85, .78));
  background-position: left 88%;
  background-repeat: no-repeat;
  background-size: 0 .2em;
  transition: background-size 1.8s cubic-bezier(.22, 1, .36, 1) .18s;
}

.concerns .section-heading h2 em.underline-reveal.visible {
  background-size: 100% .2em;
}

@media (prefers-reduced-motion: reduce) {
  .concerns .section-heading h2 em.underline-reveal {
    background-size: 100% .2em;
    transition: none;
  }
}

.concerns .bridge-cta {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 24px;
  min-height: 76px;
  padding: 12px 34px;
  overflow: hidden;
  animation: bridge-cta-glow 2.8s ease-in-out infinite;
  transition: transform .2s ease, box-shadow .2s ease;
}

.concerns .bridge-cta::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: -65%;
  bottom: -65%;
  left: -34%;
  width: 18%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .72), transparent);
  transform: skewX(-20deg);
  animation: cta-shine 3.8s ease-in-out infinite;
  pointer-events: none;
}

.concerns .bridge-cta > * {
  position: relative;
  z-index: 1;
}

@keyframes bridge-cta-glow {
  0%, 100% {
    box-shadow:
      0 18px 42px rgba(8, 121, 104, .2),
      0 0 0 0 rgba(60, 200, 120, .34);
  }
  50% {
    box-shadow:
      0 22px 50px rgba(8, 121, 104, .34),
      0 0 0 8px rgba(60, 200, 120, 0);
  }
}

.concerns .bridge-cta b {
  justify-self: center;
  font-size: 1.22rem;
  line-height: 1.4;
  letter-spacing: .04em;
}

.concerns .bridge-cta i {
  display: grid;
  width: 36px;
  height: 36px;
  justify-self: end;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .45);
  border-radius: 50%;
  font-style: normal;
  font-size: 1rem;
  transition: transform .2s ease;
}

.concerns .bridge-cta span {
  justify-self: start;
  margin: 0;
}

.concerns .bridge-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 48px rgba(8, 121, 104, .28);
}

.concerns .bridge-cta:hover i {
  transform: translateX(5px);
}

@media (max-width: 680px) {
  .concerns .bridge-cta {
    grid-template-columns: auto 36px;
    justify-content: center;
    gap: 8px 14px;
    padding: 18px 20px;
  }

  .concerns .bridge-cta span {
    grid-column: 1 / -1;
    justify-self: center;
  }

  .concerns .bridge-cta b {
    justify-self: end;
    font-size: 1.08rem;
  }

  .concerns .bridge-cta i {
    justify-self: start;
  }
}

@media (prefers-reduced-motion: reduce) {
  .concerns .bridge-cta,
  .concerns .bridge-cta i,
  .concerns .bridge-cta::before {
    animation: none;
    transition: none;
  }
}

/* Coordination diagram: clearly show who shares what, and who coordinates it. */
.mini-graphic.schedule {
  display: grid;
  grid-template-columns: minmax(58px, 1fr) 26px 104px 26px minmax(58px, 1fr);
  gap: 8px;
  width: 100%;
  height: 170px;
  padding: 20px;
  border: 1px solid #cfe5df;
  border-radius: 12px;
  background:
    radial-gradient(circle at 50% 50%, rgba(8, 169, 143, .13), transparent 36%),
    linear-gradient(135deg, #f4fbf8, #eaf6f3);
  color: #17342e;
}

.schedule-party {
  display: flex;
  min-width: 0;
  min-height: 82px;
  padding: 12px 8px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(8, 127, 114, .16);
  border-radius: 10px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 8px 20px rgba(23, 52, 46, .06);
  text-align: center;
}

.schedule-party small {
  color: #087f72;
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .06em;
}

.schedule-party b {
  margin-top: 5px;
  color: #4d625b;
  font-size: .64rem;
  line-height: 1.45;
}

.schedule-center {
  display: flex;
  width: 104px;
  height: 104px;
  padding: 13px 10px 10px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(8, 127, 114, .2);
  border-radius: 18px;
  background: #fff;
  color: #087f72;
  box-shadow: 0 12px 26px rgba(8, 127, 114, .16);
  text-align: center;
}

.schedule-center img {
  width: 88px;
  height: auto;
  object-fit: contain;
}

.schedule .schedule-center strong {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .58);
  border-radius: 50%;
  background: rgba(255, 255, 255, .13);
  color: #fff;
  font-size: 1rem;
}

.schedule-center b {
  margin-top: 4px;
  font-size: .7rem;
  line-height: 1.3;
}

.schedule-center small {
  margin-top: 6px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #e5f6f1;
  color: #087f72;
  font-size: .55rem;
  font-weight: 800;
  letter-spacing: .06em;
}

.schedule-arrow {
  position: relative;
  display: grid;
  place-items: center;
}

.schedule-arrow::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background: #8ebdb2;
}

.schedule .schedule-arrow i {
  position: relative;
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border: 1px solid #a9cec5;
  border-radius: 50%;
  background: #f8fcfa;
  color: #087f72;
  font-size: .72rem;
  font-style: normal;
  line-height: 1;
}

@media (max-width: 680px) {
  .mini-graphic.schedule {
    grid-template-columns: minmax(54px, 1fr) 20px 100px 20px minmax(54px, 1fr);
    gap: 5px;
    height: 154px;
    padding: 14px 10px;
  }

  .schedule-center {
    width: 100px;
    height: 98px;
  }

  .schedule-party {
    padding: 10px 5px;
  }
}

/* Regular-visit diagram: explain the repeatable process, not a generic calendar. */
.mini-graphic.visit-cycle {
  display: grid;
  grid-template-columns: minmax(82px, 1fr) 82px minmax(82px, 1fr);
  grid-template-rows: 1fr auto;
  gap: 10px;
  width: 100%;
  height: 170px;
  padding: 18px 20px 15px;
  border: 1px solid #cfe5df;
  border-radius: 12px;
  background:
    radial-gradient(circle at 77% 28%, rgba(121, 191, 32, .12), transparent 30%),
    linear-gradient(135deg, #f4fbf8, #eaf6f3);
}

.visit-step {
  display: flex;
  min-width: 0;
  padding: 12px 9px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(8, 127, 114, .18);
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 8px 20px rgba(23, 52, 46, .06);
  text-align: center;
}

.visit-step span {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 50%;
  background: #e5f6f1;
  color: #087f72;
  font-size: .62rem;
  font-weight: 800;
}

.visit-step b {
  margin-top: 7px;
  color: #17342e;
  font-size: .7rem;
  line-height: 1.4;
}

.visit-step-next {
  border-color: rgba(8, 127, 114, .34);
  background: linear-gradient(145deg, #087f72, #0aa68f);
  box-shadow: 0 10px 24px rgba(8, 127, 114, .2);
}

.visit-step-next span {
  border: 1px solid rgba(255, 255, 255, .5);
  background: rgba(255, 255, 255, .13);
  color: #fff;
}

.visit-step-next b {
  color: #fff;
}

.visit-connector {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.visit-connector::after {
  display: none;
}

.visit-connector small {
  color: #4f6f66;
  font-size: .6rem;
  font-weight: 700;
  line-height: 1.45;
}

.visit-connector i {
  display: block;
  width: auto;
  height: auto;
  margin-top: 7px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #087f72;
  font-family: Arial, sans-serif;
  font-size: 1.15rem;
  font-style: normal;
  line-height: 1;
}

.visit-cycle > p {
  grid-column: 1 / -1;
  margin: 0;
  color: #39776b;
  font-size: .64rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-align: center;
}

@media (max-width: 680px) {
  .mini-graphic.visit-cycle {
    grid-template-columns: minmax(78px, 1fr) 72px minmax(78px, 1fr);
    height: 158px;
    padding: 14px 10px 12px;
  }
}

/* Service flow: requester and partner are connected through the Ribicle platform. */
.mini-graphic.schedule {
  display: flex;
  height: auto;
  min-height: 470px;
  padding: 18px 24px;
  flex-direction: column;
  justify-content: center;
  border: 0;
  border-radius: 0;
  background: #f7fbfa;
  box-shadow: none;
}

.schedule-party {
  display: flex;
  min-height: 98px;
  padding: 15px 20px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid #cbded8;
  border-radius: 0;
  box-shadow: none;
  text-align: center;
}

.schedule-party small,
.schedule-platform small {
  color: #78938b;
  font-size: .6rem;
  font-weight: 800;
  letter-spacing: .16em;
}

.schedule-party b {
  margin-top: 7px;
  color: #172229;
  font-family: "Shippori Mincho", "Yu Mincho", serif;
  font-size: 1.12rem;
  line-height: 1.35;
}

.schedule-party p {
  margin: 5px 0 0;
  color: #64736e;
  font-size: .64rem;
  line-height: 1.45;
}

.schedule-transfer {
  display: flex;
  min-height: 66px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #128d7d;
}

.schedule-transfer div {
  display: flex;
  gap: 5px;
  justify-content: center;
  flex-wrap: wrap;
}

.schedule-transfer span {
  display: inline-flex;
  min-height: 22px;
  padding: 3px 9px;
  align-items: center;
  border-radius: 999px;
  background: #e5f4ef;
  color: #087f72;
  font-size: .56rem;
  font-weight: 800;
}

.schedule-transfer i {
  position: relative;
  display: block;
  width: 18px;
  height: 24px;
  background: transparent;
  font-style: normal;
}

.schedule-transfer i::before {
  content: "";
  position: absolute;
  left: 50%;
  width: 1px;
  height: 18px;
  background: currentColor;
  transform: translateX(-50%);
}

.schedule-transfer i::after {
  content: "";
  position: absolute;
  left: 50%;
  width: 6px;
  height: 6px;
  border-top: 1px solid currentColor;
  border-left: 1px solid currentColor;
}

.schedule-transfer-up i {
  order: 2;
  margin-top: 6px;
}

.schedule-transfer-up i::before {
  bottom: 0;
}

.schedule-transfer-up i::after {
  top: 1px;
  transform: translateX(-50%) rotate(45deg);
}

.schedule-transfer-down i {
  margin-bottom: 6px;
}

.schedule-transfer-down i::before {
  top: 0;
}

.schedule-transfer-down i::after {
  bottom: 1px;
  transform: translateX(-50%) rotate(225deg);
}

.schedule-platform {
  display: flex;
  min-height: 158px;
  padding: 18px 24px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: linear-gradient(112deg, #45ac2f 0%, #159884 52%, #227fc1 100%);
  color: #fff;
  text-align: center;
}

.schedule-platform small {
  color: rgba(255,255,255,.9);
}

.schedule-platform div {
  display: grid;
  width: min(300px, 78%);
  min-height: 72px;
  margin-top: 11px;
  padding: 8px 22px;
  place-items: center;
  border-radius: 8px;
  background: #fff;
}

.schedule-platform img {
  width: min(150px, 100%);
  height: auto;
}

.schedule-platform p {
  margin: 10px 0 0;
  color: #fff;
  font-size: .64rem;
  font-weight: 700;
  line-height: 1.5;
}

@media (max-width: 680px) {
  .mini-graphic.schedule {
    min-height: 430px;
    padding: 14px 12px;
  }

  .schedule-party {
    min-height: 90px;
    padding: 13px 12px;
  }

  .schedule-party b {
    font-size: 1rem;
  }

  .schedule-transfer {
    min-height: 60px;
  }

  .schedule-transfer span {
    padding-inline: 7px;
    font-size: .52rem;
  }

  .schedule-platform {
    min-height: 144px;
    padding-inline: 14px;
  }
}

/* Support desk: show the actual response flow instead of an abstract shield. */
.mini-graphic.support-flow {
  display: grid;
  height: 158px;
  padding: 16px 18px;
  grid-template-rows: auto 1fr;
  gap: 13px;
  border: 1px solid #cfe3dd;
  background: #f3faf7;
}

.support-brand {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.support-brand img {
  width: 72px;
  height: auto;
}

.support-brand b {
  color: #17342e;
  font-size: .66rem;
  line-height: 1.4;
}

.support-flow ol {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.support-flow li {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-top: 1px solid #9fcac0;
  text-align: center;
}

.support-flow li:not(:last-child)::after {
  content: "→";
  position: absolute;
  right: -13px;
  top: 50%;
  color: #087f72;
  font-family: Arial, sans-serif;
  font-size: .8rem;
  transform: translateY(-50%);
}

.support-flow li span {
  color: #087f72;
  font-size: .54rem;
  font-weight: 800;
}

.support-flow li b {
  margin-top: 3px;
  color: #3f5a52;
  font-size: .58rem;
  line-height: 1.35;
}

@media (max-width: 680px) {
  .mini-graphic.support-flow {
    height: 150px;
    padding-inline: 13px;
  }

  .support-brand img {
    width: 66px;
  }

  .support-flow ol {
    gap: 13px;
  }

  .support-flow li:not(:last-child)::after {
    right: -11px;
  }
}

/* Feature numbers: high-contrast circular markers. */
.feature-no {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 50%;
  background: var(--teal);
  color: #fff;
  font-size: 1.12rem;
  line-height: 1;
  box-shadow: 0 8px 18px rgba(8, 127, 114, .16);
}

/* Keep the WHY headline on its intended two lines. */
.features .section-heading .why-title-line {
  white-space: nowrap;
}

.features .section-heading h2 strong {
  display: inline-block;
  margin-top: 4px;
  color: #0ab89f;
  background: linear-gradient(110deg, #79bf20, #0ab89f 52%, #087ce0);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 700;
}

/* Contact CTA watermark: use the Ribicle mark instead of the circular accent. */
.cta-section > *:not(.cta-orb) {
  position: relative;
  z-index: 1;
}

.cta-orb {
  width: 405px;
  height: 460px;
  left: 50%;
  right: auto;
  top: 50%;
  border: 0;
  border-radius: 0;
  background-image: url("assets/ribicle-logo.png");
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 920px 460px;
  filter: grayscale(1);
  opacity: .055;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.experience-mobile-break {
  display: none;
}

@media (max-width: 680px) {
  .experience-card {
    min-height: 340px;
    padding: 32px 24px;
    gap: 16px;
    align-content: end;
  }

  .experience h2 {
    font-size: clamp(1.45rem, 7.2vw, 1.85rem);
  }

  .experience-mobile-break {
    display: block;
  }

  .concerns .section-heading h2 {
    font-size: clamp(1.3rem, 6.4vw, 1.75rem);
    letter-spacing: -.03em;
  }

  .concerns .section-heading h2 em {
    display: inline-block;
    font-size: 1em;
    white-space: nowrap;
    word-break: keep-all;
    overflow-wrap: normal;
  }

  .concerns-mobile-break {
    display: block;
  }

  .features .section-heading h2 {
    font-size: clamp(1.55rem, 6.8vw, 1.85rem);
  }

  .feature-no {
    width: 44px;
    height: 44px;
    margin-bottom: 18px;
    font-size: 1.02rem;
  }

  .cta-orb {
    width: 300px;
    height: 340px;
    left: 50%;
    right: auto;
    top: 50%;
    background-size: 680px 340px;
    opacity: .045;
  }
}