/*
Theme Name: WANWAN HOUSE Portfolio
Theme URI: 
Author: WANWAN HOUSE
Description: WANWAN HOUSE Portfolio — WANWAN HOUSE LP BUILDERで生成した団体LPテーマ。
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: wanwan-house-portfolio
*/


/* ---------------------------------------------------------
   影のホバー演出を「疑似要素の不透明度」で行うための共通定義。
   box-shadow を直接アニメーションさせると、ブラウザが毎フレーム
   影を描き直すため重くなる。見た目は同じまま負荷だけを下げる。
   --------------------------------------------------------- */
.lift{position:relative;transition:transform .3s var(--ease);}
.lift::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  box-shadow:var(--pr-shadow);opacity:0;transition:opacity .3s var(--ease);z-index:-1;}
.lift:hover::after{opacity:1;}
/* カスタマイズ用スロットが空のときは、余白だけ残らないよう隠す */
#previewMode [data-cz]:empty{display:none;}

/* キーボード操作時にどこを選んでいるかを明示する（マウス操作では出ない） */
#previewMode :focus-visible{outline:3px solid var(--a1);outline-offset:3px;border-radius:4px;}
#previewMode [role="button"]{cursor:pointer;}
/* キーボードでTabを押した時だけ現れる「本文へスキップ」リンク */
.skip-link{position:absolute;left:-9999px;top:0;z-index:5000;background:var(--a1);color:#fff;
  padding:12px 20px;border-radius:0 0 12px 0;font-weight:700;font-size:.86rem;text-decoration:none;}
.skip-link:focus{left:0;}

/* =========================================================
   PREVIEW — 完成LP本体（テーマスコープ）
   カジュアル＆キュート・デザインシステム（godoggy.jpを意識）
   書き出し時は、この START〜END の範囲と SITE RESPONSIVE 以降だけが
   公開サイトへコピーされる（エディタ用CSSを載せないため）
   ========================================================= */
#previewMode{display:none;background:var(--bg);color:var(--paper);font-size:calc(1rem * var(--scale,1));}
#previewMode.show{display:block;}
#previewMode .grain{position:fixed;inset:0;pointer-events:none;z-index:5;opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
#previewMode.fx-nograin .grain{display:none;}
#previewMode ::selection{background:var(--a1);color:#fff;}

/* ---- shared tokens for the cute component system ---- */
#previewMode{
  --pr-card:26px; --pr-btn:999px; --pr-badge:999px; --pr-chip:999px;
  --pr-shadow:0 14px 30px rgba(90,60,20,.10);
  --pr-shadow-sm:0 6px 16px rgba(90,60,20,.08);
  --pr-border:1px solid color-mix(in srgb, var(--paper) 10%, transparent);
  --content-max:1180px;
  --gut:6vw;
  --pad-y:100px;
}
/* コンテンツ列を中央に保つ左右余白（広い画面で端に張り付くのを防ぐ） */
#previewMode .psec{
  --side:max(var(--gut), calc((100% - var(--content-max)) / 2));
}
/* 日本語組版：単語の途中で切らず、句読点や1文字だけの折返しも抑える */
#previewMode h1,#previewMode h2,#previewMode h3,
#previewMode .st-text,#previewMode .lm-i,#previewMode .sec-head h2{
  text-wrap:balance;word-break:normal;line-break:strict;overflow-wrap:break-word;}
#previewMode p,#previewMode .hero-sub,#previewMode .st-note,#previewMode .team-intro,#previewMode .sec-head p{
  text-wrap:pretty;word-break:normal;line-break:strict;overflow-wrap:break-word;}
/* 見出しは英数字も途中で割らない */
#previewMode h1,#previewMode h2,#previewMode .st-text{hanging-punctuation:allow-end;}

/* preview nav — floating rounded pill bar */
.pnav{display:flex;align-items:center;justify-content:space-between;gap:16px;position:relative;z-index:40;
  --side:max(var(--gut,6vw), calc((100% - var(--content-max,1180px)) / 2));padding:14px var(--side);
  background:var(--nav-bg,transparent);}
