/* Standardized on the OS/browser default sans-serif — no custom font file */

:root{
  --navy: #0c2b40;
  --navy-deep: #08202f;
  --gold: #c9a97e;
  --gold-soft: #b8a488;
  --ink: #f5f2ec;
  --ink-dim: rgba(245,242,236,0.72);
  --grad-a: #3a0a75;
  --grad-b: #1e3a6e;
  --max: 1120px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--navy);
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Hiragino Sans','Meiryo','Yu Gothic',sans-serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
h1,h2,h3{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Hiragino Sans','Yu Gothic',sans-serif;
  font-weight:500;
  margin:0;
  letter-spacing:0.01em;
}

.wrap{max-width:var(--max);margin:0 auto;padding:0 32px;}

/* Header */
header.site{
  position:sticky;top:0;z-index:50;
  background:linear-gradient(to bottom, rgba(8,32,47,0.96), rgba(8,32,47,0.85));
  backdrop-filter:blur(6px);
  border-bottom:1px solid rgba(201,169,126,0.14);
}
.nav-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 32px;max-width:var(--max);margin:0 auto;
}
.brand-mark{display:flex;align-items:center;gap:10px;}
.brand-tagline{
  font-size:11px;color:#dcd9cb;letter-spacing:0.02em;
  white-space:nowrap;font-weight:400;
}
.brand-mark .dot{
  width:26px;height:26px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #d7e8c9, #6f9b5e 70%, #3d5c34);
  box-shadow:0 0 12px rgba(120,180,100,0.45);
}
.brand-mark span{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Hiragino Sans','Yu Gothic',sans-serif;font-size:16px;letter-spacing:0.08em;color:var(--ink);}
nav.links{display:flex;gap:36px;font-family:"Meiryo","Yu Gothic",sans-serif;font-size:16px;letter-spacing:0.03em;margin-left:auto;}
.lang-switch{
  margin-left:28px;font-size:13px;letter-spacing:0.03em;
  color:var(--gold-soft);border:1px solid rgba(201,169,126,0.4);
  border-radius:999px;padding:6px 14px;transition:border-color .2s,color .2s;
}
.lang-switch:hover{border-color:var(--gold);color:var(--gold);}
nav.links a{color:var(--ink-dim);transition:color .2s;position:relative;}
nav.links a:hover, nav.links a.active{color:var(--ink);}
nav.links a.active::after{
  content:'';position:absolute;left:0;right:0;bottom:-6px;height:1px;background:var(--gold);
}

/* Buttons */
.btn-cta{
  display:inline-flex;align-items:center;gap:8px;
  padding:13px 30px;border-radius:999px;
  background:linear-gradient(120deg, var(--grad-a), var(--grad-b));
  border:1px solid rgba(201,169,126,0.5);
  color:var(--ink);font-size:14px;font-weight:500;letter-spacing:0.03em;
  box-shadow:0 6px 24px rgba(58,10,117,0.35);
  transition:transform .25s ease, box-shadow .25s ease;
}
.btn-cta:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(58,10,117,0.5);}
.btn-outline{
  display:inline-flex;padding:12px 28px;border-radius:999px;
  border:1px solid rgba(245,242,236,0.35);color:var(--ink);
  font-size:14px;letter-spacing:0.03em;transition:border-color .2s, background .2s;
}
.btn-outline:hover{border-color:var(--gold);background:rgba(201,169,126,0.08);}

/* Hero */
.hero{
  padding:96px 0 72px;
}
.hero .wrap{
  display:grid;grid-template-columns:1.2fr 0.8fr;gap:64px;align-items:center;
}
.eyebrow-mark{
  display:inline-flex;
  margin-bottom:28px;
}
.eyebrow-mark img{
  height:52px;width:auto;border-radius:8px;
  box-shadow:0 6px 18px rgba(0,0,0,0.35);
}

