/*
Theme Name: Mahalo Custom
Theme URI: https://c-mahalo.co.jp/
Author: Asyl Support
Description: mahalo corporate & recruitment custom WordPress theme. Initial reconstruction, requires original assets for pixel-level parity.
Version: 2.11.0
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: mahalo-custom
*/
:root{--ink:#242729;--muted:#656d70;--accent:#00a5a5;--soft:#e9f8f7;--line:#e3e7e8;--width:1100px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;color:var(--ink);font-family:'Noto Sans JP',system-ui,-apple-system,sans-serif;line-height:1.9;background:#fff}a{color:inherit}img{max-width:100%;height:auto}button,input,textarea{font:inherit}.wrap{max-width:var(--width);padding:0 24px;margin:auto}.site-header{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.96);box-shadow:0 1px 12px #0000000c}.header-inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:32px}.brand{text-decoration:none;font-size:28px;font-weight:800;letter-spacing:.06em}.brand::first-letter{color:var(--accent)}.nav-list{display:flex;align-items:center;gap:28px;list-style:none;padding:0;margin:0}.nav-list a{text-decoration:none;font-size:13px;font-weight:700;letter-spacing:.06em}.nav-list a:hover{color:var(--accent)}.menu-toggle{display:none;background:none;border:0;font-size:16px}.hero{min-height:590px;display:grid;align-items:center;position:relative;overflow:hidden;background:linear-gradient(115deg,#ebfcfa,#fff 60%,#ddf6f4)}.hero.has-image{background-size:cover;background-position:center}.hero.has-image:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#fffffff2,#ffffff8c)}.hero .wrap{width:100%;position:relative}.hero h1{font-size:clamp(30px,4.8vw,60px);line-height:1.5;letter-spacing:.07em;margin:0 0 22px}.hero p{max-width:700px;font-size:15px}.section{padding:100px 0}.section:nth-of-type(odd){background:#fbfdfd}.section-heading{text-align:center;margin:0 0 48px}.section-heading .en{font-size:clamp(36px,5vw,60px);font-weight:800;line-height:1.2;letter-spacing:.03em;display:block}.section-heading .jp{display:block;color:var(--accent);font-size:14px;font-weight:700;margin-top:14px}.intro{max-width:860px;margin:0 auto 62px}.service{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:56px;margin:0 0 80px}.service:nth-of-type(even) .service-image{order:2}.service-image{background:#eef7f7;min-height:300px;border-radius:5px;overflow:hidden;display:grid;place-items:center;color:#6b9192}.service-image img{width:100%;height:100%;object-fit:cover;display:block}.service h3{font-size:29px;line-height:1.3;margin:0}.service .sub{color:var(--accent);font-weight:700;margin:4px 0 18px}.service .lead{font-weight:700}.about-body{max-width:900px;margin:auto}.about-image{width:100%;min-height:250px;background:#eff7f7;margin-bottom:38px;background-size:cover;background-position:center}.company-table{width:100%;border-collapse:collapse;margin:40px 0}.company-table th,.company-table td{border-bottom:1px solid var(--line);padding:15px;text-align:left;vertical-align:top}.company-table th{width:190px}.map iframe{border:0;width:100%;height:340px}.recruit-lead{text-align:center;font-weight:800;font-size:clamp(24px,3vw,36px);line-height:1.6;margin-bottom:44px}.job-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px}.job{border:1px solid var(--line);background:white;padding:32px}.job h3{font-size:24px;margin:0 0 14px;border-left:5px solid var(--accent);padding-left:15px}.job dt{font-weight:800;border-top:1px solid var(--line);padding-top:16px;margin-top:16px}.job dd{margin:6px 0 0}.job ul{padding-left:22px;margin:5px 0}.btn{display:inline-flex;justify-content:center;align-items:center;background:var(--accent);color:#fff;padding:12px 34px;border-radius:3px;text-decoration:none;font-weight:700;min-height:50px}.btn:hover{filter:brightness(.9)}.job .btn{margin-top:26px;width:100%}.contact-band{background:#dff7f4;text-align:center;padding:80px 20px}.contact-band h2{font-size:clamp(24px,3.5vw,42px);margin:0 0 14px}.contact-band .btn{margin-top:22px}.site-footer{background:#242c2d;color:white;padding:38px 0;text-align:center;font-size:12px}.page-main{padding:80px 0 110px;min-height:60vh}.page-title{font-size:36px;text-align:center;margin:0 0 40px}.contact-form{max-width:740px;margin:auto}.contact-form label{font-weight:700;display:block;margin:20px 0 7px}.contact-form input:not([type=radio]),.contact-form textarea,.contact-form select{width:100%;border:1px solid #cad3d4;padding:12px;background:#fff;border-radius:3px}.contact-form .options{display:flex;flex-wrap:wrap;gap:15px}.contact-form .options label{font-weight:400;margin:0}.contact-form .required{font-size:12px;color:#b53131}.contact-form button{border:0;cursor:pointer;margin-top:24px}.notice{padding:15px;background:var(--soft);margin:18px 0}.screen-reader-text{position:absolute;left:-10000px}@media(max-width:760px){.menu-toggle{display:block}.nav-list{display:none;position:absolute;top:76px;left:0;right:0;background:white;padding:16px 24px;box-shadow:0 10px 20px #0001;flex-direction:column;align-items:flex-start}.nav-list.open{display:flex}.hero{min-height:480px}.section{padding:66px 0}.service,.job-grid{grid-template-columns:1fr;gap:22px}.service{margin-bottom:55px}.service:nth-of-type(even) .service-image{order:0}.service-image{min-height:230px}.job{padding:22px}.company-table th{width:125px}.header-inner{min-height:76px}}

/* V2 additions */
.cta-row{display:flex;gap:16px;flex-wrap:wrap;margin-top:25px}.cta-row .btn{min-width:225px}.btn-outline{background:white;color:var(--accent);border:2px solid var(--accent)}.center-text,.centered{text-align:center}.recruit-common{background:var(--soft);padding:30px;margin:36px auto;max-width:900px}.recruit-common h3{margin:20px 0 8px}.recruit-common ul{margin-top:5px}.recruit-end{margin-top:36px}.our-team{margin:60px 0 40px}.our-team>h3{text-align:center;font-size:36px;margin:0}.team-lead{text-align:center;color:var(--accent);margin:0 0 35px}.team-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px}.team-member{padding:25px;background:#fbfdfd}.team-portrait{height:220px;display:grid;place-items:center;background:var(--soft);color:#597d80}.team-portrait img{width:100%;height:100%;object-fit:contain}.team-role{font-size:13px;color:var(--accent);font-weight:700}.team-member h4{font-size:23px;margin:0}.training-page{--navy:#18334f;--aqua:#d9f1ef;color:var(--navy)}.training-hero{padding:110px 0;background:linear-gradient(110deg,#e8f5f3,#fff)}.training-hero h1{font-size:clamp(27px,4vw,48px);line-height:1.6}.training-hero p{max-width:860px}.training-section{padding:84px 0}.training-section.pale{background:#f3faf9}.training-section h2{text-align:center;font-size:clamp(26px,3vw,36px);margin:0 0 30px}.training-section h3{line-height:1.5}.narrow{max-width:880px}.eyebrow{color:#25828a;font-weight:700}.eyebrow.centered{text-align:center}.feature-grid,.training-menu-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.training-card{background:white;border:1px solid #d4e4e5;padding:26px;border-radius:8px}.training-card>span,.audience{color:#267981;font-weight:700}.training-card h3{font-size:20px;margin:10px 0}.problem-list{padding:0;list-style:none}.problem-list li{padding:17px 20px 17px 46px;margin:10px 0;background:#f3faf9;position:relative}.problem-list li:before{content:'✓';position:absolute;left:18px;color:#27868b;font-weight:bold}.os-diagram{max-width:880px;margin:44px auto 0}.os-step{background:#18334f;border-radius:10px;padding:27px 34px;color:white;text-align:center}.os-step b{color:#bceae6}.os-step h3{margin:5px 0}.os-step p{margin:8px 0}.os-arrow{text-align:center;font-size:32px;color:#27868b;line-height:1.5}.os-step.os-design{background:#d9f1ef;color:#18334f}.os-design b{color:#247d81}.os-options{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:18px}.os-options div{background:white;padding:15px 9px;border-radius:7px;font-weight:700}.os-note{font-size:13px}.os-loop{color:#bceae6;font-weight:700}.price-note{margin:36px auto 0;padding:24px;background:#f3faf9;max-width:900px}.consultation-steps{max-width:850px;margin:auto}.consultation-steps article{background:white;padding:18px 28px;border-left:4px solid #4aadaf;margin-bottom:16px}.consultation-steps h3{margin:0;font-size:18px}.consultation-steps p{margin:4px 0}.training-contact{text-align:center}.training-contact .cta-row{justify-content:center}[data-mahalo-category][hidden]{display:none!important}
@media(max-width:760px){.team-grid,.feature-grid,.training-menu-grid{grid-template-columns:1fr}.os-options{grid-template-columns:repeat(2,minmax(0,1fr))}.training-hero{padding:70px 0}.training-section{padding:58px 0}.cta-row{flex-direction:column}.cta-row .btn{width:100%}.team-member{padding:18px}.os-step{padding:22px 16px}}

/* Ver.2.1: supplied mahalo brand mark and portraits */
.site-header .brand{display:inline-flex;align-items:center;flex-shrink:0;line-height:1}
.site-header .brand::first-letter{color:inherit}
.header-logo{display:block;width:160px;max-width:100%;height:60px;object-fit:contain;object-position:left center}
.team-portrait{height:auto;aspect-ratio:5/6;overflow:hidden;background:#f8faf8}
.team-portrait img{width:100%;height:100%;object-fit:contain;object-position:center}
@media(max-width:760px){.header-logo{width:132px;height:54px}}

/* Ver.2.2: retain 4:3 crops of supplied service photography across screen sizes. */
.service-image{aspect-ratio:4/3;min-height:0}
.service-image img{width:100%;height:100%;object-fit:contain;object-position:center}
@media(max-width:760px){.service-image{min-height:0}}

/* Ver.2.4: high-resolution hero video, no cropping on wide and mobile layouts. */
.hero.hero-video-mode{display:block;min-height:0;background:#f5fbfa}
.hero-video-stage{width:100%;aspect-ratio:16/9;max-height:none;overflow:hidden;background:#18334f;position:relative}
.hero-video{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.hero-video-content{padding-top:54px;padding-bottom:64px}
.hero-video-content h1{font-size:clamp(28px,3.5vw,44px)}
@media(max-width:760px){.hero-video-stage{aspect-ratio:16/9;max-height:none}.hero-video-content{padding-top:32px;padding-bottom:42px}}
@media(prefers-reduced-motion:reduce){.hero-video{display:none}.hero-video-stage{background:#18334f url('assets/images/mahalo-training-hero-poster.jpg') center/contain no-repeat}}

/* Ver.2.6: Balanced, contained hero video without enlargement or clipping. */
.hero.hero-video-mode { padding-top: 28px; }
.hero-video-stage {
  width: min(100% - 48px, 920px);
  margin: 0 auto;
  aspect-ratio: 16 / 9;
  max-height: none;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(24,51,79,.10);
  overflow: hidden;
}
.hero-video { width: 100%; height: 100%; object-fit: contain; }
.hero-video-content { padding-top: 38px; padding-bottom: 54px; }
.hero-video-content h1 { font-size: clamp(27px, 3vw, 40px); }
@media (max-width: 760px) {
  .hero.hero-video-mode { padding-top: 12px; }
  .hero-video-stage { width: calc(100% - 24px); border-radius: 8px; }
  .hero-video-content { padding-top: 24px; padding-bottom: 36px; }
  .hero-video-content h1 { font-size: clamp(24px, 6vw, 32px); }
}

/* Ver.2.7: hero slogan is embedded in the video; preserve accessible H1 without duplicate visible text */
.hero-video-content .screen-reader-text{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}


/* Ver.2.8: clean brand message without caption panel; scalable HTML overlay. */
.hero-video-stage { isolation:isolate; }
.hero-video-heading {
  position:absolute;
  z-index:2;
  left:5%; right:5%; bottom:10%;
  margin:0;
  padding:0;
  color:#fff;
  background:none;
  border:0;
  font-family:inherit;
  font-size:clamp(20px,3vw,39px);
  font-weight:700;
  letter-spacing:.045em;
  line-height:1.5;
  text-align:center;
  text-wrap:balance;
  text-shadow:0 2px 6px rgba(8,24,35,.63),0 1px 2px rgba(8,24,35,.65);
  pointer-events:none;
}
@media(max-width:760px){
  .hero-video-heading {left:3%;right:3%;bottom:7%;font-size:clamp(12px,3.4vw,23px);line-height:1.45;letter-spacing:0;text-shadow:0 1px 4px rgba(8,24,35,.8);}
}

/* Ver.2.9: Single caption over clean, text-free video. Natural two-line break. */
.hero-video-heading{left:4%;right:4%;bottom:13%;width:auto;max-width:92%;margin:0 auto;font-size:clamp(18px,2.6vw,28px);font-weight:600;line-height:1.62;letter-spacing:.04em;text-shadow:0 2px 4px rgba(0,0,0,.85),0 0 12px rgba(0,0,0,.48);background:transparent!important;box-shadow:none!important;}
.hero-video-heading span{display:block;white-space:nowrap;}
@media(max-width:760px){.hero-video-heading{left:2%;right:2%;bottom:10%;max-width:96%;font-size:clamp(12px,3.05vw,20px);line-height:1.48;letter-spacing:0;}}
@media(max-width:360px){.hero-video-heading{font-size:11px;}}


/* Ver.2.11: unified responsive content widths (WordPress / Cloudflare Pages). */
:root{--width:1200px;--content-reading:880px;--content-narrow:760px}
.wrap{width:100%;max-width:var(--width);margin-inline:auto;padding-inline:clamp(20px,2.5vw,32px)}
.header-inner{gap:24px}
.hero.hero-video-mode{padding-top:clamp(16px,2.8vw,30px)}
.hero-video-stage{width:min(calc(100% - 40px),960px);margin-inline:auto;aspect-ratio:16/9}
.hero-video-content{max-width:var(--content-reading);padding-top:34px;padding-bottom:62px;text-align:center}
.hero-video-content p{max-width:100%;margin-inline:auto}
.hero-video-content .cta-row{justify-content:center}
.intro{max-width:var(--content-reading)}
.service{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,4vw,58px);margin-bottom:84px}
.service>div{min-width:0}
.about-body{max-width:100%}
.about-body>p{max-width:var(--content-reading);margin-inline:auto}
.team-grid{gap:clamp(20px,2.8vw,36px)}
.team-member{min-width:0}
.training-page .narrow{max-width:var(--content-reading);margin-inline:auto}
.training-menu-grid,.feature-grid{gap:clamp(16px,2vw,24px)}
.training-card{min-width:0}
.contact-form{max-width:740px;margin-inline:auto}
@media(min-width:761px) and (max-width:1050px){
 .service{gap:28px}
 .training-menu-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .team-grid{gap:18px}
}
@media(max-width:760px){
 .wrap{padding-inline:20px}
 .hero-video-stage{width:calc(100% - 24px)}
 .hero-video-content{padding-top:24px;padding-bottom:42px;text-align:left}
 .hero-video-content .cta-row{justify-content:stretch}
 .service{grid-template-columns:1fr;gap:22px;margin-bottom:54px}
 .training-menu-grid,.feature-grid,.team-grid{grid-template-columns:1fr}
 .training-card{padding:22px}
}
@media(max-width:380px){.wrap{padding-inline:16px}}
