/* ==========================================================================
   壱岐島観光ガイド / Iki Island Travel Guide
   ========================================================================== */

:root{
  --sea-900:#062230;
  --sea-800:#0b3247;
  --sea-700:#124460;
  --sea-600:#1a5c7c;
  --sea-400:#3f8fae;
  --sea-200:#a9d3e0;
  --sea-50:#eef6f9;

  --sand-50:#fbf8f3;
  --sand-100:#f4eee3;
  --sand-200:#e7ddcb;
  --sand-400:#c3b295;

  --torii:#bf3f2c;
  --torii-dark:#9c3122;
  --gold:#c08a3e;

  --ink:#1c2529;
  --ink-soft:#4a565d;
  --ink-faint:#7c888f;
  --line:#e3dccf;

  --serif:"Noto Serif JP","Yu Mincho","Hiragino Mincho ProN",serif;
  --sans:"Noto Sans JP","Hiragino Sans","Yu Gothic",system-ui,-apple-system,"Segoe UI",sans-serif;
  --display:"Cormorant Garamond",Georgia,serif;

  --wrap:1180px;
  --radius:4px;
  --shadow:0 2px 4px rgba(6,34,48,.05),0 12px 32px rgba(6,34,48,.07);
}

*,*::before,*::after{box-sizing:border-box}

html{scroll-behavior:smooth;scroll-padding-top:80px}

body{
  margin:0;
  font-family:var(--sans);
  font-size:16px;
  line-height:1.85;
  color:var(--ink);
  background:var(--sand-50);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

html[lang="en"] body{line-height:1.72}

img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.35;margin:0}
p{margin:0 0 1.1em}
p:last-child{margin-bottom:0}
ul,ol{margin:0;padding:0;list-style:none}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 24px}
.wrap.narrow{max-width:820px}

.skip{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--torii);color:#fff;padding:10px 18px;
}
.skip:focus{left:12px;top:12px}

:focus-visible{outline:2px solid var(--sea-600);outline-offset:3px}

/* ============ HEADER ============ */
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(251,248,243,.88);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.header-inner{
  display:flex;align-items:center;gap:24px;
  min-height:68px;
}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;flex-shrink:0}
.brand-mark{
  width:34px;height:34px;flex-shrink:0;
  display:grid;place-items:center;
  background:var(--torii);color:#fff;
  font-family:var(--serif);font-size:17px;font-weight:700;
  border-radius:2px;
}
.brand-text{display:flex;flex-direction:column;line-height:1.25}
.brand-text strong{font-family:var(--serif);font-size:15px;letter-spacing:.02em}
.brand-text small{font-size:10.5px;color:var(--ink-faint);letter-spacing:.14em;text-transform:uppercase}

.nav{display:flex;gap:2px;margin-left:auto;flex-wrap:wrap}
.nav a{
  text-decoration:none;font-size:13.5px;font-weight:500;
  padding:7px 11px;border-radius:2px;color:var(--ink-soft);
  transition:color .18s,background .18s;white-space:nowrap;
}
.nav a:hover{color:var(--torii);background:var(--sand-100)}

.header-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}

.lang-switch{
  display:flex;border:1px solid var(--sand-400);border-radius:2px;overflow:hidden;
}
.lang-switch button{
  font-family:var(--sans);font-size:12px;font-weight:500;
  padding:6px 11px;border:0;background:transparent;color:var(--ink-soft);
  cursor:pointer;transition:background .18s,color .18s;line-height:1.4;
}
.lang-switch button + button{border-left:1px solid var(--sand-400)}
.lang-switch button:hover{background:var(--sand-100)}
.lang-switch button.is-active{background:var(--sea-800);color:#fff}

.menu-toggle{
  display:none;width:38px;height:34px;
  border:1px solid var(--sand-400);border-radius:2px;
  background:transparent;cursor:pointer;
  flex-direction:column;justify-content:center;align-items:center;gap:4px;
}
.menu-toggle span{display:block;width:16px;height:1.5px;background:var(--ink);transition:.2s}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}

/* ============ HERO ============ */
.hero{
  position:relative;
  background:var(--sea-900);
  color:#fff;
  overflow:hidden;
  padding:88px 0 0;
  min-height:min(88vh,760px);
  display:flex;align-items:flex-end;
}
.hero-art{position:absolute;inset:0;z-index:0}
.hero-art svg{width:100%;height:100%;display:block}
.hero::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(6,34,48,.72) 0%,rgba(6,34,48,.35) 42%,rgba(6,34,48,.82) 100%);
}
.hero-inner{position:relative;z-index:2;padding-bottom:56px;padding-top:40px}