.hero h1{
  font-size:clamp(28px, 3.4vw, 42px);
  color:var(--gold);
  line-height:1.35;
  max-width:480px;
  margin-bottom:36px;
}
.hero-photo{
  position:relative;
  justify-self:end;
  width:90%;
}
.hero-photo .ring{
  position:absolute;inset:-14px;
  border-radius:28px;
  background:radial-gradient(circle at 30% 20%, rgba(201,169,126,0.35), transparent 60%),
             radial-gradient(circle at 80% 80%, rgba(58,10,117,0.4), transparent 55%);
  filter:blur(6px);
  z-index:0;
}
.hero-photo img{
  position:relative;z-index:1;
  border-radius:20px;
  box-shadow:0 30px 60px rgba(0,0,0,0.45);
}

/* Section generic */
section{padding:88px 0;}
.section-label{
  font-size:12px;letter-spacing:0.14em;color:var(--gold-soft);
  text-transform:uppercase;margin-bottom:14px;
}
.section-title{font-size:clamp(26px,3vw,34px);color:var(--ink);margin-bottom:20px;max-width:640px;}
.section-body{color:var(--ink-dim);max-width:620px;font-size:15px;}

.card-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:52px;
}
.card{
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(201,169,126,0.16);
  border-radius:16px;padding:32px 28px;
}
.card .num{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Hiragino Sans','Yu Gothic',sans-serif;color:var(--gold);font-size:14px;margin-bottom:14px;}
.card h3{font-size:18px;color:var(--ink);margin-bottom:12px;}
.card p{color:var(--ink-dim);font-size:14px;margin:0;}

footer.site{
  border-top:1px solid rgba(201,169,126,0.14);
  padding:40px 0;margin-top:40px;
}
footer.site .wrap{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;
}
footer.site .fmark{display:flex;align-items:center;gap:10px;font-size:16px;color:var(--ink-dim);}
footer.site .flinks{display:flex;gap:24px;font-size:16px;color:var(--ink-dim);}
footer.site .flinks a:hover{color:var(--gold);}

/* Contact form */
.form-grid{display:grid;gap:18px;max-width:520px;margin-top:36px;}
.form-grid label{font-size:13px;color:var(--gold-soft);letter-spacing:0.03em;display:block;margin-bottom:8px;}
.form-grid input, .form-grid textarea{
  width:100%;padding:13px 16px;border-radius:10px;
  background:rgba(255,255,255,0.04);border:1px solid rgba(245,242,236,0.18);
  color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Hiragino Sans','Yu Gothic',sans-serif;font-size:14px;
}
.form-grid input:focus, .form-grid textarea:focus{
  outline:none;border-color:var(--gold);
}
.form-grid textarea{resize:vertical;min-height:120px;}

.brand-mark img.logo-icon{height:38px;width:auto;border-radius:6px;object-fit:contain;}

/* Philosophy section */
.philosophy{
  position:relative;
  padding:110px 0;
  overflow:hidden;
}
.philosophy .bg{
    position:absolute;inset:0;
    background-size:cover;background-position:center;
    filter:brightness(0.55) saturate(0.9);
    z-index:0;
    display:none;
}
.philosophy .overlay{
  position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(8,32,47,0.75), rgba(8,32,47,0.9));
  z-index:1;
}
.philosophy .content{
  position:relative;z-index:2;
  max-width:760px;margin:0 auto;text-align:center;
}
.philosophy h2{
  font-size:clamp(24px,3vw,32px);color:var(--gold);margin-bottom:36px;
}
.philosophy ul{list-style:none;margin:0 0 40px;padding:0;}
.philosophy li{
  color:var(--ink-dim);font-size:15px;line-height:2.1;
}
.philosophy .signed{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Hiragino Sans','Yu Gothic',sans-serif;color:var(--gold);font-size:18px;letter-spacing:0.02em;
}

