/* * Pocket Insight v1.1.0 — стили темы. * * Полный перенос утверждённого прототипа (pocket-editorial-preview-v5-2): * дизайн-система, все 10 цветовых схем (светлая и тёмная), разметка всех видов. * Схема задаётся атрибутом data-style на , режим — data-theme. * Ниже — локальные шрифты, затем CSS прототипа без изменений, * затем «мост» для разметки, которую генерирует сам WordPress. */ /* ---------- Локальные шрифты (Zodiak + Satoshi, как в прототипе) ---------- */ @font-face{font-family:'Zodiak';src:url('../fonts/zodiak-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap} @font-face{font-family:'Zodiak';src:url('../fonts/zodiak-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap} @font-face{font-family:'Satoshi';src:url('../fonts/satoshi-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap} @font-face{font-family:'Satoshi';src:url('../fonts/satoshi-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap} @font-face{font-family:'Satoshi';src:url('../fonts/satoshi-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap} /* Art direction: premium financial editorial — content-led blog, calm and precise. Typography: Zodiak for display, Satoshi for reading/UI. Density: magazine index + blog archive. */ :root{ --font-display:'Zodiak',Georgia,serif;--font-body:'Satoshi',Arial,sans-serif; --text-xs:clamp(.75rem,.72rem + .16vw,.875rem);--text-sm:clamp(.875rem,.83rem + .22vw,1rem);--text-base:clamp(1rem,.97rem + .16vw,1.1rem);--text-lg:clamp(1.15rem,1.05rem + .45vw,1.45rem);--text-xl:clamp(1.55rem,1.27rem + 1.1vw,2.3rem);--text-2xl:clamp(2.15rem,1.48rem + 2.7vw,4rem);--text-hero:clamp(2.65rem,1.45rem + 4.7vw,6.2rem); --s1:.25rem;--s2:.5rem;--s3:.75rem;--s4:1rem;--s5:1.25rem;--s6:1.5rem;--s8:2rem;--s10:2.5rem;--s12:3rem;--s16:4rem;--s20:5rem;--s24:6rem;--s32:8rem; --r-sm:.35rem;--r-md:.75rem;--r-lg:1.15rem;--max:1240px;--ease:180ms cubic-bezier(.16,1,.3,1); } /* Every scheme has independently tuned light and dark semantic colors. */ [data-style=terminal][data-theme=light]{--hover:#0a6e8c;--bg:#f1f5f2;--surface:#fff;--surface-2:#e6eee9;--ink:#13221c;--muted:#53645c;--accent:#087b60;--accent-hover:#075f4b;--soft:#d6ebe3;--on:#fff;--hero-bg:#10251d;--hero-ink:#f0faf5;--hero-muted:#b8d1c6} [data-style=terminal][data-theme=dark]{--hover:#6db8d8;--bg:#0e1612;--surface:#16211c;--surface-2:#202e27;--ink:#e4eee9;--muted:#a9b9b1;--accent:#58d0a6;--accent-hover:#79e0bc;--soft:#173d30;--on:#082118;--hero-bg:#d9f3e7;--hero-ink:#10261d;--hero-muted:#48665a} [data-style=paper][data-theme=light]{--hover:#8a6d1c;--bg:#f4efe3;--surface:#fffdf7;--surface-2:#e9dfcd;--ink:#282017;--muted:#665c4d;--accent:#944922;--accent-hover:#713416;--soft:#eedacc;--on:#fff;--hero-bg:#35261c;--hero-ink:#fff8ea;--hero-muted:#dbc8ae} [data-style=paper][data-theme=dark]{--hover:#e0b45c;--bg:#17130f;--surface:#211b15;--surface-2:#30261d;--ink:#eee4d5;--muted:#b9aa97;--accent:#e5986c;--accent-hover:#f0b18b;--soft:#4a2d20;--on:#2a1208;--hero-bg:#f0e1c7;--hero-ink:#2a2016;--hero-muted:#695943} [data-style=midnight][data-theme=light]{--hover:#2f6b9e;--bg:#eef1f5;--surface:#fff;--surface-2:#dfe5ec;--ink:#0e1a2a;--muted:#536175;--accent:#9a6a08;--accent-hover:#744e04;--soft:#f0e2bd;--on:#fff;--hero-bg:#0b1524;--hero-ink:#f4f6fa;--hero-muted:#b3bece} [data-style=midnight][data-theme=dark]{--hover:#7ba7d9;--bg:#09111d;--surface:#101b2a;--surface-2:#1a293c;--ink:#ebf0f6;--muted:#aab7c7;--accent:#e7bd5d;--accent-hover:#f2ce7b;--soft:#3b321e;--on:#211704;--hero-bg:#e8c875;--hero-ink:#1c1608;--hero-muted:#5e4b1b} [data-style=alpine][data-theme=light]{--hover:#3a6ea5;--bg:#f2f6f4;--surface:#fff;--surface-2:#e1ece7;--ink:#173028;--muted:#536c63;--accent:#176b54;--accent-hover:#0f503d;--soft:#d5e8df;--on:#fff;--hero-bg:#173b31;--hero-ink:#f4faf7;--hero-muted:#bfd4cb} [data-style=alpine][data-theme=dark]{--hover:#7bb3dd;--bg:#101714;--surface:#18221e;--surface-2:#23302a;--ink:#e6eee9;--muted:#aab9b1;--accent:#70c6a6;--accent-hover:#8bd6b9;--soft:#214437;--on:#0b281d;--hero-bg:#d9eee5;--hero-ink:#153328;--hero-muted:#506b60} [data-style=copper][data-theme=light]{--hover:#1f7a72;--bg:#f7f1ec;--surface:#fff;--surface-2:#ede1d8;--ink:#2d211b;--muted:#6c584d;--accent:#a04a23;--accent-hover:#773318;--soft:#eed8ca;--on:#fff;--hero-bg:#3b251b;--hero-ink:#fff7f1;--hero-muted:#ddc3b3} [data-style=copper][data-theme=dark]{--hover:#6fcfc4;--bg:#18120f;--surface:#221a16;--surface-2:#32251f;--ink:#f0e5df;--muted:#bca99f;--accent:#eb9368;--accent-hover:#f3ad89;--soft:#4b2b20;--on:#2d1006;--hero-bg:#efc5ad;--hero-ink:#301c13;--hero-muted:#745040} [data-style=ink][data-theme=light]{--hover:#2b5fd9;--bg:#f4f4f1;--surface:#fff;--surface-2:#e7e7e2;--ink:#111;--muted:#595955;--accent:#111;--accent-hover:#343434;--soft:#deddd7;--on:#fff;--hero-bg:#111;--hero-ink:#fff;--hero-muted:#c4c4c0} [data-style=ink][data-theme=dark]{--hover:#8aa4f0;--bg:#101010;--surface:#181818;--surface-2:#242424;--ink:#ededeb;--muted:#b6b6b1;--accent:#f0f0ec;--accent-hover:#d5d5d0;--soft:#30302e;--on:#151515;--hero-bg:#f0f0ec;--hero-ink:#111;--hero-muted:#555550} [data-style=ocean][data-theme=light]{--hover:#34578c;--bg:#eef5f5;--surface:#fff;--surface-2:#dce9eb;--ink:#10292e;--muted:#4e6870;--accent:#087584;--accent-hover:#005965;--soft:#cfe7e9;--on:#fff;--hero-bg:#0d3540;--hero-ink:#f0fbfc;--hero-muted:#b8d8dc} [data-style=ocean][data-theme=dark]{--hover:#9fb4e8;--bg:#0b1518;--surface:#122125;--surface-2:#1d3035;--ink:#e3eef0;--muted:#a6b8bc;--accent:#58c6d2;--accent-hover:#78d7e0;--soft:#17414a;--on:#06252a;--hero-bg:#cfeff1;--hero-ink:#0c3037;--hero-muted:#4c6c72} [data-style=bordeaux][data-theme=light]{--hover:#b06a1a;--bg:#f7f0f1;--surface:#fffafa;--surface-2:#eddee1;--ink:#32191f;--muted:#705359;--accent:#862d3e;--accent-hover:#641d2b;--soft:#ead3d8;--on:#fff;--hero-bg:#3d1821;--hero-ink:#fff5f6;--hero-muted:#dfbcc4} [data-style=bordeaux][data-theme=dark]{--hover:#e8a45c;--bg:#180f11;--surface:#241719;--surface-2:#342125;--ink:#f0e4e6;--muted:#bda8ac;--accent:#dc7d90;--accent-hover:#ec9aaa;--soft:#4b2630;--on:#2b0c13;--hero-bg:#efcfd5;--hero-ink:#35161d;--hero-muted:#76535b} [data-style=sand][data-theme=light]{--hover:#a3571f;--bg:#f4f0e5;--surface:#fffcf4;--surface-2:#e8dfca;--ink:#302a20;--muted:#686052;--accent:#656e40;--accent-hover:#4b532f;--soft:#e0e3ca;--on:#fff;--hero-bg:#343722;--hero-ink:#fcf9ed;--hero-muted:#d4d2b8} [data-style=sand][data-theme=dark]{--hover:#e8976a;--bg:#15140f;--surface:#201e17;--surface-2:#2e2a20;--ink:#ebe7dc;--muted:#b5ae9e;--accent:#b8c37a;--accent-hover:#ccd68f;--soft:#3e4129;--on:#202408;--hero-bg:#e8e5cc;--hero-ink:#2c2c1d;--hero-muted:#65654c} [data-style=swiss][data-theme=light]{--hover:#14708c;--bg:#f2f2f2;--surface:#fff;--surface-2:#e5e5e5;--ink:#101010;--muted:#585858;--accent:#cf342a;--accent-hover:#a9231b;--soft:#f0d4d1;--on:#fff;--hero-bg:#111;--hero-ink:#fff;--hero-muted:#c5c5c5;--r-sm:0;--r-md:0;--r-lg:0} [data-style=swiss][data-theme=dark]{--hover:#6cc4dd;--bg:#0f0f0f;--surface:#181818;--surface-2:#252525;--ink:#f0f0f0;--muted:#b8b8b8;--accent:#ff7167;--accent-hover:#ff918a;--soft:#4a2421;--on:#2e0906;--hero-bg:#f2f2f2;--hero-ink:#111;--hero-muted:#555;--r-sm:0;--r-md:0;--r-lg:0} *,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-text-size-adjust:none;scroll-padding-top:8rem}body{min-height:100dvh;background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:var(--text-base);line-height:1.65;text-rendering:optimizeLegibility}a{color:inherit;text-decoration:none}button,input,select{font:inherit;color:inherit}button{cursor:pointer}img,svg{display:block;max-width:100%}h1,h2,h3{font-family:var(--font-display);line-height:1.08;text-wrap:balance}p,li{text-wrap:pretty}a,button,input,select{transition:color var(--ease),background var(--ease),border-color var(--ease),box-shadow var(--ease),transform var(--ease)}:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.wrap{width:min(calc(100% - 2rem),var(--max));margin-inline:auto}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip{position:fixed;left:var(--s4);top:-90px;z-index:100;background:var(--accent);color:var(--on);padding:var(--s3) var(--s4)}.skip:focus{top:var(--s4)} .site-header{position:sticky;top:0;z-index:30;border-bottom:1px solid color-mix(in oklab,var(--ink) 13%,transparent);background:color-mix(in oklab,var(--bg) 92%,transparent);backdrop-filter:blur(18px)}.header-main{min-height:78px;display:flex;align-items:center;gap:var(--s5)}.brand{display:flex;align-items:center;gap:var(--s3);font-weight:800;letter-spacing:-.025em}.brand-mark{width:42px;height:42px;color:var(--accent);flex:none}.brand-word small{display:block;color:var(--muted);font-size:var(--text-xs);line-height:1.15;text-transform:uppercase;letter-spacing:.085em;font-weight:700}.main-nav{display:flex;align-items:center;gap:clamp(var(--s4),2vw,var(--s8));margin-left:auto;font-size:var(--text-sm);font-weight:700}.main-nav a{min-height:44px;display:flex;align-items:center;position:relative}.main-nav a:after{content:"";position:absolute;left:0;right:100%;bottom:7px;height:2px;background:var(--accent);transition:right var(--ease)}.main-nav a:hover:after{right:0}.header-actions{display:flex;align-items:center;gap:var(--s2)}.icon-button,.lang-button{height:44px;min-width:44px;border:1px solid color-mix(in oklab,var(--ink) 14%,transparent);background:var(--surface);border-radius:var(--r-sm);display:inline-flex;align-items:center;justify-content:center}.lang-button{padding-inline:var(--s3);font-size:var(--text-sm);font-weight:800}.header-cta{height:44px;display:inline-flex;align-items:center;padding-inline:var(--s5);background:var(--accent);color:var(--on);border-radius:var(--r-sm);font-size:var(--text-sm);font-weight:800}.header-cta:hover{background:var(--accent-hover);transform:translateY(-1px)}.search-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows 260ms cubic-bezier(.16,1,.3,1)}.search-panel.open{grid-template-rows:1fr;border-top:1px solid color-mix(in oklab,var(--ink) 13%,transparent)}.search-inner{overflow:hidden}.search-form{display:flex;gap:var(--s3);padding-block:var(--s5)}.search-form input{flex:1;min-height:48px;border:1px solid color-mix(in oklab,var(--ink) 16%,transparent);background:var(--surface);border-radius:var(--r-sm);padding-inline:var(--s4)} /* ---------- Home: hero ---------- */ .hero{padding-block:clamp(var(--s16),8vw,var(--s32));border-bottom:1px solid color-mix(in oklab,var(--ink) 12%,transparent);overflow:hidden}.hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:clamp(var(--s8),6vw,var(--s20));align-items:center}.eyebrow{color:var(--accent);font-size:var(--text-xs);font-weight:800;text-transform:uppercase;letter-spacing:.12em;margin-bottom:var(--s5)}.hero h1{max-width:15ch;font-size:var(--text-hero);letter-spacing:-.052em}.hero-copy{max-width:57ch;margin-top:var(--s6);color:var(--muted);font-size:var(--text-lg)}.hero-actions{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s8)}.button{min-height:48px;border:1px solid transparent;border-radius:var(--r-sm);padding:var(--s3) var(--s5);display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);font-size:var(--text-sm);font-weight:800}.button.primary{background:var(--accent);color:var(--on)}.button.primary:hover{background:var(--accent-hover);transform:translateY(-2px);box-shadow:0 14px 38px color-mix(in oklab,var(--ink) 15%,transparent)}.button.secondary{border-color:color-mix(in oklab,var(--ink) 15%,transparent);background:var(--surface)}.button.secondary:hover{border-color:var(--accent);color:var(--accent)}.hero-visual{position:relative;min-height:450px;background:var(--hero-bg);color:var(--hero-ink);border-radius:var(--r-lg);padding:var(--s6);overflow:hidden;box-shadow:0 22px 62px color-mix(in oklab,var(--ink) 16%,transparent)}.hero-visual:before{content:"";position:absolute;inset:0;background:linear-gradient(118deg,transparent 52%,color-mix(in oklab,var(--accent) 35%,transparent));opacity:.8}.visual-top{position:relative;display:flex;justify-content:space-between;color:var(--hero-muted);font-size:var(--text-xs);font-weight:800;text-transform:uppercase;letter-spacing:.09em}.visual-grid{position:absolute;inset:82px var(--s6) auto;display:grid;grid-template-columns:repeat(8,1fr);align-items:end;gap:7px;height:36%}.visual-grid i{background:color-mix(in oklab,var(--hero-muted) 45%,transparent);border-radius:4px;height:var(--h)}.visual-main{position:absolute;left:var(--s6);right:var(--s6);bottom:var(--s6)}.signal-line{color:var(--accent)}.signal-line svg{width:100%;height:70px}.signal-line path{fill:none;stroke:currentColor;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}.visual-main strong{display:block;margin-top:var(--s4);font-family:var(--font-display);font-size:var(--text-lg);letter-spacing:-.01em} /* ---------- Ad slots ---------- */ .ad-slot{position:relative;margin-block:clamp(var(--s10),5vw,var(--s16));min-height:210px;background:var(--accent);color:var(--on);border-radius:var(--r-lg);overflow:hidden;box-shadow:0 15px 46px color-mix(in oklab,var(--ink) 12%,transparent);display:block}.ad-slot:after{content:"Рекламная позиция";position:absolute;top:var(--s3);right:var(--s4);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.09em;opacity:.68}.ad-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:none}.ad-slot.has-image .ad-image{display:block}.ad-slot.has-image .ad-fallback{display:none}.ad-fallback{min-height:210px;padding:clamp(var(--s6),4vw,var(--s12));display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s8);align-items:end}.ad-kicker{display:block;margin-bottom:var(--s3);font-size:var(--text-xs);font-weight:800;text-transform:uppercase;letter-spacing:.12em}.ad-fallback h2{max-width:18ch;font-size:var(--text-xl);margin-bottom:var(--s3)}.ad-fallback p{max-width:58ch;opacity:.9}.ad-button{background:var(--on);color:var(--accent);align-self:center;white-space:nowrap} /* ---------- Home: editorial picks ---------- */ .editorial-section{padding-block:clamp(var(--s10),6vw,var(--s20))}.editorial-head{display:flex;justify-content:space-between;align-items:end;gap:var(--s8);padding-bottom:var(--s8);border-bottom:1px solid color-mix(in oklab,var(--ink) 14%,transparent)}.editorial-head h2{font-size:var(--text-2xl);max-width:14ch}.editorial-head>p{max-width:45ch;color:var(--muted);text-align:right}.feature-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(290px,.55fr);gap:var(--s6);padding-top:var(--s8)}.feature-card{display:grid;grid-template-columns:1.05fr .95fr;background:var(--surface);min-height:430px;border:1px solid color-mix(in oklab,var(--ink) 11%,transparent);border-radius:var(--r-lg);overflow:hidden}.feature-art{position:relative;overflow:hidden;background:var(--hero-bg);color:var(--accent);min-height:300px}.chart-grid{position:absolute;inset:0;background-image:linear-gradient(color-mix(in oklab,currentColor 18%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in oklab,currentColor 18%,transparent) 1px,transparent 1px);background-size:42px 42px}.trend{position:absolute;inset:18% 8% 12%;width:84%;height:70%}.feature-content{padding:clamp(var(--s6),4vw,var(--s12));display:flex;flex-direction:column;justify-content:center}.post-meta{display:flex;flex-wrap:wrap;gap:var(--s3);color:var(--muted);font-size:var(--text-xs);font-weight:700}.feature-content h3{font-size:var(--text-xl);margin-block:var(--s4)}.feature-card:hover h3{color:var(--hover,var(--accent))}.feature-content p,.stack-card p,.row-copy p{color:var(--muted)}.text-link{display:inline-flex;align-items:center;gap:var(--s2);margin-top:var(--s6);color:var(--accent);font-size:var(--text-sm);font-weight:800}.text-link:hover{gap:var(--s3)}.stack{display:grid;gap:var(--s6)}.stack-card{position:relative;padding:var(--s6);background:var(--surface);border:1px solid color-mix(in oklab,var(--ink) 11%,transparent);border-radius:var(--r-lg);overflow:hidden}.stack-card .number{position:absolute;right:var(--s4);top:var(--s2);font-family:var(--font-display);font-size:var(--text-xl);color:color-mix(in oklab,var(--ink) 14%,transparent)}.stack-card h3{font-size:var(--text-lg);margin-block:var(--s4) var(--s2)}.stack-card:hover h3{color:var(--hover,var(--accent))} /* ---------- Home: latest rows ---------- */ .latest-title{display:flex;justify-content:space-between;align-items:center;gap:var(--s4);padding-block:clamp(var(--s10),6vw,var(--s16)) var(--s6)}.latest-title h2{font-size:var(--text-xl)}.latest-title a,.archive-more{color:var(--accent);font-size:var(--text-sm);font-weight:800;white-space:nowrap}.latest-title a:hover,.archive-more:hover{text-decoration:underline}.post-list{display:grid;border-top:1px solid color-mix(in oklab,var(--ink) 14%,transparent)}.row-post{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:var(--s5);align-items:center;padding-block:var(--s5);border-bottom:1px solid color-mix(in oklab,var(--ink) 11%,transparent)}.row-post:hover h3{color:var(--hover,var(--accent))}.row-post:hover .row-arrow{color:var(--hover,var(--accent))}.row-index{font-family:var(--font-display);font-size:var(--text-lg);color:var(--muted)}.row-copy .post-meta{margin-bottom:var(--s2)}.row-copy h3{font-size:var(--text-lg)}.row-copy p{margin-top:var(--s2);font-size:var(--text-sm);max-width:64ch}.row-arrow{color:var(--hover,var(--accent));font-size:var(--text-lg);font-weight:800}.pagination{display:flex;justify-content:center;gap:var(--s2);padding-block:var(--s8)}.pagination .page{min-width:44px;min-height:44px;border:1px solid color-mix(in oklab,var(--ink) 16%,transparent);background:var(--surface);border-radius:var(--r-sm);font-weight:800}.pagination .page.active{background:var(--accent);color:var(--on);border-color:transparent}.pagination .page:hover:not(.active){border-color:var(--accent);color:var(--accent)}@media(hover:none){.row-post:active h3{color:var(--hover,var(--accent))}.row-post:active .row-arrow{color:var(--hover,var(--accent))}.arc-card:active{border-color:color-mix(in oklab,var(--hover,var(--accent)) 55%,transparent)}.arc-card:active h3{color:var(--hover,var(--accent))}.feature-card:active h3,.stack-card:active h3{color:var(--hover,var(--accent))}} /* ---------- Archive: Все статьи ---------- */ .wrap.archive{padding-block:clamp(var(--s12),6vw,var(--s24)) clamp(var(--s10),5vw,var(--s16))}.archive-head{padding-bottom:var(--s8);border-bottom:1px solid color-mix(in oklab,var(--ink) 14%,transparent)}.archive-head h1{font-size:var(--text-2xl);max-width:16ch}.archive-head>p{max-width:56ch;margin-top:var(--s4);color:var(--muted)}.archive-tools{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--s4);padding-block:var(--s6)}.archive-count{color:var(--muted);font-size:var(--text-sm);font-weight:700}.arc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5);padding-block:var(--s4) var(--s10)}.arc-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid color-mix(in oklab,var(--ink) 11%,transparent);border-radius:var(--r-lg);overflow:hidden}.arc-card:hover{transform:translateY(-3px);box-shadow:0 16px 42px color-mix(in oklab,var(--ink) 12%,transparent);border-color:color-mix(in oklab,var(--hover,var(--accent)) 55%,transparent)}.arc-card:hover h3{color:var(--hover,var(--accent))}.arc-card:hover .arc-art{color:var(--hover,var(--accent))}.arc-art{position:relative;aspect-ratio:16/10;background:var(--hero-bg);color:var(--hover,var(--accent));overflow:hidden}.arc-art svg{position:absolute;inset:0;width:100%;height:100%}.arc-body{display:flex;flex-direction:column;flex:1;padding:var(--s5)}.arc-body h3{font-size:var(--text-lg);margin-block:var(--s3) var(--s2)}.arc-body p{color:var(--muted);font-size:var(--text-sm);flex:1}.arc-body .text-link{margin-top:var(--s4)}.archive-empty{padding-block:var(--s16);color:var(--muted);text-align:center;display:none} /* ---------- Article ---------- */ .article{padding-top:clamp(var(--s4),1.5vw,var(--s6));padding-bottom:clamp(var(--s10),5vw,var(--s16))}.back-link{display:inline-flex;min-height:44px;align-items:center;color:var(--muted);font-size:var(--text-sm);font-weight:700}.back-link:hover{color:var(--accent)}.article-header{position:relative;min-height:min(620px,68vh);margin-top:var(--s5);padding:clamp(var(--s6),7vw,var(--s20));display:flex;align-items:flex-end;background:var(--hero-bg);color:var(--hero-ink);border-radius:var(--r-lg);overflow:hidden}.article-header:before{content:"01";position:absolute;right:clamp(var(--s4),4vw,var(--s12));top:clamp(var(--s3),3vw,var(--s8));font-family:var(--font-display);font-size:clamp(7rem,22vw,20rem);line-height:.8;color:color-mix(in oklab,var(--hero-ink) 7%,transparent)}.article-header:after{content:"";position:absolute;left:clamp(var(--s6),7vw,var(--s20));top:20%;width:22%;height:4px;background:var(--accent)}.article-header h1{position:relative;z-index:1;max-width:18ch;font-size:var(--text-hero);letter-spacing:-.05em} .article-layout{display:grid;grid-template-columns:minmax(0,720px) minmax(260px,1fr);gap:clamp(var(--s8),7vw,var(--s20));align-items:start;padding-block:clamp(var(--s12),7vw,var(--s24))}.prose{font-family:var(--font-body);font-size:clamp(1.05rem,1rem + .25vw,1.18rem);line-height:1.78}.prose>*+*{margin-top:var(--s6)}.prose h2{font-family:var(--font-display);font-size:var(--text-xl);line-height:1.13;margin-top:var(--s16)}.prose ul{padding-left:var(--s6)}.prose li+li{margin-top:var(--s2)}.article-side{position:sticky;top:150px}.side-card{padding:var(--s8);background:var(--surface);border:1px solid color-mix(in oklab,var(--ink) 12%,transparent);border-radius:var(--r-lg)}.side-card strong{font-family:var(--font-display);font-size:var(--text-lg)}.side-card p{margin-block:var(--s3) var(--s6);color:var(--muted);font-size:var(--text-sm)}.side-card .button{width:100%;justify-content:center}.article-ad{grid-column:2}.article-ad .ad-slot{margin-block:0}.article-ad .ad-slot,.article-ad .ad-fallback{min-height:0}.article-ad .ad-fallback{grid-template-columns:1fr;align-items:start}.article-ad .ad-button{justify-self:start} /* ---------- Related ---------- */ .related{padding-block:clamp(var(--s16),8vw,var(--s32));border-top:1px solid color-mix(in oklab,var(--ink) 14%,transparent)}.related-head{display:grid;grid-template-columns:.62fr 1.38fr;gap:var(--s8);align-items:end;margin-bottom:var(--s10)}.related-head h2{font-size:var(--text-2xl)}.related-head p{max-width:42ch;color:var(--muted)}.related-grid{display:grid;grid-template-columns:1.2fr .9fr .9fr;gap:var(--s4)}.related-card{min-height:310px;padding:var(--s6);display:flex;flex-direction:column;background:var(--surface);border:1px solid color-mix(in oklab,var(--ink) 11%,transparent);border-radius:var(--r-lg)}.related-card:first-child{background:var(--hero-bg);color:var(--hero-ink)}.related-card .post-meta{color:inherit;opacity:.68}.related-card h3{font-size:var(--text-lg);margin-block:var(--s6);max-width:18ch}.related-card:first-child .text-link{color:inherit;text-decoration:underline;text-underline-offset:4px}.related-card:first-child h3{font-size:var(--text-xl)}.related-card .text-link{margin-top:auto} /* ---------- Footer ---------- */ .site-footer{margin-top:clamp(var(--s16),8vw,var(--s32));background:var(--hero-bg);color:var(--hero-ink)}.footer-main{display:grid;grid-template-columns:1.35fr .65fr .75fr;gap:clamp(var(--s8),6vw,var(--s20));padding-block:clamp(var(--s16),7vw,var(--s24))}.site-footer .brand-mark{color:var(--accent)}.site-footer .brand-word small,.footer-brand p,.footer-cta p{color:var(--hero-muted)}.footer-brand h2{max-width:16ch;font-size:var(--text-2xl);margin-block:var(--s8) var(--s4)}.footer-brand p{max-width:48ch}.footer-nav,.footer-cta{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s3)}.footer-nav strong,.footer-cta strong{margin-bottom:var(--s2);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.12em}.footer-nav a{min-height:38px;display:flex;align-items:center;color:var(--hero-muted)}.footer-nav a:hover{color:var(--hero-ink)}.footer-cta .button{margin-top:var(--s4);background:var(--accent);color:var(--on)}.footer-bottom{min-height:78px;border-top:1px solid color-mix(in oklab,var(--hero-ink) 16%,transparent);display:flex;justify-content:space-between;align-items:center;gap:var(--s4);font-size:var(--text-xs);color:var(--hero-muted)}.footer-links{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--s5)}.footer-links a:hover{color:var(--hero-ink)} /* ---------- Settings ---------- */ /* ---------- Per-style flourishes ---------- */ [data-style=paper] .feature-card,[data-style=paper] .stack-card,[data-style=paper] .arc-card{box-shadow:7px 7px 0 var(--surface-2)}[data-style=midnight] .hero-visual,[data-style=ocean] .hero-visual{border-radius:3rem 0 3rem 0}[data-style=alpine] .hero-grid{grid-template-columns:.9fr 1.1fr}[data-style=alpine] .hero-visual{order:-1}[data-style=copper] .hero-visual{transform:rotate(1deg)}[data-style=ink] .hero h1,[data-style=swiss] .hero h1,[data-style=swiss] .archive-head h1{font-family:var(--font-body);font-weight:700}[data-style=ink] .feature-card{grid-template-columns:1fr}[data-style=ink] .feature-art{min-height:240px}[data-style=bordeaux] .hero-visual{border-radius:50% 50% 0 0}[data-style=sand] .hero-visual:before{background:repeating-linear-gradient(125deg,transparent 0 28px,color-mix(in oklab,var(--accent) 14%,transparent) 28px 29px)}[data-style=swiss] .hero-grid{grid-template-columns:1fr 1fr}[data-style=swiss] .hero-visual{box-shadow:none;border:4px solid var(--ink)} /* ---------- Responsive ---------- */ @media(max-width:1040px){.header-main{flex-wrap:wrap;row-gap:0}.main-nav{order:3;flex-basis:100%;flex-wrap:wrap;margin-left:0;gap:var(--s4) var(--s6)}.header-actions{margin-left:auto}.hero-grid{grid-template-columns:1fr .8fr}.feature-grid{grid-template-columns:1fr}.stack{grid-template-columns:1fr 1fr}.footer-main{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.article-layout{grid-template-columns:minmax(0,1fr) 280px}.related-grid{grid-template-columns:1fr 1fr}.related-card:last-child{display:none}.arc-grid{grid-template-columns:1fr 1fr}} @media(max-width:760px){.wrap{width:min(calc(100% - 1.25rem),var(--max))}.preview-row>strong,.preview-controls label{display:none}.preview-row{justify-content:flex-end}.hero-grid,.feature-card,.article-layout,.footer-main,.related-head{grid-template-columns:1fr}.hero{padding-top:var(--s12)}.hero-visual{min-height:320px;order:initial!important;transform:none!important}.visual-grid{top:68px}.ad-fallback{grid-template-columns:1fr;align-items:start}.ad-button{justify-self:start}.editorial-head{align-items:start;flex-direction:column}.editorial-head>p{text-align:left}.stack{grid-template-columns:1fr 1fr}.feature-art{min-height:250px}.article-side{position:static}.article-ad{grid-column:auto}.article-header{min-height:440px}.related-grid{grid-template-columns:1fr}.related-card:last-child{display:flex}.footer-bottom{align-items:flex-start;flex-direction:column;padding-block:var(--s5)}.footer-links{justify-content:flex-start}.row-post{grid-template-columns:75px minmax(0,1fr) auto;gap:var(--s4)}.arc-grid{grid-template-columns:1fr}} @media(max-width:560px){.preview-control span,.brand-word small{display:none}.preview-controls select{max-width:154px}.header-cta{display:none}.header-main{gap:var(--s3)}.pi-lang{flex-wrap:wrap;gap:6px}.pi-lang .lang-button,.icon-button{height:38px;min-width:38px;padding-inline:var(--s2);font-size:var(--text-xs)}.main-nav{gap:var(--s2) var(--s5)}.main-nav a{min-height:40px}.header-main{min-height:64px}.hero h1{font-size:clamp(2.6rem,13vw,4rem)}.hero-copy{font-size:var(--text-base)}.hero-actions .button{width:100%}.stack{grid-template-columns:1fr}.ad-slot,.ad-fallback{min-height:250px}.row-post{grid-template-columns:55px minmax(0,1fr)}.row-copy p{display:none}.article-header{min-height:390px;padding:var(--s6)}.article-header h1{font-size:clamp(2rem,9.5vw,3.2rem);overflow-wrap:anywhere}.article-header:after{left:var(--s6)}.search-form{flex-wrap:wrap}.search-form .button{width:100%}.settings{padding:var(--s4)}} @media(prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}} /* ================= Мост для разметки WordPress ================= */ /* Раскладка ядра WP: constrained-группы не должны ограничивать ширину элементов прототипа — ширину задаёт .wrap и сетки прототипа. */ .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)){max-width:none;margin-left:0 !important;margin-right:0 !important} /* Меню (wp:block-navigation): списки «прозрачны» для flex/grid раскладки прототипа. */ .main-nav ul,.mobile-nav ul,.footer-nav ul{display:contents;list-style:none} .main-nav li,.mobile-nav li,.footer-nav li{display:contents} .main-nav li li,.mobile-nav li li,.footer-nav li li{display:contents} .main-nav .wp-block-navigation__submenu-icon,.mobile-nav .wp-block-navigation__submenu-icon,.footer-nav .wp-block-navigation__submenu-icon{display:none} /* Поиск (wp:search) в панели шапки — как нативная форма прототипа. */ .search-form .wp-block-search__inside-wrapper,.search-form .wp-block-search__button-wrapper{display:contents} .search-form .wp-block-search__label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0} .search-form .wp-block-search__button{min-height:48px;border:1px solid transparent;background:var(--accent);color:var(--on);border-radius:var(--r-sm);padding:var(--s3) var(--s5);font-size:var(--text-sm);font-weight:800;cursor:pointer} .search-form .wp-block-search__button:hover{background:var(--accent-hover)} /* Переключатель языков (Polylang) в стиле lang-button прототипа. */ .pi-lang{display:flex;align-items:center;gap:var(--s2)} .pi-lang .lang-button{text-decoration:none;line-height:1;padding-inline:var(--s3);font-size:var(--text-sm);font-weight:800} .pi-lang .lang-button[aria-current]{background:var(--accent);color:var(--on);border-color:transparent} /* Переключатель светлый/тёмный режим. */ .pi-theme-toggle .pi-moon{display:none} [data-theme=dark] .pi-theme-toggle .pi-moon{display:block} [data-theme=dark] .pi-theme-toggle .pi-sun{display:none} /* Партнёрская кнопка без ссылки (комплаенс не подтверждён) — нейтральная. */ .pi-button--disabled{opacity:.5;cursor:default;pointer-events:none} /* Закреплённая мобильная кнопка. */ .pi-sticky{position:fixed;left:50%;bottom:var(--s5);z-index:60;transform:translate(-50%,140%);transition:transform 260ms cubic-bezier(.16,1,.3,1)} .pi-sticky.is-visible{transform:translate(-50%,0)} .pi-sticky .button,.pi-sticky .pi-button--disabled{box-shadow:0 12px 34px color-mix(in oklab,#000 30%,transparent)} /* Индикатор чтения. */ .pi-progress{position:fixed;top:0;left:0;z-index:50;height:3px;width:0;background:var(--accent)} /* Админ-панель WordPress не должна перекрывать закреплённую шапку. */ body.admin-bar .site-header{top:32px} @media screen and (max-width:782px){body.admin-bar .site-header{top:46px}} /* Контент записей (wp:post-content внутри .prose). */ .prose a{text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:3px} .prose .alignwide{width:calc(100% + 12vw);max-width:none;margin-inline:-6vw} .prose .alignfull{width:100vw;max-width:none;margin-inline:calc(50% - 50vw)} .prose figure{margin-block:var(--s6)} .prose figcaption{margin-top:var(--s3);font-size:var(--text-sm);color:var(--muted)} .prose blockquote{padding:var(--s5) var(--s6);background:var(--surface);border-left:4px solid var(--accent);border-radius:var(--r-md);font-size:var(--text-lg)} .prose table{width:100%;border-collapse:collapse;font-size:var(--text-sm)} .prose th,.prose td{padding:var(--s3) var(--s4);border-bottom:1px solid color-mix(in oklab,var(--ink) 12%,transparent);text-align:left} .prose hr{border:none;border-top:1px solid color-mix(in oklab,var(--ink) 14%,transparent);margin-block:var(--s10)} .prose code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92em;background:var(--surface-2);padding:.15em .4em;border-radius:var(--r-sm)} .prose pre{overflow:auto;background:var(--surface);border:1px solid color-mix(in oklab,var(--ink) 12%,transparent);border-radius:var(--r-md);padding:var(--s5)} .prose pre code{background:none;padding:0} /* Рубрики под статьёй (wp:post-terms). */ .wp-block-post-terms{margin-top:var(--s10)} .wp-block-post-terms a{display:inline-flex;min-height:36px;align-items:center;padding-inline:var(--s3);border:1px solid color-mix(in oklab,var(--ink) 14%,transparent);border-radius:var(--r-sm);color:var(--muted);font-size:var(--text-xs);font-weight:700;text-decoration:none} .wp-block-post-terms a:hover{border-color:var(--accent);color:var(--accent)} /* Паттерны: предупреждение о рисках и партнёрское раскрытие. */ .pi-warning{margin-top:var(--s8);padding:var(--s5) var(--s6);background:var(--surface-2);border-left:4px solid var(--accent);border-radius:var(--r-md);font-size:var(--text-sm)} .pi-disclosure{margin-top:var(--s8);color:var(--muted);font-size:var(--text-sm)} /* Пагинация архива: ссылки ведут себя как кнопки прототипа. */ .pagination .page{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:inherit} .pagination .page, .pagination span.page{padding:0 var(--s2)} @media(prefers-reduced-motion:reduce){.pi-sticky{transition:none}} /* Служебный текст для скринридеров (как в ядре WordPress). */ .screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute !important;word-wrap:normal !important} .screen-reader-text:focus{background-color:var(--surface);clip:auto !important;clip-path:none;color:var(--ink);display:block;font-size:1em;height:auto;left:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}