.eyebrow{
  font-size:12px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--sea-200);margin-bottom:22px;font-weight:500;
}
html[lang="ja"] .eyebrow{letter-spacing:.16em;text-transform:none;font-size:12.5px}

.hero h1{margin:0 0 26px;display:flex;flex-direction:column;gap:10px}
.h1-jp{
  font-family:var(--serif);font-weight:700;
  font-size:clamp(64px,12vw,148px);
  line-height:.95;letter-spacing:.06em;
  text-shadow:0 4px 40px rgba(0,0,0,.4);
}
html[lang="en"] .h1-jp{font-family:var(--display);letter-spacing:.14em;font-size:clamp(66px,13vw,158px)}
.h1-sub{
  font-family:var(--display);font-style:italic;
  font-size:clamp(15px,2vw,22px);letter-spacing:.2em;
  color:var(--sand-200);font-weight:600;
}

.lead{
  max-width:640px;font-size:clamp(15px,1.5vw,17.5px);
  line-height:2;color:rgba(255,255,255,.9);margin-bottom:34px;
}

.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:52px}
.btn{
  display:inline-block;text-decoration:none;
  font-size:14px;font-weight:500;padding:13px 30px;
  border-radius:2px;transition:.2s;letter-spacing:.03em;
}
.btn-primary{background:var(--torii);color:#fff}
.btn-primary:hover{background:var(--torii-dark);transform:translateY(-1px)}
.btn-ghost{border:1px solid rgba(255,255,255,.45);color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.12);border-color:#fff}

.hero-facts{
  display:grid;grid-template-columns:repeat(4,1fr);gap:8px;
  border-top:1px solid rgba(255,255,255,.18);padding-top:24px;max-width:820px;
}
.hero-facts li{display:flex;flex-direction:column;gap:3px}
.hero-facts b{
  font-family:var(--display);font-size:clamp(26px,3.4vw,38px);
  font-weight:600;line-height:1;color:#fff;
}
.hero-facts b span{font-size:.42em;margin-left:3px;letter-spacing:.06em;color:var(--sea-200)}
.hero-facts li > span{font-size:11.5px;color:rgba(255,255,255,.66);line-height:1.5}

/* ============ SECTIONS ============ */
.section{padding:96px 0}
.section-alt{background:var(--sand-100)}
.section-dark{background:var(--sea-900);color:var(--sand-100)}

.sec-head{margin-bottom:52px;position:relative}
.sec-num{
  display:block;font-family:var(--display);font-size:13px;
  letter-spacing:.3em;color:var(--gold);margin-bottom:10px;font-weight:600;
}
.sec-head h2{
  font-size:clamp(27px,3.6vw,40px);letter-spacing:.04em;margin-bottom:12px;
  position:relative;padding-bottom:16px;
}
.sec-head h2::after{
  content:"";position:absolute;left:0;bottom:0;
  width:46px;height:2px;background:var(--torii);
}
.sec-sub{font-size:14.5px;color:var(--ink-faint);margin:0;letter-spacing:.02em}
.section-dark .sec-sub{color:var(--sea-200)}
.section-dark .sec-head h2::after{background:var(--gold)}

/* ============ ABOUT ============ */
.about-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:56px;align-items:start}
.about-lead p{font-size:15.5px;line-height:2.05;color:var(--ink-soft)}
.about-lead p:first-child{
  font-size:17px;color:var(--ink);
  border-left:2px solid var(--torii);padding-left:20px;
}

.factbox{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:30px 28px;box-shadow:var(--shadow);position:sticky;top:92px;
}
.factbox h3{
  font-size:16px;letter-spacing:.06em;margin-bottom:20px;padding-bottom:14px;
  border-bottom:1px solid var(--line);
}
.factbox dl{margin:0;display:grid;grid-template-columns:auto;gap:0}
.factbox dt{
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-faint);margin-top:16px;font-weight:500;
}
.factbox dt:first-of-type{margin-top:0}
.factbox dd{margin:3px 0 0;font-size:14px;line-height:1.6;color:var(--ink)}

