:root {
  --cream:#faf7ee;
  --ink:#272327;
  --pink:#ef9db9;
  --lavender:#d8cbea;
  --blue:#b8cde8;
  --yellow:#f5db81;
  --line:#272327;
  --muted:#655d61;
  --max:1160px;
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:auto;
  scroll-padding-top:115px;
}
body {
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
  font-size:16px;
  line-height:1.9;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,p,figure {
  margin:0;
}
h1,h2,h3 {
  line-height:1.45;
}
a {
  color:inherit;
  text-decoration:none;
}
button,input,select {
  font:inherit;
  color:inherit;
}
button,a,input,select,summary {
  -webkit-tap-highlight-color:transparent;
}
a,button,summary {
  touch-action:manipulation;
}
button,summary {
  cursor:pointer;
}
button {
  border:0;
}
img {
  display:block;
  width:100%;
  height:auto;
}
button,a {
  transition:background .2s,transform .2s,color .2s;
}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible {
  outline:3px solid #6e398a;
  outline-offset:6px;
}
button:disabled {
  cursor:not-allowed;
}
.wrap {
  width:min(var(--max),calc(100% - 112px));
  margin-inline:auto;
}
.section {
  padding-block:100px;
}
.pink {
  background:var(--pink);
}
.lavender {
  background:var(--lavender);
}
.blue {
  background:var(--blue);
}
.yellow {
  background:var(--yellow);
}
.eyebrow,.micro {
  font-family:Arial,sans-serif;
  font-size:14px;
  font-weight:600;
  letter-spacing:.09em;
  line-height:1.7;
}
.eyebrow {
  margin-bottom:22px;
}
.note {
  font-size:14px;
  line-height:1.8;
  color:var(--muted);
  margin-top:22px;
}
.pink .note,.lavender .note,.blue .note,.yellow .note {
  color:#4c424b;
}
p+p {
  margin-top:20px;
}
.skip-link {
  position:fixed;
  top:10px;
  left:20px;
  z-index:100;
  background:white;
  padding:10px 20px;
  transform:translateY(-200%);
}
.skip-link:focus {
  transform:none;
}
.site-header {
  height:105px;
  padding:0 4.4%;
  display:flex;
  align-items:center;
  gap:34px;
  background:var(--cream);
  border-bottom:1px solid #27232720;
  position:relative;
  z-index:20;
}
.brand {
  font-family:"Arial Rounded MT Bold","Trebuchet MS",sans-serif;
  font-size:50px;
  letter-spacing:-4px;
  line-height:.9;
  font-weight:800;
  display:block;
  margin-right:auto;
}
.brand span {
  display:block;
  font-family:Arial,sans-serif;
  font-size:14px;
  letter-spacing:.1em;
  text-align:center;
  line-height:1.6;
  margin-top:2px;
}
.desktop-nav {
  display:flex;
  gap:30px;
  font-family:Arial,sans-serif;
  font-size:14px;
  font-weight:600;
  letter-spacing:.04em;
}
.desktop-nav a:hover,.desktop-nav a[aria-current] {
  text-decoration:underline;
  text-underline-offset:6px;
}
.header-book {
  background:var(--pink);
  border:1px solid var(--ink);
  border-radius:60px;
  display:flex;
  align-items:center;
  gap:25px;
  padding:9px 20px;
  font-size:14px;
  font-weight:700;
  box-shadow:3px 3px 0 var(--ink);
}
.header-book span {
  font-size:24px;
  line-height:1;
}
.header-book:hover {
  background:var(--yellow);
  transform:translateY(-2px);
}
.mobile-menu {
  display:none;
}
.pill {
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:38px;
  border:1px solid var(--ink);
  border-radius:99px;
  background:var(--cream);
  padding:5px 5px 5px 25px;
  min-height:58px;
  min-width:230px;
  font-size:14px;
  font-weight:600;
  box-shadow:3px 4px 0 var(--ink);
  line-height:1.5;
}
.pill span {
  width:46px;
  height:46px;
  border:1px solid var(--ink);
  border-radius:50%;
  display:grid;
  place-items:center;
  font:26px Arial;
  background:var(--pink);
  flex-shrink:0;
}
.pill:hover {
  transform:translate(-1px,-3px);
  background:var(--yellow);
}
.text-link {
  display:inline-flex;
  justify-content:space-between;
  gap:35px;
  border-bottom:1px solid var(--ink);
  padding:12px 0;
  line-height:1.5;
  font-size:15px;
  font-weight:600;
}
.text-link:hover {
  color:#703052;
}
.text-link span {
  font-size:25px;
}
.hero {
  position:relative;
  max-width:1500px;
  margin:auto;
  min-height:720px;
  display:grid;
  grid-template-columns:45% 55%;
  padding:62px 5% 70px;
  overflow:hidden;
}
.hero-copy {
  position:relative;
  z-index:2;
  padding-top:6px;
}
.hero-copy .eyebrow {
  font-size:14px;
  margin-bottom:24px;
  letter-spacing:.09em;
}
.hero h1 {
  font-size:clamp(48px,5.2vw,76px);
  font-weight:600;
  letter-spacing:.05em;
  line-height:1.48;
}
.hero h1 span {
  background:linear-gradient(transparent 77%,var(--pink) 77%,var(--pink) 96%,transparent 96%);
}
.hero-description {
  font-size:16px;
  line-height:2;
  margin:27px 0 25px;
}
.hero-art {
  position:relative;
  height:540px;
}
.hero-oval {
  position:absolute;
  inset:32px 0 20px 5%;
  background:var(--lavender);
  border-radius:48% 48% 46% 51%;
  transform:rotate(-12deg);
}
.hero-main {
  position:absolute;
  top:10px;
  right:42px;
  width:62%;
  height:444px;
  transform:rotate(8deg);
  border:1px solid var(--ink);
  border-radius:180px 180px 100px 100px;
  overflow:hidden;
}
.hero-main img {
  height:100%;
  object-fit:cover;
  object-position:50% 43%;
}
.hero-small {
  position:absolute;
  bottom:24px;
  left:8px;
  width:34%;
  height:245px;
  border:6px solid var(--cream);
  border-radius:130px;
  overflow:hidden;
  transform:rotate(-13deg);
}
.hero-small img {
  height:100%;
  object-fit:cover;
  object-position:center 35%;
}
.hero-star {
  position:absolute;
  font:120px Arial;
  left:4%;
  top:-10px;
  z-index:1;
  transform:rotate(15deg);
  line-height:1;
}
.hero-sticker {
  position:absolute;
  right:0;
  bottom:23px;
  width:139px;
  height:139px;
  border:1px solid var(--ink);
  border-radius:50%;
  background:var(--yellow);
  font:700 21px/1.12 Arial;
  text-align:center;
  padding-top:30px;
  transform:rotate(12deg);
  box-shadow:3px 3px 0 var(--ink);
}
.hero-sticker i {
  font-size:35px;
  display:block;
  font-style:normal;
}
.hero-handwriting {
  position:absolute;
  bottom:12px;
  left:25%;
  font:italic 40px Georgia,serif;
  transform:rotate(-10deg);
}
.hero-side {
  position:absolute;
  right:-32px;
  top:185px;
  writing-mode:vertical-rl;
  font:14px Arial;
  letter-spacing:.08em;
}
.hero-bottom {
  position:absolute;
  bottom:25px;
  left:5%;
  right:5%;
  display:flex;
  justify-content:space-between;
  font:14px Arial;
  letter-spacing:.05em;
}
.ribbon {
  display:flex;
  align-items:center;
  justify-content:space-around;
  gap:40px;
  padding:20px 30px;
  background:var(--lavender);
  border-block:1px solid var(--ink);
  font:700 27px Arial;
  letter-spacing:-.035em;
  white-space:nowrap;
  overflow:hidden;
}
.ribbon i {
  font:40px Arial;
  font-style:normal;
  line-height:1;
}
.home-concept {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:85px;
  align-items:center;
}
.japanese-large {
  font-size:38px;
  line-height:1.9;
  letter-spacing:.04em;
}
.prose {
  line-height:2.3;
}
.prose .text-link {
  margin-top:17px;
}
.color-dots {
  display:flex;
  margin-top:30px;
  gap:12px;
}
.color-dots i {
  height:36px;
  width:36px;
  border-radius:50%;
  background:var(--pink);
  border:1px solid var(--ink);
}
.color-dots i:nth-child(2) {
  background:var(--lavender);
}
.color-dots i:nth-child(3) {
  background:var(--blue);
}
.color-dots i:nth-child(4) {
  background:var(--yellow);
}
.styles-section {
  background:#f3eee5;
}
.heading-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  margin-bottom:43px;
}
.section-heading h2 {
  font:700 clamp(40px,4.2vw,58px)/1.1 Arial,sans-serif;
  letter-spacing:-.05em;
}
.section-heading h2 span {
  display:block;
  font:500 17px/1.8 "Hiragino Kaku Gothic ProN",sans-serif;
  letter-spacing:.02em;
  margin-top:15px;
}
.section-heading .eyebrow {
  margin-bottom:15px;
}
.styles-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:25px;
}
.style-card {
  position:relative;
  min-width:0;
}
.style-photo {
  aspect-ratio:3/4;
  position:relative;
  overflow:hidden;
  border-radius:140px 140px 12px 12px;
  background:var(--lavender);
}
.style-photo.short {
  border-radius:12px 12px 140px 140px;
}
.style-photo.short .photo-number {
  top:15px;
  bottom:auto;
}
.style-photo.copper {
  border-radius:12px 140px 12px 12px;
}
.style-photo.wave {
  border-radius:140px 12px 12px 12px;
}
.style-photo img {
  height:100%;
  object-fit:cover;
  transition:transform .5s;
}
.style-card:hover img {
  transform:scale(1.04);
}
.photo-number {
  position:absolute;
  bottom:15px;
  left:15px;
  display:grid;
  place-items:center;
  width:35px;
  height:35px;
  background:var(--cream);
  border:1px solid;
  border-radius:50%;
  font:14px Arial;
}
.style-card .micro {
  font-size:14px;
  letter-spacing:.025em;
  margin-top:24px;
}
.style-card h3 {
  font:600 27px/1.5 Arial;
  letter-spacing:-.04em;
  margin-top:2px;
}
.style-card>p:not(.micro) {
  font-size:14px;
  margin-top:5px;
}
.card-link {
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid;
  width:36px;
  height:36px;
  border-radius:50%;
  margin-top:17px;
  font-size:24px;
}
.card-link:hover {
  background:var(--pink);
}
.color-feature {
  padding:84px 0;
}
.color-feature-inner {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:50px;
  align-items:center;
}
.color-feature h2 {
  font-size:56px;
  line-height:1.5;
  letter-spacing:.02em;
  margin-bottom:18px;
}
.color-feature .pill {
  margin-top:30px;
}
.outline {
  -webkit-text-stroke:1px var(--ink);
  color:transparent;
}
.swatch-art {
  height:400px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:13px;
}
.swatch-art div {
  height:310px;
  width:100px;
  flex:0 1 100px;
  border:1px solid;
  border-radius:65px;
  background:var(--swatch);
  color:white;
  writing-mode:vertical-rl;
  display:flex;
  align-items:center;
  justify-content:center;
  font:14px Arial;
  letter-spacing:.1em;
  transform:rotate(16deg);
}
.swatch-art div:nth-child(2) {
  transform:rotate(16deg) translateY(-25px);
}
.swatch-art div:nth-child(3) {
  transform:rotate(16deg) translateY(25px);
  color:var(--ink);
}
.swatch-art>span {
  position:absolute;
  bottom:5px;
  left:0;
  font:italic 36px/1 Georgia;
  transform:rotate(-9deg);
}
.home-menu {
  display:grid;
  grid-template-columns:1fr 1.15fr;
  gap:85px;
}
.home-menu>.section-heading {
  margin-bottom:25px;
}
.home-menu>div>p {
  margin:30px 0;
}
.price-list>div {
  display:flex;
  justify-content:space-between;
  padding:26px 0;
  border-bottom:1px solid;
  gap:20px;
}
.price-list>div:first-child {
  border-top:1px solid;
}
.price-list h3 {
  font:500 30px Arial;
  letter-spacing:-.04em;
}
.price-list h3 span {
  display:block;
  font:14px/2 sans-serif;
  letter-spacing:0;
}
.price-list>div>p {
  font:500 30px Arial;
  text-align:right;
  white-space:nowrap;
}
.price-list>div>p span {
  display:block;
  font:14px/2 Arial;
}
.salon-feature {
  display:grid;
  grid-template-columns:1.2fr 1fr;
  min-height:530px;
}
.salon-image {
  padding:55px 0 55px 55px;
}
.salon-image img {
  height:100%;
  object-fit:cover;
  border-radius:8px 140px 8px 8px;
}
.salon-copy {
  align-self:center;
  padding:55px;
}
.salon-copy h2,.split-copy h2 {
  font-size:32px;
  line-height:1.9;
  letter-spacing:.03em;
  margin-bottom:20px;
}
.salon-copy .pill,.split-copy .pill {
  margin-top:25px;
}
.visit-links {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:center;
}
.visit-links h2 {
  font-size:30px;
  margin-bottom:18px;
}
.visit-links>div:last-child>a {
  display:flex;
  gap:22px;
  border-bottom:1px solid;
  padding:24px 0;
  align-items:center;
  font-size:18px;
  font-weight:500;
}
.visit-links>div:last-child>a:first-child {
  border-top:1px solid;
}
.visit-links a span {
  font:14px Arial;
}
.visit-links a i {
  margin-left:auto;
  font-style:normal;
  font-size:25px;
}
.visit-links a:hover {
  padding-left:8px;
  background:#ffffff30;
}
.booking-cta {
  padding:78px 25px 65px;
  text-align:center;
  position:relative;
  overflow:hidden;
  border-top:1px solid;
}
.booking-cta h2 {
  font-size:35px;
  letter-spacing:.06em;
  margin-bottom:30px;
}
.booking-cta .pill {
  min-width:295px;
  text-align:left;
}
.booking-cta>span {
  position:absolute;
  left:4%;
  top:14%;
  font:120px Arial;
  opacity:.24;
  pointer-events:none;
}
.footer {
  background:var(--pink);
  padding:65px 5% 30px;
  border-top:1px solid;
}
.footer-top {
  display:flex;
  justify-content:space-between;
  gap:60px;
  padding-bottom:60px;
}
.footer-brand {
  font:800 112px/.8 "Arial Rounded MT Bold","Trebuchet MS",sans-serif;
  letter-spacing:-8px;
  display:inline-flex;
  align-items:center;
  gap:12px;
}
.brand-flower {
  font:70px Arial;
  line-height:1;
  letter-spacing:0;
}
.footer-top>div>p {
  margin-top:25px;
  font-size:17px;
}
.footer-top nav {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  column-gap:55px;
  row-gap:15px;
  padding-top:10px;
  font-size:14px;
}
.footer-top nav a:hover {
  text-decoration:underline;
  text-underline-offset:5px;
}
.footer-bottom {
  display:flex;
  justify-content:space-between;
  align-items:end;
  border-top:1px solid #27232770;
  padding-top:25px;
  gap:30px;
  font-size:14px;
}
.footer-bottom p {
  margin:0;
}
.footer-bottom>p:first-child {
  font-family:Arial;
  white-space:nowrap;
}
.footer-bottom>a {
  font:14px Arial;
  white-space:nowrap;
}
.page-intro {
  padding:70px 0 65px;
  border-bottom:1px solid;
  position:relative;
  overflow:hidden;
}
.page-intro .wrap {
  position:relative;
}
.page-intro h1 {
  font:700 clamp(52px,7vw,94px)/1.1 Arial;
  letter-spacing:-.06em;
  max-width:90%;
}
.page-intro h1>span {
  display:block;
  font:500 24px/1.8 sans-serif;
  letter-spacing:.05em;
  margin:17px 0;
}
.page-intro .eyebrow>span {
  margin:0 14px;
}
.intro-flower {
  position:absolute;
  right:0;
  top:22px;
  font:150px Arial;
  opacity:.3;
  line-height:1;
}
.page-intro .wrap>p:last-of-type {
  max-width:75%;
}
.manifesto {
  text-align:center;
}
.manifesto h2 {
  font-size:45px;
  line-height:1.8;
  margin-bottom:25px;
}
.manifesto .color-dots {
  justify-content:center;
}
.split-section {
  display:grid;
  grid-template-columns:1fr 1fr;
}
.split-section>div:first-child>img {
  height:100%;
  object-fit:cover;
}
.split-copy {
  padding:75px max(5vw,40px);
}
.split-copy p {
  line-height:2;
}
.principles {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:50px;
  margin-top:50px;
}
.principle-disc {
  width:180px;
  height:180px;
  border:1px solid;
  border-radius:50%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  font:60px/1 Arial;
  margin:0 auto 30px;
}
.principle-disc span {
  font:16px/2 Arial;
}
.principles h3 {
  font-size:21px;
  margin-bottom:16px;
}
.day-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;
  margin:45px 0 0;
}
.day-grid article {
  border-top:1px solid;
  padding-top:22px;
}
.day-grid article>span {
  font:14px Arial;
}
.day-grid h3 {
  font-size:24px;
  margin:15px 0;
}
.closing-split {
  display:flex;
  justify-content:space-around;
  align-items:center;
  gap:55px;
}
.closing-split .pill {
  margin-top:30px;
}
.mini-photo {
  width:260px;
  flex-shrink:0;
}
.mini-photo img {
  height:300px;
  object-fit:cover;
  border-radius:140px 140px 0 0;
}
.notice {
  border:1px solid;
  padding:20px 25px;
  margin-bottom:55px;
  font:600 14px/1.7 Arial;
  display:flex;
  gap:25px;
  align-items:center;
}
.notice span {
  font-family:sans-serif;
  font-weight:400;
}
.menu-table {
  margin-top:45px;
}
.menu-line {
  display:grid;
  grid-template-columns:1.05fr 1.15fr .55fr auto;
  gap:30px;
  align-items:center;
  padding:32px 0;
  border-bottom:1px solid;
}
.menu-line:first-child {
  border-top:1px solid;
}
.menu-line>div:first-child {
  display:flex;
  gap:22px;
}
.menu-line .eyebrow {
  margin:0;
  padding-top:7px;
}
.menu-line h3 {
  font:500 27px/1.2 Arial;
  letter-spacing:-.04em;
}
.menu-line h3 span {
  display:block;
  font:14px/1.8 sans-serif;
  margin-top:8px;
  letter-spacing:0;
}
.menu-line>p {
  font-size:14px;
}
.menu-price {
  font:27px Arial;
  text-align:right;
  white-space:nowrap;
}
.menu-price span {
  display:block;
  font:14px/1.8 sans-serif;
  margin-top:6px;
}
.menu-line .pill {
  min-width:105px;
  gap:15px;
  padding-left:17px;
  min-height:45px;
}
.menu-line .pill>span {
  width:34px;
  height:34px;
  font-size:21px;
}
.menu-builder {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;
  align-items:center;
}
.menu-builder h2 {
  font-size:35px;
  margin-bottom:25px;
}
fieldset {
  border:0;
  padding:0;
  margin:0 0 35px;
  min-width:0;
}
legend {
  font-size:20px;
  font-weight:600;
  margin-bottom:25px;
  padding:0;
}
#menu-builder label {
  display:flex;
  align-items:center;
  gap:12px;
  padding:20px 0;
  border-top:1px solid;
  font-size:17px;
  cursor:pointer;
}
#menu-builder label>span {
  margin-left:auto;
  font-size:14px;
}
input[type=checkbox],input[type=radio] {
  accent-color:var(--ink);
  width:20px;
  height:20px;
  flex-shrink:0;
  margin:0;
}
#menu-total {
  display:block;
  border-top:1px solid;
  padding-top:18px;
  font:38px Arial;
  letter-spacing:-.04em;
}
.compare-options {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:30px;
  margin-top:45px;
}
.compare-options>a {
  border-top:1px solid;
  position:relative;
  padding:25px 0 10px;
}
.compare-options>a>span {
  font:14px Arial;
}
.compare-options h3 {
  font-size:22px;
  margin:25px 0 12px;
}
.compare-options i {
  font-size:26px;
  font-style:normal;
  display:block;
  margin-top:22px;
}
.compact-columns {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
}
.compact-columns h2 {
  font-size:33px;
  line-height:1.8;
}
.compact-columns .pill {
  margin-top:25px;
}
.full-styles {
  grid-template-columns:repeat(2,1fr);
  gap:70px 45px;
}
.full-styles .style-photo {
  aspect-ratio:4/4.8;
}
.full-styles .style-photo img {
  object-position:center 35%;
}
.full-styles .style-photo.bob {
  border-radius:240px 240px 10px 10px;
}
.full-styles .style-photo.short {
  border-radius:10px 10px 220px 220px;
}
.filter-bar {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:32px 0 24px;
}
.filter-bar button {
  background:transparent;
  border:1px solid;
  border-radius:30px;
  padding:10px 22px;
  font-size:14px;
  min-height:44px;
}
.filter-bar button.active {
  background:var(--ink);
  color:var(--cream);
}
.filter-bar button:hover:not(.active) {
  background:var(--pink);
}
#style-count {
  margin-bottom:30px;
}
.style-detail {
  margin-top:23px;
  border-top:1px solid;
  border-bottom:1px solid;
}
.style-detail summary {
  display:flex;
  justify-content:space-between;
  padding:15px 0;
  font-size:14px;
  list-style:none;
}
.style-detail summary::-webkit-details-marker {
  display:none;
}
.style-detail[open] summary>span {
  transform:rotate(45deg);
}
.style-detail p {
  font-size:16px;
  margin:0 0 20px;
}
.style-detail .pill {
  margin-bottom:25px;
}
.tag-list {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:25px;
}
.tag-list span {
  border:1px solid;
  padding:5px 20px;
  border-radius:25px;
  font-size:14px;
}
.color-strip {
  display:flex;
  gap:15px;
  margin:40px 0;
}
.color-strip span {
  background:var(--swatch);
  color:white;
  flex:1;
  border-radius:90px;
  min-height:110px;
  display:grid;
  place-items:center;
  font:14px Arial;
  border:1px solid var(--ink);
}
.color-strip span:last-child {
  color:var(--ink);
}
.simple-next {
  text-align:center;
}
.simple-next h2 {
  font-size:31px;
  margin:0 0 25px;
}
.simple-next .pill {
  margin-top:25px;
}
.swatch-buttons {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
  margin:35px 0;
}
.swatch-button {
  display:flex;
  align-items:center;
  flex-direction:column;
  text-align:center;
  font:18px/1.5 Arial;
  padding:20px;
  border:1px solid transparent;
  border-radius:100px 100px 10px 10px;
}
.swatch-button i {
  width:65px;
  height:65px;
  border-radius:50%;
  background:var(--swatch);
  border:1px solid var(--ink);
  margin-bottom:15px;
}
.swatch-button>span {
  font:14px/1.8 sans-serif;
}
.swatch-button[aria-current=true] {
  border-color:var(--ink);
  background:var(--lavender);
}
.swatch-button:hover {
  background:#d8cbea80;
}
.color-panel {
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:70px;
  align-items:center;
  margin-top:50px;
}
.color-panel>img {
  max-height:525px;
  object-fit:cover;
  border-radius:200px 200px 10px 10px;
}
.color-panel h3 {
  font:54px/1.1 Arial;
  letter-spacing:-.045em;
  margin-bottom:25px;
}
.color-panel h3 span {
  display:block;
  font:18px/1.7 sans-serif;
  letter-spacing:0;
  margin-top:10px;
}
.color-panel .pill {
  margin-top:30px;
}
.numbered-list {
  list-style:none;
  padding:0;
  max-width:800px;
  margin:40px auto 0;
}
.numbered-list li {
  display:flex;
  gap:40px;
  border-top:1px solid;
  padding:25px 0;
}
.numbered-list li>span {
  font:45px Arial;
}
.numbered-list h3 {
  font-size:23px;
  margin-bottom:10px;
}
.table-scroll {
  overflow-x:auto;
  margin-top:45px;
}
table {
  width:100%;
  border-collapse:collapse;
  text-align:left;
  min-width:540px;
  font-size:15px;
}
caption {
  text-align:left;
  font-size:14px;
  margin-bottom:20px;
}
th,td {
  border:1px solid #27232760;
  padding:24px 22px;
}
thead {
  background:var(--lavender);
}
tbody th {
  background:#f0e9df;
  white-space:nowrap;
}
.salon-wide {
  margin-top:60px;
}
.salon-wide>img {
  max-height:640px;
  object-fit:cover;
  border-radius:10px 180px 10px 10px;
}
.floorplan-section {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;
  align-items:center;
}
.floorplan {
  height:430px;
  border:2px solid;
  position:relative;
  padding:45px 30px;
  background:var(--cream);
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:1.2fr 1fr;
  gap:25px;
  border-radius:120px 5px 5px 5px;
}
.floor-window {
  position:absolute;
  left:20%;
  right:20%;
  top:0;
  text-align:center;
  font:14px Arial;
  background:var(--blue);
  transform:translateY(-50%);
  padding:7px;
}
.floor-stations {
  display:flex;
  gap:15px;
  grid-column:1/3;
  justify-content:center;
}
.floor-stations span {
  border:1px solid;
  border-radius:60px 60px 10px 10px;
  background:var(--pink);
  width:110px;
  text-align:center;
  padding-top:40px;
  font:15px/1.5 Arial;
}
.floor-wash,.floor-reception {
  font-size:14px;
  text-align:center;
  display:grid;
  place-content:center;
  border:1px solid;
  border-radius:15px;
  padding:15px;
}
.floor-wash {
  background:var(--blue);
}
.floor-reception {
  background:var(--yellow);
}
.floor-entry {
  position:absolute;
  bottom:0;
  right:20px;
  font:14px Arial;
  padding:0 15px;
  background:var(--cream);
  transform:translateY(50%);
}
.welcome-split {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:60px;
  align-items:center;
}
.welcome-split>img {
  border-radius:140px 140px 10px 10px;
  aspect-ratio:1;
  object-fit:cover;
}
.welcome-split>div>p {
  margin-top:20px;
}
.welcome-split .pill {
  margin-top:25px;
}
.timeline {
  list-style:none;
  margin:50px auto 0;
  padding:0;
  max-width:850px;
}
.timeline li {
  display:flex;
  gap:40px;
  padding:0 0 40px;
  position:relative;
}
.timeline li:not(:last-child):before {
  content:'';
  position:absolute;
  left:32px;
  top:64px;
  bottom:0;
  border-left:1px solid;
}
.timeline li>span {
  display:grid;
  place-items:center;
  width:65px;
  height:65px;
  flex-shrink:0;
  font:27px Arial;
  border:1px solid;
  border-radius:50%;
  background:var(--cream);
}
.timeline .eyebrow {
  margin-bottom:6px;
}
.timeline h3 {
  font-size:25px;
  margin-bottom:14px;
}
.timeline p {
  line-height:2;
}
.prep-section {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;
}
.prep-section .section-heading {
  margin-bottom:30px;
}
.checklist>label {
  display:flex;
  gap:20px;
  align-items:center;
  border-top:1px solid;
  padding:24px 0;
  cursor:pointer;
}
.checklist strong {
  display:block;
  font-size:18px;
}
.checklist label>span {
  font-size:14px;
}
.time-blocks {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:45px;
  margin-top:45px;
}
.time-blocks>div {
  border-top:1px solid;
  padding-top:25px;
}
.time-blocks strong {
  font:72px Arial;
  letter-spacing:-.06em;
}
.time-blocks strong span {
  font-size:22px;
  letter-spacing:0;
  margin-left:10px;
}
.faq-section {
  max-width:950px;
}
.faq-tools>label {
  font-size:14px;
  display:block;
  margin-bottom:10px;
}
.search-field {
  display:flex;
  border-bottom:1px solid;
}
.search-field input {
  width:100%;
  border:0;
  padding:16px 5px;
  background:transparent;
  border-radius:0;
  min-width:0;
}
.search-field button {
  background:transparent;
  white-space:nowrap;
  font-size:14px;
  padding:10px;
}
.faq-list {
  margin-top:38px;
}
.faq-item {
  border-top:1px solid;
}
.faq-item:last-child {
  border-bottom:1px solid;
}
.faq-item summary {
  display:flex;
  gap:25px;
  align-items:center;
  list-style:none;
  padding:26px 0;
  font-weight:500;
}
.faq-item summary::-webkit-details-marker {
  display:none;
}
.faq-item summary>span {
  font:27px Arial;
}
.faq-item summary>i {
  font-style:normal;
  margin-left:auto;
  font-size:24px;
}
.faq-item[open] summary>i {
  transform:rotate(45deg);
}
.faq-item>div {
  padding:0 30px 30px 53px;
}
.faq-item[open] {
  background:#d8cbea45;
}
.faq-item[open] summary {
  padding-inline:15px;
}
.faq-item[open]>div {
  padding-left:68px;
}
#faq-empty {
  padding:50px 0;
}
#faq-empty .pill {
  margin-top:25px;
}
.booking-layout {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:100px;
  align-items:start;
}
.booking-layout aside h2 {
  font-size:38px;
  line-height:1.8;
}
.booking-layout aside>p:not(.eyebrow) {
  margin-top:25px;
}
.demo-box {
  background:var(--lavender);
  padding:26px;
  margin:30px 0;
}
.demo-box strong {
  font-size:16px;
}
.demo-box p {
  font-size:14px;
  margin-top:15px;
}
.form-progress {
  display:flex;
  gap:20px;
  align-items:center;
  font-size:14px;
  border-bottom:1px solid;
  padding-bottom:25px;
  margin-bottom:35px;
}
.form-progress i {
  font-style:normal;
}
.form-progress .current {
  font-weight:bold;
}
#booking-form legend>span {
  font:19px Arial;
  border:1px solid;
  border-radius:50%;
  padding:9px;
  margin-right:14px;
}
#booking-form label:not(.radio-label):not(.consent) {
  display:block;
  font-size:15px;
  margin:20px 0 9px;
}
.required {
  font-size:14px;
  background:var(--pink);
  padding:2px 8px;
  border-radius:4px;
  margin-left:8px;
  white-space:nowrap;
}
#booking-form select,#booking-form input[type=date] {
  width:100%;
  border:1px solid;
  background:var(--cream);
  padding:14px 15px;
  min-height:56px;
  border-radius:5px;
}
#booking-form .booking-estimate {
  margin-top:13px;
  font-size:14px;
  font-weight:600;
}
#booking-form fieldset {
  border-bottom:1px solid #27232740;
  padding-bottom:25px;
  margin-bottom:40px;
}
.radio-label {
  display:flex;
  align-items:center;
  gap:15px;
  margin-bottom:16px;
}
.consent {
  display:flex;
  gap:13px;
  align-items:flex-start;
  margin-bottom:30px;
  font-size:14px;
}
.consent input {
  margin-top:4px;
}
.booking-result {
  border:1px solid;
  padding:40px;
  background:var(--lavender);
}
.booking-result h2 {
  font-size:34px;
  margin-bottom:20px;
}
.booking-result>p {
  font-size:16px;
}
.booking-result strong {
  display:block;
  margin-top:12px;
}
.booking-result dl {
  margin:25px 0 35px;
}
.booking-result dl>div {
  border-bottom:1px solid #27232750;
  padding:14px 0;
}
.booking-result dt {
  font-size:14px;
}
.booking-result dd {
  margin:5px 0 0;
  font-weight:600;
}
.booking-result .text-link {
  margin-top:25px;
}
.js-only {
  display:none;
}
.js .js-only {
  display:revert;
}
[hidden] {
  display:none!important;
}
.js .filter-bar {
  display:flex;
}
.js .faq-tools,.js #booking-form {
  display:block;
}
.js #style-count,.js #prep-count {
  display:block;
}
@media(min-width:1500px) {
  .hero {
    min-height:800px;
    padding-top:85px;
  }
  .hero-art {
    height:600px;
  }
  .hero-main {
    height:490px;
  }
  .hero-small {
    height:280px;
  }
  .hero-copy {
    padding-left:25px;
  }
}
@media(max-width:1050px) {
  .wrap {
    width:calc(100% - 72px);
  }
  .site-header {
    gap:22px;
  }
  .desktop-nav {
    gap:20px;
  }
  .hero {
    padding:50px 4% 65px;
    min-height:670px;
  }
  .hero-art {
    height:480px;
  }
  .hero-main {
    right:20px;
    height:380px;
    width:65%;
  }
  .hero-small {
    height:205px;
    bottom:10px;
  }
  .hero-sticker {
    width:110px;
    height:110px;
    font-size:16px;
    padding-top:23px;
  }
  .hero-sticker i {
    font-size:26px;
  }
  .hero-handwriting {
    font-size:32px;
    bottom:12px;
  }
  .hero-description {
    font-size:15px;
  }
  .hero h1 {
    font-size:56px;
  }
  .styles-grid {
    gap:18px;
  }
  .style-card h3 {
    font-size:24px;
  }
  .section {
    padding-block:80px;
  }
  .home-concept,.home-menu,.visit-links,.compact-columns,.menu-builder,.booking-layout {
    gap:45px;
  }
  .japanese-large {
    font-size:31px;
  }
  .color-feature h2 {
    font-size:48px;
  }
  .swatch-art div {
    width:80px;
    height:280px;
  }
  .salon-copy {
    padding:35px;
  }
  .salon-copy h2 {
    font-size:27px;
  }
  .salon-image {
    padding:35px 0 35px 35px;
  }
  .footer-brand {
    font-size:85px;
  }
  .brand-flower {
    font-size:50px;
  }
  .footer-top nav {
    column-gap:25px;
  }
  .footer-bottom {
    flex-wrap:wrap;
    font-size:14px;
  }
  .footer-bottom p:nth-child(2) {
    order:3;
    flex-basis:100%;
  }
  .menu-line {
    grid-template-columns:1fr 1fr auto;
    gap:20px;
  }
  .menu-line>.pill {
    grid-column:3;
  }
  .menu-line>p {
    grid-column:2;
    grid-row:1/3;
  }
  .menu-line>.menu-price {
    grid-column:3;
    grid-row:1;
  }
  .menu-line>div:first-child {
    grid-row:1/3;
  }
  .principles {
    gap:30px;
  }
  .color-panel {
    gap:40px;
  }
  .split-copy {
    padding:50px 35px;
  }
  .split-copy h2 {
    font-size:28px;
  }
  .floorplan-section,.welcome-split,.prep-section {
    gap:40px;
  }
  .booking-layout aside h2 {
    font-size:30px;
  }
}
@media(max-width:760px) {
  html {
    scroll-padding-top:90px;
  }
  .wrap {
    width:calc(100% - 40px);
  }
  body {
    line-height:1.85;
  }
  .section {
    padding-block:64px;
  }
  .site-header {
    height:88px;
    padding:0 20px;
    gap:16px;
  }
  .brand {
    font-size:42px;
    letter-spacing:-3px;
  }
  .brand span {
    font-size:14px;
  }
  .desktop-nav {
    display:none;
  }
  .header-book {
    padding:8px 15px;
    gap:16px;
    box-shadow:2px 2px 0;
    font-size:14px;
  }
  .mobile-menu {
    display:block;
  }
  .mobile-menu summary {
    list-style:none;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:5px;
    font:14px Arial;
    width:42px;
  }
  .mobile-menu summary::-webkit-details-marker {
    display:none;
  }
  .mobile-menu summary i {
    width:25px;
    height:8px;
    border-block:1px solid;
  }
  .mobile-menu[open] summary i {
    height:1px;
    transform:rotate(-20deg);
  }
  .mobile-menu nav {
    position:absolute;
    top:88px;
    left:0;
    right:0;
    background:var(--lavender);
    border-block:1px solid;
    display:grid;
    grid-template-columns:1fr 1fr;
    padding:25px 20px;
    gap:4px 22px;
    box-shadow:0 5px 0 #272327;
  }
  .mobile-menu nav a {
    font-size:14px;
    padding:12px 0;
    border-bottom:1px solid #27232740;
  }
  .hero {
    display:block;
    padding:38px 20px 62px;
    min-height:0;
  }
  .hero-copy {
    padding:0;
    max-width:100%;
  }
  .hero-copy .eyebrow {
    font-size:14px;
    letter-spacing:.04em;
    margin-bottom:18px;
  }
  .hero h1 {
    font-size:50px;
    line-height:1.42;
    letter-spacing:.045em;
  }
  .hero h1 br:nth-of-type(2) {
    display:initial;
  }
  .hero-description {
    font-size:15px;
    line-height:1.9;
    margin:23px 0;
  }
  .hero-art {
    height:410px;
    margin-top:30px;
    margin-left:6px;
  }
  .hero-oval {
    inset:35px 10px 28px 0;
  }
  .hero-main {
    width:62%;
    height:340px;
    right:27px;
    top:6px;
    transform:rotate(7deg);
  }
  .hero-small {
    height:200px;
    width:36%;
    bottom:25px;
    left:0;
    border-width:5px;
  }
  .hero-star {
    font-size:80px;
    left:0;
    top:12px;
  }
  .hero-sticker {
    width:99px;
    height:99px;
    right:0;
    bottom:14px;
    font-size:15px;
    padding-top:20px;
  }
  .hero-sticker i {
    font-size:28px;
  }
  .hero-handwriting {
    left:26%;
    bottom:7px;
    font-size:30px;
  }
  .hero-side {
    right:-7px;
    top:110px;
    font-size:14px;
  }
  .hero-bottom {
    bottom:20px;
    left:20px;
    right:20px;
    font-size:14px;
    letter-spacing:0;
  }
  .hero-bottom>span:first-child {
    display:none;
  }
  .hero-bottom>span:last-child {
    margin-left:auto;
  }
  .ribbon {
    font-size:22px;
    justify-content:start;
    padding:17px 20px;
    gap:25px;
  }
  .ribbon i {
    font-size:32px;
  }
  .ribbon>span:last-child {
    display:none;
  }
  .home-concept {
    grid-template-columns:1fr;
    gap:35px;
  }
  .japanese-large {
    font-size:30px;
    line-height:1.8;
  }
  .color-dots {
    margin-top:22px;
  }
  .color-dots i {
    width:30px;
    height:30px;
  }
  .prose {
    line-height:2.2;
  }
  .heading-row {
    display:block;
    margin-bottom:30px;
  }
  .heading-row>.pill {
    margin-top:27px;
  }
  .section-heading h2 {
    font-size:45px;
  }
  .section-heading h2 span {
    font-size:16px;
    margin-top:12px;
  }
  .section-heading .eyebrow {
    font-size:14px;
  }
  .styles-grid {
    grid-template-columns:repeat(2,1fr);
    gap:35px 16px;
  }
  .style-photo {
    border-radius:100px 100px 8px 8px;
  }
  .style-photo.short {
    border-radius:8px 8px 100px 100px;
  }
  .style-photo.copper {
    border-radius:8px 90px 8px 8px;
  }
  .style-photo.wave {
    border-radius:90px 8px 8px 8px;
  }
  .style-card .micro {
    font-size:14px;
    letter-spacing:0;
    margin-top:17px;
    line-height:1.5;
  }
  .style-card h3 {
    font-size:24px;
    line-height:1.3;
    margin-top:7px;
  }
  .style-card>p:not(.micro) {
    font-size:14px;
    line-height:1.8;
  }
  .photo-number {
    width:30px;
    height:30px;
    bottom:10px;
    left:10px;
  }
  .card-link {
    margin-top:15px;
  }
  .color-feature {
    padding:60px 0;
  }
  .color-feature-inner {
    grid-template-columns:1fr;
    gap:20px;
  }
  .color-feature h2 {
    font-size:45px;
  }
  .swatch-art {
    height:320px;
    max-width:400px;
    width:100%;
    margin:0 auto;
  }
  .swatch-art div {
    height:240px;
    flex-basis:80px;
  }
  .swatch-art>span {
    font-size:29px;
    bottom:8px;
  }
  .home-menu {
    grid-template-columns:1fr;
    gap:40px;
  }
  .home-menu>div>p {
    margin:23px 0;
  }
  .price-list h3 {
    font-size:29px;
  }
  .price-list>div>p {
    font-size:28px;
  }
  .salon-feature {
    grid-template-columns:1fr;
    min-height:0;
  }
  .salon-image {
    padding:30px 20px 0;
  }
  .salon-image img {
    height:auto;
    aspect-ratio:1.2;
    border-radius:8px 100px 8px 8px;
  }
  .salon-copy {
    padding:40px 25px 55px;
  }
  .salon-copy h2 {
    font-size:30px;
  }
  .visit-links {
    grid-template-columns:1fr;
    gap:30px;
  }
  .visit-links h2 {
    font-size:27px;
  }
  .visit-links>div:last-child>a {
    font-size:16px;
  }
  .booking-cta {
    padding:60px 20px 50px;
  }
  .booking-cta .eyebrow {
    font-size:14px;
    max-width:260px;
    margin:0 auto 20px;
  }
  .booking-cta h2 {
    font-size:25px;
    letter-spacing:.01em;
    position:relative;
  }
  .booking-cta>span {
    font-size:80px;
    left:-20px;
    top:15%;
  }
  .booking-cta .note {
    font-size:14px;
    max-width:350px;
    margin:24px auto 0;
  }
  .footer {
    padding:50px 22px 25px;
  }
  .footer-top {
    display:block;
    padding-bottom:35px;
  }
  .footer-brand {
    font-size:80px;
    letter-spacing:-6px;
    gap:8px;
  }
  .brand-flower {
    font-size:50px;
  }
  .footer-top>div>p {
    font-size:16px;
    margin-top:20px;
  }
  .footer-top nav {
    margin-top:35px;
    gap:14px 18px;
    font-size:14px;
  }
  .footer-bottom {
    gap:22px;
    line-height:1.8;
  }
  .footer-bottom>p:first-child {
    font-size:14px;
  }
  .footer-bottom>a {
    font-size:14px;
  }
  .page-intro {
    padding:42px 0 40px;
  }
  .page-intro h1 {
    font-size:54px;
    max-width:100%;
    position:relative;
    z-index:1;
  }
  .page-intro h1>span {
    font-size:20px;
    margin:15px 0;
  }
  .page-intro .eyebrow {
    font-size:14px;
    letter-spacing:.02em;
    margin-bottom:22px;
  }
  .page-intro .eyebrow>span {
    margin:0 8px;
  }
  .page-intro .wrap>p:last-of-type {
    max-width:100%;
    font-size:15px;
    position:relative;
    z-index:1;
  }
  .intro-flower {
    font-size:100px;
    right:-10px;
    top:35px;
    opacity:.16;
  }
  .manifesto h2 {
    font-size:31px;
    line-height:1.8;
  }
  .manifesto>p:not(.eyebrow) {
    font-size:16px;
    text-align:left;
  }
  .manifesto>p br {
    display:none;
  }
  .split-section {
    grid-template-columns:1fr;
  }
  .split-section>div:first-child>img {
    height:auto;
    aspect-ratio:1.3;
    object-fit:cover;
  }
  .split-copy {
    padding:40px 25px 55px;
  }
  .split-copy h2 {
    font-size:30px;
  }
  .principles {
    grid-template-columns:1fr;
    gap:45px;
    margin-top:40px;
  }
  .principles article {
    display:grid;
    grid-template-columns:110px 1fr;
    column-gap:22px;
    align-items:start;
  }
  .principle-disc {
    width:110px;
    height:110px;
    font-size:38px;
    grid-row:1/3;
    margin:0;
  }
  .principle-disc span {
    font-size:14px;
  }
  .principles h3 {
    font-size:19px;
    margin:8px 0 14px;
  }
  .principles p {
    font-size:15px;
  }
  .day-grid {
    grid-template-columns:1fr;
    gap:30px;
    margin-top:35px;
  }
  .day-grid h3 {
    font-size:22px;
  }
  .closing-split {
    flex-direction:column;
    gap:35px;
    align-items:start;
  }
  .mini-photo {
    width:100%;
  }
  .mini-photo img {
    width:220px;
    height:275px;
    margin-left:auto;
  }
  .notice {
    display:block;
    padding:18px;
    margin-bottom:40px;
  }
  .notice span {
    display:block;
    margin-top:8px;
  }
  .menu-line {
    grid-template-columns:1fr auto;
    gap:18px;
    padding:25px 0;
  }
  .menu-line>div:first-child {
    grid-column:1;
    grid-row:1;
    gap:13px;
  }
  .menu-line h3 {
    font-size:25px;
  }
  .menu-line>.menu-price {
    grid-column:2;
    grid-row:1;
    font-size:25px;
  }
  .menu-line>p {
    grid-column:1/3;
    grid-row:2;
  }
  .menu-line>.pill {
    grid-column:2;
    grid-row:3;
    justify-self:end;
    min-width:120px;
  }
  .menu-line h3 span {
    font-size:14px;
  }
  .menu-builder {
    grid-template-columns:1fr;
    gap:35px;
  }
  .menu-builder h2 {
    font-size:31px;
  }
  #menu-builder label {
    flex-wrap:wrap;
    gap:10px;
    font-size:16px;
  }
  #menu-builder label>span {
    font-size:14px;
  }
  #menu-total {
    font-size:34px;
  }
  .compare-options {
    grid-template-columns:1fr;
    gap:16px;
    margin-top:30px;
  }
  .compare-options>a {
    padding:22px 0;
  }
  .compare-options h3 {
    margin:10px 0;
    font-size:23px;
  }
  .compare-options i {
    position:absolute;
    right:10px;
    top:50px;
    margin:0;
  }
  .compact-columns {
    grid-template-columns:1fr;
    gap:28px;
  }
  .compact-columns h2 {
    font-size:30px;
  }
  .full-styles {
    grid-template-columns:1fr;
    gap:50px;
  }
  .full-styles .style-photo {
    aspect-ratio:4/4.6;
    max-height:520px;
  }
  .full-styles .style-card h3 {
    font-size:32px;
  }
  .full-styles .style-card>p:not(.micro) {
    font-size:16px;
  }
  .filter-bar {
    gap:8px;
  }
  .filter-bar button {
    padding:10px 16px;
    font-size:14px;
  }
  .color-strip {
    gap:8px;
    margin:30px 0;
    flex-direction:column;
  }
  .color-strip span {
    min-height:65px;
  }
  .simple-next h2 {
    font-size:27px;
  }
  .simple-next>p br {
    display:none;
  }
  .swatch-buttons {
    gap:8px;
    margin:30px 0;
    grid-template-columns:repeat(2,1fr);
  }
  .swatch-button {
    font-size:18px;
    padding:17px 8px;
    border-radius:80px 80px 6px 6px;
  }
  .swatch-button i {
    height:60px;
    width:60px;
  }
  .color-panel {
    grid-template-columns:1fr;
    gap:30px;
    margin-top:35px;
  }
  .color-panel>img {
    max-height:440px;
    max-width:100%;
    object-position:center 30%;
  }
  .color-panel h3 {
    font-size:44px;
  }
  .numbered-list li {
    gap:25px;
  }
  .numbered-list li>span {
    font-size:36px;
  }
  .numbered-list h3 {
    font-size:21px;
  }
  th,td {
    padding:18px 14px;
  }
  .salon-wide {
    margin-top:35px;
  }
  .salon-wide>img {
    aspect-ratio:1;
    object-fit:cover;
    border-radius:5px 100px 5px 5px;
  }
  .floorplan-section {
    grid-template-columns:1fr;
    gap:40px;
  }
  .floorplan {
    height:390px;
    padding:40px 22px;
    gap:18px;
  }
  .welcome-split {
    grid-template-columns:1fr;
    gap:35px;
  }
  .welcome-split>img {
    border-radius:110px 110px 5px 5px;
  }
  .timeline {
    margin-top:40px;
  }
  .timeline li {
    gap:20px;
    padding-bottom:35px;
  }
  .timeline li>span {
    width:49px;
    height:49px;
    font-size:21px;
  }
  .timeline li:not(:last-child):before {
    left:24px;
    top:49px;
  }
  .timeline h3 {
    font-size:22px;
  }
  .timeline .eyebrow {
    font-size:14px;
    letter-spacing:.02em;
  }
  .timeline p {
    font-size:15px;
  }
  .prep-section {
    grid-template-columns:1fr;
    gap:30px;
  }
  .checklist strong {
    font-size:17px;
  }
  .time-blocks {
    gap:18px;
    grid-template-columns:1fr;
    margin-top:25px;
  }
  .time-blocks>div {
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding-top:15px;
    gap:20px;
  }
  .time-blocks strong {
    font-size:55px;
  }
  .time-blocks strong span {
    font-size:18px;
  }
  .faq-item summary {
    gap:15px;
    font-size:16px;
    padding:23px 0;
  }
  .faq-item summary>span {
    font-size:24px;
  }
  .faq-item>div {
    padding:0 10px 25px 38px;
    font-size:15px;
  }
  .faq-item[open] summary {
    padding-inline:8px;
  }
  .faq-item[open]>div {
    padding-left:46px;
  }
  .faq-tools .filter-bar button {
    padding:8px 12px;
  }
  .booking-layout {
    grid-template-columns:1fr;
    gap:45px;
  }
  .booking-layout aside h2 {
    font-size:32px;
  }
  .demo-box {
    margin:22px 0;
    padding:22px;
  }
  .booking-layout aside>p {
    font-size:16px;
  }
  .booking-result {
    padding:26px 22px;
  }
  .booking-result h2 {
    font-size:30px;
  }
  .booking-result .pill {
    min-width:100%;
    gap:15px;
  }
  .consent {
    flex-wrap:wrap;
  }
  .consent>.required {
    margin-left:33px;
  }
  .form-progress {
    gap:16px;
  }
  .booking-estimate {
    line-height:1.8;
  }
  .booking-cta .pill {
    min-width:270px;
  }
}
@media(max-width:360px) {
  .hero h1 {
    font-size:42px;
  }
  .hero-art {
    height:350px;
  }
  .hero-main {
    height:290px;
    right:22px;
  }
  .hero-small {
    height:170px;
  }
  .hero-sticker {
    width:85px;
    height:85px;
    font-size:14px;
    padding-top:16px;
  }
  .hero-sticker i {
    font-size:23px;
  }
  .hero-handwriting {
    font-size:26px;
    bottom:5px;
  }
  .hero-star {
    font-size:65px;
  }
  .site-header {
    gap:12px;
    padding-inline:15px;
  }
  .brand {
    font-size:36px;
  }
  .header-book {
    padding:7px 11px;
    gap:12px;
  }
  .style-card h3 {
    font-size:22px;
  }
  .styles-grid {
    gap:30px 12px;
  }
  .page-intro h1 {
    font-size:47px;
  }
  .footer-brand {
    font-size:69px;
  }
  .brand-flower {
    font-size:40px;
  }
  .booking-cta h2 {
    font-size:23px;
  }
  .principles article {
    grid-template-columns:88px 1fr;
    gap:16px;
  }
  .principle-disc {
    width:88px;
    height:88px;
    font-size:30px;
  }
  .menu-line h3 {
    font-size:22px;
  }
  .japanese-large {
    font-size:26px;
  }
  .floorplan {
    padding:40px 16px;
    gap:12px;
  }
  .floor-wash,.floor-reception {
    padding:10px;
    font-size:14px;
  }
  .eyebrow {
    letter-spacing:.04em;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*::before,*::after {
    transition:none!important;
    animation:none!important;
  }
}