:root{
    --paper:#F5F3ED;
    --ink:#16232F;
    --navy:#1C3A56;
    --navy-deep:#0F2436;
    --signal:#C1401F;
    --coral-bg:#FBEFE9;
    --line:#CBC2AF;
    --muted:#5C6773;
    --serif:'Times New Roman', Times, Georgia, serif;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:'IBM Plex Sans', sans-serif;
    -webkit-font-smoothing:antialiased;
  }
  a{color:inherit;}
  .wrap{max-width:960px; margin:0 auto; padding:0 32px;}

  /* HEADER */
  header{
    background:var(--navy-deep);
    color:var(--paper);
    padding:20px 0;
    border-bottom:1px solid rgba(245,243,237,0.15);
    position:sticky; top:0; z-index:10;
  }
  header .wrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;}
  .brand-group{display:flex; align-items:center; gap:12px;}
  .mark{flex:none; line-height:0;}
  .brand{font-family:var(--serif); font-size:18px; font-weight:700;}
  .brand-role{font-family:'IBM Plex Mono', monospace; font-size:11px; color:#B9C4CE;}
  .nav-group{display:flex; align-items:center; gap:26px; flex-wrap:wrap;}
  nav{display:flex; gap:22px; font-family:'IBM Plex Mono', monospace; font-size:12.5px;}
  nav a{text-decoration:none; color:#B9C4CE; transition:color .15s ease;}
  nav a:hover{color:var(--paper);}
  .lang-switch{display:flex; align-items:center; gap:10px; font-family:'IBM Plex Mono', monospace; font-size:12px;}
  .lang-switch a{text-decoration:none; color:#8FA0AE; transition:color .15s ease;}
  .lang-switch a:hover{color:var(--paper);}
  .lang-current{color:var(--paper); border-bottom:1px solid var(--signal); padding-bottom:1px;}

  .nav-toggle{
    display:none; flex-direction:column; justify-content:center; gap:5px;
    width:34px; height:34px; background:none; border:1px solid rgba(245,243,237,0.3);
    border-radius:4px; cursor:pointer; padding:0;
  }
  .nav-toggle span{display:block; width:16px; height:1.5px; background:var(--paper); margin:0 auto;}

  @media (max-width:760px){
    .nav-toggle{display:flex;}
    .nav-group{
      display:none; flex-direction:column; align-items:flex-start; gap:16px;
      width:100%; margin-top:16px; padding-top:16px;
      border-top:1px solid rgba(245,243,237,0.15);
    }
    .nav-group.open{display:flex;}
    header .wrap{flex-wrap:wrap;}
    nav{flex-direction:column; gap:12px;}
  }

  /* HERO */
  .hero{padding:64px 0 48px;}
  h1{
    font-family:var(--serif); font-weight:700; font-size:clamp(30px,4.6vw,44px);
    line-height:1.15; margin:0 0 20px;
  }
  .kicker-band{
    background:var(--coral-bg); border-top:1px solid var(--line); border-bottom:1px solid var(--line);
    padding:20px 0;
  }
  .kicker-band .wrap{display:flex; align-items:center; gap:16px;}
  .kicker-band .accent{width:3px; align-self:stretch; background:var(--signal); flex:none; border-radius:2px;}
  .kicker-band p{
    font-family:var(--serif); font-style:italic; font-weight:400; font-size:18px;
    color:var(--navy-deep); margin:0; line-height:1.5;
  }
  .hero-sub{font-size:16.5px; line-height:1.6; color:var(--muted); width:100%; margin:0;}

  /* FLOW DIAGRAM */
  .flow{padding:8px 0 56px;}
  .flow-top{
    border:1.4px solid var(--navy); border-radius:6px; background:var(--paper);
    padding:22px 24px; margin-bottom:4px;
  }
  .flow-top .tag{font-family:var(--serif); font-weight:700; font-size:17px; color:var(--navy-deep); margin-bottom:4px;}
  .flow-top .sub{font-family:'IBM Plex Mono', monospace; font-size:11.5px; color:var(--muted); margin-bottom:10px;}
  .flow-top ul{margin:0; padding-left:16px; font-size:13px; color:var(--muted); line-height:1.7; columns:2; column-gap:28px;}
  .flow-connector{
    text-align:center; font-family:'IBM Plex Mono', monospace; font-size:11.5px;
    color:var(--muted); padding:10px 0; position:relative;
  }
  .flow-boxes{display:flex; align-items:stretch; gap:0; flex-wrap:wrap; margin-top:4px;}
  .flow-box{
    flex:1 1 200px; border:1.4px solid var(--navy); border-radius:6px;
    background:var(--paper); padding:20px 18px; margin:6px;
  }
  .flow-box.mid{border-color:var(--signal); background:var(--coral-bg);}
  .flow-box .tag{font-family:var(--serif); font-weight:700; font-size:16px; color:var(--navy-deep); margin-bottom:6px;}
  .flow-box.mid .tag{color:#8A2E14;}
  .flow-box .sub{font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--muted); margin-bottom:10px;}
  .flow-box ul{margin:0; padding-left:16px; font-size:13px; color:var(--muted); line-height:1.7;}
  .flow-note{font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--muted); text-align:center; margin-top:14px;}
  .flow-arrow{display:flex; align-items:center; justify-content:center; font-size:20px; color:var(--muted); flex:0 0 30px;}
  @media (max-width:760px){ .flow-arrow{display:none;} }
  @media (max-width:640px){ .flow-top ul{columns:1;} }

  /* SECTIONS */
  section{padding:10px 0 20px;}
  .section-head{padding:44px 0 24px; border-top:1px solid var(--line);}
  .section-head h2{font-family:var(--serif); font-weight:700; font-size:24px; margin:0 0 6px;}
  .section-head p{margin:0; font-size:14.5px; color:var(--muted); max-width:60ch;}
  .section-head p + p{margin-top:10px;}

  /* VALUE PROPOSITION */
  .value-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin-top:8px;}
  .value-item{border-top:2px solid var(--signal); padding-top:16px;}
  .value-item h3{font-family:var(--serif); font-weight:700; font-size:17px; color:var(--navy-deep); margin:0 0 8px;}
  .value-item p{font-size:13.5px; color:var(--muted); line-height:1.65; margin:0;}
  @media (max-width:760px){ .value-grid{grid-template-columns:1fr; gap:22px;} }

  .pillar{margin-bottom:38px;}
  .pillar h3{font-family:var(--serif); font-weight:700; font-size:18px; color:var(--navy-deep); margin:0 0 4px;}
  .pillar .pillar-tag{font-family:'IBM Plex Mono', monospace; font-size:15px; font-weight:600; color:var(--signal); margin-bottom:14px; display:block; letter-spacing:0.01em;}
  .pillar ul{margin:0; padding-left:0; list-style:none; columns:2; column-gap:32px;}
  .pillar li{
    font-size:14px; color:var(--ink); line-height:1.6; padding:7px 0 7px 16px;
    border-top:1px solid var(--line); position:relative; break-inside:avoid;
  }
  .pillar li::before{content:"—"; position:absolute; left:0; color:var(--muted);}
  @media (max-width:640px){ .pillar ul{columns:1;} }

  /* PACKAGES */
  .packages{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
  @media (max-width:700px){ .packages{grid-template-columns:1fr;} }
  .package{border:1px solid var(--line); border-radius:6px; padding:22px 22px 20px;}
  .package .pkg-label{font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--signal); margin-bottom:6px;}
  .package h3{font-family:var(--serif); font-weight:700; font-size:18px; margin:0 0 8px; color:var(--navy-deep);}
  .package p{font-size:13.5px; color:var(--muted); line-height:1.55; margin:0 0 14px;}
  .phase-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:32px;}
  @media (max-width:700px){ .phase-grid{grid-template-columns:1fr;} }
  .phase-card{border:1.4px solid var(--navy); border-radius:6px; background:var(--paper); padding:22px 22px 20px;}
  .phase-card.mid{border-color:var(--signal); background:var(--coral-bg);}
  .phase-card .tag{font-family:var(--serif); font-weight:700; font-size:18px; color:var(--navy-deep); margin-bottom:3px;}
  .phase-card.mid .tag{color:#8A2E14;}
  .phase-card .sub{font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--muted); margin-bottom:14px;}
  .phase-card ul{margin:0; padding-left:16px; font-size:13px; color:var(--ink); line-height:1.85; columns:2; column-gap:20px;}
  .phase-card.compact ul{columns:1;}
  .phase-card.optional{border-style:dashed;}
  @media (max-width:520px){ .phase-card ul{columns:1;} }
  .tags span{
    font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--navy);
    background:var(--paper); border:1px solid var(--line); border-radius:3px; padding:5px 10px;
  }
  .package .tags{margin-top:14px; display:grid; grid-template-columns:repeat(2, 1fr); gap:6px;}
  .package .tags span{font-size:10.5px; padding:4px 8px; text-align:left;}

  /* CONTACT */
  .contact{background:var(--navy-deep); color:var(--paper); padding:56px 0 52px; margin-top:20px;}
  .contact .wrap{display:grid; grid-template-columns:1.2fr 1fr; gap:44px;}
  .contact h2{font-family:var(--serif); font-weight:700; font-size:26px; margin:0 0 14px; max-width:15ch;}
  .contact p{color:#B9C4CE; line-height:1.65; font-size:15px; max-width:44ch; margin:0;}
  .contact-card{border:1px solid rgba(245,243,237,0.25); padding:24px 24px;}
  .contact-card .label{font-family:'IBM Plex Mono', monospace; font-size:11px; color:#8FA0AE; margin-bottom:12px;}
  .contact-links{display:flex; flex-direction:column; gap:9px;}
  .contact-links a{
    text-decoration:none; font-size:14.5px; display:inline-flex; align-items:center; gap:10px;
    padding:9px 13px; border:1px solid rgba(245,243,237,0.25); transition:background .15s ease, border-color .15s ease;
  }
  .contact-links a:hover{background:rgba(245,243,237,0.08); border-color:var(--signal);}
  .glyph{font-family:'IBM Plex Mono', monospace; color:var(--signal); font-size:12px;}
  @media (max-width:680px){ .contact .wrap{grid-template-columns:1fr;} }

  footer{padding:20px 0; font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--muted); border-top:1px solid var(--line);}