/* Why choose us / icon cards */
.icon-card-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:52px;
}
.icon-card{
  border:1px solid rgba(201,169,126,0.3);
  border-radius:28px;
  padding:44px 28px;text-align:center;
}
.icon-card svg{width:44px;height:44px;margin-bottom:22px;color:var(--gold);}
.icon-card h3{font-size:17px;color:var(--ink);margin-bottom:12px;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Hiragino Sans','Yu Gothic',sans-serif;font-weight:500;}
.icon-card p{font-size:13.5px;color:var(--ink-dim);margin:0;line-height:1.7;}

/* Service photo cards */
.service-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:52px;
}
.service-card img{
  width:100%;height:190px;object-fit:cover;border-radius:14px;
  margin-bottom:20px;
}
.service-card h3{font-size:16px;color:var(--ink);margin-bottom:10px;}
.service-card p{font-size:13.5px;color:var(--ink-dim);margin:0;}

@media (max-width:860px){
  .icon-card-grid, .service-grid{grid-template-columns:1fr;}
}

@media (max-width:860px){
  .hero .wrap{grid-template-columns:1fr;}
  .hero-photo{order:-1;}
  .card-grid{grid-template-columns:1fr;}
  nav.links{display:none;}
}
/* Q.man Footer Layout */
.footer-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
    width: 100%;
    flex: 1 1 100%;  /* ← この1行を追加 */
    font-size: 16px;
}

.footer-row nav {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}

.footer-row nav a {
    color: inherit;
    text-decoration: none;
}

.footer-row nav a:hover {
    text-decoration: underline;
}

/* ========================================
   Q.man President Profile
   代表者紹介
======================================== */

.president-section {
  padding: 90px 0 110px;
  background: #0c293d;
}

.president-heading {
  text-align: center;
  margin-bottom: 55px;
}

.president-heading .section-label {
  color: var(--gold);
  margin-bottom: 15px;
}

.president-heading h2 {
  font-size: 30px;
  font-weight: 500;
  color: var(--ink);
}


.president-profile {
  display: grid;
  grid-template-columns: 280px 240px;
  grid-template-areas:
    "content photo"
    "career career";
  column-gap: 35px;
  row-gap: 35px;
  justify-content: center;
  align-items: center;
}

.president-content {
  grid-area: content;
}

.president-photo {
  grid-area: photo;
}

.president-career {
  grid-area: career;
  width: 100%;
  max-width: 1050px;
  justify-self: center;
}


.president-photo img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border-radius: 14px;
  border: 1px solid rgba(201,169,126,0.3);
}

.president-content {
  min-width: 0;
}

.president-position {
  color: var(--gold);
  font-size: 15px;
  line-height: 1.6;
  margin: 0 0 12px;
}

.president-content h3 {
  font-size: 32px;
  font-weight: 500;
  color: var(--ink);
  margin: 0 0 4px;
}

.president-name-en {
  color: var(--gold);
  font-size: 18px;
  letter-spacing: 0.08em;
  margin: 0 0 30px;
}

.president-content > p:not(.president-position):not(.president-name-en) {
  font-size: 14px;
  line-height: 1.7;
  color: var(--ink-dim);
  margin: 0 0 10px;
}

/* スマートフォン対応 */
@media (max-width: 860px) {
  .president-section {
    padding: 65px 0 80px;
  }

  .president-heading h2 {
    font-size: 25px;
  }

  .president-profile {
   grid-template-columns: 1fr;
   grid-template-areas:
    "content"
    "photo"
    "career";
   gap: 35px;
  }

  .president-photo {
    max-width: 360px;
    width: 100%;
    margin: 0 auto;
  }

  .president-content h3 {
    font-size: 28px;
  }
}
/* Q.man 日本語版：スマホ専用タイトル */
@media (max-width: 860px) {
  .brand-tagline:has(.brand-mobile-break) {
    white-space: normal;
    line-height: 1.5;
  }

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

  .brand-powered {
    display: inline-block;
    margin-left: 10ch;
    white-space: nowrap;
  }
}
/* Q.man Company Name */
.company-name {
    text-align: center;
    color: #ffffff;
    font-size: 24px;
    font-weight: 500;
    letter-spacing: 0.08em;
    padding: 28px 16px 0;
}

/* Smartphone */
@media (max-width: 860px) {
    .company-name {
        font-size: 18px;
        padding: 20px 12px 0;
    }
}