/* ============ ACCESS ============ */
.access-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(268px,1fr));
  gap:20px;margin-bottom:48px;
}
.access-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:28px 26px;display:flex;flex-direction:column;
  transition:transform .22s,box-shadow .22s;
}
.access-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.access-card.featured{border-color:var(--torii);border-width:1px;box-shadow:0 0 0 1px var(--torii)}

.tag{
  display:inline-block;align-self:flex-start;
  font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;
  background:var(--sand-100);color:var(--ink-soft);
  padding:4px 10px;border-radius:2px;margin-bottom:14px;font-weight:500;
}
.access-card.featured .tag{background:var(--torii);color:#fff}

.access-card h3{font-size:17px;letter-spacing:.02em;margin-bottom:6px}
.route{
  font-family:var(--display);font-size:14px;font-style:italic;
  color:var(--sea-600);margin-bottom:18px;letter-spacing:.04em;
}
.route span{margin:0 5px;font-style:normal}

.specs{border-top:1px solid var(--line);margin-bottom:16px}
.specs li{
  display:flex;gap:14px;padding:9px 0;border-bottom:1px solid var(--line);
  font-size:13.5px;line-height:1.5;
}
.specs b{
  flex:0 0 52px;font-weight:500;font-size:11px;letter-spacing:.1em;
  color:var(--ink-faint);text-transform:uppercase;padding-top:3px;
}
.specs span{color:var(--ink)}

.note{font-size:13px;line-height:1.75;color:var(--ink-faint);margin-top:auto}

.callout{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:36px 34px;
}
.callout > h3{font-size:19px;margin-bottom:26px;letter-spacing:.04em}
.callout-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:30px}
.callout-grid h4{font-size:14.5px;margin-bottom:8px;color:var(--sea-700)}
.callout-grid p{font-size:13.5px;line-height:1.85;color:var(--ink-soft)}
.disclaimer{
  margin-top:28px;padding-top:20px;border-top:1px solid var(--line);
  font-size:12.5px;line-height:1.8;color:var(--ink-faint);
}

/* ============ SPOTS ============ */
.spot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(325px,1fr));gap:26px}
.spot{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:column;
  transition:transform .22s,box-shadow .22s;
}
.spot:hover{transform:translateY(-4px);box-shadow:var(--shadow)}

.spot-img{
  height:158px;position:relative;overflow:hidden;
  display:grid;place-items:center;
  background:var(--sea-700);
}
.spot-img span{
  font-family:var(--serif);font-size:30px;font-weight:600;
  color:rgba(255,255,255,.92);letter-spacing:.14em;
  text-shadow:0 2px 18px rgba(0,0,0,.35);z-index:2;
}
.spot-img::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:radial-gradient(circle at 50% 115%,rgba(255,255,255,.22),transparent 62%);
}

