/* Takatsuki AI Home Portal v1.1.1
   Colmar-inspired theme-park entrance. Existing links/functions are unchanged.
*/
.ai-portal-fullbleed{
  position:relative;
  width:100vw;
  max-width:100vw;
  margin:0 calc(50% - 50vw) !important;
  padding:0 !important;
  overflow:hidden;
  background:#20160f;
}

/* Remove Gutenberg/Cocoon block spacing around this shortcode when possible */
.wp-block-shortcode:has(.ai-portal-fullbleed),
.entry-content > div:has(> .ai-portal-fullbleed),
.article > div:has(> .ai-portal-fullbleed){
  margin-top:0 !important;
  margin-bottom:0 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
}

.ai-portal-scene{
  position:relative;
  isolation:isolate;
  background-image:var(--ai-portal-bg);
  background-size:cover;
  background-position:center center;
  min-height:720px;
}
.ai-portal-shade{
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(180deg,rgba(12,8,5,.36) 0%,rgba(12,8,5,.14) 22%,rgba(12,8,5,.23) 58%,rgba(12,8,5,.56) 100%),
    linear-gradient(90deg,rgba(8,6,4,.22),transparent 35%,transparent 68%,rgba(8,6,4,.18));
}
.ai-portal{
  width:min(1500px,100%);
  margin:0 auto !important;
  padding:28px clamp(14px,3vw,44px) 30px !important;
  box-sizing:border-box;
  font-family:"Hiragino Mincho ProN","Yu Mincho",YuMincho,"Noto Serif JP",serif;
  color:#2d1a12;
}
.ai-portal-head{
  text-align:center;
  margin:0 auto 22px !important;
  padding:0 !important;
  border:0 !important;
  display:block !important;
}
.ai-portal-kicker{
  margin:0 0 5px !important;
  color:#f8e2aa !important;
  font-size:12px !important;
  font-weight:700;
  letter-spacing:.22em;
  text-shadow:0 2px 8px rgba(0,0,0,.8);
}
.ai-portal-head h2{
  margin:0 !important;
  color:#fff1bf !important;
  font-size:clamp(38px,5.8vw,78px) !important;
  line-height:1.05 !important;
  font-weight:700 !important;
  letter-spacing:.02em;
  text-shadow:
    0 2px 0 #a85f24,
    0 0 9px rgba(255,183,68,.9),
    0 4px 18px rgba(0,0,0,.75);
}
.ai-portal-head h2::before,
.ai-portal-head h2::after{
  content:"✦";
  display:inline-block;
  margin:0 .22em;
  font-size:.42em;
  vertical-align:middle;
  color:#ffd276;
}
.ai-portal-subtitle{
  margin:7px 0 0 !important;
  color:#fff8df !important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Yu Gothic",Meiryo,sans-serif;
  font-size:clamp(14px,1.6vw,18px) !important;
  font-weight:700;
  text-shadow:0 2px 8px rgba(0,0,0,.85);
}
.ai-portal-guide{
  display:inline-block !important;
  margin:8px auto 0 !important;
  padding:5px 13px !important;
  border:1px solid rgba(255,218,145,.75) !important;
  border-radius:999px;
  background:rgba(35,20,11,.62);
  color:#ffe9b9 !important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Yu Gothic",Meiryo,sans-serif;
  font-size:12px !important;
  line-height:1.45 !important;
  max-width:none !important;
  backdrop-filter:blur(5px);
}
.ai-portal-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  align-items:start;
}
.ai-category{
  position:relative;
  margin:0 !important;
  overflow:visible;
  border:2px solid rgba(112,67,28,.85);
  border-radius:18px 18px 14px 14px;
  background:
    linear-gradient(rgba(255,250,226,.96),rgba(243,224,183,.96)),
    #f4dfb2;
  box-shadow:
    0 9px 22px rgba(0,0,0,.32),
    inset 0 0 0 4px rgba(255,255,255,.45),
    inset 0 0 28px rgba(137,83,30,.14);
  transform:translateZ(0);
}
.ai-category::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(151,103,50,.36);
  border-radius:12px;
  pointer-events:none;
}
.ai-category-cap{
  width:46px;
  height:46px;
  margin:-14px auto -5px;
  border-radius:50%;
  border:3px solid #b27a35;
  background:radial-gradient(circle at 35% 30%,#fff1a9 0 8%,#c48a3c 10% 35%,#6d3c1e 72%);
  box-shadow:0 4px 9px rgba(0,0,0,.35),inset 0 0 0 2px #f6d48c;
}
.ai-category.play .ai-category-cap::after{content:"🎲";}
.ai-category.create .ai-category-cap::after{content:"🎨";}
.ai-category.talk .ai-category-cap::after{content:"💬";}
.ai-category.food .ai-category-cap::after{content:"🍴";}
.ai-category.break .ai-category-cap::after{content:"☕";}
.ai-category.station .ai-category-cap::after{content:"✦";}
.ai-category-cap::after{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;height:100%;
  font-size:22px;
  filter:drop-shadow(0 1px 1px rgba(255,255,255,.6));
}
.ai-category-title{
  position:relative;
  margin:0 !important;
  padding:12px 14px 9px !important;
  border:0 !important;
  background:transparent !important;
  color:#4c2b1b !important;
  text-align:center;
  font-size:clamp(19px,1.7vw,25px) !important;
  line-height:1.2 !important;
  font-weight:800 !important;
}
.ai-category-title::after{
  content:"";
  display:block;
  width:58%;
  height:1px;
  margin:9px auto 0;
  background:linear-gradient(90deg,transparent,#9d723f,transparent);
}
.ai-links{
  position:relative;
  margin:0 !important;
  padding:0 13px 13px !important;
  list-style:none !important;
}
.ai-links li{
  margin:0 !important;
  border-top:1px solid rgba(129,89,46,.22) !important;
}
.ai-links li:first-child{border-top:none !important;}
.ai-links a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:42px;
  padding:8px 10px !important;
  border-radius:10px;
  color:#3b2a20 !important;
  text-decoration:none !important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Yu Gothic",Meiryo,sans-serif;
  font-size:15px !important;
  font-weight:700 !important;
  line-height:1.35 !important;
  transition:transform .16s ease,background .16s ease,box-shadow .16s ease;
}
.ai-links a:hover,
.ai-links a:focus-visible{
  background:rgba(255,255,255,.66);
  box-shadow:0 3px 9px rgba(85,48,17,.14);
  transform:translateY(-1px);
}
.ai-arrow{
  flex:0 0 auto;
  color:#a2632d !important;
  font-size:22px !important;
  line-height:1;
}

@media(max-width:980px){
  .ai-portal-scene{background-position:58% center;}
  .ai-portal-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:640px){
  .ai-portal-scene{background-position:64% center;min-height:auto;}
  .ai-portal{padding:20px 8px 18px !important;}
  .ai-portal-head{margin-bottom:16px !important;}
  .ai-portal-head h2{font-size:clamp(32px,10.5vw,48px) !important;}
  .ai-portal-head h2::before,.ai-portal-head h2::after{display:none;}
  .ai-portal-subtitle{font-size:13px !important;}
  .ai-portal-guide{font-size:11px !important;max-width:94% !important;}
  .ai-portal-grid{grid-template-columns:1fr;gap:11px;}
  .ai-category{border-radius:14px;}
  .ai-category-cap{width:40px;height:40px;margin-top:-11px;}
  .ai-category-title{font-size:19px !important;padding-top:10px !important;}
  .ai-links a{font-size:15px !important;min-height:40px;}
}

/* v1.1.1 readability fix: force header supporting text to white over photo */
.ai-portal-fullbleed .ai-portal-kicker,
.ai-portal-fullbleed .ai-portal-subtitle,
.ai-portal-fullbleed .ai-portal-guide {
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  text-shadow:0 2px 5px rgba(0,0,0,.95),0 0 10px rgba(0,0,0,.65) !important;
}
.ai-portal-fullbleed .ai-portal-kicker {
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Yu Gothic",Meiryo,sans-serif !important;
  font-size:14px !important;
  font-weight:800 !important;
  letter-spacing:.12em !important;
}
.ai-portal-fullbleed .ai-portal-subtitle {
  font-weight:800 !important;
}
.ai-portal-fullbleed .ai-portal-guide {
  background:rgba(20,14,10,.74) !important;
  border-color:rgba(255,255,255,.58) !important;
}
