/* Learn With Me — shared stylesheet for every page */
  :root{
    --paper:#FBFAF7;
    --ink:#26323C;
    --ink-soft:#5B6670;
    --red:#C8443A;
    --sage:#4F8065;
    --line:#E3E0D6;
    --card:#FFFFFF;
    --spanish:#E8A93B;
    --spanish-deep:#C8443A;
    --french:#3B6EA8;
    --french-deep:#25476E;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{margin:0; background:var(--paper); color:var(--ink); font-family:'Inter',sans-serif; line-height:1.6;}
  @media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} }
  h1,h2,h3{font-family:'Fraunces',serif; margin:0 0 12px; font-weight:600;}
  a{color:inherit;}
  .wrap{max-width:920px; margin:0 auto; padding:0 24px;}
  ul{padding-left:20px;}
  li{margin-bottom:6px;}

  /* Nav */
  header{position:sticky; top:0; background:var(--paper); border-bottom:1px solid var(--line); z-index:10;}
  .navrow{display:flex; align-items:center; justify-content:space-between; padding:16px 24px; max-width:920px; margin:0 auto;}
  .brand{font-family:'Fraunces',serif; font-weight:600; font-size:1.2rem; text-decoration:none;}
  .brand span{color:var(--red);}
  nav{display:flex; gap:22px;}
  nav a{font-size:.95rem; text-decoration:none; color:var(--ink-soft); font-weight:500;}
  nav a:hover{color:var(--red);}
  .navtoggle{display:none; background:none; border:1px solid var(--line); border-radius:4px; padding:8px 10px; font-size:18px;}
  @media (max-width:860px){
    nav{display:none; position:absolute; top:60px; left:0; right:0; background:var(--paper); flex-direction:column; gap:4px; padding:12px 24px; border-bottom:1px solid var(--line);}
    nav.open{display:flex;}
    nav a{padding:10px 0;}
    .navtoggle{display:inline-block;}
  }

  /* Language strip */
  .langstrip{height:6px; background:linear-gradient(90deg, var(--spanish-deep) 0%, var(--spanish) 25%, var(--sage) 50%, var(--french) 75%, var(--french-deep) 100%);}

  /* Hero */
  .hero{padding:64px 24px 48px; text-align:center; background:radial-gradient(ellipse at top, #FDF0E4 0%, var(--paper) 60%);}
  .hero .langbadges{display:flex; justify-content:center; gap:10px; margin-bottom:18px; flex-wrap:wrap;}
  .langbadge{font-size:.8rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:6px 14px; border-radius:20px; color:#fff;}
  .langbadge.es{background:var(--spanish-deep);}
  .langbadge.fr{background:var(--french);}
  .langbadge.en{background:var(--sage);}
  .langbadge.interp{background:#8B5FBF;}
  .hero h1{font-size:clamp(2rem,5vw,2.8rem); max-width:34ch; margin:0 auto 16px;}
  .hero p{color:var(--ink-soft); max-width:52ch; margin:0 auto 28px; font-size:1.05rem;}
  .btn{display:inline-block; font-weight:600; font-size:.95rem; padding:13px 26px; border-radius:4px; text-decoration:none;}
  .btn-primary{background:var(--red); color:#fff;}
  .btn-primary:hover{background:#9c352e;}
  .btn-ghost{border:1.5px solid var(--ink); color:var(--ink); margin-left:10px;}
  .btn-ghost:hover{background:var(--ink); color:var(--paper);}

  section{padding:56px 0; border-top:1px solid var(--line);}
  .eyebrow{font-size:.85rem; text-transform:uppercase; letter-spacing:.06em; color:var(--sage); font-weight:600; margin-bottom:6px;}

  /* Two-col */
  .cols{display:grid; grid-template-columns:1fr 1fr; gap:40px;}
  @media (max-width:700px){.cols{grid-template-columns:1fr;}}

  .taglist{display:flex; flex-wrap:wrap; gap:8px; margin-top:12px;}
  .tag{background:var(--card); border:1px solid var(--line); border-radius:20px; padding:6px 14px; font-size:.88rem; color:var(--ink-soft);}
  .tag.es{background:#FBEBD3; border-color:#EFCB8E; color:#8A5A16;}
  .tag.fr{background:#DDE8F3; border-color:#AEC7E2; color:#2A4E77;}

  /* Timetable simple table */
  table{width:100%; border-collapse:collapse; margin-top:16px;}
  th,td{text-align:left; padding:12px 10px; border-bottom:1px solid var(--line); font-size:.95rem;}
  th{color:var(--ink-soft); font-weight:600; font-size:.85rem; text-transform:uppercase; letter-spacing:.04em;}

  .lenrow3{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:36px;}
  @media (max-width:700px){.lenrow3{grid-template-columns:1fr;}}
  .lenbox{background:var(--card); border:1.5px solid rgba(79,128,101,.4); border-radius:8px; padding:18px 16px; text-align:center; display:flex; flex-direction:column; justify-content:center;}
  .lenbox small{display:block; font-size:.74rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--sage); margin-bottom:6px;}
  .lenbox b{font-family:'Fraunces',serif; font-size:1.2rem; display:block; color:var(--ink);}
  .lenbox span{font-size:.88rem; color:var(--ink-soft); margin-top:4px;}

  .infobox{background:var(--card); border:1px solid var(--line); border-radius:6px; padding:20px 24px; margin-top:20px;}

  /* Past lessons simple list groups */
  /* Past Lessons — compact image cards */
  .topicgrid{display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-top:22px;}
  @media (max-width:700px){.topicgrid{grid-template-columns:1fr;}}
  .topiccard{
    background:var(--card); border:1px solid var(--line); border-top:4px solid var(--ink);
    border-radius:8px; overflow:hidden; display:flex; flex-direction:column;
  }
  .topiccard.es{border-top-color:var(--spanish-deep);}
  .topiccard.fr{border-top-color:var(--french);}
  .topiccard.gr{border-top-color:var(--sage);}
  .topiccard.gc{border-top-color:#8B5FBF;}
  .topiccard .thumb{width:100%; height:150px; object-fit:cover; display:block; background:var(--paper-dim, #eee);}
  .topiccard .tc-body{padding:16px 18px 18px;}
  .topiccard h3{font-size:1.02rem; margin-bottom:8px; display:flex; align-items:center; gap:8px;}
  .topiccard .dot{width:9px; height:9px; border-radius:50%; display:inline-block;}
  .topiccard.es .dot{background:var(--spanish-deep);}
  .topiccard.fr .dot{background:var(--french);}
  .topiccard.gr .dot{background:var(--sage);}
  .topiccard.gc .dot{background:#8B5FBF;}
  .topiccard ul{margin:0; color:var(--ink-soft); font-size:.9rem; padding-left:18px;}
  .topiccard ul.tc-more{display:none; margin-top:2px;}
  .topiccard.expanded ul.tc-more{display:block;}
  .tc-toggle{
    margin-top:10px; background:none; border:none; padding:0; font-size:.82rem; font-weight:600;
    color:var(--ink-soft); cursor:pointer; text-decoration:underline; text-underline-offset:2px;
  }
  .tc-toggle:hover{color:var(--ink);}

  /* steps */
  .step{display:flex; gap:16px; padding:16px 0; border-bottom:1px solid var(--line);}
  .step:last-child{border-bottom:none;}
  .step .num{font-family:'Fraunces',serif; font-weight:600; color:var(--red); min-width:24px;}
  .step h4{margin:0 0 4px; font-size:1rem;}
  .step p{margin:0; color:var(--ink-soft); font-size:.92rem;}

  .locbox{display:flex; gap:24px; align-items:flex-start; flex-wrap:wrap; margin-top:20px;}
  .locbox .addr{background:var(--card); border:1px solid var(--line); border-radius:6px; padding:20px 24px; flex:1; min-width:220px;}
  .locbox .addr p{margin:0; color:var(--ink-soft); font-size:.95rem; line-height:1.7;}
  .locbox .addr a{color:var(--red); font-weight:600; text-decoration:none;}
  .locbox .addr a:hover{text-decoration:underline;}

  /* interactive hover lift */
  .topiccard, .lenbox, .locbox .addr{transition:transform .18s ease, box-shadow .18s ease;}
  .topiccard:hover, .locbox .addr:hover{transform:translateY(-4px); box-shadow:0 12px 24px -14px rgba(38,50,60,.25);}
  .lenbox{cursor:default;}
  .lenbox:hover{transform:translateY(-4px); box-shadow:0 12px 24px -14px rgba(38,50,60,.25);}

  /* Past lessons filter tabs (removed — replaced by static image cards) */

  /* contact form */
  .contact-form{max-width:480px; margin:28px auto 0; text-align:left; display:grid; gap:14px;}
  .contact-form label{font-size:.85rem; font-weight:600; display:block; margin-bottom:5px;}
  .contact-form input, .contact-form select, .contact-form textarea{
    width:100%; padding:11px 13px; border:1.5px solid var(--line); border-radius:5px; font-family:'Inter',sans-serif; font-size:.95rem; background:var(--card); color:var(--ink);
  }
  .contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus{outline:2px solid var(--french); outline-offset:1px;}
  .contact-form textarea{resize:vertical; min-height:90px;}
  .contact-form button{justify-self:start;}
  .contact-form .form-actions{text-align:center;}
  .form-note{font-size:.82rem; color:var(--ink-soft); margin-top:-4px;}
  .contact-form{scroll-margin-top:90px;}
  .form-status{font-size:.92rem; font-weight:600; margin:10px 0 0;}
  .form-status.ok{color:var(--sage);}
  .form-status.err{color:var(--red);}

  /* booking prompt bar */
  .bookbar{background:var(--ink); color:var(--paper);}
  .bookbar-in{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px 24px; padding-top:14px; padding-bottom:14px;}
  .bookbar p{margin:0; font-size:.98rem;}
  .bookbar strong{color:var(--spanish);}
  .bookbar .btn{padding:10px 20px; white-space:nowrap;}
  .btn-interest{background:var(--sage); color:#fff; max-width:100%; line-height:1.35; text-align:center;}
  .btn-interest:hover{background:#3f6a52;}
  .colflex{display:flex; flex-direction:column;}
  .cols3{display:grid; grid-template-columns:repeat(3,1fr); gap:32px;}
  @media (max-width:900px){.cols3{grid-template-columns:1fr;}}
  .cols3 .sec-actions{flex-direction:column; align-items:stretch; max-width:360px;}
  .sec-actions .paynote{flex:none; width:100%; margin:0; font-size:.82rem; font-style:italic; line-height:1.4; color:var(--ink-soft);}
  .sec-actions{display:flex; flex-wrap:wrap; gap:12px; margin-top:auto; padding-top:12px;}
  .pricegrid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:24px;}
  @media (max-width:820px){.pricegrid{grid-template-columns:1fr;}}
  .pricecard{background:var(--card); border:1px solid var(--line); border-top:4px solid var(--ink); border-radius:8px; padding:20px 22px; display:flex; flex-direction:column;}
  .pricecard .sec-actions{padding-top:16px;}
  .pricecard.es{border-top-color:var(--spanish-deep);}
  .pricecard.ad{border-top-color:var(--spanish);}
  .pricecard.fr{border-top-color:var(--french);}
  .pricecard h3{font-size:1.05rem; margin-bottom:4px;}
  .pricecard .price{font-family:'Fraunces',serif; font-weight:600; font-size:2.2rem; line-height:1.1;}
  .pricecard .pmeta{font-size:.82rem; font-weight:600; color:var(--ink-soft); margin:4px 0 12px;}
  .pricecard p{margin:0; color:var(--ink-soft); font-size:.92rem;}
  .infobox ul.booklist{margin:10px 0 0;}
  .plangrid{display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:18px;}
  @media (max-width:700px){.plangrid{grid-template-columns:1fr;}}
  .plancard{background:var(--card); border:1px solid var(--line); border-radius:8px; padding:22px; display:flex; flex-direction:column;}
  .plancard.best{border:2px solid var(--red);}
  .plancard .badge{align-self:flex-start; background:var(--red); color:#fff; font-size:.78rem; font-weight:700; padding:4px 10px; border-radius:20px; margin-bottom:10px;}
  .plancard .badge.plain{background:#EFEDE6; color:var(--ink-soft);}
  .plancard h4{font-family:'Fraunces',serif; font-size:1.05rem; font-weight:600; margin:0 0 4px;}
  .plancard .price{font-family:'Fraunces',serif; font-weight:600; font-size:2.3rem; line-height:1.1;}
  .plancard .price s{font-size:1.1rem; font-weight:500; color:var(--ink-soft); margin-left:8px;}
  .plancard .pmeta{font-size:.82rem; font-weight:600; color:var(--ink-soft); margin:4px 0 12px;}
  .plancard p{margin:0; color:var(--ink-soft); font-size:.92rem;}
  .plancard .sec-actions{padding-top:16px;}
  .planfine{margin-top:14px; font-size:.85rem; color:var(--ink-soft);}
  .sec-actions .btn{margin-left:0; font-size:.9rem; padding:12px 18px; text-align:center;}

  /* wide desktop screens */
  @media (min-width:1100px){
    .wrap, .navrow{max-width:1120px;}
    .hero{padding-top:88px; padding-bottom:72px;}
    .hero p{max-width:60ch; font-size:1.12rem;}
    section{padding-top:68px; padding-bottom:68px;}
    .topicgrid{gap:24px;}
    .topiccard .thumb{height:200px;}
    .topiccard .tc-body{padding:20px 22px 22px;}
    .steps-grid{display:grid; grid-template-columns:1fr 1fr; column-gap:56px;}
    .steps-grid .step:nth-last-child(2){border-bottom:none;}
    .contact-form{max-width:560px;}
  }
  @media (min-width:1600px){
    .wrap, .navrow{max-width:1240px;}
  }

  /* marquee banner */
  .marquee{
    overflow:hidden; width:100%; background:var(--sage); padding:16px 0; margin-top:20px;
    border-radius:6px;
  }
  .marquee-track{display:flex; width:max-content; animation:scroll-marquee 40s linear infinite;}
  .marquee-track span{
    display:inline-flex; align-items:center; color:#fff; font-weight:600; font-size:1rem;
    padding:0 28px; white-space:nowrap;
  }
  .marquee-track span::after{content:"✦"; margin-left:28px; color:var(--spanish); font-size:.8rem;}
  @keyframes scroll-marquee{
    from{transform:translateX(0);}
    to{transform:translateX(-50%);}
  }
  @media (prefers-reduced-motion: reduce){
    .marquee-track{animation:none;}
  }

  footer{text-align:center; padding:56px 24px;}
  footer p{font-family:'Fraunces',serif; font-style:italic; font-size:1.2rem; margin-bottom:24px;}
  footer .fine{font-size:.8rem; color:var(--ink-soft); margin-top:36px;}

  /* booking & cancellation policy (policy.html) */
  .policygrid{display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:22px;}
  @media (max-width:700px){.policygrid{grid-template-columns:1fr;}}
  .policycard{background:var(--card); border:1px solid var(--line); border-radius:6px; padding:18px 20px;}
  .policycard.key{border-top:3px solid var(--red);}
  .policycard h3{font-size:1rem; margin-bottom:6px;}
  .policycard p{margin:0; color:var(--ink-soft); font-size:.92rem;}
  .policynote{margin-top:18px; font-size:.85rem; color:var(--ink-soft);}
  @media (min-width:1100px){.policygrid{grid-template-columns:repeat(3,1fr);}}

  

  /* ---- five-page site additions ---- */
  nav a[aria-current="page"]{color:var(--red); font-weight:700;}
  section[id]{scroll-margin-top:70px;}
  .btnrow{display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin-top:4px;}
  .btnrow.left{justify-content:flex-start;}
  .btnrow .btn{margin:0;}
  .hero .btnrow + .btnrow{margin-top:20px;}

  .svcgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:24px;}
  @media (max-width:820px){.svcgrid{grid-template-columns:1fr;}}
  .svccard{background:var(--card); border:1px solid var(--line); border-top:4px solid var(--ink); border-radius:8px; padding:20px 22px; display:flex; flex-direction:column; transition:transform .18s ease, box-shadow .18s ease;}
  .svccard:hover{transform:translateY(-4px); box-shadow:0 12px 24px -14px rgba(38,50,60,.25);}
  .svccard.es{border-top-color:var(--spanish-deep);}
  .svccard.fr{border-top-color:var(--french);}
  .svccard.ad{border-top-color:var(--spanish);}
  .svccard h3{font-size:1.1rem; margin-bottom:8px;}
  .svccard p{margin:0; color:var(--ink-soft); font-size:.95rem;}
  .svccard .more{margin-top:auto; padding-top:16px; font-weight:600; color:var(--red); text-decoration:none;}
  .svccard .more:hover{text-decoration:underline;}

  .skillgrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px; margin-top:24px;}
  .skillgrid.ad{grid-template-columns:repeat(2,1fr);}
  @media (max-width:560px){.skillgrid.ad{grid-template-columns:1fr;}}
  .skillcard{background:var(--card); border:1px solid var(--line); border-left:4px solid var(--sage); border-radius:8px; padding:18px 20px;}
  .skillgrid.es .skillcard{border-left-color:var(--spanish-deep);}
  .skillgrid.fr .skillcard{border-left-color:var(--french);}
  .skillgrid.ad .skillcard{border-left-color:var(--spanish);}
  .skillcard h3{font-size:1.02rem; margin-bottom:6px;}
  .skillcard p{margin:0; color:var(--ink-soft); font-size:.92rem;}

  .notice{background:#FFF7E8; border:1px solid #EFCB8E; border-left:4px solid var(--spanish); border-radius:6px; padding:16px 20px; margin-top:20px;}
  .notice strong{display:block; font-size:1.02rem; margin-bottom:2px;}
  .notice p{margin:0; color:var(--ink-soft); font-size:.93rem;}
  .agree{margin-top:18px; font-size:.9rem; color:var(--ink-soft);}
  .agree a{color:var(--red);}

  .footlinks{display:flex; flex-wrap:wrap; justify-content:center; gap:8px 22px; margin-top:22px; font-size:.9rem;}
  .footlinks a{color:var(--ink-soft); text-decoration:underline; text-underline-offset:2px;}

  .topiccard ul.plain{margin:0; color:var(--ink-soft); font-size:.92rem; padding-left:18px;}
  .contact-form{margin-top:24px;}
  .narrow{max-width:62ch;}
  .lenbox{justify-content:flex-start;}