body.standalone .pnav.no-stick{position:relative;}
.pnav.nav-transparent{position:absolute;top:0;left:0;right:0;background:transparent;}
body.standalone .pnav.nav-transparent{position:absolute;backdrop-filter:none;-webkit-backdrop-filter:none;}
.pnav.nav-dark{color:#fff;}
.pnav.nav-dark .pn-links a{color:rgba(255,255,255,.86);}
.pnav.nav-dark .pn-links a:hover{background:rgba(255,255,255,.16);color:#fff;}
.pnav.nav-light{color:#3a2e22;}
.pnav.nav-center{display:grid;grid-template-columns:1fr auto 1fr;}
.pnav.nav-center .pn-brand{grid-column:2;justify-self:center;}
.pnav.nav-center .pn-right{grid-column:3;justify-self:end;}
.pnav .pn-right{display:flex;align-items:center;gap:10px;}
.pnav .pn-logo{height:38px;width:auto;object-fit:contain;display:block;}
.pn-cta{display:inline-block;background:var(--a1);color:#fff;font-weight:800;font-size:.82rem;padding:11px 22px;border-radius:var(--pr-btn);
  text-decoration:none;white-space:nowrap;box-shadow:0 8px 18px color-mix(in srgb, var(--a1) 38%, transparent);transition:transform .25s var(--ease);}
.pn-cta:hover{transform:translateY(-2px);}
.pn-burger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px;}
.pn-burger span{display:block;width:22px;height:2px;background:currentColor;border-radius:2px;transition:transform .25s,opacity .25s;}
body.standalone .pnav{position:sticky;top:0;background:color-mix(in srgb, var(--bg) 94%, transparent);}
/* ぼかしは「上に重ねる」透過ヘッダーのときだけ使う（スクロール毎の再ブラーを避ける） */
body.standalone .pnav.nav-blur{background:color-mix(in srgb, var(--bg) 78%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);}
.pnav .pn-brand{font-family:var(--f-disp);font-weight:var(--fw-disp);font-size:1.05rem;letter-spacing:.01em;display:flex;align-items:center;gap:9px;color:inherit;text-decoration:none;}
.pnav .pn-brand .pn-paw{font-size:1.2rem;display:inline-block;transform:rotate(-8deg);}
.pnav .pn-links{display:flex;gap:6px;align-items:center;}
.pnav .pn-links a{font-family:var(--f-body);font-weight:700;font-size:.82rem;color:var(--dim);text-decoration:none;padding:9px 16px;border-radius:var(--pr-btn);transition:all .25s var(--ease);}
.pnav .pn-links a:hover{background:color-mix(in srgb, var(--a1) 14%, transparent);color:var(--a1);}
.pnav.scrolled{box-shadow:var(--pr-shadow-sm);border-radius:0 0 24px 24px;}
#pbar{position:fixed;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--a1),var(--a2));transform:scaleX(0);transform-origin:left;z-index:899;border-radius:0 3px 3px 0;}
.u{position:relative;text-decoration:none;}

/* section base */
.psec{position:relative;scroll-margin-top:90px;padding-left:var(--side);padding-right:var(--side);contain:layout style;}
.psec.p-marquee{padding-left:0;padding-right:0;}
.sec-head{text-align:center;max-width:640px;margin:0 auto 56px;}
.sec-head h2{font-family:var(--f-disp);font-weight:var(--fw-disp);font-size:clamp(1.7rem,4.2vw,2.6rem);letter-spacing:-.01em;line-height:1.3;}
.sec-head .sh-note{display:inline-block;margin-top:10px;font-family:var(--f-body);font-size:.76rem;font-weight:700;color:var(--a2);background:color-mix(in srgb, var(--a2) 12%, transparent);padding:5px 14px;border-radius:var(--pr-badge);}
.eyebrow{font-family:var(--f-body);font-size:.8rem;font-weight:800;letter-spacing:.02em;color:var(--a2);display:inline-flex;align-items:center;gap:8px;background:color-mix(in srgb, var(--a2) 12%, transparent);padding:7px 16px;border-radius:var(--pr-badge);}
.eyebrow::before{content:"🐾";font-size:.9em;}
.accent{color:var(--a1);}

/* ---- ステータスバッジ（募集中など） ---- */
.status-badge{display:inline-block;font-family:var(--f-body);font-size:.7rem;font-weight:800;padding:5px 14px;border-radius:var(--pr-badge);letter-spacing:.01em;white-space:nowrap;}
.status-badge.st-open{background:#4fb6a6;color:#fff;}
.status-badge.st-trial{background:#ffa53d;color:#fff;}
.status-badge.st-done{background:#b6a892;color:#fff;}
.status-badge.st-ask{background:#ff7d7d;color:#fff;}
.status-badge.st-care{background:#7a9fe0;color:#fff;}
.card-status{position:absolute;top:14px;left:14px;z-index:2;box-shadow:0 3px 10px rgba(0,0,0,.18);}
.photo-count{position:absolute;bottom:12px;right:12px;z-index:2;background:rgba(255,255,255,.92);color:#3a2e22;font-size:.68rem;font-weight:800;padding:4px 11px;border-radius:var(--pr-badge);}
.no-media{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font-size:1.8rem;color:var(--mut);
  background:repeating-linear-gradient(45deg, color-mix(in srgb, var(--a1) 6%, transparent) 0 12px, transparent 12px 24px);}
.no-media span{font-size:.72rem;font-weight:700;}

/* ---- custom section background: 自動コントラスト文字色 ---- */
.psec.text-light-sec{color:#fff;}
.psec.text-light-sec .sec-head h2{color:#fff;}
.psec.text-light-sec .sec-head p,.psec.text-light-sec .team-intro{color:rgba(255,255,255,.85);}
.psec.text-light-sec .eyebrow,.psec.text-light-sec .sec-head .sh-note{background:rgba(255,255,255,.22);color:#fff;}
.psec.text-dark-sec{color:#3a2e22;}
.psec.text-dark-sec .sec-head h2{color:#3a2e22;}
.psec.text-dark-sec .sec-head p,.psec.text-dark-sec .team-intro{color:rgba(58,46,34,.75);}
.psec.text-dark-sec .eyebrow,.psec.text-dark-sec .sec-head .sh-note{background:rgba(58,46,34,.10);color:#3a2e22;}

/* ============ HERO ============ */
.p-hero{min-height:82vh;min-height:82svh;display:flex;flex-direction:column;justify-content:center;
  padding:70px var(--side) 60px;position:relative;overflow:hidden;}
.p-hero:not(.has-media){background:
    radial-gradient(ellipse 60% 45% at 14% 12%, color-mix(in srgb, var(--a2) 22%, transparent), transparent 62%),
    radial-gradient(ellipse 55% 45% at 88% 18%, color-mix(in srgb, var(--a1) 24%, transparent), transparent 60%),
    radial-gradient(ellipse 60% 50% at 50% 100%, color-mix(in srgb, var(--a1) 12%, transparent), transparent 65%);}
.p-hero .hero-bg{position:absolute;inset:0;z-index:0;}
.p-hero .hero-bg img,.p-hero .hero-bg video{width:100%;height:100%;object-fit:cover;}
.p-hero .hero-bg.iframe-bg{overflow:hidden;}
/* 埋め込みが拒否されても真っ黒にならないよう、サムネイルを下に敷く */
.hv-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.hero-bg.iframe-bg iframe,.hv-frame iframe{z-index:1;}
.p-hero .hero-bg.iframe-bg iframe{position:absolute;top:50%;left:50%;width:177.78vh;height:56.25vw;min-width:100%;min-height:100%;transform:translate(-50%,-50%);pointer-events:none;border:0;}
.p-hero .hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(30,20,10,.12) 0%, rgba(30,20,10,.55) 100%);}
.p-hero.text-light{color:#fff;}
.p-hero.text-light .eyebrow{background:rgba(255,255,255,.22);color:#fff;}
.p-hero.text-light .eyebrow::before{filter:none;}
.p-hero.text-light h1{color:#fff;}
.p-hero.text-light .hero-sub{color:rgba(255,255,255,.92);}
.p-hero.text-light .hero-meta{border-top-color:rgba(255,255,255,.3);}
.p-hero.text-light .hm-num{color:#fff;}
.p-hero.text-light .hm-label{color:rgba(255,255,255,.78);}
.p-hero.text-light .hero-badge{background:rgba(255,255,255,.92);color:#3a2e22;}
.p-hero.text-dark{color:#3a2e22;}
.p-hero.text-dark .eyebrow{background:rgba(58,46,34,.10);color:#3a2e22;}
.p-hero.text-dark h1{color:#3a2e22;}
.p-hero.text-dark .hero-sub{color:rgba(58,46,34,.78);}
.p-hero.text-dark .hero-meta{border-top-color:rgba(58,46,34,.22);}
.p-hero.text-dark .hm-num{color:#3a2e22;}
.p-hero.text-dark .hm-label{color:rgba(58,46,34,.6);}
.hero-word{display:none;}
.p-hero .hero-in{position:relative;z-index:2;max-width:min(760px,100%);}
.p-hero.center{align-items:center;text-align:center;}
.p-hero.center .hero-in{max-width:min(720px,100%);margin:0 auto;}
.p-hero.center .hero-meta{justify-content:center;}
.p-hero.center .hero-sub{margin-left:auto;margin-right:auto;}

/* ---- ヒーロー：動画を左右half/インセットで見せるレイアウト ---- */
.p-hero.split{display:grid;align-items:center;gap:clamp(28px,4vw,64px);padding-top:80px;padding-bottom:80px;}
.p-hero.split-right{grid-template-columns:1fr 46%;}
.p-hero.split-left{grid-template-columns:46% 1fr;}
.p-hero.split-left .hero-in{order:2;}
.p-hero.split-left .hero-visual{order:1;}
.p-hero.split .hero-in{max-width:100%;}
.p-hero.split .hero-sub{max-width:100%;}
.p-hero.split h1{font-size:clamp(1.9rem,3.4vw,3.1rem);line-height:1.36;}
.p-hero.split .hero-meta{gap:clamp(20px,2.4vw,36px);}
.hero-visual{position:relative;z-index:2;width:100%;}
.hero-visual .hv-frame{position:relative;width:100%;aspect-ratio:var(--hv-ratio,4/5);overflow:hidden;background:var(--bg2);container-type:size;}
.hero-visual .hv-frame > img,.hero-visual .hv-frame > video{width:100%;height:100%;object-fit:cover;display:block;}
/* 埋め込み動画を枠いっぱいに（縦横比を保ったままカバー） */
.hero-visual .hv-frame iframe{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border:0;pointer-events:none;
  width:220%;height:220%;}
@supports (width:1cqw){
  .hero-visual .hv-frame iframe{width:max(100cqw, 177.78cqh);height:max(100cqh, 56.25cqw);}
}
/* --- フレームプリセット --- */
.hv-soft   .hv-frame{border-radius:32px;box-shadow:0 26px 50px rgba(90,60,20,.18);}
.hv-blob   .hv-frame{border-radius:52% 48% 44% 56% / 46% 44% 56% 54%;box-shadow:0 26px 50px rgba(90,60,20,.16);}
.hv-circle .hv-frame{border-radius:50%;aspect-ratio:1;box-shadow:0 26px 50px rgba(90,60,20,.16);}
.hv-polaroid{padding:0;}
.hv-polaroid .hv-frame{border-radius:6px;border:14px solid #fff;border-bottom-width:52px;box-shadow:0 22px 44px rgba(90,60,20,.20);transform:rotate(-2.2deg);}
.hv-arch   .hv-frame{border-radius:999px 999px 28px 28px;box-shadow:0 26px 50px rgba(90,60,20,.16);}
.hv-sticker .hv-frame{border-radius:34px;border:8px solid #fff;box-shadow:0 0 0 3px var(--a1),0 24px 46px rgba(90,60,20,.18);}
.hv-tape{padding-top:14px;}
.hv-tape .hv-frame{border-radius:4px;border:10px solid #fff;box-shadow:0 20px 40px rgba(90,60,20,.20);}
.hv-tape::before,.hv-tape::after{content:"";position:absolute;width:98px;height:28px;background:color-mix(in srgb, var(--a1) 34%, #fff);z-index:3;opacity:.85;}
.hv-tape::before{top:-2px;left:8%;transform:rotate(-6deg);}
.hv-tape::after{bottom:-2px;right:8%;transform:rotate(-4deg);}
.hv-none .hv-frame{border-radius:0;}
/* フレーム外の装飾ドット */
.hero-visual .hv-dot{position:absolute;border-radius:50%;z-index:-1;}
.hero-visual .hv-dot.d1{width:120px;height:120px;background:color-mix(in srgb, var(--a2) 30%, transparent);top:-34px;left:-34px;}
.hero-visual .hv-dot.d2{width:88px;height:88px;background:color-mix(in srgb, var(--a1) 32%, transparent);bottom:-26px;right:-22px;}
.p-hero .eyebrow{margin-bottom:24px;}
.p-hero h1{font-family:var(--f-disp);font-weight:var(--fw-disp);font-size:clamp(2.3rem,6vw,4.4rem);line-height:1.32;letter-spacing:-.01em;margin-bottom:22px;}
.p-hero .hero-sub{font-size:1.05rem;color:var(--dim);max-width:560px;line-height:1.9;margin-bottom:30px;}
.hero-cta{display:inline-block;padding:17px 34px;border-radius:var(--pr-btn);background:var(--a1);color:#fff;font-weight:800;font-size:1rem;box-shadow:0 14px 28px color-mix(in srgb, var(--a1) 45%, transparent);transition:transform .25s var(--ease),box-shadow .25s;}
.hero-cta:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 18px 32px color-mix(in srgb, var(--a1) 55%, transparent);}
.hero-meta{display:flex;gap:40px;flex-wrap:wrap;margin-top:36px;padding-top:24px;border-top:2px dashed color-mix(in srgb, var(--paper) 16%, transparent);}
.hero-meta-item .hm-num{font-family:var(--f-disp);font-weight:var(--fw-disp);font-size:2rem;letter-spacing:-.01em;color:var(--a1);}
.hero-meta-item .hm-label{font-family:var(--f-body);font-size:.7rem;font-weight:700;color:var(--mut);letter-spacing:.03em;margin-top:4px;}
.hero-badge{display:inline-flex;align-items:center;gap:8px;margin-top:26px;padding:10px 20px;border-radius:var(--pr-badge);font-size:.82rem;font-weight:800;background:#fff;color:var(--ink,var(--paper));box-shadow:var(--pr-shadow-sm);}
.hero-badge::before{content:"⭐";}
.lm{display:block;overflow:hidden;}
.lm .lm-i{display:block;transform:translateY(112%) scale(.98);transition:transform 1s var(--ease);}
.rv.in .lm .lm-i{transform:none;}
.lm:nth-child(2) .lm-i{transition-delay:.08s}.lm:nth-child(3) .lm-i{transition-delay:.16s}.lm:nth-child(4) .lm-i{transition-delay:.24s}.lm:nth-child(5) .lm-i{transition-delay:.32s}
.fx-nomotion .lm .lm-i{transform:none;transition:none;}

/* ============ MARQUEE — 長方形の無限ループ帯 ============ */
.p-marquee{padding:var(--mq-pad,18px) 0;overflow:hidden;background:var(--mq-custom-bg, var(--a2));color:#fff;margin-bottom:40px;max-width:100%;}
.p-marquee .mq-track{display:flex;flex-wrap:nowrap;width:max-content;gap:0;animation:mq var(--mq-dur,32s) linear infinite;}
.p-marquee.mq-on .mq-track{will-change:transform;}
@keyframes mq{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.mq-track{animation-play-state:paused;}
.p-marquee.mq-on .mq-track{animation-play-state:running;}
.mq-seg{display:flex;align-items:center;flex:0 0 auto;flex-shrink:0;white-space:nowrap;}
.mq-seg span{font-family:var(--f-disp);font-weight:800;font-size:clamp(1rem,2vw,1.3rem);letter-spacing:.01em;padding:0 20px;color:inherit;white-space:nowrap;flex-shrink:0;}
.mq-seg i{font-style:normal;font-size:1rem;opacity:.9;flex-shrink:0;}
.mq-img{display:flex;align-items:center;padding:0 var(--mq-img-gap,14px);flex-shrink:0;}
.mq-img img{width:var(--mq-img-w,44px);height:var(--mq-img-h,44px);object-fit:cover;border-radius:var(--mq-img-radius,50%);
  border:var(--mq-img-border,3px solid rgba(255,255,255,.65));box-shadow:var(--pr-shadow-sm);display:block;}
.p-marquee.mq-photo{padding:0;}
.p-marquee.mq-photo .mq-img{padding:0 var(--mq-img-gap,6px);}
.p-marquee.outline .mq-seg span{color:inherit;-webkit-text-stroke:0;}

/* ============ FEATURED — ピックアップ ============ */
.p-featured{padding-top:var(--pad-y);padding-bottom:calc(var(--pad-y) * .4);}
.feat{position:relative;margin-bottom:32px;cursor:pointer;border-radius:var(--pr-card);overflow:hidden;box-shadow:var(--pr-shadow);transition:transform .35s var(--ease),box-shadow .35s;}
.feat:hover{transform:translateY(-6px);box-shadow:0 22px 40px rgba(90,60,20,.16);}
.feat:last-child{margin-bottom:0;}
.feat .feat-media{transform:scale(1);}
.feat-media{width:100%;aspect-ratio:21/9;background:var(--bg2);overflow:hidden;position:relative;}
.feat-media img,.feat-media video{width:100%;height:110%;object-fit:cover;display:block;}
.feat-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05),transparent 40%,transparent 55%,rgba(20,14,8,.68));pointer-events:none;}
.feat-idx{position:absolute;top:22px;left:26px;font-family:var(--f-body);font-size:.72rem;font-weight:800;color:#fff;background:rgba(255,255,255,.22);padding:5px 14px;border-radius:var(--pr-badge);z-index:2;}
.feat-cap{position:absolute;left:26px;right:26px;bottom:26px;z-index:2;display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;}
.feat-cap .fc-cat{font-family:var(--f-body);font-size:.72rem;font-weight:800;color:#ffe0b0;letter-spacing:.02em;margin-bottom:8px;}
.feat-cap h3{font-family:var(--f-disp);font-weight:var(--fw-disp);font-size:clamp(1.4rem,3vw,2.1rem);color:#fff;line-height:1.25;}
.feat-cap .fc-client{color:rgba(255,255,255,.82);font-size:.84rem;margin-top:6px;}
.feat-cap .fc-view{font-family:var(--f-body);font-size:.76rem;font-weight:800;color:#3a2e22;letter-spacing:.01em;padding:10px 20px;border-radius:var(--pr-btn);text-transform:none;flex-shrink:0;background:#fff;transition:all .25s;}
.feat:hover .fc-view{background:var(--a1);color:#fff;}

/* ============ WORKS — わんこカード ============ */
.p-works{padding-top:var(--pad-y);padding-bottom:var(--pad-y);}
.reel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:26px;background:none;}
.frame-card{background:#fff;position:relative;cursor:pointer;overflow:hidden;border-radius:var(--pr-card);box-shadow:var(--pr-shadow-sm);border:var(--pr-border);transition:transform .3s var(--ease);}
.frame-card:hover{transform:translateY(-6px) rotate(-.6deg);}
.reel-grid:hover .frame-card:not(:hover),.reel-alt:hover .alt-row:not(:hover){opacity:1;}
.frame-info h3::after{content:"🐾";display:inline-block;margin-left:8px;font-size:.8em;opacity:0;transform:translateX(-6px);transition:opacity .3s,transform .3s;}
.frame-card:hover .frame-info h3::after,.alt-row:hover .alt-info h3::after{opacity:1;transform:none;}
.frame-media{width:100%;aspect-ratio:4/3;background:var(--bg2);position:relative;overflow:hidden;}
.frame-media img,.frame-media video{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease);backface-visibility:hidden;}
.frame-card:hover .frame-media img,.frame-card:hover .frame-media video{transform:scale(1.06);}
.frame-info{padding:18px 20px 22px;}
.frame-info .fi-cat{font-family:var(--f-body);font-size:.7rem;font-weight:800;color:var(--a2);letter-spacing:.01em;margin-bottom:6px;}
.frame-info h3{font-family:var(--f-disp);font-weight:800;font-size:1.12rem;margin-bottom:6px;}
.frame-info .fi-client{font-size:.8rem;color:var(--mut);margin-bottom:12px;}
.frame-tags{display:flex;flex-wrap:wrap;gap:6px;}
.frame-tags span{font-family:var(--f-body);font-size:.7rem;font-weight:700;color:var(--a2);background:color-mix(in srgb, var(--a2) 12%, transparent);padding:4px 12px;border-radius:var(--pr-chip);}
/* stack variant */
.reel-grid.layout-stack{grid-template-columns:1fr;max-width:820px;margin:0 auto;gap:26px;}
.reel-grid.layout-stack .frame-media{aspect-ratio:16/9;}
.reel-grid.layout-stack .frame-info h3{font-size:1.4rem;}
/* alternating editorial variant */
.reel-alt{display:flex;flex-direction:column;gap:56px;}
.alt-row{display:grid;grid-template-columns:52% 1fr;gap:36px;align-items:center;cursor:pointer;}
.alt-row.rev{grid-template-columns:1fr 52%;}
.alt-row.rev .alt-media{order:2;}
.alt-media{aspect-ratio:4/3;overflow:hidden;position:relative;background:var(--bg2);border-radius:var(--pr-card);box-shadow:var(--pr-shadow-sm);}
.alt-media img,.alt-media video{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease);}
.alt-row:hover .alt-media img,.alt-row:hover .alt-media video{transform:scale(1.05);}
.alt-media::after{display:none;}
.alt-info{position:relative;}
.alt-info .fi-cat{font-family:var(--f-body);font-size:.7rem;font-weight:800;color:var(--a2);letter-spacing:.01em;margin-bottom:10px;}
.alt-info h3{font-family:var(--f-disp);font-weight:800;font-size:clamp(1.3rem,2.4vw,1.9rem);margin-bottom:10px;line-height:1.3;}
.alt-info .fi-client{font-size:.84rem;color:var(--mut);margin-bottom:12px;}
.alt-info .ai-desc{font-size:.88rem;color:var(--dim);line-height:1.9;margin-bottom:14px;max-width:46ch;}

/* ============ STATEMENT ============ */
.p-statement{padding-top:calc(var(--pad-y) * .8);padding-bottom:calc(var(--pad-y) * .8);}
.p-statement .st-in{max-width:900px;margin:0 auto;background:var(--bg2);border-radius:36px;padding:clamp(40px,5vw,68px) clamp(28px,5vw,72px);text-align:center;position:relative;overflow:hidden;}
.p-statement .st-in::before{content:"";position:absolute;width:220px;height:220px;border-radius:50%;background:color-mix(in srgb, var(--a1) 18%, transparent);top:-90px;left:-70px;}
.p-statement .st-in::after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;background:color-mix(in srgb, var(--a2) 18%, transparent);bottom:-80px;right:-60px;}
.p-statement .eyebrow{margin-bottom:26px;position:relative;z-index:1;}
.p-statement p.st-text{font-family:var(--f-disp);font-weight:800;font-size:clamp(1.5rem,3.4vw,2.5rem);line-height:1.55;letter-spacing:-.005em;position:relative;z-index:1;}
.p-statement .st-note{margin-top:26px;color:var(--dim);font-size:.92rem;line-height:2;max-width:60ch;margin-left:auto;margin-right:auto;position:relative;z-index:1;}
.p-statement.has-image .st-split{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:44% 1fr;gap:44px;align-items:center;}
.p-statement.has-image .st-split-media{aspect-ratio:4/3;border-radius:var(--pr-card);overflow:hidden;box-shadow:var(--pr-shadow);}
.p-statement.has-image .st-split-media img{width:100%;height:100%;object-fit:cover;}
.p-statement.has-image .st-in{background:none;border-radius:0;padding:0;text-align:left;}
.p-statement.has-image .st-in::before,.p-statement.has-image .st-in::after{display:none;}
.p-statement.has-image .eyebrow{justify-content:flex-start;}
.p-statement.has-image .st-note{margin-left:0;margin-right:0;}

/* ============ SERVICES（ながれ）— 番号バッジのステップ ============ */
.p-services{padding-top:var(--pad-y);padding-bottom:var(--pad-y);}
.svc-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px;}
.svc{background:#fff;border-radius:var(--pr-card);padding:32px 26px;text-align:center;box-shadow:var(--pr-shadow-sm);border:var(--pr-border);transition:transform .3s var(--ease);}
.svc:hover{transform:translateY(-6px);}
.svc .sv-num{width:48px;height:48px;border-radius:50%;background:var(--a1);color:#fff;font-family:var(--f-disp);font-weight:800;display:flex;align-items:center;justify-content:center;margin:0 auto 18px;font-size:1.1rem;overflow:hidden;}
.svc .sv-num img{width:100%;height:100%;object-fit:cover;}
.svc h3{font-family:var(--f-disp);font-weight:800;font-size:1.08rem;margin-bottom:10px;}
.svc p{font-size:.86rem;color:var(--dim);line-height:1.8;}

/* ============ TEAM（支援方法）============ */
.p-team{padding-top:var(--pad-y);padding-bottom:var(--pad-y);}
.team-intro{max-width:640px;margin:0 auto 48px;font-size:1rem;color:var(--dim);line-height:2;text-align:center;}
.team-banner{max-width:1000px;margin:0 auto 48px;aspect-ratio:21/9;border-radius:var(--pr-card);overflow:hidden;box-shadow:var(--pr-shadow);}
.team-banner img{width:100%;height:100%;object-fit:cover;}
.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;}
.team-member{background:#fff;border-radius:var(--pr-card);padding:26px 24px;display:flex;flex-direction:column;gap:6px;box-shadow:var(--pr-shadow-sm);border:var(--pr-border);position:relative;padding-left:76px;min-height:64px;transition:transform .3s var(--ease);}
.team-member:hover{transform:translateY(-4px);}
.team-member::before{content:"🐾";position:absolute;left:22px;top:26px;width:38px;height:38px;border-radius:50%;background:color-mix(in srgb, var(--a2) 16%, transparent);display:flex;align-items:center;justify-content:center;font-size:1.1rem;}
.team-member.has-icon::before{display:none;}
.team-member .tm-icon{position:absolute;left:22px;top:26px;width:38px;height:38px;border-radius:50%;object-fit:cover;}
.team-member .tm-name{font-family:var(--f-disp);font-weight:800;font-size:1.05rem;}
.team-member .tm-role{font-family:var(--f-body);font-size:.74rem;font-weight:700;color:var(--a2);}
.team-member .tm-note{font-size:.82rem;color:var(--mut);line-height:1.7;margin-top:2px;}

/* ============ SOCIAL — SNS投稿スライダー ============ */
.p-social{padding-top:var(--pad-y);padding-bottom:var(--pad-y);}
.hint-empty{text-align:center;color:var(--mut);font-size:.86rem;padding:36px 0;border:2px dashed color-mix(in srgb, var(--paper) 14%, transparent);border-radius:var(--pr-card);}
.sp-wrap{position:relative;}
.sp-rail{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 2px 18px;scrollbar-width:none;-ms-overflow-style:none;}
.sp-rail::-webkit-scrollbar{display:none;}
.sp-card{flex:0 0 clamp(230px,26vw,310px);scroll-snap-align:start;background:#fff;border-radius:var(--pr-card);overflow:hidden;
  box-shadow:var(--pr-shadow-sm);border:var(--pr-border);text-decoration:none;color:inherit;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);position:relative;}
.sp-card.is-link{cursor:pointer;}
.sp-card.is-link:hover{transform:translateY(-6px);box-shadow:var(--pr-shadow);}
.sp-media{position:relative;width:100%;aspect-ratio:1;overflow:hidden;background:var(--bg2);}
.sp-square .sp-media{aspect-ratio:1;}
.sp-portrait .sp-media{aspect-ratio:4/5;}
.sp-wide .sp-media{aspect-ratio:16/9;}
.sp-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease);}
.sp-card.is-link:hover .sp-media img{transform:scale(1.06);}
.sp-go{position:absolute;right:12px;bottom:12px;background:rgba(255,255,255,.94);color:#3a2e22;font-size:.7rem;font-weight:800;
  padding:6px 14px;border-radius:var(--pr-badge);opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s;box-shadow:var(--pr-shadow-sm);}
.sp-card.is-link:hover .sp-go{opacity:1;transform:none;}
.sp-info{padding:14px 16px 18px;}
.sp-info .sp-date{font-size:.68rem;font-weight:700;color:var(--mut);margin-bottom:5px;}
.sp-info p{font-size:.82rem;color:var(--dim);line-height:1.75;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.sp-arrow{position:absolute;top:calc(50% - 30px);transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:none;cursor:pointer;
  background:#fff;color:#3a2e22;font-size:1.5rem;line-height:1;display:flex;align-items:center;justify-content:center;
  box-shadow:var(--pr-shadow);z-index:3;transition:transform .2s,background .2s;}
.sp-arrow:hover{background:var(--a1);color:#fff;transform:translateY(-50%) scale(1.08);}
.sp-arrow.prev{left:-16px;}
.sp-arrow.next{right:-16px;}
.sp-loading{flex:1;min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  color:var(--mut);font-size:.84rem;text-align:center;padding:30px;
  border:2px dashed color-mix(in srgb, var(--paper) 14%, transparent);border-radius:var(--pr-card);width:100%;}
.sp-loading small{font-size:.72rem;opacity:.8;}
.sp-follow{text-align:center;margin-top:8px;}
.sp-follow a{display:inline-block;font-weight:800;font-size:.86rem;color:var(--a1);text-decoration:none;padding:12px 26px;border-radius:var(--pr-btn);
  border:2px solid color-mix(in srgb, var(--a1) 40%, transparent);transition:all .25s;}
.sp-follow a:hover{background:var(--a1);color:#fff;border-color:var(--a1);}
@media(max-width:640px){
  .sp-arrow{display:none;}
  .sp-card{flex-basis:78vw;}
}

/* ============ GALLERY — フォトギャラリー ============ */
.p-gallery{padding-top:var(--pad-y);padding-bottom:var(--pad-y);}
.gl-grid{display:grid;gap:16px;}
.gl-masonry{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));grid-auto-rows:12px;}
.gl-masonry .gl-cell:nth-child(3n+1){grid-row:span 22;}
.gl-masonry .gl-cell:nth-child(3n+2){grid-row:span 17;}
.gl-masonry .gl-cell:nth-child(3n){grid-row:span 26;}
.gl-even{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));}
.gl-even .gl-cell{aspect-ratio:1;}
.gl-wide{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));}
.gl-wide .gl-cell{aspect-ratio:16/10;}
.gl-cell{position:relative;overflow:hidden;border-radius:var(--pr-card);background:var(--bg2);box-shadow:var(--pr-shadow-sm);
  text-decoration:none;color:inherit;transition:transform .3s var(--ease),box-shadow .3s var(--ease);}
.gl-cell img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease);}
.gl-cell.is-link{cursor:pointer;}
.gl-cell.is-link:hover{transform:translateY(-5px);box-shadow:var(--pr-shadow);}
.gl-cell.is-link:hover img{transform:scale(1.06);}
.gl-cap{position:absolute;left:0;right:0;bottom:0;padding:22px 14px 12px;color:#fff;font-size:.78rem;font-weight:700;
  background:linear-gradient(180deg,transparent,rgba(20,14,8,.62));}
.gl-go{position:absolute;top:12px;right:12px;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.92);color:#3a2e22;
  display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:800;opacity:0;transform:scale(.8);transition:all .25s;}
.gl-cell.is-link:hover .gl-go{opacity:1;transform:none;}

/* ============ CUSTOM 自由ブロック ============ */
.p-custom{padding-top:calc(var(--pad-y) * .9);padding-bottom:calc(var(--pad-y) * .9);}
.p-custom .cu-in{max-width:760px;margin:0 auto;}
.p-custom .cu-media{position:relative;display:block;aspect-ratio:16/9;border-radius:var(--pr-card);overflow:hidden;margin-bottom:28px;box-shadow:var(--pr-shadow);}
.p-custom .cu-media img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease);}
.p-custom .cu-media.is-link{cursor:pointer;text-decoration:none;transition:transform .3s var(--ease),box-shadow .3s var(--ease);}
.p-custom .cu-media.is-link::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(20,14,8,.45));opacity:0;transition:opacity .3s;}
.p-custom .cu-media.is-link:hover{transform:translateY(-5px);box-shadow:0 22px 42px rgba(90,60,20,.2);}
.p-custom .cu-media.is-link:hover::after{opacity:1;}
.p-custom .cu-media.is-link:hover img{transform:scale(1.05);}
.cu-go{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.9);z-index:2;background:#fff;color:#3a2e22;
  font-size:.86rem;font-weight:800;padding:14px 28px;border-radius:var(--pr-btn);box-shadow:var(--pr-shadow);
  opacity:0;transition:opacity .3s var(--ease),transform .3s var(--ease);white-space:nowrap;}
.p-custom .cu-media.is-link:hover .cu-go{opacity:1;transform:translate(-50%,-50%) scale(1);}
.p-custom h2.cu-ttl{font-family:var(--f-disp);font-weight:800;font-size:clamp(1.4rem,2.6vw,2rem);margin-bottom:24px;text-align:center;}
.p-custom .cu-body{font-size:.94rem;color:var(--dim);line-height:2;white-space:pre-line;}

/* ============ CONTACT ============ */
.p-contact{padding-top:0;padding-bottom:var(--pad-y);text-align:center;}
.p-contact > *{position:relative;z-index:1;}
.p-contact{background:none;}
.p-contact-inner{background:linear-gradient(155deg,var(--a2) 0%, color-mix(in srgb, var(--a2) 70%, var(--a1)) 100%);border-radius:40px;padding:clamp(46px,5vw,72px) clamp(28px,5vw,64px);max-width:1000px;margin:0 auto;color:#fff;position:relative;overflow:hidden;}
.p-contact-inner.has-image{background-size:cover;background-position:center;}
.p-contact-inner.has-image::after{content:"";position:absolute;inset:0;background:linear-gradient(155deg, rgba(30,20,10,.55) 0%, rgba(30,20,10,.72) 100%);z-index:0;}
.p-contact-inner::before{content:"";position:absolute;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.12);top:-100px;right:-60px;z-index:0;}
.p-contact-inner.text-dark-sec{color:#3a2e22;}
.p-contact-inner.text-dark-sec .ct-sub,.p-contact-inner.text-dark-sec .ct-note{color:rgba(58,46,34,.85);}
.p-contact-inner.text-dark-sec .closing-contact a.ct-mail{background:rgba(58,46,34,.12);color:#3a2e22;}
.p-contact h2{font-family:var(--f-disp);font-weight:var(--fw-disp);font-size:clamp(1.8rem,4.6vw,3rem);margin-bottom:20px;letter-spacing:-.01em;line-height:1.35;position:relative;z-index:1;}
.p-contact .ct-sub{color:rgba(255,255,255,.92);font-size:.98rem;margin-bottom:36px;position:relative;z-index:1;}
.closing-contact{display:flex;gap:24px;justify-content:center;flex-wrap:wrap;align-items:center;position:relative;z-index:1;}
.closing-contact a.ct-mail{font-family:var(--f-disp);font-weight:800;font-size:clamp(1.1rem,2.6vw,1.5rem);color:#fff;background:rgba(255,255,255,.18);padding:14px 30px;border-radius:var(--pr-btn);border-bottom:none;transition:all .25s;}
.closing-contact a.ct-mail:hover{background:#fff;color:var(--a2);}
.closing-contact a{color:#fff;text-decoration:none;}
.closing-contact .ct-tel{color:rgba(255,255,255,.9);font-weight:700;}
.ct-note{margin-top:28px;font-size:.8rem;color:rgba(255,255,255,.85);line-height:1.8;position:relative;z-index:1;}

/* ============ 下層ページ（固定ページ・投稿・404） ============ */
.sub-page{min-height:70vh;}
.sub-page-in{padding-top:calc(var(--pad-y) * .7);padding-bottom:var(--pad-y);max-width:820px;margin:0 auto;}
.sub-page-title{font-family:var(--f-disp);font-weight:var(--fw-disp);font-size:clamp(1.6rem,4vw,2.4rem);
  line-height:1.4;margin-bottom:18px;}
.sub-page-meta{font-size:.8rem;color:var(--mut);margin-bottom:26px;}
.sub-page-body{font-size:1rem;line-height:2;color:var(--dim);}
.sub-page-body h2{font-family:var(--f-disp);font-size:1.4rem;margin:36px 0 14px;color:var(--paper);}
.sub-page-body h3{font-family:var(--f-disp);font-size:1.15rem;margin:28px 0 10px;color:var(--paper);}
.sub-page-body p{margin-bottom:18px;}
.sub-page-body ul,.sub-page-body ol{margin:0 0 18px 1.4em;}
.sub-page-body li{margin-bottom:8px;}
.sub-page-body img{max-width:100%;height:auto;border-radius:var(--pr-card);margin:12px 0;}
.sub-page-body a{color:var(--a1);text-decoration:underline;}
.sub-page-body table{width:100%;border-collapse:collapse;margin-bottom:18px;}
.sub-page-body th,.sub-page-body td{border:1px solid var(--line);padding:10px 12px;text-align:left;}
.sub-page-body blockquote{border-left:4px solid var(--a1);padding-left:16px;margin:0 0 18px;color:var(--mut);}
.sub-page-back{margin-top:46px;}
.sub-page-back a{display:inline-block;font-weight:700;color:var(--a1);text-decoration:none;
  padding:12px 24px;border-radius:var(--pr-btn);border:2px solid color-mix(in srgb, var(--a1) 40%, transparent);transition:all .25s;}
.sub-page-back a:hover{background:var(--a1);color:#fff;}

/* ============ FOOTER ============ */
.pfoot{--side:max(var(--gut,6vw), calc((100% - var(--content-max,1180px)) / 2));padding:30px var(--side);display:flex;justify-content:space-between;gap:14px;font-family:var(--f-body);font-size:.76rem;font-weight:600;color:var(--mut);flex-wrap:wrap;}
.pfoot a{color:var(--mut);text-decoration:none;transition:color .3s;}
.pfoot a:hover{color:var(--a1);}

/* ============ INTRO（書き出しHTMLのみ・任意） ============ */
#intro{position:fixed;inset:0;background:var(--intro-bg,var(--bg));color:var(--intro-fg,var(--paper));z-index:6000;display:none;overflow:hidden;}
body.standalone #intro{display:block;}
#intro .intro-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:0 8vw;z-index:2;}
#intro .intro-name{font-family:var(--f-disp);font-weight:var(--fw-disp);font-size:clamp(1.9rem,6vw,4rem);letter-spacing:-.01em;line-height:1.2;display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center;}
#intro .intro-logo{height:clamp(46px,7vw,86px);width:auto;object-fit:contain;}
#intro .intro-sub{font-family:var(--f-body);font-size:.84rem;font-weight:700;letter-spacing:.08em;opacity:.7;}

/* counter：上下に情報、中央に名前（従来） */
#intro.intro-counter{display:none;flex-direction:column;justify-content:space-between;padding:4vh 6vw 5vh;}
body.standalone #intro.intro-counter{display:flex;}
#intro.intro-counter .intro-top,#intro.intro-counter .intro-bot{display:flex;justify-content:space-between;gap:14px;font-family:var(--f-body);font-size:.76rem;font-weight:700;letter-spacing:.02em;opacity:.6;}
#intro.intro-counter .intro-mark{font-size:1.1rem;}
#intro.intro-counter .intro-name{align-self:center;}
#intro.intro-counter .intro-ct{color:var(--a1);font-weight:800;opacity:1;}
#intro.intro-counter.done{transform:translateY(-101%);transition:transform .9s var(--ease);}

/* fade：ふわっと消える */
#intro.intro-fade .intro-name{animation:introPop .9s var(--ease) both;}
#intro.intro-fade.done{opacity:0;transform:scale(1.04);transition:opacity .8s var(--ease),transform .8s var(--ease);}
@keyframes introPop{from{opacity:0;transform:translateY(16px) scale(.96);}to{opacity:1;transform:none;}}

/* slide：下から上へ抜ける */
#intro.intro-slide .intro-name{animation:introPop .8s var(--ease) both;}
#intro.intro-slide.done{transform:translateY(-101%);transition:transform .85s cubic-bezier(.75,0,.2,1);}

/* curtain：上下のパネルが開く */
#intro.intro-curtain .intro-panel{position:absolute;left:0;right:0;height:50%;background:var(--intro-bg,var(--bg));z-index:1;transition:transform .85s cubic-bezier(.75,0,.2,1);}
#intro.intro-curtain .intro-panel.p1{top:0;}
#intro.intro-curtain .intro-panel.p2{bottom:0;}
#intro.intro-curtain .intro-name{animation:introPop .8s var(--ease) both;}
#intro.intro-curtain.done{background:transparent;pointer-events:none;}
#intro.intro-curtain.done .intro-panel.p1{transform:translateY(-100%);}
#intro.intro-curtain.done .intro-panel.p2{transform:translateY(100%);}
#intro.intro-curtain.done .intro-center{opacity:0;transition:opacity .35s;}

/* circle：円が広がって消える */
#intro.intro-circle{background:transparent;}
#intro.intro-circle .intro-circle{position:absolute;top:50%;left:50%;width:300vmax;height:300vmax;border-radius:50%;
  background:var(--intro-bg,var(--bg));transform:translate(-50%,-50%) scale(1);transition:transform .95s cubic-bezier(.7,0,.2,1);z-index:1;}
#intro.intro-circle .intro-name{animation:introPop .8s var(--ease) both;}
#intro.intro-circle.done .intro-circle{transform:translate(-50%,-50%) scale(0);}
#intro.intro-circle.done .intro-center{opacity:0;transition:opacity .4s;}

/* paw：肉球が順番に出てくる */
#intro.intro-paw .intro-paws{display:flex;gap:14px;margin-bottom:6px;}
#intro.intro-paw .ip{font-size:clamp(1.4rem,3vw,2.2rem);opacity:0;display:inline-block;
  animation:pawIn .5s var(--ease) forwards;animation-delay:calc(var(--i) * .13s);}
#intro.intro-paw .ip:nth-child(even){transform:translateY(10px);}
@keyframes pawIn{from{opacity:0;transform:translateY(14px) rotate(-18deg) scale(.7);}to{opacity:1;transform:none;}}
#intro.intro-paw .intro-name{animation:introPop .7s var(--ease) both;animation-delay:.5s;}
#intro.intro-paw.done{opacity:0;transform:scale(1.03);transition:opacity .8s var(--ease),transform .8s var(--ease);}

/* ============ LIGHTBOX ============ */
.lightbox{position:fixed;inset:0;background:rgba(30,22,14,.72);z-index:2000;display:none;align-items:center;justify-content:center;padding:5vw;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);}
.lightbox.show{display:flex;}
.lightbox-inner{max-width:1000px;width:100%;background:var(--bg);border-radius:28px;padding:20px;box-shadow:0 30px 60px rgba(0,0,0,.3);}
.lightbox-media{width:100%;aspect-ratio:4/3;max-height:62vh;background:var(--bg2);border-radius:18px;overflow:hidden;}
.lightbox-media img,.lightbox-media video,.lightbox-media iframe{width:100%;height:100%;object-fit:contain;border:none;}
.lightbox-meta{display:flex;justify-content:space-between;align-items:flex-start;margin-top:18px;flex-wrap:wrap;gap:12px;padding:0 6px;}
.lightbox-meta h3{font-family:var(--f-disp);font-size:1.2rem;font-weight:800;margin-bottom:6px;}
.lightbox-meta .lm-client{color:var(--mut);font-size:.84rem;}
.lightbox-desc{margin-top:12px;color:var(--dim);line-height:1.9;font-size:.88rem;max-width:72ch;padding:0 6px;}
.lb-thumbs{display:flex;gap:8px;margin-top:12px;padding:0 6px;overflow-x:auto;}
.lb-thumbs:empty{display:none;}
.lb-thumb{width:64px;height:64px;flex-shrink:0;border-radius:14px;overflow:hidden;border:2px solid transparent;background:var(--bg2);cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;transition:border-color .2s,transform .2s;}
.lb-thumb img{width:100%;height:100%;object-fit:cover;}
.lb-thumb:hover{transform:translateY(-2px);}
.lb-thumb.active{border-color:var(--a1);}
.lb-thumb-vid{font-size:1rem;color:var(--a1);}
.lightbox-meta .frame-tags,.lightbox-inner > .frame-tags{padding:0 6px;margin-top:12px;}
.lb-right{flex-shrink:0;}
.lb-actions{padding:0 6px;margin-top:20px;}
.lb-actions:empty{display:none;}
.lb-cta{display:inline-block;background:var(--a1);color:#fff;font-weight:800;font-size:.9rem;padding:14px 28px;border-radius:var(--pr-btn);text-decoration:none;box-shadow:0 10px 22px color-mix(in srgb, var(--a1) 40%, transparent);transition:transform .25s var(--ease);}
.lb-cta:hover{transform:translateY(-3px);}
.lb-empty{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--mut);font-size:1.8rem;}
.lb-empty span{font-size:.78rem;font-weight:700;}
.lightbox-close{position:fixed;top:26px;right:5vw;background:#fff;border:none;color:#3a2e22;width:42px;height:42px;border-radius:50%;cursor:pointer;font-size:1rem;display:flex;align-items:center;justify-content:center;transition:all .2s;z-index:2001;box-shadow:var(--pr-shadow-sm);}
.lightbox-close:hover{background:var(--a1);color:#fff;}

/* ============ REVEAL animation ============ */
.rv{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .8s var(--ease);}
.rv.in{opacity:1;transform:none;}
.fx-nomotion .rv{opacity:1;transform:none;transition:none;}
.fx-nomotion .mq-track{animation:none;}

/* ============ CURSOR follower ============ */
#cur{position:fixed;top:0;left:0;width:var(--cur-size,26px);height:var(--cur-size,26px);pointer-events:none;z-index:3000;
  transform:translate3d(0,0,0) translate(-50%,-50%);transition:width .3s var(--ease),height .3s var(--ease);display:none;
  will-change:transform;contain:layout style paint;}
#cur .cur-shape{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--cur-color,var(--a1));transition:transform .3s var(--ease);}
#cur .cur-shape svg{width:100%;height:100%;display:block;fill:currentColor;filter:drop-shadow(0 2px 5px rgba(0,0,0,.18));}
#cur .cur-t{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--f-body);font-weight:800;font-size:.66rem;color:#fff;opacity:0;transition:opacity .2s;z-index:2;}
#cur.big{width:calc(var(--cur-size,26px) * 2.6);height:calc(var(--cur-size,26px) * 2.6);}
#cur.big .cur-shape{transform:rotate(-10deg);}
#cur.big .cur-t{opacity:1;text-shadow:0 1px 3px rgba(0,0,0,.35);}
/* ドット型は塗りの円 */
#cur.cur-dot .cur-shape{background:var(--cur-color,var(--a1));border-radius:50%;box-shadow:0 0 0 4px color-mix(in srgb, var(--cur-color,var(--a1)) 20%, transparent);}
#cur.cur-dot.big .cur-shape{box-shadow:none;}
/* リング型 */
#cur.cur-ring .cur-shape{border:2px solid var(--cur-color,var(--a1));border-radius:50%;}
@media(hover:hover) and (pointer:fine){ .fx-cursor #cur{display:block;} .fx-cursor .feat,.fx-cursor .frame-card,.fx-cursor .alt-row{cursor:none;} }



/* ============ SITE RESPONSIVE ============ */
@media(max-width:920px){
  .p-hero{min-height:74vh;min-height:74svh;}
  .p-hero.split,.p-hero.split-left,.p-hero.split-right{grid-template-columns:1fr;gap:34px;}
  .p-hero.split-left .hero-in,.p-hero.split-right .hero-in{order:1;}
  .p-hero.split-left .hero-visual,.p-hero.split-right .hero-visual{order:2;}
  .p-statement.has-image .st-split{grid-template-columns:1fr;gap:26px;}
  .hv-polaroid .hv-frame{transform:none;}
  .p-featured,.p-works,.p-services,.p-team,.p-custom{padding-top:70px;padding-bottom:70px;}
  .alt-row,.alt-row.rev{grid-template-columns:1fr;gap:22px;}
  .alt-row.rev .alt-media{order:0;}
  .feat-media{aspect-ratio:16/9;}
}
@media(max-width:820px){
  .pn-burger{display:flex;}
  .pnav,.pnav.nav-center{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;}
  .pnav .pn-right{order:3;width:100%;max-height:0;overflow:hidden;flex-direction:column;align-items:stretch;gap:6px;transition:max-height .3s var(--ease);}
  .pnav.nav-open .pn-right{max-height:70vh;padding-top:10px;}
  .pnav .pn-links{flex-direction:column;align-items:stretch;gap:2px;}
  .pnav .pn-links a{padding:12px 14px;border-radius:14px;}
  .pn-cta{text-align:center;margin-top:6px;}
  .pnav.nav-open .pn-burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .pnav.nav-open .pn-burger span:nth-child(2){opacity:0;}
  .pnav.nav-open .pn-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
}
@media(max-width:640px){
  .pnav{padding:12px 5vw;}
  .p-hero{padding:70px 6vw 56px;}
  .hero-meta{gap:24px;}
  .reel-grid{grid-template-columns:1fr;}
  .p-statement .st-in{padding:44px 7vw;border-radius:28px;}
  .p-contact-inner{padding:50px 7vw;border-radius:28px;}
  .sec-head{margin-bottom:36px;}
  .closing-contact{flex-direction:column;gap:14px;align-items:center;}
  .pfoot{flex-direction:column;gap:6px;text-align:center;}
  .lightbox{padding:12px;}
  .lightbox-close{top:10px;right:12px;}
  .lightbox-meta h3{font-size:1.05rem;}
}
@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important;}
  .rv{opacity:1 !important;transform:none !important;}
  .lm .lm-i{transform:none !important;}
  .feat .feat-media{transform:none !important;}
  #intro{display:none !important;}
}