/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--spacing:.25rem;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.relative{position:relative}.start{inset-inline-start:var(--spacing)}.inline{display:inline}.table{display:table}}:root{--ink:#151817;--ink-soft:#3f4441;--paper:#f7f6f1;--paper-warm:#eeeae1;--white:#fff;--line:#d8d6ce;--line-dark:#4b4f4c;--lime:#b8d900;--lime-deep:#8fa900;--focus:#087d80;--shell:1180px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--ink);background:var(--paper);letter-spacing:0;margin:0;font-family:Yu Gothic,YuGothic,Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,Meiryo,sans-serif}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}figure,p,h1,h2,h3,dl,dd{margin:0}.page-shell{width:min(calc(100% - 48px), var(--shell));margin-inline:auto}.section-kicker{color:var(--lime-deep);letter-spacing:.12em;margin-bottom:12px;font-size:12px;font-weight:900;line-height:1.3}.section-kicker-light{color:var(--lime)}.section-heading h2,.problem-heading h2,.value-copy h2,.memory-copy h2,.faq-heading h2{letter-spacing:0;font-size:38px;font-weight:900;line-height:1.35}.section-heading>p:last-child{color:var(--ink-soft);margin-top:14px;font-size:15px;font-weight:600;line-height:1.9}.section-heading-center{text-align:center}.section-heading-center h2 span{color:var(--lime-deep)}.section-heading-split{justify-content:space-between;align-items:flex-end;gap:48px;display:flex}.section-heading-split>p{flex:none}.site-header{z-index:50;background:#fffffff7;border-bottom:1px solid #15181714;grid-template-columns:minmax(140px,1fr) auto minmax(180px,1fr);align-items:center;height:76px;padding:0 clamp(22px,4vw,64px);display:grid;position:sticky;top:0}.brand img{width:100%;height:auto}.site-nav{align-items:center;gap:clamp(22px,3vw,42px);font-size:14px;font-weight:800;display:flex}.site-nav a{padding:27px 0 24px;position:relative}.site-nav a:after{background:var(--lime);transform-origin:0;content:"";height:2px;transition:transform .18s;position:absolute;bottom:18px;left:0;right:0;transform:scaleX(0)}.site-nav a:hover:after,.site-nav a:focus-visible:after{transform:scaleX(1)}.header-cta,.primary-cta{background:var(--lime);color:#11130f;justify-content:center;align-items:center;gap:13px;min-height:48px;font-weight:900;transition:background-color .16s,transform .16s;display:inline-flex}.header-cta{justify-self:end;min-width:180px;padding-inline:20px;font-size:13px}.header-cta:hover,.primary-cta:hover{background:#cce800;transform:translateY(-2px)}.header-cta:focus-visible,.primary-cta:focus-visible,.site-nav a:focus-visible,.brand:focus-visible,.faq-list summary:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.hero{background:var(--white);grid-template-columns:minmax(460px,44%) minmax(0,56%);height:calc(100svh - 116px);min-height:620px;max-height:700px;display:grid;position:relative;overflow:hidden}.hero-copy{z-index:3;padding:52px 30px 54px max(44px, calc((100vw - var(--shell)) / 2));flex-direction:column;justify-content:center;display:flex;position:relative}.hero-copy:after{z-index:-1;background:var(--white);clip-path:polygon(0 0,72% 0,60% 9%,78% 18%,58% 28%,82% 39%,63% 49%,79% 60%,57% 71%,76% 82%,62% 92%,72% 100%,0 100%);content:"";width:180px;height:106%;position:absolute;top:-3%;right:-90px}.hero-kicker{background:var(--ink);color:var(--white);align-self:flex-start;margin-bottom:20px;padding:7px 12px 8px;font-size:14px;font-weight:900;transform:rotate(-1.5deg)}.hero h1{letter-spacing:0;font-size:68px;font-weight:900;line-height:1.08}.hero h1 span{width:max-content;max-width:100%;color:var(--lime-deep);margin-top:4px;display:block;position:relative}.hero h1 span:after{opacity:.82;pointer-events:none;content:"";background:url(../assets/lime-brush-long.png) 50%/100% 100% no-repeat;height:24px;position:absolute;bottom:-15px;left:-4%;right:-4%}.hero-lead{margin-top:26px;font-size:23px;font-weight:900;line-height:1.65}.hero-benefits{grid-template-columns:repeat(3,minmax(0,1fr));width:min(510px,100%);margin-top:28px;display:grid}.hero-benefit{text-align:center;border-right:1px solid #1518172e;min-width:0;padding:0 14px}.hero-benefit:first-child{padding-left:0}.hero-benefit:last-child{border-right:0;padding-right:0}.hero-benefit svg{margin:0 auto 8px}.hero-benefit strong,.hero-benefit span{display:block}.hero-benefit strong{font-size:12px;line-height:1.45}.hero-benefit span{color:var(--ink-soft);margin-top:3px;font-size:10px;line-height:1.4}.primary-cta{align-self:flex-start;min-width:276px;margin-top:30px;padding-inline:25px;font-size:15px;box-shadow:0 10px 28px #6475002e}.hero-photo{background:var(--paper-warm);min-width:0;height:100%;position:relative;overflow:hidden}.hero-photo:before{z-index:2;filter:brightness(0)invert();opacity:.94;pointer-events:none;content:"";background:url(../assets/lime-brush-long.png) 50%/100% 100% no-repeat;width:720px;height:138px;position:absolute;top:50%;left:-12px;transform:translate(-50%,-50%)rotate(90deg)}.hero-photo>img{object-fit:cover;object-position:56% center;width:100%;height:100%}.hero-product-mark{z-index:3;color:var(--ink);flex-direction:column;align-items:flex-end;padding:14px 16px 10px 28px;display:flex;position:absolute;bottom:7%;right:3%;transform:rotate(-2deg)}.hero-product-mark:before{z-index:-1;content:"";background:url(../assets/lime-brush-swipe.png) 50%/100% 100% no-repeat;position:absolute;inset:-78px -92px -66px -86px}.hero-product-mark span{background:var(--ink);color:var(--white);padding:4px 8px;font-size:10px;font-weight:900}.hero-product-mark strong{letter-spacing:0;margin-top:2px;font-size:48px;font-style:italic;line-height:1}.problem-strip{grid-template-columns:.82fr 1.18fr;align-items:center;gap:64px;padding-block:68px;display:grid}.problem-heading h2{font-size:30px;position:relative}.problem-heading h2:after{opacity:.7;pointer-events:none;content:"";background:url(../assets/lime-brush-long.png) 50%/100% 100% no-repeat;width:170px;height:17px;position:absolute;bottom:-17px;left:-9px}.problem-list{grid-template-columns:repeat(3,minmax(0,1fr));margin:0;padding:0;list-style:none;display:grid}.problem-list li{border-left:1px solid var(--line);min-width:0;padding:4px 24px;font-size:14px;font-weight:800;line-height:1.7}.problem-list svg{color:var(--lime-deep);margin-bottom:12px;display:block}.value-band{color:var(--white);background:repeating-linear-gradient(168deg,#ffffff05 0 2px,#0000 2px 13px),#181a19;padding:72px 0 40px;position:relative;overflow:hidden}.value-band:before,.value-band:after{opacity:.7;pointer-events:none;content:"";background:url(../assets/lime-brush-swipe.png) 50%/contain no-repeat;width:560px;height:330px;position:absolute}.value-band:before{top:-168px;left:-230px;transform:rotate(-10deg)}.value-band:after{bottom:-174px;right:-245px;transform:rotate(10deg)}.value-inner{z-index:1;grid-template-columns:.9fr 1.1fr;align-items:center;gap:74px;display:grid;position:relative}.value-photo{height:420px;position:relative;overflow:hidden;transform:rotate(-.8deg);box-shadow:-12px 12px #b8d9002e}.value-photo img{object-fit:cover;object-position:center 62%;width:100%;height:100%}.value-copy h2{font-size:46px;position:relative}.value-copy h2:after{opacity:.86;pointer-events:none;content:"";background:url(../assets/lime-brush-long.png) 50%/100% 100% no-repeat;width:230px;height:20px;position:absolute;bottom:-18px;left:-10px}.value-brand{flex-direction:column;width:max-content;margin:0 0 24px;line-height:1;display:flex;position:relative;transform:rotate(-1.5deg)}.value-brand:before{z-index:-1;opacity:.24;pointer-events:none;content:"";background:url(../assets/lime-brush-long.png) 50%/100% 100% no-repeat;height:52px;position:absolute;bottom:-18px;left:-26px;right:-66px}.value-brand strong{letter-spacing:0;font-size:74px;font-style:italic;font-weight:900}.value-brand span{color:var(--white);letter-spacing:.25em;margin-top:7px;padding-left:6px;font-size:14px;font-weight:900}.value-copy>p:last-child{color:#dadcd9;margin-top:24px;font-size:16px;font-weight:600;line-height:1.95}.benefit-row{z-index:1;border-top:1px solid var(--line-dark);grid-template-columns:repeat(5,minmax(0,1fr));margin-top:48px;display:grid;position:relative}.benefit-row-item{border-right:1px solid var(--line-dark);min-width:0;min-height:110px;color:var(--lime);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:18px 12px;display:flex}.benefit-row-item:first-child{border-left:1px solid var(--line-dark)}.benefit-row-item span{color:var(--white);font-size:12px;font-weight:800;line-height:1.45}.how-section,.detail-section,.colors-section,.faq-section{background:var(--white)}.how-section{position:relative;overflow:hidden}.how-section:before{opacity:.1;pointer-events:none;content:"";background:url(../assets/lime-brush-swipe.png) 50%/contain no-repeat;width:560px;height:330px;position:absolute;top:-122px;right:-190px;transform:rotate(-7deg)}.how-section>.page-shell{z-index:1;position:relative}.steps-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;display:grid}.step-item{border:1px solid var(--line);border-top:4px solid var(--ink);background:var(--white);border-radius:6px;min-width:0;padding:18px;position:relative;box-shadow:0 13px 30px #1518170e}.step-item:not(:last-child):after{z-index:3;border-top:3px solid var(--ink);border-right:3px solid var(--ink);content:"";width:13px;height:13px;position:absolute;top:42%;right:-19px;transform:rotate(45deg)}.step-number{z-index:2;background:var(--lime);color:var(--ink);align-items:baseline;gap:8px;padding:5px 8px 4px;font-size:25px;font-weight:900;line-height:1;display:flex;position:absolute;top:28px;left:28px;transform:rotate(-2deg)}.step-number small{color:var(--ink);font-size:11px;font-weight:900;line-height:1}.step-photo,.step-item .photo-placeholder{aspect-ratio:4/3;width:100%}.step-photo{object-fit:cover}.step-item h3{margin-top:20px;font-size:19px;font-weight:900;line-height:1.4}.step-item>p{color:var(--ink-soft);margin-top:8px;font-size:13px;font-weight:600;line-height:1.75}.photo-placeholder{color:#6c706d;text-align:center;background:linear-gradient(30deg,#0000 49.7%,#1518170d 50%,#0000 50.3%),linear-gradient(150deg,#0000 49.7%,#1518170d 50%,#0000 50.3%),#eeede8;border:1px dashed #aaa9a2;flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:180px;display:flex;overflow:hidden}.photo-placeholder span{padding-inline:14px;font-size:13px;font-weight:800;line-height:1.5}.photo-placeholder small{letter-spacing:.12em;font-size:9px;font-weight:700}.places-section{background:var(--paper)}.places-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;display:grid}.place-item{min-width:0;position:relative}.place-item>img,.place-item>.photo-placeholder{aspect-ratio:16/10;width:100%}.place-item>img{object-fit:cover}.place-item:first-child>img{object-position:center 67%}.place-label{z-index:2;background:var(--lime);clip-path:polygon(4% 8%,100% 0,96% 91%,0 100%);padding:6px 12px;font-size:13px;font-weight:900;position:absolute;top:12px;left:12px;transform:rotate(-1.5deg)}.place-item:nth-child(2) .place-label{transform:rotate(1deg)}.place-item:nth-child(3) .place-label{transform:rotate(-.5deg)}.place-item>p{padding:16px 3px 0;font-size:13px;font-weight:700;line-height:1.75}.features-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;display:grid}.feature-item{border-top:3px solid var(--ink);min-width:0}.feature-item .photo-placeholder{aspect-ratio:4/3;min-height:160px}.feature-copy svg{color:var(--lime-deep)}.feature-copy h3{margin-top:10px;font-size:17px;font-weight:900;line-height:1.45}.feature-copy p{color:var(--ink-soft);margin-top:8px;font-size:12px;font-weight:600;line-height:1.75}.memory-section{background:var(--paper);position:relative;overflow:hidden}.memory-section:after{z-index:0;opacity:.56;pointer-events:none;content:"";background:url(../assets/lime-brush-swipe.png) 50%/contain no-repeat;width:620px;height:390px;position:absolute;bottom:-74px;right:-150px}.memory-inner{z-index:1;grid-template-columns:.72fr 1.28fr;align-items:center;gap:64px;display:grid;position:relative}.memory-copy>p:last-of-type{color:var(--ink-soft);margin-top:20px;font-size:15px;font-weight:600;line-height:1.9}.memory-copy h2{position:relative}.memory-copy h2:after{opacity:.78;pointer-events:none;content:"";background:url(../assets/lime-brush-long.png) 50%/100% 100% no-repeat;width:190px;height:18px;position:absolute;bottom:-18px;left:-10px}.memory-photo{height:430px;overflow:hidden}.memory-photo img{object-fit:cover;width:100%;height:100%}.capacity-list{gap:22px;margin-top:28px;display:flex}.capacity-list>div{border-left:4px solid var(--lime);background:var(--white);min-width:142px;padding:15px 16px}.capacity-list dt{color:var(--ink-soft);font-size:11px;font-weight:800}.capacity-list dd{margin-top:6px;font-size:14px;font-weight:800}.colors-grid{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.color-item{grid-template-columns:.82fr 1.18fr;align-items:center;min-height:400px;display:grid;overflow:hidden}.color-item-light{background:#f1f0ec}.color-item-dark{color:var(--white);background:#202220}.color-copy{padding:36px}.color-copy span{border-bottom:3px solid var(--lime);padding-bottom:5px;font-size:15px;font-weight:900;display:inline-block}.color-copy h3{margin-top:16px;font-size:20px;font-weight:900;line-height:1.6}.color-item img{object-fit:contain;mix-blend-mode:multiply;width:100%;height:100%}.color-item-dark img{background:var(--white);mix-blend-mode:normal}.spec-section{background:var(--paper)}.spec-inner{grid-template-columns:.62fr 1.38fr;align-items:start;gap:80px;display:grid}.spec-table{border-top:2px solid var(--ink)}.spec-table>div{border-bottom:1px solid var(--line);grid-template-columns:170px 1fr;min-height:58px;display:grid}.spec-table dt,.spec-table dd{align-items:center;padding:13px 16px;font-size:13px;line-height:1.6;display:flex}.spec-table dt{background:#e9e7e0;font-weight:900}.spec-table dd{font-weight:600}.pending-data{color:#777b78}.faq-inner{grid-template-columns:280px 1fr;align-items:start;gap:68px;display:grid}.faq-heading{padding-top:6px}.faq-icon{background:var(--lime);border-radius:50%;place-items:center;width:48px;height:48px;margin-bottom:18px;font-size:27px;font-weight:900;display:grid}.faq-list{border-top:2px solid var(--ink)}.faq-list details{border-bottom:1px solid var(--line)}.faq-list summary{cursor:pointer;justify-content:space-between;align-items:center;gap:20px;min-height:64px;padding:16px 8px;font-size:14px;font-weight:900;list-style:none;display:flex}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary svg{color:var(--lime-deep);flex:none;transition:transform .18s}.faq-list details[open] summary svg{transform:rotate(45deg)}.faq-list details>p{color:var(--ink-soft);padding:0 42px 20px 8px;font-size:13px;font-weight:600;line-height:1.85}.final-cta{color:var(--white);background:repeating-linear-gradient(170deg, #ffffff05 0 2px, transparent 2px 14px), var(--ink);position:relative;overflow:hidden}.final-cta:before{opacity:.76;pointer-events:none;content:"";background:url(../assets/lime-brush-swipe.png) 50%/contain no-repeat;width:590px;height:360px;position:absolute;top:-130px;left:-190px}.final-cta-inner{z-index:1;justify-content:space-between;align-items:center;gap:48px;min-height:150px;display:flex;position:relative}.final-cta p{font-size:24px;font-weight:900;line-height:1.5}.final-cta small{color:#bfc2bf;margin-top:8px;font-size:11px;display:block}.final-cta .primary-cta{flex:none;align-self:center;margin-top:0}@media (width<=1040px){.site-header{grid-template-columns:1fr auto}.site-nav{display:flex}.hero{grid-template-columns:minmax(430px,48%) minmax(0,52%)}.hero h1{font-size:58px}.hero-copy{padding-left:34px}.hero-benefit span{display:none}.problem-strip{grid-template-columns:1fr;gap:34px}.features-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:42px}.colors-grid{grid-template-columns:1fr}}@media (width<=760px){.page-shell{width:min(calc(100% - 32px), var(--shell))}.section-pad{padding-block:64px}.section-heading{margin-bottom:32px}.section-heading h2,.problem-heading h2,.value-copy h2,.memory-copy h2,.faq-heading h2{font-size:28px}.section-heading-split{display:block}.section-heading-split>p{margin-top:14px}.site-header{height:64px;padding-inline:16px;position:relative}.brand{width:104px}.header-cta{min-width:0;min-height:40px;padding-inline:13px}.header-cta span{font-size:11px}.hero{grid-template-rows:auto 250px;grid-template-columns:1fr;height:auto;min-height:0;max-height:none;display:grid}.hero-copy{order:1;padding:34px 20px 32px}.hero-copy:after{clip-path:polygon(0 0,14% 17%,31% 4%,46% 22%,64% 7%,81% 20%,100% 3%,100% 58%,0 68%);width:104%;height:80px;inset:auto -2% -45px}.hero-photo{order:2}.hero-photo>img{object-position:66% 55%}.hero-kicker{margin-bottom:14px;font-size:11px}.hero h1{font-size:46px}.hero h1 span:after{height:17px;bottom:-10px}.hero-lead{margin-top:16px;font-size:17px;line-height:1.55}.hero-benefits{margin-top:20px}.hero-benefit{padding-inline:8px}.hero-benefit svg{width:23px;height:23px}.hero-benefit strong{font-size:10px}.primary-cta{min-width:242px;min-height:46px;margin-top:22px;font-size:13px}.hero-product-mark{bottom:18px;right:8px}.hero-product-mark strong{font-size:32px}.hero-product-mark:before{inset:-54px -54px -48px -62px}.problem-strip{gap:28px;padding-block:54px}.problem-list{grid-template-columns:1fr}.problem-list li{border-top:1px solid var(--line);border-left:0;grid-template-columns:24px 1fr;align-items:start;gap:10px;padding:14px 0;display:grid}.problem-list svg{margin:2px 0 0}.value-band{padding-top:56px}.value-band:before,.value-band:after{opacity:.6;width:390px;height:240px}.value-inner{grid-template-columns:1fr;gap:34px}.value-photo{height:300px;box-shadow:-7px 7px #b8d9002b}.value-copy{order:-1}.value-brand{margin-bottom:20px}.value-brand strong{font-size:54px}.benefit-row{grid-template-columns:repeat(2,minmax(0,1fr))}.benefit-row-item{border-bottom:1px solid var(--line-dark)}.benefit-row-item:nth-child(odd){border-left:1px solid var(--line-dark)}.steps-grid,.places-grid,.features-grid{grid-template-columns:1fr}.steps-grid{gap:18px}.step-item:not(:last-child):after{display:none}.step-item{grid-template-columns:42% 1fr;align-items:start;column-gap:18px;display:grid}.step-item .photo-placeholder,.step-item .step-photo{aspect-ratio:4/5;grid-row:1/span 3}.step-number{font-size:19px;top:26px;left:27px}.step-item h3{margin-top:6px}.places-grid{gap:34px}.features-grid{gap:38px}.feature-item{grid-template-columns:42% 1fr;gap:18px;padding-top:12px;display:grid}.feature-item .photo-placeholder{min-height:150px}.feature-copy{padding-top:0}.memory-inner{grid-template-columns:1fr;gap:34px}.memory-photo{height:300px}.memory-section:after{opacity:.42;width:480px;height:300px;bottom:-100px;right:-200px}.capacity-list{gap:10px}.capacity-list>div{flex:1;min-width:0;padding-inline:11px}.color-item{grid-template-columns:.85fr 1.15fr;min-height:300px}.color-copy{padding:24px}.color-copy h3{font-size:16px}.spec-inner{grid-template-columns:1fr;gap:18px}.spec-table>div{grid-template-columns:112px 1fr}.spec-table dt,.spec-table dd{padding:12px 10px;font-size:12px}.faq-inner{grid-template-columns:1fr;gap:28px}.faq-icon{width:42px;height:42px;font-size:23px}.faq-list summary{font-size:13px;line-height:1.6}.final-cta-inner{flex-direction:column;justify-content:center;align-items:flex-start;gap:0;min-height:210px;padding-block:34px}.final-cta p{font-size:20px}.final-cta:before{opacity:.66;width:480px;height:300px;top:-92px;left:-210px}.final-cta .primary-cta{align-self:flex-start}}.hero-copy:after{display:none}.hero-photo:before{filter:brightness(0)invert();opacity:1;background:url(../assets/lime-brush-long.png) 50%/100% 100% no-repeat;width:790px;height:176px;top:50%;left:-8px;transform:translate(-50%,-50%)rotate(90deg)scaleY(1.22)}@media (width<=760px){.hero-photo:before{width:430px;height:112px;top:-4px;left:50%;transform:translate(-50%,-50%)rotate(0)scaleY(1.35)}}.hero:before,.hero-photo:before,.hero-photo:after{display:none}.hero-photo-edge{z-index:2;pointer-events:none;width:48%;position:absolute;inset:0 auto 0 0;overflow:visible}.hero-photo-edge:before{background:var(--white);content:"";width:13%;position:absolute;inset:0 auto 0 -2px}.hero-photo-edge span{filter:brightness(0)invert();opacity:1;background:url(../assets/lime-brush-swipe.png) 50%/100% 100% no-repeat;width:138%;height:43%;position:absolute;left:-35%}.hero-photo-edge span:first-child{top:-10%;transform:rotate(-8deg)scaleX(1.08)}.hero-photo-edge span:nth-child(2){top:27%;left:-29%;transform:rotate(4deg)scaleX(1.14)}.hero-photo-edge span:nth-child(3){top:62%;left:-39%;transform:rotate(-6deg)scaleX(1.2)}.hero-product-mark:before{z-index:-2;opacity:1;background:url(../assets/lime-brush-swipe.png) 50%/100% 100% no-repeat;inset:-94px -106px -80px -118px;transform:rotate(-5deg)scale(1.08)}.hero-product-mark:after{z-index:-1;opacity:.92;pointer-events:none;content:"";background:url(../assets/lime-brush-long.png) 50%/100% 100% no-repeat;position:absolute;inset:-42px -74px -45px -88px;transform:rotate(4deg)scaleY(2.35)}.hero-product-mark .hero-product-label{z-index:1;align-self:flex-end;position:relative;box-shadow:5px 4px #ffffffe6}.hero-product-mark>img{z-index:1;object-fit:contain;width:220px;height:auto;margin-top:10px;position:relative}@media (width<=760px){.hero-photo-edge{width:100%;height:42%;top:0;bottom:auto;right:0}.hero-photo-edge:before{width:100%;height:15%;inset:-2px 0 auto}.hero-photo-edge span{width:120%;height:74%;left:-10%}.hero-photo-edge span:first-child{top:-48%;transform:rotate(-3deg)}.hero-photo-edge span:nth-child(2){top:-12%;left:-14%;transform:rotate(3deg)scaleX(1.08)}.hero-photo-edge span:nth-child(3){display:none}.hero-product-mark{width:205px;padding:13px 18px 11px 25px}.hero-product-mark:before{inset:-66px -70px -56px -72px}.hero-product-mark:after{inset:-32px -46px -30px -52px}.hero-product-mark>img{width:152px;margin-top:7px}}@media (width<=420px){.hero h1{font-size:41px}.hero-benefit strong{font-size:9px}.step-item,.feature-item{grid-template-columns:1fr}.step-item .photo-placeholder,.step-item .step-photo{aspect-ratio:4/3;grid-row:auto}.step-number{top:28px;left:28px}.color-item{grid-template-columns:1fr}.color-item img{height:250px}}.hero:before,.hero:after{z-index:2;pointer-events:none;content:"";background:url(../assets/lime-brush-swipe.png) 50%/contain no-repeat;position:absolute}.hero:before{opacity:.18;width:420px;height:250px;top:-84px;left:39%;transform:rotate(-15deg)}.hero:after{filter:brightness(0);opacity:.075;width:440px;height:260px;bottom:-135px;left:-120px;transform:rotate(13deg)}.hero-copy:before{z-index:-1;filter:brightness(0);opacity:.045;pointer-events:none;content:"";background:url(../assets/lime-brush-swipe.png) 50%/contain no-repeat;width:260px;height:150px;position:absolute;top:11%;right:-34px;transform:rotate(-21deg)}.hero-kicker{z-index:1;box-shadow:7px 6px 0 var(--lime);transform:rotate(-2.2deg)}.hero h1{z-index:1;text-shadow:2px 2px #ffffffe6;position:relative}.hero h1:before{z-index:-1;filter:brightness(0);opacity:.055;pointer-events:none;content:"";background:url(../assets/lime-brush-long.png) 50%/100% 100% no-repeat;width:230px;height:115px;position:absolute;top:-30px;left:-45px;transform:rotate(-13deg)}.hero h1 span{color:#a8c900;text-shadow:1px 1px #718700,3px 3px #15181714}.hero h1 span:after{opacity:.88;height:28px;bottom:-23px;left:-7%;right:-10%;transform:rotate(-1.4deg)}.hero-benefits{padding-block:13px 10px;position:relative}.hero-benefits:before,.hero-benefits:after{pointer-events:none;content:"";background:url(../assets/lime-brush-long.png) 50%/100% 100% no-repeat;width:106%;height:8px;position:absolute;left:-12px}.hero-benefits:before{filter:brightness(0);opacity:.18;top:0}.hero-benefits:after{opacity:.56;bottom:0;transform:rotate(-.6deg)}.hero-benefit svg{background:var(--ink);color:var(--lime);box-shadow:4px 3px 0 var(--lime);padding:4px;transform:rotate(-2deg)}.hero-benefit:nth-child(2) svg{transform:rotate(2deg)}.hero-photo:after{z-index:2;filter:brightness(0);opacity:.13;pointer-events:none;content:"";background:url(../assets/lime-brush-swipe.png) 50%/contain no-repeat;width:470px;height:270px;position:absolute;top:-92px;right:-165px;transform:rotate(14deg)}.hero-product-mark:before{opacity:.96;inset:-92px -122px -82px -105px}.hero-product-mark span{transform:rotate(-1deg);box-shadow:5px 4px #ffffffe0}.problem-value{background:#f5f4ef}.problem-strip{isolation:isolate;width:min(100%,1440px);padding-inline:max(24px, calc((100% - var(--shell)) / 2));position:relative;overflow:hidden}.problem-strip:before,.problem-strip:after{z-index:-1;pointer-events:none;content:"";background:url(../assets/lime-brush-swipe.png) 50%/contain no-repeat;width:360px;height:210px;position:absolute}.problem-strip:before{filter:brightness(0);opacity:.07;top:-120px;left:-150px;transform:rotate(-12deg)}.problem-strip:after{opacity:.18;bottom:-115px;right:-135px;transform:rotate(16deg)}.problem-heading h2{z-index:1;display:inline-block;position:relative}.problem-heading h2:before{z-index:-1;opacity:.85;pointer-events:none;content:"";background:url(../assets/lime-brush-long.png) 50%/100% 100% no-repeat;height:19px;position:absolute;bottom:-12px;left:47%;right:-22px;transform:rotate(-1deg)}.problem-cards{z-index:1;position:relative}.problem-cards article{position:relative}.problem-cards article:before{z-index:-1;background:var(--lime);clip-path:polygon(3% 2%,99% 0,96% 98%,0 94%);opacity:.72;content:"";height:calc(100% - 48px);position:absolute;top:10px;left:18px;right:18px;transform:rotate(-1.6deg)}.problem-cards article:nth-child(2):before{filter:brightness(0);opacity:.12;transform:rotate(1.2deg)}.problem-cards article:nth-child(3):before{transform:rotate(-.8deg)}.problem-cards img{border:3px solid var(--white);clip-path:polygon(1% 2%,100% 0,98% 97%,0 100%);border-radius:2px;box-shadow:0 9px 24px #1518171f}.problem-cards article:nth-child(2) img{clip-path:polygon(0 0,98% 2%,100% 100%,2% 97%)}.problem-cards p{z-index:1;background:var(--white);width:calc(100% - 18px);margin-inline:9px;padding:9px 11px 8px;position:relative;box-shadow:4px 4px #15181714}.problem-cards svg{background:var(--lime);color:var(--ink)}@media (width<=760px){.hero:before{opacity:.14;width:260px;height:150px;top:26%;left:65%}.hero:after{display:none}.hero-copy:before{right:-100px}.hero h1 span:after{height:20px;bottom:-16px}.hero-benefits{padding-block:11px 8px}.hero-product-mark:before{inset:-68px -74px -58px -72px}.problem-strip{padding-inline:16px}.problem-cards article:before{left:10px;right:10px}.problem-cards p{width:calc(100% - 12px);margin-inline:6px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.header-cta,.primary-cta,.site-nav a:after,.faq-list summary svg{transition:none}}:root{--shell:1220px}.section-pad{padding-block:68px}.site-header{height:68px;padding-inline:clamp(24px,3.4vw,52px)}.brand{width:126px}.site-nav{gap:clamp(20px,2.5vw,34px);font-size:13px}.site-nav a{padding-block:23px 21px}.header-cta{min-width:168px;min-height:44px}.hero{grid-template-columns:minmax(510px,49%) minmax(0,51%);height:min(690px,100svh - 68px);min-height:650px;max-height:690px}.hero-copy{padding:48px 44px 48px max(54px, calc((100vw - var(--shell)) / 2))}.hero-copy:after{width:145px;right:-72px}.hero-kicker{margin-bottom:18px;padding:7px 12px;font-size:13px}.hero h1{font-size:clamp(58px,4.8vw,72px)}.hero h1 span{color:var(--lime-deep);margin-top:6px}.hero h1 span:after{opacity:.55;height:20px;bottom:-16px}.hero-lead{margin-top:29px;font-size:21px;line-height:1.65}.hero-benefits{width:min(470px,100%);margin-top:26px}.hero-photo:before{opacity:.9;width:700px;left:-28px}.hero-photo>img{object-position:52% center}.hero-product-mark{bottom:8%;right:4%}.hero-product-mark:before{inset:-80px -102px -64px -88px}.hero-product-mark strong{font-size:45px}.problem-strip{padding-block:46px 52px;display:block}.problem-heading{text-align:center}.problem-heading h2{font-size:29px}.problem-heading h2 span{color:var(--lime-deep)}.problem-heading h2:after{display:none}.problem-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:28px;display:grid}.problem-cards article{border-right:1px solid var(--line);min-width:0;padding-inline:28px}.problem-cards article:first-child{padding-left:0}.problem-cards article:last-child{border-right:0;padding-right:0}.problem-cards img{aspect-ratio:16/10;object-fit:cover;border-radius:5px;width:100%}.problem-cards article:first-child img{object-position:center 70%}.problem-cards article:nth-child(2) img{object-position:center 58%}.problem-cards p{align-items:flex-start;gap:9px;margin-top:12px;font-size:13px;font-weight:800;line-height:1.55;display:flex}.problem-cards svg{border:2px solid var(--lime-deep);border-radius:50%;flex:none;margin-top:1px;padding:2px}.value-band{background:#171918;min-height:478px;padding:52px 0 30px}.value-band:before{opacity:.92;width:620px;height:420px;top:-76px;left:-152px;transform:rotate(-8deg)}.value-band:after{opacity:.78;bottom:-194px;right:-250px}.value-inner{grid-template-columns:.92fr 1.08fr;gap:62px}.value-photo{height:300px;box-shadow:none;overflow:visible;transform:rotate(-1deg)}.value-photo img{z-index:1;object-fit:contain;filter:saturate(.96)contrast(1.05);mix-blend-mode:screen;position:relative}.value-brand{margin-bottom:12px}.value-brand:before{opacity:.18;height:45px;bottom:-20px;left:-30px;right:-34px}.value-brand strong{font-size:82px}.value-brand span{margin-top:2px;font-size:15px}.value-copy h2{margin-top:4px;font-size:31px}.value-copy h2 span{color:var(--lime)}.value-copy h2:after{display:none}.value-copy>p:last-child{margin-top:17px;font-size:14px;line-height:1.85}.benefit-row-item{min-height:88px;padding-block:13px}.benefit-row-item svg{width:27px;height:27px}.how-section{padding-top:56px}.how-section:before{opacity:.06}.section-heading{margin-bottom:30px}.section-heading h2,.memory-copy h2,.faq-heading h2{font-size:32px}.steps-grid{gap:34px}.step-item{border:1px solid var(--line);border-top:1px solid var(--line);min-height:210px;box-shadow:none;border-radius:6px;grid-template-rows:auto auto 1fr;grid-template-columns:42% 58%;padding:0;display:grid;overflow:visible}.step-item:not(:last-child):after{top:calc(50% - 7px);right:-25px}.step-number{color:var(--lime-deep);background:0 0;align-self:end;margin:24px 20px 0;padding:0;font-size:32px;position:static;transform:none}.step-photo{aspect-ratio:auto;object-fit:cover;grid-area:1/2/4;width:100%;height:100%}.step-item h3{margin:5px 20px 0;font-size:17px}.step-item>p{margin:7px 20px 22px;font-size:11px;line-height:1.65}.places-section{background:#f6f5f0;padding-top:58px}.places-grid{gap:16px}.place-item{background:var(--white);border-radius:5px;overflow:hidden}.place-item>img{aspect-ratio:16/9}.place-item:nth-child(3)>img{object-position:center 58%}.place-label{padding:5px 18px;top:10px;left:10px}.place-item>p{min-height:66px;padding:13px 16px 15px;font-size:12px}.detail-section{padding-top:62px}.features-grid{gap:13px}.feature-item{border-top:0}.feature-item>img{aspect-ratio:4/3;object-fit:cover;width:100%}.feature-copy{padding:15px 2px 0}.feature-copy h3{margin-top:7px;font-size:15px}.feature-copy p{margin-top:6px;font-size:11px}.memory-section{background:#f7f6f1;padding-block:58px}.memory-section:after{opacity:.72;width:650px;bottom:-88px;right:-110px}.memory-inner{grid-template-columns:.62fr 1.38fr;gap:52px}.memory-copy h2:after{display:none}.memory-photo img{object-position:center 56%}.capacity-list{margin-top:20px}.capacity-list>div{padding-block:11px}.colors-section,.spec-section,.faq-section{padding-block:62px}.colors-grid{gap:0}.color-item{min-height:340px}.faq-inner{grid-template-columns:240px 1fr;gap:48px}.faq-list summary{min-height:54px;padding-block:12px}.final-cta{background:var(--ink)}.final-cta-inner{min-height:118px}.final-cta:before{opacity:.72;top:-150px}@media (width<=1040px){.hero{grid-template-columns:minmax(430px,48%) minmax(0,52%)}.hero-copy{padding-left:34px}.value-brand strong{font-size:68px}.step-item{grid-template-columns:44% 56%}}@media (width<=760px){.section-pad{padding-block:52px}.site-header{height:62px}.hero{grid-template-rows:auto 285px;grid-template-columns:1fr;height:auto;min-height:0;max-height:none}.hero-copy{padding:32px 20px 30px}.hero h1{font-size:48px}.hero-photo>img{object-position:60% 53%}.problem-strip{padding-block:44px}.problem-heading h2{font-size:25px;line-height:1.5}.problem-cards{grid-template-columns:1fr;gap:24px;margin-top:24px}.problem-cards article,.problem-cards article:first-child,.problem-cards article:last-child{border-right:0;padding:0}.problem-cards img{aspect-ratio:16/9}.value-band{padding-top:48px}.value-inner{grid-template-columns:1fr;gap:18px}.value-photo{order:2;height:270px}.value-copy{order:1}.value-brand strong{font-size:58px}.value-copy h2{font-size:27px}.benefit-row{margin-top:18px}.steps-grid,.places-grid,.features-grid{grid-template-columns:1fr}.steps-grid{gap:18px}.step-item{grid-template-columns:41% 59%;min-height:180px}.step-item:not(:last-child):after{display:none}.step-number{margin:22px 16px 0;font-size:26px}.step-item h3,.step-item>p{margin-inline:16px}.place-item>img{aspect-ratio:16/10}.feature-item{grid-template-columns:42% 1fr;gap:18px}.feature-item>img{aspect-ratio:4/3}.memory-inner{grid-template-columns:1fr;gap:28px}.memory-photo{height:270px}.faq-inner{grid-template-columns:1fr;gap:24px}}@media (width<=420px){.hero h1{font-size:43px}.step-item{grid-template-columns:43% 57%}.feature-item{grid-template-columns:1fr}}.hero-photo-edge{background:url(../assets/hero-photo-boundary-white.png) 0/100% 100% no-repeat;width:24%;height:100%;inset:0 auto 0 0}.hero-photo-edge:before,.hero-photo-edge span{display:none}.hero-product-mark{isolation:isolate;width:316px;padding:20px 32px 18px 42px}.hero-product-mark:before{z-index:-1;opacity:1;transform:rotate(-4deg)}.hero-product-mark:after{z-index:-2;opacity:.96;background-image:url(../assets/brush-field-lime-deep.png);inset:-28px -70px -30px -74px;transform:translate(-14px,13px)rotate(8deg)}.value-band:before,.value-band:after{background-position:50%;background-repeat:no-repeat;background-size:contain}.value-band:before{opacity:.92;background-image:url(../assets/lime-brush-swipe.png);width:620px;height:420px;top:-76px;left:-152px;transform:rotate(-8deg)}.value-band:after{opacity:.88;background-image:url(../assets/lime-brush-swipe-deep.png);width:620px;height:420px;inset:36px auto auto -258px;transform:rotate(1deg)}.value-inner{isolation:isolate}.value-inner:before,.value-inner:after{z-index:-1;opacity:.82;pointer-events:none;content:"";background:url(../assets/lime-brush-swipe.png) 50%/contain no-repeat;width:620px;height:420px;display:block;position:absolute;bottom:-192px;right:-330px;transform:rotate(9deg)}.value-inner:after{opacity:.86;background-image:url(../assets/lime-brush-swipe-deep.png);bottom:-166px;right:-360px;transform:rotate(15deg)}.value-brand>img{filter:brightness(0)invert();object-fit:contain;width:330px;height:auto}.how-section:before{opacity:.12;background-image:url(../assets/brush-field-lime.png);width:680px;height:250px;top:-82px;right:-180px;transform:rotate(-4deg)}.places-section,.detail-section,.colors-section,.spec-section,.faq-section{isolation:isolate;position:relative;overflow:hidden}.places-section:before,.detail-section:before,.colors-section:before,.spec-section:before,.faq-section:before{z-index:0;opacity:.08;pointer-events:none;content:"";background:url(../assets/brush-field-lime-deep.png) 50%/100% 100% no-repeat;width:640px;height:210px;position:absolute}.places-section:before{top:-74px;left:-210px;transform:rotate(-5deg)}.detail-section:before{opacity:.1;background-image:url(../assets/brush-field-lime.png);bottom:-82px;right:-210px;transform:rotate(4deg)}.colors-section:before{opacity:.09;top:-80px;right:-190px;transform:rotate(3deg)}.spec-section:before{opacity:.08;background-image:url(../assets/brush-field-lime.png);bottom:-92px;left:-240px;transform:rotate(-4deg)}.faq-section:before{opacity:.07;top:-94px;right:-230px;transform:rotate(5deg)}.places-section>.page-shell,.detail-section>.page-shell,.colors-section>.page-shell,.spec-section>.page-shell,.faq-section>.page-shell{z-index:1;position:relative}.memory-section{color:var(--white);background:repeating-linear-gradient(168deg,#ffffff05 0 2px,#0000 2px 13px),#303432}.memory-section:before{z-index:0;opacity:.32;pointer-events:none;content:"";background:url(../assets/brush-field-lime-deep.png) 50%/100% 100% no-repeat;width:720px;height:250px;position:absolute;top:-92px;left:-240px;transform:rotate(-5deg)}.memory-section:after{opacity:.52;background:url(../assets/brush-field-lime.png) 50%/100% 100% no-repeat;width:720px;height:260px;bottom:-78px;right:-150px;transform:rotate(4deg)}.memory-photo{box-shadow:12px 12px #b8d90052}.memory-copy h2{color:var(--white)}.memory-copy>p:last-of-type{color:#d8dcd9}.memory-section .section-kicker{color:var(--lime)}.color-item img{transform-origin:50%;transform:scale(1.14)}@media (width<=760px){.hero-photo-edge{background:url(../assets/brush-field-white.png) 50%/132% 100% no-repeat;width:100%;height:38%;top:-12%;bottom:auto;right:0}.hero-product-mark{width:210px;padding:13px 18px 11px 25px}.hero-product-mark:before,.hero-product-mark:after{inset:-12px -38px -13px -40px}.hero-product-mark:after{inset:-16px -44px -17px -46px;transform:translate(-8px,7px)rotate(7deg)}.value-band:before{left:-300px}.value-band:after{top:20px;left:-330px}.value-inner:before,.value-inner:after{width:500px;height:330px;bottom:-150px;right:-360px}.value-inner:after{bottom:-130px;right:-382px}.value-brand>img{width:245px}.memory-section:before{top:-72px;left:-390px}.memory-section:after{bottom:-76px;right:-420px}.memory-photo{box-shadow:8px 8px #6f8b0033}.color-item{grid-template-columns:1fr;min-height:auto}.color-item img{height:300px;transform:scale(1.08)}}@media (width>=1041px){.hero{grid-template-columns:minmax(480px,42%) minmax(0,58%)}}@media (width>=761px) and (width<=1040px){.hero{grid-template-columns:minmax(420px,45%) minmax(0,55%)}}@media (width>=761px){.hero-photo>img{object-position:44% center}.hero-photo-edge{transform-origin:50%;background-image:url(../assets/hero-photo-boundary-white-coarse.png);background-size:100% 100%;width:22%;height:110%;top:-5%;bottom:auto;left:-4%;transform:skewY(-2deg)}}.hero:before,.hero:after,.hero-copy:before,.hero-copy:after,.hero h1:before,.hero-photo:after{display:none}.hero-kicker{margin-bottom:24px}.hero-lead{margin-top:38px}.hero-benefits{margin-top:36px;padding-top:18px;padding-bottom:14px}.primary-cta{margin-top:38px}.hero-product-mark{width:326px;padding:20px 34px 18px 44px}.hero-product-mark:before,.hero-product-mark:after{background:url(../assets/lime-brush-swipe.png) 50%/115% no-repeat;inset:-36px -54px -32px -50px}.hero-product-mark:before{opacity:.98;transform:translate(26px,21px)rotate(3deg)scaleY(1.42)}.hero-product-mark:after{opacity:.96;background-image:url(../assets/lime-brush-swipe-deep.png);inset:-38px -56px -34px -52px;transform:translate(-28px,-10px)rotate(0)}@media (width>=1280px){.problem-strip{width:min(100%,1600px);padding-inline:clamp(24px,3vw,48px)}.problem-heading h2{font-size:clamp(29px,2vw,34px)}.problem-cards{margin-top:clamp(28px,2.2vw,36px)}.problem-cards p{font-size:clamp(13px,.86vw,14px)}}.value-inner:before{opacity:.78;background-image:url(../assets/lime-brush-swipe.png);width:650px;height:430px;bottom:-292px;right:-390px;transform:rotate(8deg)}.benefit-row{grid-template-columns:repeat(4,minmax(0,1fr))}.final-cta-inner{min-height:210px;padding-block:34px}@media (width<=760px){.hero-photo-edge{height:26%;top:-20%}.hero-photo>img{object-position:40% 52%}.hero-kicker{margin-bottom:18px}.hero-lead{margin-top:25px}.hero-benefits{margin-top:28px;padding-top:14px;padding-bottom:10px}.primary-cta{margin-top:32px}.hero-product-mark{width:220px;padding:13px 20px 11px 27px}.hero-product-mark:before,.hero-product-mark:after{inset:-24px -34px -22px -32px}.hero-product-mark:before{transform:translate(16px,13px)rotate(3deg)scaleY(1.36)}.hero-product-mark:after{inset:-26px -36px -24px -34px;transform:translate(-17px,-6px)rotate(0)}.value-inner:before{width:500px;height:330px;bottom:-245px;right:-350px}.benefit-row{grid-template-columns:repeat(2,minmax(0,1fr))}.color-item{grid-template-columns:1fr;min-height:auto}.color-item img{height:340px;padding:8px 0;transform:none}.final-cta-inner{min-height:260px;padding-block:52px}}.hero-photo{background:var(--white)}.hero-photo-edge{filter:brightness(0)invert()}.hero-product-mark{transform:none}.hero-product-mark>img{filter:none}.hero-logo-lockup{z-index:1;width:220px;margin-top:10px;position:relative}.hero-logo-lockup>img{z-index:1;filter:none;object-fit:contain;width:100%;height:auto;display:block;position:relative}.hero-logo-shadow{z-index:0;background:var(--white);pointer-events:none;position:absolute;inset:0;transform:translate(5px,4px);-webkit-mask:url(../assets/flipper-logo.png) 50%/contain no-repeat;mask:url(../assets/flipper-logo.png) 50%/contain no-repeat}.value-band{overflow:visible}.value-band:before,.value-band:after{display:none}.value-inner{z-index:2}.value-photo{isolation:isolate;height:390px;margin:0;transform:translateY(-80px)}.value-photo:before,.value-photo:after{z-index:0;pointer-events:none;content:"";background:url(../assets/brush-field-lime.png) 50%/100% 100% no-repeat;width:116%;height:64%;position:absolute}.value-photo:before{opacity:.78;bottom:2%;left:-8%;transform:rotate(-5deg)}.value-photo:after{opacity:.9;background-image:url(../assets/brush-field-lime-deep.png);bottom:10%;left:-15%;transform:rotate(4deg)}.value-photo img{z-index:2;object-fit:contain;object-position:center;filter:none;mix-blend-mode:normal;width:100%;max-width:100%;height:100%;position:relative;transform:none}.step-item:first-child .step-photo,.step-item:nth-child(2) .step-photo{object-position:92% center}.place-item:first-child>img{object-position:center 67%;transform-origin:55% 68%;transform:scale(1.12)}.feature-item:first-child>img{object-position:center 88%}.feature-item:nth-child(3)>img{object-position:center}.memory-photo{height:410px}.memory-photo img{object-fit:contain;object-position:center}@media (width<=760px){.hero-logo-lockup{width:152px;margin-top:7px}.hero-logo-shadow{transform:translate(4px,3px)}.value-photo{height:330px;transform:none}.value-photo:before,.value-photo:after{width:110%;height:58%}.place-item:first-child>img{transform:scale(1.06)}.place-item:nth-child(3)>img{transform:scale(1.1)}.memory-photo{height:300px}}@media (width>=761px){.problem-cards article,.problem-cards article:first-child,.problem-cards article:last-child{padding-inline:14px}.problem-cards img{aspect-ratio:16/10;object-fit:cover;width:100%;height:auto;display:block}}.value-band{min-height:478px;overflow:visible}.value-band:before,.value-band:after{z-index:0;background-position:50%;background-repeat:no-repeat;background-size:contain;width:610px;height:350px;display:block}.value-band:before{opacity:.68;background-image:url(../assets/lime-brush-swipe.png);inset:0 -210px auto auto;transform:rotate(-7deg)}.value-band:after{opacity:.72;background-image:url(../assets/lime-brush-swipe-deep.png);inset:24px -255px auto auto;transform:rotate(2deg)}.value-inner{isolation:isolate;z-index:2}.value-photo{z-index:2;height:460px;transform:translateY(-88px)}.value-photo img{width:116%;max-width:none;height:116%;transform:translate(-7%,-2%)}.value-photo:before,.value-photo:after{z-index:0;width:122%;height:66%}.value-copy,.benefit-row{z-index:4;position:relative}.value-inner:before{z-index:0;opacity:.58;background-image:url(../assets/lime-brush-swipe.png);width:470px;height:250px;display:block;bottom:0;right:-145px;transform:rotate(7deg)}.value-inner:after{display:none}.step-item:nth-child(3) .step-photo{object-position:74% center;image-rendering:auto}.places-section .section-heading{z-index:3;margin-bottom:44px;position:relative}.places-grid{z-index:1;position:relative}.place-item>img{aspect-ratio:16/10;object-fit:cover;width:100%;display:block}.place-item:nth-child(2)>img{object-fit:cover;object-position:center 72%;background:0 0;transform:none}.color-item img{transform-origin:50%;padding-block:0;transform:scale(1.28)}@media (width<=760px){.value-band:before,.value-band:after{width:390px;height:220px}.value-band:before{top:8px;right:-245px}.value-band:after{top:26px;right:-270px}.value-photo{height:360px;transform:none}.value-photo img{width:110%;height:110%;transform:translate(-5%,-1%)}.value-inner:before{width:360px;height:210px;bottom:0;right:-205px}.places-section .section-heading{margin-bottom:32px}.place-item:nth-child(2)>img{object-position:center 72%;transform:none}.place-item:nth-child(3)>img{object-position:center 58%;transform-origin:50%;transform:scale(1.04)}.color-item img{height:360px;padding-block:0;transform:scale(1.2)}}.value-photo:before,.value-photo:after{display:none}.value-band:before,.value-band:after{width:610px;height:350px;bottom:auto;right:auto}.value-band:before{opacity:.68;top:-72px;left:-185px;transform:rotate(-7deg)}.value-band:after{opacity:.72;top:-34px;left:-235px;transform:rotate(2deg)}.value-inner:before{opacity:.72;width:700px;height:430px;bottom:-135px;right:-120px;transform:rotate(7deg)}.memory-section:after{bottom:-152px;right:-185px}.place-item:nth-child(3)>img{object-position:center 58%;transform-origin:50%;transform:translate(1.5%)scale(1.1)}.color-item{grid-template-columns:minmax(190px,.78fr) minmax(260px,1.22fr);min-height:460px}.color-copy{z-index:2;min-width:190px;padding:clamp(26px,3vw,38px);position:relative}.color-copy h3{max-width:230px}.color-item img{object-fit:contain;width:100%;height:440px;padding:14px 12px;transform:none}@media (width<=760px){.value-band:before,.value-band:after{width:430px;height:250px}.value-band:before{top:-46px;left:-275px}.value-band:after{top:-12px;left:-305px}.value-inner:before{width:520px;height:330px;bottom:-85px;right:-235px}.memory-section:after{bottom:-128px;right:-330px}.place-item:nth-child(3)>img{transform:translate(1%)scale(1.06)}.color-item{grid-template-columns:1fr;min-height:auto}.color-copy{min-width:0;padding:26px 24px 8px}.color-copy h3{max-width:none}.color-item img{height:380px;padding:8px 16px 20px;transform:none}}.value-band{min-height:430px;padding-bottom:18px}.benefit-row{margin-top:18px}.value-inner:before{bottom:-190px;right:-245px}.how-section .section-heading h2 span{white-space:nowrap}.step-item p{text-wrap:pretty;max-width:34em}.feature-item:nth-child(4)>img{object-position:center 67%}.capacity-photo{width:min(100%,270px);margin-top:22px}.capacity-photo img{object-fit:cover;object-position:39% 82%;border:1px solid #ffffff73;width:100%;height:155px;display:block}.capacity-photo figcaption{color:var(--ink-soft);margin-top:8px;font-size:11px;font-weight:700;line-height:1.6}@media (width<=760px){.value-band{min-height:0;padding-bottom:14px}.benefit-row{margin-top:12px}.value-inner:before{bottom:-125px;right:-285px}.how-section .section-heading h2{text-wrap:balance;max-width:12em;margin-inline:auto}.how-section .section-heading h2 span{display:block}.step-item p{text-wrap:pretty}.capacity-photo{width:100%;max-width:320px}.capacity-photo img{height:170px}}.site-footer{color:var(--white);background:#111312;border-top:1px solid #ffffff24}.site-footer-inner{justify-content:space-between;align-items:center;gap:32px;min-height:118px;padding-block:24px;display:flex}.site-footer-brand{align-items:center;gap:18px;display:flex}.site-footer-brand img{filter:brightness(0)invert();width:126px;height:auto}.site-footer-brand p{color:#b7bcb8;letter-spacing:.14em;font-size:10px;font-weight:800}.social-links{align-items:center;gap:10px;display:flex}.social-links a{width:46px;height:46px;color:var(--white);background:#ffffff0f;border:1px solid #fff3;border-radius:4px;place-items:center;transition:color .16s,border-color .16s,background-color .16s;display:grid}.social-links a:hover,.social-links a:focus-visible{color:#111312;background:var(--lime);border-color:var(--lime)}.social-links a:focus-visible{outline:2px solid var(--white);outline-offset:3px}.social-links svg{width:23px;height:23px}@media (width<=560px){.site-footer-inner{flex-direction:column;justify-content:center;align-items:flex-start;gap:20px;min-height:154px;padding-block:30px}.site-footer-brand{gap:14px}.site-footer-brand img{width:112px}}@media (width>=761px){.value-band{min-height:390px;padding-bottom:8px}.value-band:before,.value-band:after{width:690px;height:390px}.value-band:before{top:-108px;left:-220px}.value-band:after{top:-42px;left:-270px}.value-inner:before{bottom:-245px;right:-270px}}.step-item:not(:last-child):after{display:none}.step-number{min-height:38px}.place-photo{width:100%;height:clamp(238px,20vw,310px);overflow:hidden}.place-photo img{object-fit:cover;width:100%;height:100%;display:block}.place-item:first-child .place-photo img{object-position:52% 62%}.place-item:nth-child(2) .place-photo img{object-position:38% 68%;transform-origin:38% 68%;transform:scale(1.16)}.place-item:nth-child(3) .place-photo img{object-position:55% 56%;transform-origin:55% 56%;transform:scale(1.08)}.feature-item:nth-child(4){overflow:hidden}.feature-item:nth-child(4)>img{object-position:52% 58%;transform-origin:52% 56%;transform:scale(1.36)}.memory-inner{grid-template-columns:minmax(280px,.62fr) minmax(0,1.38fr);align-items:end;gap:clamp(34px,4vw,64px)}.memory-visuals{grid-template-columns:minmax(0,1fr) minmax(150px,.34fr);align-items:end;gap:18px;min-width:0;display:grid}.memory-photo,.capacity-photo{width:100%;margin:0}.memory-photo img{height:clamp(330px,29vw,430px)}.capacity-photo img{object-position:40% 80%;height:clamp(210px,20vw,300px)}.capacity-list{gap:0;margin-top:24px}.capacity-list>div{background:0 0;border:0;min-width:0;padding:0 22px 0 0}.capacity-list>div+div{border-left:1px solid #121c2333;padding-left:22px}.capacity-list dt{font-size:11px;font-weight:750}.capacity-list dd{margin-top:3px;font-size:12px}.capacity-list strong{color:var(--ink);margin-inline:3px;font-size:23px}.color-item-dark img{box-sizing:border-box;width:calc(100% - 30px);height:410px;margin:15px;padding:10px}@media (width<=900px){.place-photo{height:260px}.memory-inner{grid-template-columns:1fr;align-items:stretch}.memory-visuals{grid-template-columns:minmax(0,1fr) minmax(150px,.38fr)}}@media (width<=760px){.place-photo{height:clamp(230px,66vw,330px)}.place-item:nth-child(2) .place-photo img{object-position:34% 68%;transform-origin:34% 68%;transform:scale(1.18)}.memory-visuals{grid-template-columns:1fr}.memory-photo img,.capacity-photo img{height:auto;max-height:none}.capacity-photo{max-width:none}.capacity-photo img{aspect-ratio:16/10;object-fit:cover;object-position:40% 80%}.color-item-dark img{width:calc(100% - 28px);height:350px;margin:14px;padding:8px}}@media (width<=1040px){.site-header{grid-template-columns:auto minmax(0,1fr) auto;gap:18px;padding-inline:clamp(18px,3vw,32px)}.site-nav{white-space:nowrap;justify-content:center;gap:clamp(14px,2vw,24px);min-width:0;font-size:12px}}@media (width<=720px){.site-header{grid-template-columns:1fr;gap:0;height:auto;padding:11px 16px 0}.brand{width:108px}.site-nav{scrollbar-width:none;border-top:1px solid #15181712;grid-row:2;justify-content:flex-start;width:calc(100% + 32px);margin-inline:-16px;padding-inline:16px;font-size:11px;overflow-x:auto}.site-nav::-webkit-scrollbar{display:none}.site-nav a{flex:none;padding:10px 0 9px}.site-nav a:after{bottom:5px}.header-cta{display:none}}.memory-visuals{grid-template-columns:1fr}.memory-section .memory-copy,.memory-section .memory-copy h2,.memory-section .capacity-list dt,.memory-section .capacity-list dd,.memory-section .capacity-list strong,.memory-section .capacity-photo figcaption{color:#f4f5f1}.memory-section .capacity-list>div+div{border-left-color:#ffffff47}.memory-section .capacity-photo{width:min(100%,340px);margin-top:18px}.memory-section .capacity-photo img{aspect-ratio:auto;object-fit:cover;object-position:50% 91%;width:100%;height:158px}@media (width<=760px){.memory-section .capacity-photo{width:min(100%,340px)}.memory-section .capacity-photo img{aspect-ratio:auto;object-position:50% 91%;height:158px}}.hero-benefit svg{width:42px;height:42px;padding:7px}.problem-card-copy{background:#fff;min-height:112px;padding:14px 12px 16px}.problem-card-copy p{margin:0;font-size:14px;font-weight:900;line-height:1.55}.problem-card-copy small{color:var(--ink-soft);text-wrap:pretty;margin-top:8px;font-size:12px;font-weight:500;line-height:1.7;display:block}.step-title{grid-area:1/1;align-self:end;align-items:baseline;gap:10px;margin:22px 20px 0;display:flex}.step-title span{color:var(--lime-deep);font-size:25px;font-weight:900;line-height:1}.step-title strong{color:var(--ink);font-size:16px;font-weight:900;line-height:1.4}.step-media{aspect-ratio:4/3;grid-area:2/1;width:100%;min-width:0;height:auto;position:relative;overflow:hidden}.step-media .step-photo{object-fit:cover;grid-area:auto;width:100%;height:100%}.step-item>p{grid-area:3/1;align-self:start;margin:10px 20px 22px}.step-item{grid-template-rows:auto auto auto;grid-template-columns:1fr;min-height:0}.step-item:first-child .step-photo{object-position:58% 50%}.step-item:nth-child(2) .step-photo{object-position:54% 50%}.step-item:nth-child(3) .step-photo{object-position:45% 50%}.movie-section{background:#f2f3ef}.movie-inner{display:block}.movie-inner .section-heading{margin-bottom:34px}.movie-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,3vw,40px);display:grid}.movie-item{min-width:0}.movie-item-heading{min-height:116px;margin-bottom:16px}.movie-item-heading span{color:var(--lime-deep);letter-spacing:.12em;margin-bottom:6px;font-size:12px;font-weight:900;display:block}.movie-item-heading h3{color:var(--navy);margin:0;font-size:clamp(21px,2vw,28px);line-height:1.35}.movie-item-heading p{color:var(--ink-soft);margin:8px 0 0;font-size:14px;line-height:1.75}.movie-frame{aspect-ratio:16/9;box-shadow:12px 12px 0 var(--lime-deep);background:#111312;border:6px solid #fff;position:relative;overflow:hidden}.movie-frame iframe{border:0;width:100%;height:100%;position:absolute;inset:0}.feature-item:nth-child(4)>img{object-position:50% 50%;transform:none}@media (width<=760px){.hero{grid-template-rows:minmax(245px,70vw) auto}.hero-photo{order:1;min-height:245px}.hero-copy{order:2}.hero-photo>img{object-position:55% 52%}.hero-benefit svg{width:46px;height:46px;padding:8px}.hero-copy>.primary-cta{width:min(100%,290px);margin-left:auto;margin-right:auto;display:flex}.problem-card-copy{min-height:0;padding:14px 12px 16px}.problem-card-copy small{margin-left:30px;font-size:12px}.step-item{grid-template-columns:1fr}.step-title{grid-area:1/1;margin:18px 16px 12px}.step-media{aspect-ratio:16/10;grid-area:2/1}.step-item>p{grid-area:3/1;margin:14px 16px 18px}.movie-grid{grid-template-columns:1fr;gap:34px}.movie-item-heading{min-height:0}.movie-frame{box-shadow:8px 8px 0 var(--lime-deep);border-width:4px}}@media (width<=420px){.step-title span{font-size:22px}}.problem-cards article{grid-template-rows:auto auto 1fr;align-content:start;display:grid}.problem-card-title{min-height:68px;color:var(--ink);background:#fff;align-items:center;gap:9px;margin:0;padding:12px;font-size:14px;font-weight:900;line-height:1.5;display:flex}.problem-card-title svg{color:var(--lime-deep);flex:none}.problem-card-copy{align-items:flex-start;min-height:72px;display:flex}.problem-card-copy small{margin:0}@media (width>=761px){.value-band{min-height:370px;padding-bottom:0}.value-band:before,.value-band:after{width:640px;height:360px}.value-band:before{top:0;left:-20px}.value-band:after{top:34px;left:-78px}.value-photo{margin-bottom:-34px}.benefit-row{margin-top:6px}.value-inner:before{width:520px;height:275px;bottom:0;right:0}}.final-cta-inner>div{margin-right:20px}@media (width<=760px){.final-cta-inner{text-align:center;align-items:center;gap:22px}.final-cta-inner>div{margin-right:0}.final-cta .primary-cta{align-self:center}.problem-card-title{min-height:0;padding:14px 12px 10px}.problem-card-copy{min-height:0}.problem-card-copy small{margin-left:0}}

/* ============================================================
   2026-08-07 調整ブロック（このファイル末尾で上書き）
     1. 黒帯のインクを大型化し、左上端から飛び散る形へ
     2. 2枚を重ねて「飛び散り」を出す（ウィンドウ幅に応じて拡大）
     3. 2つ目のインクを「床を傷つけにくいゴム」付近（右下）へ移動
     4. インクは擬似要素の"背景"として描くため、黒帯から絶対にはみ出さない
        （デッキ写真のはみ出しは従来どおり維持）
     5. 「思い出のデッキ」写真のライムグリーンの枠ズレを解消
   ============================================================ */

/* ---- 1〜4: 黒帯のインク ---- */
.value-band{position:relative}

.value-band:before,
.value-band:after{
  content:"";
  display:block;
  position:absolute;
  inset:0;
  width:auto;
  height:auto;
  transform:none;
  z-index:0;
  pointer-events:none;
  background-color:transparent;
  background-repeat:no-repeat;
}

/* 左上端から飛び散るインク（2枚重ね） */
.value-band:before{
  opacity:.62;
  background-image:
    url(../assets/lime-brush-swipe.png),
    url(../assets/lime-brush-swipe-deep.png);
  background-position:
    left -18vw top -16vw,
    left 1vw top -8vw;
  background-size:
    70vw auto,
    46vw auto;
}

/* 右下（床を傷つけにくいゴム付近）のインク */
.value-band:after{
  opacity:.6;
  background-image:
    url(../assets/lime-brush-swipe.png);
  background-position:right -9vw bottom -11vw;
  background-size:44vw auto;
}

/* 旧インク（黒帯からはみ出していたもの）を停止 */
.value-inner:before,
.value-inner:after{display:none}

@media (max-width:760px){
  .value-band:before{
    background-position:
      left -30vw top -26vw,
      left 2vw top -14vw;
    background-size:
      126vw auto,
      84vw auto;
  }
  .value-band:after{
    background-position:right -20vw bottom -22vw;
    background-size:88vw auto;
  }
}

/* ---- 5: 「思い出のデッキ」写真の枠ズレ ----
   object-fit:contain により写真の左右に余白ができ、
   ライムグリーンの影（枠）が写真本体からずれていたため、
   枠が写真とぴったり一致するよう、写真本来の縦横比で表示する。 */
.memory-photo{height:auto;overflow:visible}
.memory-photo img{
  display:block;
  width:100%;
  height:auto;
  max-height:none;
  object-fit:fill;
}
@media (max-width:760px){
  .memory-photo{height:auto}
  .memory-photo img{height:auto}
}

/* ============================================================
   2026-08-07 調整ブロック その2
     6. 「リビング」写真を少しアップにし、右端の隙間（隣室の開口部）を
        画面外へ追い出す。左右のトリミング量が均等になるよう中心も調整。
   ============================================================ */
.place-item:nth-child(3) .place-photo img{
  object-position:50% 56%;
  transform-origin:50% 56%;
  transform:scale(1.15);
}

/* ============================================================
   2026-08-07 調整ブロック その3
     7. 動画セクションの見出し（flipper PV / flipperの使い方）が
        font-weight:400 のままで、他の見出し（900）より細かったため揃える。
   ============================================================ */
.movie-item-heading h3{font-weight:900}

/* ============================================================
   2026-08-07 調整ブロック その4 ─ 補足テキストの視認性
     8. 10〜12px だった補足文を 12〜14.5px へ底上げし、行間も広げる。
        レイアウト・配色・書体は変更しない（サイズと行間のみ）。
     9. 見出し上の英字ラベル（EASY TO USE 等）の緑を、
        白背景でも読める濃さへ微調整。
   ============================================================ */

/* 使い方 3ステップ */
.step-item>p{font-size:14px;line-height:1.85}

/* 製品詳細 4枚のカード */
.feature-copy p{font-size:13.5px;line-height:1.85}

/* 設置場所 3枚のカード */
.place-item>p{font-size:13.5px;line-height:1.8}

/* お悩み 3枚のカード */
.problem-card-copy small{font-size:13.5px;line-height:1.8}

/* 動画セクションの説明文 */
.movie-item-heading p{font-size:15px;font-weight:500;line-height:1.8}

/* ヒーローの3つの特長 */
.hero-benefit strong{font-size:13px}
.hero-benefit span{font-size:12px;line-height:1.6}

/* 黒帯の4つの特長 */
.benefit-row-item span{font-size:13px}

/* 黒帯の本文 */
.value-copy>p:last-child{font-size:15px;line-height:1.9}

/* 収納枚数まわり */
.capacity-list dt{font-size:12px}
.capacity-list dd{font-size:13px}
.capacity-photo figcaption{font-size:12.5px;line-height:1.7}

/* 製品仕様の表 */
.spec-table dt,
.spec-table dd{font-size:14px;line-height:1.75}

/* FAQ の回答 */
.faq-list details p{font-size:14.5px;line-height:1.9}

/* 英字ラベルの緑を少し濃く（白背景での可読性向上） */
.section-kicker{color:#758c00}
.memory-section .section-kicker{color:var(--lime)}

/* ============================================================
   2026-08-07 調整ブロック その5
     10. ヒーロー写真の上のflipperロゴに、はっきりした白い落ち影を付ける。

     【なぜ作り直したか】
       既存の .hero-logo-shadow は「ロゴPNGでマスクした白いdiv」方式。
       CSSのmaskは別ドメインの画像を拒否するため、画像をgigaplusへ移した
       時点で機能しなくなっていた（LPプレビュー時は同一ドメインだったため動いていた）。
       → maskを使わない drop-shadow 方式へ変更。PNGの透明部分をそのまま
         影の形に使うので、別ドメインでも確実に描画される。

     【影の大きさ】
       ロゴ表示幅220pxに対して 右6px / 下5px。ぼかしは0（輪郭のはっきりした影）。
       もっと強くしたい場合は 8px/7px、控えめにしたい場合は 4px/3px。
   ============================================================ */

/* 効かなくなった旧方式を停止 */
.hero-logo-shadow{display:none}

/* 白い落ち影（ぼかしゼロ） */
.hero-logo-lockup>img{filter:drop-shadow(6px 5px 0 #fff)}

@media (max-width:760px){
  /* ロゴが152pxに縮むため、影も比率を保って縮小 */
  .hero-logo-lockup>img{filter:drop-shadow(4px 3px 0 #fff)}
}

/* ============================================================
   2026-08-07 調整ブロック その6 ─ ヘッダー
     11. PC・スマホともスクロール追従（スマホは position:relative で解除されていた）
     12. スマホでも購入ボタンを表示（スマホは display:none だった）
     13. ヘッダーにSNSアイコンを追加（リンク先はフッターと同一）
     14. 固定ヘッダーにアンカー先が隠れないよう scroll-padding-top を設定
   ============================================================ */

/* ---- 11・14: 追従 ---- */
.site-header{
  position:sticky;
  top:0;
  z-index:60;
  background:#fffffff2;
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
}
html{scroll-padding-top:96px}

/* ---- 右側（SNS＋購入ボタン）のまとまり ---- */
.header-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  justify-self:end;
  gap:clamp(8px,1vw,14px);
  min-width:0;
}

/* ---- 13: ヘッダー用SNSアイコン（明るい背景に合わせた配色） ---- */
.header-social{display:flex;align-items:center;gap:6px}
.header-social a{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border:1px solid #1518172e;
  border-radius:4px;
  background:#fff;
  color:var(--ink);
  transition:background-color .16s,border-color .16s,color .16s;
}
.header-social a:hover,
.header-social a:focus-visible{
  background:var(--lime);
  border-color:var(--lime);
  color:#11130f;
}
.header-social a:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.header-social svg{width:19px;height:19px}

/* ---- 購入ボタンのラベル出し分け（狭い幅では短い表記） ---- */
.header-cta__short{display:none}

/* 中間幅：アイコンを少しずつ詰める */
@media (max-width:1180px){
  .header-social a{width:34px;height:34px}
  .header-social svg{width:17px;height:17px}
}
@media (max-width:1040px){
  .header-social{gap:5px}
  .header-social a{width:32px;height:32px}
  .header-social svg{width:16px;height:16px}
  .header-cta{min-width:0;padding-inline:16px}
}

/* ---- 12: スマホ ---- */
@media (max-width:720px){
  html{scroll-padding-top:88px}
  .site-header{
    position:sticky;
    top:0;
    grid-template-columns:auto minmax(0,1fr);
    grid-template-areas:"brand actions" "nav nav";
    gap:0;
    height:auto;
    padding:9px 16px 0;
  }
  .brand{grid-area:brand;width:96px}
  .site-nav{grid-area:nav}
  .header-actions{grid-area:actions;gap:8px}

  .header-cta{
    display:inline-flex;
    min-width:0;
    min-height:36px;
    padding-inline:13px;
    gap:7px;
    font-size:11px;
  }
  .header-cta svg{width:14px;height:14px}
  .header-cta__full{display:none}
  .header-cta__short{display:inline}

  .header-social a{width:30px;height:30px}
  .header-social svg{width:15px;height:15px}
  .site-nav a{padding:9px 0 8px}
}

/* 極小幅：ボタンを優先し、SNSはフッターに任せる */
@media (max-width:370px){
  .header-social{display:none}
}

/* ============================================================
   2026-08-18 調整ブロック その7 ─ ヘッダーの操作性
     15. スマホのヘッダーを2行×2列に再構成
           1行目: ロゴ ／ SNS（右）
           2行目: ナビ（横スクロール） ／ 購入ボタン（右）
         これにより SNS 38px・購入ボタン 42px高 を確保（従来 30px / 36px）
     16. スマホのナビを「チップ（丸い枠）」化して押せると分かる形に
     17. タブレット幅のSNSも 32px → 36px へ
   ============================================================ */

@media (max-width:1040px) and (min-width:721px){
  .header-social a{width:36px;height:36px}
  .header-social svg{width:18px;height:18px}
}

@media (max-width:720px){
  html{scroll-padding-top:118px}

  .site-header{
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "brand social"
      "nav   cta";
    gap:8px 12px;
    height:auto;
    padding:9px 16px 10px;
    align-items:center;
  }

  .brand{grid-area:brand;width:98px}

  /* ラッパーを解体し、SNSと購入ボタンを別々のマスへ置く */
  .header-actions{display:contents}

  .header-social{grid-area:social;justify-self:end;gap:6px}
  .header-social a{width:38px;height:38px;border-radius:10px}
  .header-social svg{width:19px;height:19px}

  .header-cta{
    grid-area:cta;
    display:inline-flex;
    width:100%;
    min-width:0;
    min-height:42px;
    padding-inline:14px;
    gap:6px;
    border-radius:999px;
    font-size:12.5px;
    box-shadow:0 4px 14px rgba(100,117,0,.22);
  }
  .header-cta svg{width:15px;height:15px}
  .header-cta__full{display:none}
  .header-cta__short{display:inline}

  /* ナビをチップ化 */
  .site-nav{
    grid-area:nav;
    width:auto;
    margin-inline:0;
    padding:0;
    border-top:0;
    gap:7px;
    font-size:12.5px;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    -webkit-mask-image:linear-gradient(90deg,#000 84%,rgba(0,0,0,.15));
    mask-image:linear-gradient(90deg,#000 84%,rgba(0,0,0,.15));
  }
  .site-nav::-webkit-scrollbar{display:none}
  .site-nav a{
    flex:none;
    padding:10px 15px;
    border:1px solid var(--line);
    border-radius:999px;
    background:#fff;
    font-weight:800;
    line-height:1.2;
    white-space:nowrap;
  }
  .site-nav a:after{display:none}
  .site-nav a:active{background:var(--lime);border-color:var(--lime)}
}

/* ============================================================
   2026-08-18 調整ブロック その8
     18. スマホのナビを横スクロールなしで全項目表示（ナビ行を全幅化）
         購入ボタンは画面下部の固定バーへ移動（親指が届く位置＝押しやすい）
     19. カラーセクションをスワイプ式に。次のカードを覗かせて
         「横にもう1色ある」と分かる形にし、縦の長さも短縮
   ============================================================ */

/* PCでは短縮ラベルを使わない */
.nav-short{display:none}

/* 下部固定バーはスマホのみ */
.mobile-cta-bar{display:none}

@media (max-width:720px){

  /* ---- 18. ヘッダー ---- */
  html{scroll-padding-top:104px}

  .site-header{
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "brand social"
      "nav   nav";
    gap:9px 12px;
    padding:9px 16px 10px;
  }
  .brand{grid-area:brand;width:98px}
  .header-actions{display:contents}
  .header-social{grid-area:social;justify-self:end;gap:6px}

  /* ナビは全幅を使えるので折り返しも横スクロールも不要 */
  .site-nav{
    grid-area:nav;
    display:flex;
    justify-content:space-between;
    gap:6px;
    width:auto;
    margin-inline:0;
    padding:0;
    border-top:0;
    overflow:visible;
    font-size:12px;
    -webkit-mask-image:none;
    mask-image:none;
  }
  .site-nav a{
    flex:1 1 auto;
    min-width:0;
    padding:10px 6px;
    border:1px solid var(--line);
    border-radius:999px;
    background:#fff;
    font-weight:800;
    line-height:1.2;
    text-align:center;
    white-space:nowrap;
  }
  .site-nav a:after{display:none}
  .site-nav a:active{background:var(--lime);border-color:var(--lime)}
  .nav-full{display:none}
  .nav-short{display:inline}

  /* 購入ボタンはヘッダーから外して画面下部へ */
  .header-cta{display:none}

  .mobile-cta-bar{
    display:block;
    position:fixed;
    inset:auto 0 0 0;
    z-index:70;
    padding:9px 16px calc(9px + env(safe-area-inset-bottom));
    background:#fffffff2;
    -webkit-backdrop-filter:blur(8px);
    backdrop-filter:blur(8px);
    border-top:1px solid #15181714;
  }
  .mobile-cta-bar .primary-cta{
    width:100%;
    min-width:0;
    min-height:52px;
    margin:0;
    font-size:15px;
    border-radius:999px;
    box-shadow:0 6px 18px rgba(100,117,0,.26);
  }
  /* 固定バーの高さぶん、ページ末尾に余白を足す */
  body{padding-bottom:78px}

  /* ---- 19. カラーをスワイプ式に ---- */
  .colors-swipe-hint{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    margin:-14px 0 18px;
    color:var(--ink-soft);
    font-size:12.5px;
    font-weight:800;
  }
  .colors-swipe-hint svg{width:17px;height:17px;color:var(--lime-deep)}

  .colors-grid{
    display:flex;
    grid-template-columns:none;
    gap:12px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:16px;
    padding-inline:16px;
    margin-inline:-16px;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .colors-grid::-webkit-scrollbar{display:none}

  .color-item{
    flex:0 0 84%;
    scroll-snap-align:center;
    grid-template-columns:1fr;
    min-height:0;
    border-radius:8px;
    overflow:hidden;
  }
  .color-item img{height:240px;padding-block:0;transform:scale(1.1)}
  .color-copy{padding:16px 20px 20px}
  .color-copy h3{font-size:15px}
  .color-copy span{font-size:13px}
}

/* PCでは案内文を出さない */
@media (min-width:721px){
  .colors-swipe-hint{display:none}
}

/* ============================================================
   2026-08-18 調整ブロック その10
     22. スマホでも SNS と購入ボタンを常時表示。
         1行目に ロゴ／SNS／購入ボタン を並べ、
         2行目のナビは全幅のまま維持（横スクロールなし）。
         スクロール連動の出し分けは廃止。
   ============================================================ */

@media (max-width:720px){
  html{scroll-padding-top:104px}

  .site-header{
    grid-template-columns:auto minmax(0,1fr) auto;
    grid-template-areas:
      "brand social cta"
      "nav   nav    nav";
    gap:9px 10px;
    padding:9px 14px 10px;
    align-items:center;
  }

  .brand{grid-area:brand;width:86px}
  .header-actions{display:contents}

  .header-social{grid-area:social;justify-self:end;gap:5px}
  .header-social a{width:36px;height:36px;border-radius:10px}
  .header-social svg{width:18px;height:18px}

  .header-cta{
    grid-area:cta;
    display:inline-flex;
    width:auto;
    min-width:0;
    min-height:38px;
    padding-inline:13px;
    gap:5px;
    border-radius:999px;
    font-size:12px;
    box-shadow:0 4px 12px rgba(100,117,0,.2);
  }
  .header-cta svg{width:14px;height:14px}
  .header-cta__full{display:none}
  .header-cta__short{display:inline}

  .site-nav{grid-area:nav}
}

/* 画面幅が特に狭い端末では、収まるように少しだけ縮める */
@media (max-width:345px){
  .brand{width:76px}
  .header-social{gap:4px}
  .header-social a{width:32px;height:32px}
  .header-social svg{width:16px;height:16px}
  .header-cta{padding-inline:11px;font-size:11.5px}
  .header-cta svg{display:none}
  .site-nav{gap:5px}
  .site-nav a{padding-inline:4px;font-size:11.5px}
}

/* 以前の「極小幅ではSNSを隠す」指定を解除（常時表示にするため） */
@media (max-width:370px){
  .header-social{display:flex}
}

/* ============================================================
   2026-08-18 調整ブロック その11
     23. カラーのスワイプを「枠の中で動く」形に変更。
         画面端まで広がる作りをやめ、囲み枠の内側でカードが動く。
         どこがスワイプできる範囲か輪郭で分かるようにする。
     24. 案内文はスマホのみ。PCでは表示しない（従来どおり）。
   ============================================================ */

@media (max-width:720px){

  .colors-swipe-hint{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    margin:-10px 0 12px;
    color:var(--ink-soft);
    font-size:12px;
    font-weight:800;
  }
  .colors-swipe-hint svg{width:15px;height:15px;color:var(--lime-deep)}

  /* 枠：この内側だけがスワイプ範囲 */
  .colors-grid{
    display:flex;
    grid-template-columns:none;
    gap:10px;
    margin-inline:0;
    padding:10px;
    border:1px solid var(--line);
    border-radius:12px;
    background:var(--paper);
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:10px;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .colors-grid::-webkit-scrollbar{display:none}

  .color-item{
    flex:0 0 88%;
    scroll-snap-align:start;
    grid-template-columns:1fr;
    min-height:0;
    border-radius:8px;
    overflow:hidden;
  }
  .color-item img{height:230px;padding-block:0;transform:scale(1.08)}
  .color-copy{padding:15px 18px 18px}
  .color-copy h3{font-size:14.5px}
  .color-copy span{font-size:12.5px}
}

@media (min-width:721px){
  .colors-swipe-hint{display:none}
}

/* ============================================================
   2026-08-18 調整ブロック その12 ─ カラーのスワイプを作り直し
     25. 次のカードを覗かせる方式をやめ、枠に1枚ずつぴったり収める。
         （白いカードの端が見切れて不格好になる問題の解消）
     26. 枠と説明部分を黒で統一。スワイプで「画像」と「言葉」だけが変わる。
     27. 覗かせが無くなるぶん、動く矢印の案内で操作を伝える。
   ============================================================ */

@media (max-width:720px){

  /* ---- 案内（矢印がゆっくり左右に動く） ---- */
  .colors-swipe-hint{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin:-8px 0 14px;
    color:var(--ink-soft);
    font-size:12.5px;
    font-weight:800;
    letter-spacing:.02em;
  }
  .colors-swipe-hint svg{
    width:18px;height:18px;
    color:var(--lime-deep);
    animation:flSwipeHint 1.9s ease-in-out infinite;
  }
  @keyframes flSwipeHint{
    0%,100%{transform:translateX(-3.5px)}
    50%    {transform:translateX(3.5px)}
  }

  /* ---- 枠：1枚ぶんの窓 ---- */
  .colors-grid{
    display:flex;
    grid-template-columns:none;
    gap:0;
    margin-inline:0;
    padding:0;
    border:0;
    border-radius:14px;
    background:#1c1e1c;
    box-shadow:0 10px 30px rgba(21,24,23,.14);
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:0;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .colors-grid::-webkit-scrollbar{display:none}

  /* ---- 中身：黒で統一し、画像→説明の順に ---- */
  .color-item,
  .color-item-light,
  .color-item-dark{
    flex:0 0 100%;
    scroll-snap-align:start;
    display:grid;
    grid-template-columns:1fr;
    min-height:0;
    border-radius:0;
    background:#1c1e1c;
    color:#fff;
    overflow:hidden;
  }

  .color-item img,
  .color-item-dark img{
    order:1;
    height:250px;
    padding-block:0;
    background:#fff;
    mix-blend-mode:normal;
    object-fit:contain;
    transform:scale(1.06);
  }

  .color-copy{
    order:2;
    padding:17px 20px 20px;
  }
  .color-copy span{
    color:#fff;
    border-bottom:3px solid var(--lime);
    font-size:12.5px;
  }
  .color-copy h3{
    color:#fff;
    margin-top:11px;
    font-size:15px;
    line-height:1.6;
  }
}

/* 動きを抑える設定の端末では矢印を止める */
@media (prefers-reduced-motion:reduce){
  .colors-swipe-hint svg{animation:none}
}

@media (min-width:721px){
  .colors-swipe-hint{display:none}
}

/* ============================================================
   2026-08-18 調整ブロック その13 ─ カラーの見せ方
     28. PC（721px以上）: 従来どおり2色を横に並べて同時表示。タブは出さない。
     29. スマホ（720px以下）: BLACK / WHITE のタブで切り替え。
         ウィンドウを狭めればPCでもタブ表示に切り替わる。
     30. JavaScriptが動かない環境では2色とも表示（情報が欠けない作り）。
   ============================================================ */

.colors-swipe-hint{display:none}

/* PCでは切り替え用の箱を無かったことにして、元のレイアウトを保つ */
.color-switch{display:contents}
.color-tabs{display:none}

@media (max-width:720px){

  .color-switch{
    display:flex;
    flex-direction:column;
    align-items:center;
    width:100%;
  }

  .color-switch.is-js .color-tabs{
    display:inline-flex;
    gap:4px;
    margin:0 auto 18px;
    padding:5px;
    border:1px solid var(--line);
    border-radius:999px;
    background:#fff;
    box-shadow:0 2px 10px rgba(21,24,23,.06);
  }

  .color-tab{
    appearance:none;
    border:0;
    cursor:pointer;
    padding:11px 28px;
    border-radius:999px;
    background:0 0;
    color:var(--ink-soft);
    font:inherit;
    font-size:12.5px;
    font-weight:900;
    letter-spacing:.1em;
    line-height:1;
    transition:background-color .18s,color .18s;
  }
  .color-tab:hover{color:var(--ink)}
  .color-tab.is-active{background:var(--ink);color:#fff}
  .color-tab:focus-visible{outline:2px solid var(--focus);outline-offset:2px}

  /* スワイプ用の指定を解除 */
  .colors-grid{
    display:block;
    grid-template-columns:none;
    width:100%;
    gap:0;
    margin-inline:0;
    padding:0;
    border:0;
    background:0 0;
    box-shadow:none;
    overflow:visible;
    scroll-snap-type:none;
  }

  /* JSなし：2色とも縦に表示 */
  .colors-grid .color-item{display:grid}
  .colors-grid .color-item + .color-item{margin-top:16px}

  /* JSあり：選ばれた1枚だけ */
  .color-switch.is-js .colors-grid .color-item{display:none;margin-top:0}
  .color-switch.is-js .colors-grid .color-item.is-shown{
    display:grid;
    animation:flColorIn .28s ease both;
  }
  @keyframes flColorIn{
    from{opacity:0;transform:translateY(7px)}
    to  {opacity:1;transform:none}
  }
}

@media (prefers-reduced-motion:reduce){
  .color-switch.is-js .colors-grid .color-item.is-shown{animation:none}
}

/* ============================================================
   2026-08-18 調整ブロック その14 ─ カラー写真の統一
     31. WHITEのときだけ出ていた黒い枠を解消。
         画像の白地をカード幅いっぱいに広げ、左右の余白差をなくす。
     32. 黒・白で画像の余白指定が違っていたのを統一。
         （製品の大きさ・位置は画像そのものを作り直して合わせ済み）
   ============================================================ */

.color-item img,
.color-item-light img,
.color-item-dark img{
  padding-inline:0;
}

@media (max-width:720px){
  .color-item img,
  .color-item-light img,
  .color-item-dark img{
    width:100%;
    height:300px;
    padding:0;
    margin:0;
    transform:none;
    object-fit:contain;
    object-position:center;
    background:#fff;
    mix-blend-mode:normal;
    display:block;
  }
}

/* PC側も黒・白で写真の枠・大きさを完全に揃える */
@media (min-width:721px){
  .color-item img,
  .color-item-light img,
  .color-item-dark img{
    width:100%;
    height:460px;
    padding:0;
    margin:0;
    transform:none;
    object-fit:contain;
    object-position:center;
    background:#fff;
    mix-blend-mode:normal;
    display:block;
  }
}

/* price (v13) */
.hero-price{display:flex;align-items:center;flex-wrap:wrap;margin-top:24px;line-height:1;color:var(--ink)}
.hero-price__num{font-size:20px;font-weight:900;letter-spacing:.02em}
.hero-price__tax{margin-left:5px;color:#6b6f6b;font-size:11px;font-weight:700;align-self:flex-end;padding-bottom:2px}
.hero-price__ship{position:relative;z-index:0;margin-left:14px;padding-left:14px;font-size:15px;font-weight:900;letter-spacing:.04em}
.hero-price__ship:before{content:"";position:absolute;left:0;top:50%;width:1px;height:14px;background:var(--line);transform:translateY(-50%)}
.hero-price__ship:after{content:"";position:absolute;left:12px;right:-3px;bottom:-4px;height:5px;background:var(--lime);opacity:.85;z-index:-1;transform:skewX(-12deg)}
.hero-price+.primary-cta{margin-top:14px}
.final-price{display:block;margin-bottom:4px;color:#fff;font-size:15px;font-weight:900;letter-spacing:.02em}
@media (width<=760px){
  .hero-price{justify-content:center;margin-top:20px}
}
/* rakuten button + mobile nav (v14) */
.rakuten-cta{display:inline-flex;justify-content:center;align-items:center;gap:13px;align-self:flex-start;min-width:276px;min-height:48px;margin-top:10px;padding-inline:25px;background:var(--ink);color:#fff;font-size:15px;font-weight:900;transition:background-color .16s,transform .16s}
.rakuten-cta:hover{background:#2c302e;transform:translateY(-2px)}
.rakuten-cta:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.final-cta__btns{flex:none;display:flex;flex-direction:column;gap:10px}
.final-cta .rakuten-cta{margin-top:0;background:transparent;box-shadow:inset 0 0 0 1.5px #fff}
.final-cta .rakuten-cta:hover{background:#fff;color:var(--ink)}
@media (width<=760px){
  .rakuten-cta{min-width:242px;min-height:46px;font-size:13px}
  .hero-copy>.rakuten-cta{width:min(100%,290px);margin-left:auto;margin-right:auto;display:flex}
  .final-cta__btns{align-self:center;width:min(100%,290px)}
  .final-cta__btns .primary-cta,.final-cta__btns .rakuten-cta{width:100%;min-width:0}
}
@media (max-width:720px){
  .site-nav a{background:var(--ink);border-color:var(--ink);color:#fff}
  .site-nav a:active{background:var(--lime);border-color:var(--lime);color:var(--ink)}
}
@media (prefers-reduced-motion:reduce){.rakuten-cta{transition:none}}
/* hero grows when buttons don't fit (v15) */
@media (width>=761px){
  .hero{height:auto;max-height:none;min-height:clamp(620px,100svh - 68px,690px)}
}
/* other items shelf (v16) */
.items-section{background:var(--paper)}
.items-section .section-heading{margin-bottom:30px}
.ib{display:inline-block}
.items-section h2 b{font-weight:inherit}
.items-list{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;margin:0;padding:0;list-style:none}
.items-list li{width:260px}
.item-card{display:block;height:100%;background:#fff;border:1px solid var(--line);color:var(--ink);transition:border-color .16s,transform .16s}
.item-card:hover{border-color:var(--ink);transform:translateY(-2px)}
.item-card:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.item-card__img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:contain;padding:14px;background:#fff}
.item-card__body{padding:14px 16px 16px;border-top:1px solid var(--line)}
.item-card__name{font-size:15px;font-weight:900;line-height:1.5;margin-bottom:4px}
.item-card__d{font-size:12.5px;color:var(--ink-soft);line-height:1.7;margin-bottom:12px}
.item-card__foot{display:flex;justify-content:space-between;align-items:flex-end;gap:8px}
.item-card__price{font-size:16px;font-weight:900;line-height:1.35}
.item-card__price small{display:block;font-size:10.5px;font-weight:700;color:var(--ink-soft)}
.item-card__more{font-size:12.5px;font-weight:900;white-space:nowrap}
@media (width<=760px){
  .items-section .section-heading{margin-bottom:24px}
  .items-list{gap:12px}
  .items-list li{width:calc(50% - 6px)}
  .item-card__img{padding:10px}
  .item-card__body{padding:12px 12px 14px}
  .item-card__name{font-size:14px}
  .item-card__foot{flex-direction:column;align-items:flex-start;gap:4px}
}
@media (prefers-reduced-motion:reduce){.item-card{transition:none}}