.i-rock   {background:linear-gradient(160deg,#4c6072,#1d3240 62%,#101f2a)}
.i-torii  {background:linear-gradient(160deg,#2e7391,#174a63 58%,#0d2f42)}
.i-moon   {background:linear-gradient(160deg,#2b3a55,#1a2438 60%,#101725)}
.i-museum {background:linear-gradient(160deg,#8a7350,#5c4a30 58%,#382c1c)}
.i-beach  {background:linear-gradient(160deg,#7fc8cd,#2f8ba0 55%,#166078)}
.i-cliff  {background:linear-gradient(160deg,#5d6a6e,#2c3d45 60%,#17252c)}
.i-dolphin{background:linear-gradient(160deg,#48a3bd,#1e6c8a 58%,#0e3f57)}
.i-boat   {background:linear-gradient(160deg,#63c5c0,#218894 56%,#0f5462)}
.i-monkey {background:linear-gradient(160deg,#6f7d5e,#3d4a33 60%,#232d1e)}
.i-jizo   {background:linear-gradient(160deg,#7d8894,#414f5c 60%,#232e39)}
.i-cedar  {background:linear-gradient(160deg,#4e7052,#2a4630 60%,#152618)}
.i-sunset {background:linear-gradient(160deg,#e0925c,#a1543c 52%,#4a2a2a)}

.spot-body{padding:24px 24px 26px;display:flex;flex-direction:column;flex:1}
.spot-cat{
  align-self:flex-start;font-size:10.5px;letter-spacing:.15em;
  color:var(--torii);text-transform:uppercase;font-weight:500;margin-bottom:9px;
}
.spot-body h3{font-size:19px;letter-spacing:.02em;margin-bottom:5px}
.romaji{
  font-family:var(--display);font-size:12.5px;font-style:italic;
  color:var(--ink-faint);margin-bottom:14px;letter-spacing:.05em;
}
.spot-body > p:not(.romaji):not(.spot-meta){
  font-size:14px;line-height:1.9;color:var(--ink-soft);margin-bottom:16px;
}
.spot-meta{
  margin-top:auto;padding-top:14px;border-top:1px solid var(--line);
  font-size:11.5px;letter-spacing:.04em;color:var(--ink-faint);line-height:1.6;
}

/* ============ FOOD ============ */
.food-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:22px}
.food-card{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.13);
  border-radius:var(--radius);padding:30px 28px;
  transition:background .22s,border-color .22s;
}
.food-card:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.26)}
.food-card h3{font-size:20px;color:#fff;margin-bottom:4px;letter-spacing:.03em}
.food-card .romaji{color:var(--gold);margin-bottom:16px}
.food-card p:last-child{font-size:14px;line-height:1.92;color:rgba(255,255,255,.76);margin:0}
.food-card.highlight{
  grid-column:span 2;background:rgba(192,138,62,.11);border-color:rgba(192,138,62,.42);
}
.food-card.highlight .tag{background:var(--gold);color:var(--sea-900)}

/* ============ STAY ============ */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.panel{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:34px 32px;
}
.panel h3{
  font-size:20px;margin-bottom:18px;padding-bottom:14px;
  border-bottom:1px solid var(--line);letter-spacing:.03em;
}
.panel p{font-size:14.5px;line-height:1.95;color:var(--ink-soft)}

.tick li{padding:14px 0;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:4px}
.tick li:first-child{padding-top:0}
.tick b{
  font-size:13px;font-weight:600;color:var(--sea-700);letter-spacing:.04em;
  display:flex;align-items:center;gap:8px;
}
.tick b::before{content:"";width:5px;height:5px;background:var(--torii);border-radius:50%;flex-shrink:0}
.tick span{font-size:13.5px;line-height:1.8;color:var(--ink-soft)}

/* ============ COURSES ============ */
.course-tabs{display:flex;gap:8px;margin-bottom:34px;flex-wrap:wrap}
.course-tabs button{
  font-family:var(--sans);font-size:13.5px;font-weight:500;
  padding:11px 26px;border:1px solid var(--sand-400);
  background:transparent;color:var(--ink-soft);cursor:pointer;
  border-radius:2px;transition:.2s;letter-spacing:.03em;
}
.course-tabs button:hover{border-color:var(--sea-600);color:var(--sea-700)}
.course-tabs button.is-active{background:var(--sea-800);border-color:var(--sea-800);color:#fff}

.course-panel{display:none}
.course-panel.is-active{display:block;animation:fade .35s ease}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.course-intro{
  font-size:15.5px;color:var(--ink-soft);margin-bottom:32px;
  padding-left:18px;border-left:2px solid var(--gold);line-height:1.9;
}

.timeline{position:relative;padding-left:0}
.timeline li{
  display:grid;grid-template-columns:118px 1fr;gap:26px;
  padding:20px 0;border-bottom:1px solid var(--line);position:relative;
}
.timeline li:last-child{border-bottom:0}
.timeline .t{
  font-family:var(--display);font-size:17px;font-weight:600;
  color:var(--torii);letter-spacing:.06em;padding-top:2px;
}
html[lang="ja"] .timeline .t{font-family:var(--serif);font-size:14.5px;letter-spacing:.04em}
.timeline b{display:block;font-family:var(--serif);font-size:16px;margin-bottom:5px;letter-spacing:.02em}
.timeline p{font-size:13.5px;color:var(--ink-faint);line-height:1.8;margin:0}

/* ============ SEASONS ============ */
.season-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}
.season{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:28px 26px;border-top:3px solid var(--line);
}
.season h3{font-size:18px;margin-bottom:14px;letter-spacing:.04em}
.season p{font-size:13.5px;line-height:1.88;color:var(--ink-soft)}
.season-food{
  margin-top:18px;padding-top:14px;border-top:1px solid var(--line);
  display:flex;gap:10px;align-items:baseline;
}
.season-food b{
  font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-faint);flex-shrink:0;font-weight:500;
}
.season-food span{font-size:13px;color:var(--ink);line-height:1.6}

.s-spring{border-top-color:#e59db4}
.s-summer{border-top-color:#4aa8c4}
.s-autumn{border-top-color:#d08a3f}
.s-winter{border-top-color:#7f95a8}

/* ============ TIPS ============ */
.tips-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(268px,1fr));gap:2px;background:var(--line)}
.tip{background:var(--sand-50);padding:30px 28px}
.tip h3{
  font-size:15.5px;margin-bottom:11px;letter-spacing:.03em;
  display:flex;align-items:center;gap:9px;
}
.tip h3::before{
  content:"";width:6px;height:6px;background:var(--torii);
  border-radius:50%;flex-shrink:0;
}
.tip p{font-size:13.5px;line-height:1.9;color:var(--ink-soft)}

/* ============ FAQ ============ */
.faq details{
  border-bottom:1px solid var(--line);
}
.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{
  cursor:pointer;list-style:none;padding:22px 44px 22px 0;
  font-family:var(--serif);font-size:16px;font-weight:600;
  position:relative;transition:color .18s;letter-spacing:.02em;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--torii)}
.faq summary::after{
  content:"";position:absolute;right:8px;top:50%;
  width:9px;height:9px;margin-top:-6px;
  border-right:1.5px solid var(--ink-faint);border-bottom:1.5px solid var(--ink-faint);
  transform:rotate(45deg);transition:transform .25s;
}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:-2px}
.faq details p{
  padding:0 30px 26px 0;font-size:14px;line-height:1.95;color:var(--ink-soft);margin:0;
}

/* ============ FOOTER ============ */
.site-footer{background:var(--sea-900);color:rgba(255,255,255,.72);padding:64px 0 28px}
.footer-top{
  display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:44px;
  padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.13);
}
.footer-brand .brand-mark{margin-bottom:14px}
.fb-name{font-family:var(--serif);font-size:16px;color:#fff;margin-bottom:6px}
.tagline{font-size:13px;color:var(--sea-200);line-height:1.8;margin:0}
.footer-links h4{
  font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold);margin-bottom:16px;font-family:var(--sans);font-weight:500;
}
.footer-links li{font-size:13px;line-height:1.7;padding:5px 0}
.footer-links .small{font-size:12.5px;line-height:1.85;color:rgba(255,255,255,.55)}

.footer-bottom{
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding-top:24px;font-size:11.5px;letter-spacing:.06em;color:rgba(255,255,255,.42);
}
.footer-bottom p{margin:0}

/* ============ RESPONSIVE ============ */
@media (max-width:1080px){
  .about-grid{grid-template-columns:1fr;gap:36px}
  .factbox{position:static}
  .food-card.highlight{grid-column:span 1}
  .footer-top{grid-template-columns:1fr 1fr;gap:34px}
}

@media (max-width:900px){
  .nav{
    display:none;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;gap:0;
    background:var(--sand-50);border-bottom:1px solid var(--line);
    padding:8px 24px 18px;box-shadow:var(--shadow);
  }
  .nav.is-open{display:flex}
  .nav a{padding:13px 4px;border-bottom:1px solid var(--line);font-size:15px;border-radius:0}
  .nav a:last-child{border-bottom:0}
  .menu-toggle{display:flex}
  .header-inner{min-height:62px;gap:12px;position:relative}
  .two-col{grid-template-columns:1fr}
}

@media (max-width:760px){
  .section{padding:68px 0}
  .sec-head{margin-bottom:38px}
  .hero{min-height:auto;padding-top:56px}
  .hero-inner{padding-bottom:44px}
  .hero-facts{grid-template-columns:1fr 1fr;gap:22px 12px}
  .timeline li{grid-template-columns:1fr;gap:6px}
  .timeline .t{font-size:15px}
  .callout{padding:28px 22px}
  .panel{padding:28px 24px}
  .brand-text small{display:none}
  .footer-top{grid-template-columns:1fr;gap:30px}
}

@media (max-width:420px){
  .wrap{padding:0 18px}
  .hero-cta{flex-direction:column;align-items:stretch}
  .btn{text-align:center}
  .course-tabs button{flex:1;padding:11px 12px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}

@media print{
  .site-header,.hero-art,.course-tabs,.menu-toggle{display:none}
  .course-panel{display:block !important}
  body{background:#fff;color:#000}
  .section{padding:24px 0;page-break-inside:avoid}
}
