/*
Theme Name: PARAMAX
Description: PARAMAXの1ページ公式サイト。外観のカスタマイズから事業リンクを設定できます。
Version: 1.2.2
Text Domain: paramax
*/
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:#faf9f5;color:#30352b;font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;font-size:16px;line-height:1.9;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid #915366;outline-offset:7px}img{max-width:100%;display:block}h1,h2,h3,h4,p{margin:0}header{height:100px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;background:#faf9f5;position:relative;z-index:2}.brand{width:215px;height:76px;object-fit:contain}nav{display:flex;gap:32px;align-items:center;font-size:14px}nav a{padding:10px 0}nav a:hover,.text-link:hover{color:#915366}.nav-contact{border-bottom:1px solid #535944}.nav-contact span{margin-left:15px}.hero{position:relative;isolation:isolate;overflow:hidden;min-height:690px;background:#eee8dc;padding:85px 8% 30px}.hero-content{position:relative;z-index:1}.eyebrow{font-size:13px;font-weight:600;letter-spacing:.16em}.hero h1{font-size:clamp(38px,4.6vw,70px);line-height:1.5;font-weight:500;letter-spacing:.04em;margin:24px 0}.hero-description{line-height:2.15;font-size:17px}.text-link{display:inline-flex;align-items:center;gap:52px;border-bottom:1px solid;padding:12px 0;margin-top:26px;font-size:14px}.geometry{position:absolute;inset:0;z-index:-1}.geometry i{position:absolute;display:block;width:440px;height:590px;transform:rotate(34deg);mix-blend-mode:multiply}.geometry i:nth-child(1){background:#f7baff;right:9%;top:-250px}.geometry i:nth-child(2){background:#fbb274;right:-130px;top:170px;transform:rotate(34deg)}.geometry i:nth-child(3){background:#ffcf75;right:15%;top:330px;width:240px;height:410px;transform:rotate(34deg)}.hero-bottom{display:flex;justify-content:space-between;font-size:12px;letter-spacing:.16em;margin-top:74px}.section-wrap{padding:100px 8%}.concept{display:grid;grid-template-columns:1fr 1.5fr;gap:60px}.section-label>span{font-size:13px;font-weight:600;letter-spacing:.13em;color:#686e51}.section-label>p{margin-top:12px;font-size:16px}.concept h2,.business-heading h2{font-size:clamp(25px,2.7vw,39px);line-height:1.65;font-weight:500;letter-spacing:.06em}.concept-copy>p{margin-top:28px;line-height:2.2}.values{display:flex;margin-top:32px;gap:12px}.values span{padding:6px 25px;border:1px solid #b9bda8;font-size:14px}.business-heading{display:flex;justify-content:space-between;gap:30px;padding-top:20px;padding-bottom:50px}.business-row{display:grid;grid-template-columns:1fr 1fr;min-height:580px}.salon-art{position:relative;background:#f4e3e8;display:flex;align-items:center;justify-content:center;overflow:hidden;min-height:540px}.image-label{position:absolute;left:40px;top:30px;font-size:12px;letter-spacing:.14em}.salon-logo{width:67%;max-width:420px;mix-blend-mode:multiply}.mogyu{position:absolute;width:160px;bottom:25px;right:20px}.art-caption{position:absolute;bottom:32px;left:40px;writing-mode:vertical-rl;letter-spacing:.15em;font-size:14px}.business-copy{padding:65px 12%;background:#f7f4ed;display:flex;flex-direction:column;justify-content:center}.business-subtitle{font-size:16px;margin-top:28px}.business-copy h3{font-size:44px;font-weight:400;letter-spacing:.04em;line-height:1.4}.reading{font-size:12px;display:inline-block;margin-left:15px}.business-copy h4{font-size:28px;font-weight:500;line-height:1.7;margin:25px 0 20px}.business-copy>p:not(.eyebrow):not(.business-subtitle){font-size:15px;line-height:2.1}.tags{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:24px;font-size:13px;color:#68714b}.tags span:before{content:'＃';margin-right:2px}.food .food-art{grid-column:2;grid-row:1;position:relative;overflow:hidden;min-height:580px}.food-art>img{height:100%;width:100%;object-fit:cover;position:absolute;inset:0}.food .business-copy{grid-column:1;grid-row:1;background:#f0f0e6}.food .image-label{color:white;background:#343c2d;padding:4px 12px}.delicious{position:absolute;right:25px;bottom:35px;font-size:48px;font-weight:700;writing-mode:vertical-rl;color:white;letter-spacing:.1em;text-shadow:0 2px 15px #0007;transform:rotate(7deg)}.curry-logo{width:310px;mix-blend-mode:multiply;margin:28px 0 5px}.about{display:grid;grid-template-columns:1fr 1.5fr;gap:60px}.about h2{font-size:26px;font-weight:500;margin-top:22px}.about dl{margin:0}.about dl>div{display:grid;grid-template-columns:120px 1fr;border-bottom:1px solid #deded3;padding:20px 0}.about dt{font-size:14px;color:#707365}.about dd{margin:0;font-size:15px;overflow-wrap:anywhere}.muted{font-size:12px;margin-left:16px;color:#72756b}.contact{background:#646e43;color:#fff;padding:65px 8%;display:flex;align-items:center;justify-content:space-between;gap:40px}.contact h2{font-size:32px;line-height:1.6;font-weight:400;margin-top:16px}.contact>a{border-bottom:1px solid #c8cbbd;min-width:320px;padding:20px 0;font-size:22px}.contact>a span{float:right}.contact small{display:block;font-size:14px;margin-top:8px;letter-spacing:.04em}footer{padding:35px 8%;display:flex;align-items:center;justify-content:space-between;gap:20px}footer>a:first-child{font-size:25px;letter-spacing:.23em}footer p,.back-top{font-size:12px;letter-spacing:.1em}.skip{position:absolute;top:-100px}.skip:focus{top:5px;z-index:9;background:white;padding:15px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.business-link{margin-top:28px;display:inline-block;border-bottom:1px solid;padding:8px 0;align-self:flex-start;font-size:14px}
@media(min-width:1600px){.hero{padding-left:max(8%,calc((100vw - 1340px)/2))}.hero h1{font-size:72px}.geometry i{width:550px}}
@media(max-width:900px){header{height:85px}.brand{width:180px}nav{gap:20px}nav a:nth-child(1){display:none}.hero{padding:70px 6% 28px;min-height:630px}.geometry{opacity:.65}.geometry i:nth-child(1){right:-90px}.geometry i:nth-child(2){right:-250px}.geometry i:nth-child(3){right:-80px}.section-wrap{padding:70px 6%}.concept,.about{gap:30px;grid-template-columns:1fr 1.6fr}.business-heading{padding-top:0}.business-copy{padding:45px 9%}.business-copy>p:not(.eyebrow){font-size:16px}.business-copy h4{font-size:24px}.mogyu{width:120px}.image-label{left:25px}.art-caption{left:20px}.contact{padding:50px 6%}.contact>a{min-width:260px}}
@media(max-width:600px){html{scroll-padding-top:24px}header{height:76px;padding:0 6%}.brand{width:151px;height:65px}nav{gap:20px;font-size:12px}nav a:nth-child(3),nav a:nth-child(4){display:none}.hero{padding:55px 7% 24px;min-height:665px}.hero h1{font-size:clamp(30px,8.1vw,45px);line-height:1.65;letter-spacing:.015em;margin-top:28px}.hero .eyebrow{font-size:10px;letter-spacing:.1em}.hero-description{font-size:16px}.geometry{opacity:.6}.geometry i:nth-child(1){width:210px;height:340px;right:-100px;top:-90px}.geometry i:nth-child(2){width:220px;height:290px;right:-110px;top:415px}.geometry i:nth-child(3){width:135px;height:260px;right:25px;top:495px}.hero-bottom{margin-top:92px;font-size:10px}.section-wrap{padding:58px 7%}.concept,.about{display:block}.concept-copy{margin-top:30px}.concept h2,.business-heading h2{font-size:26px}.concept-copy>p{font-size:15px}.values span{padding:5px 20px}.business-heading{display:block;padding-top:0;padding-bottom:30px}.business-heading h2{margin-top:25px}.business-row{display:flex;flex-direction:column;min-height:0}.salon-art{min-height:380px}.salon-logo{width:72%;max-width:340px}.mogyu{width:115px;right:15px;bottom:16px}.art-caption{font-size:12px;bottom:25px}.business-copy{padding:40px 7% 48px}.business-copy h4{font-size:27px}.business-copy h3{font-size:42px}.food .food-art{min-height:390px}.delicious{font-size:42px}.curry-logo{width:290px}.about dl{margin-top:28px}.about dl>div{grid-template-columns:94px 1fr}.about dd{font-size:14px}.muted{display:block;margin:0}.contact{display:block;padding:45px 7%}.contact h2{font-size:29px}.contact>a{display:block;margin-top:26px;font-size:20px;min-width:0}footer{padding:28px 7%;flex-wrap:wrap}footer>a:first-child{font-size:22px}footer p{font-size:11px}.back-top{font-size:10px} }
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Me-Chill photographic montage and original brand logo */
.salon-mix{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:left center}
.salon-art .image-label{z-index:1;color:#fff;background:#575e3de8;padding:4px 12px}
.salon-art .mogyu{z-index:2;filter:drop-shadow(0 3px 12px #fff9)}
.salon-art .art-caption{z-index:1;background:#faf4efdb;padding:12px 7px;color:#3d4631}
.mechill-brand-logo{width:215px;height:215px;object-fit:contain;mix-blend-mode:multiply;margin:12px 0 -8px}
.wellness .business-copy{padding-top:44px;padding-bottom:44px}
@media(max-width:600px){.salon-art{min-height:410px}.mechill-brand-logo{width:200px;height:200px;margin-top:12px}.salon-art .mogyu{width:112px}.wellness .business-copy{padding-top:38px;padding-bottom:44px}}

@media(min-width:601px) and (max-width:900px){.wellness{display:flex;flex-direction:column}.salon-art{min-height:0;aspect-ratio:1.08}.wellness .business-copy{padding:44px 9%}.mechill-brand-logo{width:215px;height:215px}}

/* LP narrative: retain the established palette, typography and photo panels. */
.hero-intro{font-size:15px;line-height:2;margin-top:22px;max-width:540px}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}.brand-button{display:inline-flex;align-items:center;justify-content:space-between;gap:22px;background:#5d6740;color:#fff;padding:13px 20px;font-size:14px;border:1px solid #5d6740}.brand-button.secondary{background:#faf9f5e6;color:#424b30}.brand-button:hover{background:#404a2d;color:white}.hero-bottom{margin-top:48px}.hero{padding-top:64px}.concept-detail{background:#f1ece3}.principles .section-label h2{font-size:28px;font-weight:500;margin-top:16px}.principles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:45px;margin-top:44px}.principles-grid article{border-top:1px solid #bbc0ad;padding-top:26px}.principle-word{display:inline-block;font-size:48px;line-height:1.4;font-weight:400;color:#72794e}.principles-grid article:nth-child(2) .principle-word{color:#a77583}.principles-grid article:nth-child(3) .principle-word{color:#9a8461}.principle-word.living{font-size:38px;line-height:1.77}.principles-grid h3{font-size:21px;font-weight:500;line-height:1.7;margin:18px 0}.principles-grid p{font-size:16px;line-height:2}.brand-paragraph{margin-top:18px}.message{background:#eee8dc}.business-link small{display:block;font-size:12px;color:#68714b}.contact-description{margin-top:20px;font-size:15px;line-height:2}.about{padding-top:75px;padding-bottom:75px}
@media(max-width:600px){.hero{padding-top:45px}.hero-intro{font-size:14px}.hero-intro br{display:none}.hero-actions{flex-direction:column;align-items:flex-start}.brand-button{width:min(100%,310px)}.hero-bottom{margin-top:42px}.principles-grid{grid-template-columns:1fr;gap:28px}.principles-grid h3 br{display:none}.principles-grid article{padding-top:20px}.principle-word{font-size:40px}.principle-word.living{font-size:32px}.principles-grid h3{font-size:20px;margin:10px 0}.principles .section-label h2{font-size:26px}.concept-copy p br{display:none}.concept-copy p{max-width:38em}.message .concept-copy p:first-of-type br,#paramax .concept-copy p:nth-of-type(2) br,#concept .concept-copy p:nth-of-type(2) br{display:initial}.contact-description br{display:none}}

/* Hero colors sampled from the supplied PARAMAX business card. */
.hero{background:#fff}.geometry{opacity:1}.name-story{border-left:2px solid #737d50;padding-left:20px;color:#5b624b;font-size:15px}.contact{background:#f1ece3;color:#30352b;border-top:3px solid #646e43}.contact .eyebrow{color:#646e43}.contact>a{color:#4d5b31;border-color:#8a9277}
@media(max-width:600px){.about dl>div{grid-template-columns:112px 1fr}.name-story{padding-left:15px}}

/* Three pillars of Me-Chill care. */
.care-pillars{margin:24px 0 0}.care-pillars>div{display:grid;grid-template-columns:48px 1fr;gap:14px;padding:13px 0;border-top:1px solid #d5d4c6}.care-pillars dt{font-size:16px;color:#646e43;font-weight:500}.care-pillars dd{margin:0}.care-pillars strong{display:block;font-weight:500;font-size:15px}.care-pillars dd span{display:block;font-size:14px;line-height:1.8;margin-top:3px}.wellness .mechill-brand-logo{width:170px;height:170px}.wellness{background:#f4e3e8}.wellness .salon-art{align-self:center;aspect-ratio:1.08;min-height:0;width:100%}.wellness .business-copy{padding-left:9%;padding-right:9%}
@media(max-width:600px){.care-pillars>div{grid-template-columns:42px 1fr;gap:12px}.wellness .business-copy{padding-left:7%;padding-right:7%}.wellness .salon-art{aspect-ratio:1;min-height:0}}

/* Business-card composition: layered diagonals at left, olive at opposite corner. */
.hero .geometry{width:32%;max-width:480px;right:auto;opacity:1}
.hero .geometry i{inset:0;width:100%;height:100%;transform:none;mix-blend-mode:normal}
.hero .geometry i:nth-child(1){background:#f7baff;clip-path:polygon(12% 0,97% 0,36% 59%,0 41%,0 0)}
.hero .geometry i:nth-child(2){background:#ffcf75;clip-path:polygon(0 0,12% 0,100% 41%,40% 100%,21% 100%,0 90%)}
.hero .geometry i:nth-child(3){background:#fbb274;clip-path:polygon(0 0,12% 0,69% 27%,36% 59%,0 41%)}
.hero:after{content:"";position:absolute;right:0;bottom:0;width:100px;height:150px;background:#646e43;clip-path:polygon(100% 0,100% 100%,0 100%);pointer-events:none}
.hero-content{margin-left:29%;}
.hero-bottom{margin-left:29%;padding-right:26px}
@media(max-width:900px){.hero .geometry{width:26%}.hero-content,.hero-bottom{margin-left:24%}.hero h1{font-size:clamp(34px,5vw,45px)}.hero-intro br{display:none}.hero:after{width:65px;height:100px}}
@media(max-width:600px){.hero{padding-top:175px}.hero .geometry{width:145px;height:170px}.hero-content,.hero-bottom{margin-left:0}.hero h1{font-size:clamp(30px,8.1vw,45px)}.hero:after{width:45px;height:75px}.hero-bottom{padding-right:30px}}

/* Food and warmth: wide photographic opening, fixed on desktop. */
.brand-panorama{width:100%;height:70vh;max-height:800px;background:#8f623f url("assets/paramax-food-warmth.png") center center / cover no-repeat}
@media(min-width:1100px) and (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.brand-panorama{background-attachment:fixed}}
@media(max-width:1099px),(hover:none){.brand-panorama{height:auto;max-height:none;aspect-ratio:2/1;background-attachment:scroll}}
@media print{.brand-panorama{height:600px;max-height:none;background-attachment:scroll}}

.hero-actions{align-items:stretch}.hero-actions .brand-button{gap:16px;font-size:14px;max-width:100%}.hero-actions .brand-button span{flex-shrink:0}
