html / index.html
Unmid's picture
Update index.html
e5e3a8b verified
Raw
History Blame Contribute Delete
42.6 kB
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="One-to-one body and mind coaching for adults 35+. Build habits that work in real life.">
<meta name="theme-color" content="#0c0c0d">
<title>Pure Body Transformation — Stop Starting Again</title>
<style>
:root{
--ink:#0c0c0d;--ink-2:#161618;--paper:#fbfaf8;--cloud:#f2f1ee;--line:#dfdcd7;
--text:#181719;--muted:#6f6a66;--red:#ed2639;--red-dark:#c91528;--red-soft:#ffeaec;
--orange:#ff8a3d;--lime:#d6fc70;--white:#fff;--shadow:0 24px 60px rgba(15,13,13,.13);
--radius:28px;--wrap:1200px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:var(--paper);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased} body.modal-open{overflow:hidden} button,input,select{font:inherit} button{cursor:pointer} a{color:inherit;text-decoration:none} img{display:block;max-width:100%}
::selection{background:var(--red);color:#fff}.skip{position:fixed;z-index:1000;top:10px;left:10px;transform:translateY(-160%);background:#fff;padding:10px 15px;border-radius:8px;font-weight:800}.skip:focus{transform:translateY(0)}
.wrap{width:min(var(--wrap),calc(100% - 48px));margin-inline:auto}.topline{background:var(--red);color:#fff;text-align:center;font-size:12px;font-weight:850;letter-spacing:.1em;text-transform:uppercase;padding:10px 16px}.topline b{color:#fff7c7}
.nav{height:78px;display:flex;align-items:center;justify-content:space-between;gap:28px;position:relative}.nav-shell{position:sticky;top:0;z-index:50;background:rgba(251,250,248,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(223,220,215,.9)}
.brand{font-size:16px;letter-spacing:-.045em;font-weight:950;line-height:.93;display:inline-grid;text-transform:uppercase}.brand span{color:var(--red)}.brand small{font-size:8px;letter-spacing:.19em;color:var(--muted);margin-top:5px;font-weight:800}.nav-links{display:flex;align-items:center;gap:25px}.nav-links>a:not(.btn){font-size:13px;color:#4c4845;font-weight:750;transition:color .2s}.nav-links>a:not(.btn):hover{color:var(--red)}
.btn{border:0;border-radius:999px;min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:13px 21px;font-size:13px;line-height:1;font-weight:900;letter-spacing:.01em;transition:transform .22s ease,box-shadow .22s ease,background .22s ease}.btn:hover{transform:translateY(-2px)}.btn:focus-visible,.menu-button:focus-visible,.icon-btn:focus-visible,.faq-q:focus-visible{outline:3px solid #151515;outline-offset:3px}.btn-primary{background:var(--red);color:#fff;box-shadow:0 11px 24px rgba(237,38,57,.23)}.btn-primary:hover{background:var(--red-dark);box-shadow:0 14px 30px rgba(237,38,57,.3)}.btn-dark{background:var(--ink);color:#fff}.btn-dark:hover{box-shadow:0 15px 32px rgba(0,0,0,.22)}.btn-light{background:#fff;color:var(--ink)}.btn-outline{border:1px solid rgba(255,255,255,.45);color:#fff;background:transparent}.btn-outline:hover{background:#fff;color:var(--ink)}.arrow{font-size:18px;line-height:0}.menu-button{display:none;background:transparent;border:1px solid var(--line);width:43px;height:43px;border-radius:13px;font-size:20px;color:var(--ink)}
.mobile-nav{display:none;padding:0 24px 18px;background:var(--paper);border-top:1px solid var(--line)}.mobile-nav.open{display:grid;gap:5px}.mobile-nav a{padding:12px 4px;font-size:14px;font-weight:800}.mobile-nav .btn{margin-top:8px}
.hero{overflow:hidden;background:var(--ink);color:#fff;position:relative}.hero:before{content:"";position:absolute;pointer-events:none;width:820px;height:820px;right:-355px;top:-405px;border-radius:50%;background:radial-gradient(circle,#ef3041 0 23%,rgba(237,38,57,.25) 24%,transparent 64%)}.hero:after{content:"";position:absolute;pointer-events:none;left:0;right:0;bottom:0;height:160px;background:linear-gradient(transparent,var(--ink))}.hero-grid{min-height:680px;display:grid;grid-template-columns:1.08fr .92fr;gap:46px;align-items:center;position:relative;z-index:1;padding:70px 0 78px}.eyebrow{display:flex;align-items:center;gap:9px;color:#ffbdc3;font-size:11px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}.eyebrow:before{content:"";width:21px;height:2px;background:currentColor}.hero h1,.display{font-size:clamp(44px,6vw,78px);letter-spacing:-.075em;line-height:.92;margin:18px 0 22px;font-weight:950}.hero h1 em{font-style:normal;color:#ff5260}.hero-copy{font-size:18px;line-height:1.55;color:#e6e1df;max-width:625px;margin:0}.hero-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:32px 0 19px}.hero-note{font-size:12px;color:#aaa5a2;display:flex;align-items:center;gap:8px}.hero-note:before{content:"✓";display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:var(--lime);color:#131313;font-size:11px;font-weight:900}.hero-proof{display:flex;align-items:center;gap:13px;margin-top:38px}.avatars{display:flex}.avatars span{width:29px;height:29px;border:2px solid var(--ink);border-radius:50%;display:grid;place-items:center;margin-right:-8px;color:#fff;font-size:10px;font-weight:900;background:#514e4d}.avatars span:nth-child(2){background:#e7565c}.avatars span:nth-child(3){background:#d19b69}.avatars span:nth-child(4){background:#678a70}.hero-proof div:last-child{font-size:12px;color:#d9d4d1}.hero-proof b{display:block;color:#fff;font-size:13px}.hero-visual{min-height:470px;position:relative}.red-orbit{position:absolute;left:3%;top:2%;width:92%;aspect-ratio:1;border:1px solid rgba(255,255,255,.18);border-radius:50%;animation:spin 20s linear infinite}.red-orbit:before,.red-orbit:after{content:"";position:absolute;width:11px;height:11px;background:var(--red);border-radius:50%}.red-orbit:before{left:15%;top:8%}.red-orbit:after{right:12%;bottom:14%;background:var(--lime)}.hero-photo{position:absolute;inset:28px 6% 0 16%;overflow:hidden;border-radius:180px 180px 22px 22px;background:#2b2929}.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center}
.trust-strip{background:var(--ink-2);color:#fff;padding:21px 0;border-top:1px solid rgba(255,255,255,.08);position:relative}.trust-strip .wrap{display:grid;grid-template-columns:1.1fr repeat(3,1fr);gap:20px;align-items:center}.trust-heading{font-size:12px;line-height:1.35;color:#aaa}.trust-heading b{font-size:13px;color:#fff;display:block}.stat{border-left:1px solid rgba(255,255,255,.15);padding-left:20px}.stat b{font-size:22px;letter-spacing:-.06em;display:block}.stat span{font-size:11px;color:#aaa}
section{padding:110px 0}.section-kicker{font-size:11px;letter-spacing:.15em;color:var(--red);font-weight:950;text-transform:uppercase}.section-title{font-size:clamp(34px,4.5vw,59px);font-weight:950;letter-spacing:-.07em;line-height:.98;margin:11px 0 15px;max-width:780px}.section-lead{max-width:615px;color:var(--muted);font-size:16px;margin:0}.center{text-align:center;margin-inline:auto}.center .section-title{margin-left:auto;margin-right:auto}.center .section-lead{margin-left:auto;margin-right:auto}
.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.marker{display:inline-grid;place-items:center;width:45px;height:45px;border-radius:50%;background:var(--red-soft);color:var(--red);font-weight:950;margin-bottom:20px}.quote-card{padding:34px;border-radius:var(--radius);background:var(--cloud);position:relative}.quote-card:before{content:"“";position:absolute;right:23px;top:-28px;color:var(--red);font-family:Georgia,serif;font-size:160px;line-height:1}.quote-card blockquote{position:relative;font-size:clamp(24px,3vw,35px);letter-spacing:-.05em;line-height:1.1;font-weight:900;margin:0 0 28px;max-width:495px}.quote-person{display:flex;gap:10px;align-items:center;position:relative}.quote-person i{display:block;width:31px;height:31px;border-radius:50%;background:linear-gradient(135deg,#e17d59,#563a31)}.quote-person b{font-size:12px}.quote-person span{display:block;font-size:11px;color:var(--muted)}.problem-list{display:grid;gap:13px;margin-top:31px}.problem{border-bottom:1px solid var(--line);padding:0 0 13px;display:flex;gap:13px;align-items:baseline}.problem span{color:var(--red);font-weight:950}.problem b{font-size:15px}.problem p{margin:4px 0 0;color:var(--muted);font-size:13px}
.dark-section{background:var(--ink);color:#fff;position:relative;overflow:hidden}.dark-section:after{content:"";width:420px;height:420px;position:absolute;border:70px solid rgba(237,38,57,.15);border-radius:50%;right:-180px;bottom:-210px}.dark-section .section-kicker{color:#ff8d96}.dark-section .section-lead{color:#bab5b2}.system-grid{margin-top:47px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;position:relative;z-index:1}.system-card{min-height:235px;border:1px solid rgba(255,255,255,.15);border-radius:21px;padding:21px;background:rgba(255,255,255,.04);display:flex;flex-direction:column;transition:transform .25s,background .25s}.system-card:hover{transform:translateY(-6px);background:rgba(255,255,255,.09)}.system-no{width:31px;height:31px;border-radius:50%;background:#fff;color:#111;display:grid;place-items:center;font-size:11px;font-weight:950}.system-card:nth-child(2) .system-no{background:var(--lime)}.system-card:nth-child(3) .system-no{background:var(--orange)}.system-card:nth-child(4) .system-no{background:#fa9ba4}.system-card h3{font-size:22px;letter-spacing:-.05em;line-height:1;margin:42px 0 10px}.system-card p{font-size:13px;line-height:1.52;color:#c9c4c1;margin:0}.system-end{font-size:13px;color:#d6fc70;margin:29px 0 0;font-weight:800}
.results-section{background:#f1efeb}.results-grid{display:grid;grid-template-columns:.77fr 1.23fr;gap:40px;align-items:end}.results-aside .section-title{font-size:clamp(36px,4.2vw,56px)}.results-aside .btn{margin-top:26px}.results-disclaimer{margin-top:17px;color:#817b76;font-size:11px}
.tools{background:var(--red);color:#fff;overflow:hidden;position:relative}.tools:before{content:"PBT";position:absolute;right:-22px;top:-104px;font-size:270px;line-height:1;letter-spacing:-.18em;font-weight:950;color:rgba(255,255,255,.1)}.tools-head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;position:relative}.tools .section-kicker{color:#ffced2}.tools .section-title{max-width:730px}.tools .section-lead{color:#ffe7e9}.tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:44px;position:relative}.tool-card{min-height:355px;background:#fff;border-radius:var(--radius);padding:30px;color:var(--ink);position:relative;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 16px 32px rgba(86,7,16,.13)}.tool-card:after{content:"";position:absolute;width:235px;height:235px;right:-100px;bottom:-130px;border-radius:50%;background:var(--red-soft)}.tool-card:nth-child(2):after{background:#eefbd1}.tool-number{font-size:11px;font-weight:950;letter-spacing:.16em;color:var(--red);text-transform:uppercase}.tool-icon{margin:33px 0 22px;width:52px;height:52px;border-radius:17px;background:var(--ink);display:grid;place-items:center;color:#fff;font-size:24px}.tool-card:nth-child(2) .tool-icon{background:#e6ffac;color:#111}.tool-card h3{font-size:30px;letter-spacing:-.07em;line-height:.95;margin:0 0 12px;max-width:365px}.tool-card p{font-size:14px;color:var(--muted);max-width:430px;margin:0 0 23px}.tool-card .btn{width:max-content;margin-top:auto;position:relative;z-index:2}.tool-card .btn-primary{box-shadow:none}
.path{background:var(--paper)}.path-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:44px}.path-card{border:1px solid var(--line);background:#fff;padding:25px;border-radius:20px}.path-card.featured{background:var(--ink);border-color:var(--ink);color:#fff}.path-card .round{width:33px;height:33px;display:grid;place-items:center;border-radius:50%;background:var(--red-soft);color:var(--red);font-size:12px;font-weight:950}.path-card.featured .round{background:var(--lime);color:#111}.path-card h3{font-size:24px;letter-spacing:-.06em;margin:34px 0 9px;line-height:1}.path-card p{font-size:13px;color:var(--muted);margin:0}.path-card.featured p{color:#cac5c3}.path-line{margin-top:31px;border-top:1px dashed #cfcac6;position:relative;height:1px}.path-line:before{content:"";position:absolute;top:-4px;left:0;width:7px;height:7px;border-radius:50%;background:var(--red)}.path-card .mini-link{display:inline-flex;color:var(--red);font-size:12px;font-weight:900;margin-top:22px}.path-card.featured .mini-link{color:var(--lime)}
.programme{background:#eae7e2}.programme-grid{margin-top:43px;display:grid;grid-template-columns:1fr 1.05fr;gap:18px;align-items:stretch}.plan{border:1px solid var(--line);border-radius:26px;padding:30px;background:#fff;display:flex;flex-direction:column}.plan.hot{background:var(--ink);border-color:var(--ink);color:#fff;box-shadow:var(--shadow);position:relative}.plan-top{display:flex;justify-content:space-between;align-items:center;gap:10px}.plan-label{font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--red);font-weight:950}.plan.hot .plan-label{color:#ff9ba4}.popular{background:var(--lime);padding:6px 10px;border-radius:99px;color:#111;font-size:10px;font-weight:950;text-transform:uppercase}.plan h3{font-size:38px;letter-spacing:-.07em;line-height:1;margin:26px 0 10px}.plan .intro{font-size:14px;color:var(--muted);max-width:410px}.plan.hot .intro{color:#d3cecb}.price{font-size:38px;line-height:1;font-weight:950;letter-spacing:-.07em;margin:25px 0 3px}.price small{font-size:14px;font-weight:800;letter-spacing:0}.price-note{font-size:11px;color:var(--muted);margin-bottom:21px}.plan.hot .price-note{color:#a8a29f}.plan ul{list-style:none;padding:0;margin:0 0 24px;display:grid;gap:11px;flex:1}.plan li{font-size:13px;padding-left:23px;position:relative}.plan li:before{content:"✓";position:absolute;left:0;color:var(--red);font-weight:950}.plan.hot li:before{color:var(--lime)}.plan .btn{width:100%}
.about{background:#fff}.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:74px;align-items:center}.about-mark{min-height:420px;border-radius:30px;background:var(--ink);position:relative;overflow:hidden;display:flex;align-items:flex-end;padding:34px}.about-mark:before{content:"PBT";font-size:135px;letter-spacing:-.16em;color:var(--red);line-height:1;font-weight:950;position:absolute;left:0;top:64px}.about-mark:after{content:"";position:absolute;width:385px;height:385px;border:1px solid rgba(255,255,255,.28);border-radius:50%;left:-112px;top:-100px}.about-mark span{position:relative;color:#fff;font-size:24px;line-height:1.08;letter-spacing:-.05em;font-weight:900;max-width:220px}.about-mark i{position:absolute;right:35px;bottom:36px;width:74px;height:74px;border-radius:50%;background:var(--lime);display:grid;place-items:center;color:#111;font-size:32px;font-style:normal}.about-copy p{color:var(--muted);font-size:15px;max-width:580px}.credentials{display:flex;flex-wrap:wrap;gap:8px;margin-top:25px}.credential{font-size:11px;font-weight:800;background:var(--cloud);border-radius:99px;padding:9px 12px}
.faq-section{background:var(--cloud)}.faq-grid{display:grid;grid-template-columns:.74fr 1.26fr;gap:70px}.faq-list{border-top:1px solid var(--line)}.faq-item{border-bottom:1px solid var(--line)}.faq-q{background:transparent;border:0;width:100%;padding:21px 0;display:flex;text-align:left;align-items:center;justify-content:space-between;gap:25px;color:var(--ink);font-size:16px;font-weight:850}.faq-q span:last-child{font-size:25px;font-weight:400;color:var(--red);transition:transform .2s}.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .25s}.faq-a>div{overflow:hidden}.faq-a p{color:var(--muted);font-size:14px;line-height:1.6;margin:0 0 20px;max-width:600px}.faq-item.open .faq-a{grid-template-rows:1fr}.faq-item.open .faq-q span:last-child{transform:rotate(45deg)}
.final{padding:80px 0;background:var(--paper)}.final-box{border-radius:32px;background:linear-gradient(130deg,#0c0c0d,#222022);color:#fff;padding:55px 6%;position:relative;overflow:hidden;text-align:center}.final-box:after{content:"";position:absolute;top:-195px;right:-120px;width:430px;height:430px;border-radius:50%;border:60px solid rgba(237,38,57,.55)}.final-box>*{position:relative;z-index:1}.final-box .section-kicker{color:#ffa8b0}.final-box .section-title{max-width:700px;margin-left:auto;margin-right:auto}.final-box p{max-width:590px;margin:0 auto;color:#d9d4d1}.form-grid{max-width:680px;margin:30px auto 0;display:grid;grid-template-columns:1fr 1fr auto;gap:9px}.form-grid input{border:1px solid transparent;border-radius:99px;min-width:0;padding:0 17px;height:48px;outline:none;color:#111}.form-grid input:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(237,38,57,.2)}.form-grid .btn{height:48px}.form-note{font-size:11px;color:#a7a19e;margin-top:14px}.footer{background:#080809;color:#aaa;padding:30px 0}.footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px}.footer .brand{color:#fff}.footer p{font-size:11px;margin:0;text-align:right}
.modal{display:none;position:fixed;z-index:100;inset:0;padding:20px;background:rgba(6,6,7,.72);backdrop-filter:blur(9px)}.modal.open{display:flex;align-items:center;justify-content:center}.modal-box{width:min(980px,100%);height:min(890px,calc(100dvh - 40px));position:relative;border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 32px 100px rgba(0,0,0,.4)}.modal-top{height:55px;display:flex;align-items:center;justify-content:space-between;padding:0 15px 0 22px;background:#111;color:#fff}.modal-title{font-size:12px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.modal-close{border:0;border-radius:50%;background:#fff;color:#111;width:33px;height:33px;font-size:22px;line-height:1}.modal iframe{width:100%;height:calc(100% - 55px);border:0;display:block;background:#fff}.toast{visibility:hidden;opacity:0;position:fixed;z-index:300;left:50%;bottom:92px;transform:translate(-50%,15px);background:#fff;color:#151515;padding:14px 18px;border-radius:13px;box-shadow:var(--shadow);font-size:13px;font-weight:750;transition:.25s}.toast.show{visibility:visible;opacity:1;transform:translate(-50%,0)}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease}.reveal.visible{opacity:1;transform:none}@keyframes float{50%{transform:translateY(-10px)}}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@media(max-width:980px){.nav-links>a:not(.btn){display:none}.hero-grid,.intro-grid,.about-grid,.faq-grid{grid-template-columns:1fr;gap:35px}.hero-grid{padding:64px 0 70px}.hero-visual{max-width:600px;width:100%;justify-self:center;min-height:440px}.trust-strip .wrap{grid-template-columns:repeat(3,1fr)}.trust-heading{grid-column:1/-1;text-align:center}.system-grid{grid-template-columns:repeat(2,1fr)}.results-grid{grid-template-columns:1fr;gap:30px}.results-aside{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:end}.results-aside .btn{margin:0}.about-grid{gap:44px}.about-mark{max-width:540px;min-height:320px}.about-mark:before{font-size:105px}.faq-grid{gap:25px}.tool-grid{gap:14px}.programme-grid{grid-template-columns:1fr 1fr}}
@media(max-width:650px){.wrap{width:min(100% - 34px,var(--wrap))}.topline{font-size:10px}.nav{height:64px}.menu-button{display:block}.nav-links{display:none}.brand{font-size:14px}.hero-grid{padding:48px 0 55px}.hero h1{font-size:48px}.hero-copy{font-size:16px}.hero-actions{display:grid;grid-template-columns:1fr;margin-top:27px}.hero-actions .btn{width:100%}.hero-visual{min-height:350px;margin-top:10px}.hero-photo{inset:25px 7% 0 13%}.trust-strip .wrap{grid-template-columns:1fr 1fr;gap:18px}.stat{border-left:0;padding-left:0}.stat b{font-size:19px}section{padding:74px 0}.section-title{font-size:39px}.intro-grid{gap:30px}.quote-card{padding:26px}.quote-card blockquote{font-size:26px}.system-grid{grid-template-columns:1fr 1fr;gap:9px;margin-top:31px}.system-card{min-height:215px;padding:16px}.system-card h3{font-size:19px;margin-top:33px}.system-card p{font-size:12px}.results-aside{display:block}.results-aside .btn{margin-top:23px}.tools-head{display:block}.tool-grid,.programme-grid,.path-grid{grid-template-columns:1fr}.tool-card{min-height:310px;padding:26px}.tool-card h3{font-size:27px}.path-grid{margin-top:31px}.path-card h3{margin-top:27px}.about-mark{min-height:280px}.about-mark:before{font-size:92px}.about-mark span{font-size:21px}.faq-q{font-size:15px}.final{padding:55px 0}.final-box{padding:42px 18px}.form-grid{grid-template-columns:1fr}.form-grid input{width:100%}.footer .wrap{display:block}.footer p{text-align:left;margin-top:16px}.modal{padding:8px}.modal-box{height:calc(100dvh - 16px);border-radius:16px}.modal-top{height:50px;padding-left:15px}.modal iframe{height:calc(100% - 50px)}.modal-title{font-size:10px}.toast{width:calc(100% - 34px);bottom:72px;text-align:center}.path-card.featured{order:-1}}
/* Image-first transformation treatment — no copy, gradients or labels ever sit over a before/after image. */
.hero-photo{border-radius:54px 54px 22px 22px;box-shadow:0 26px 65px rgba(0,0,0,.28);will-change:transform;transform:translate3d(0,var(--parallax,0px),0)}
.hero-photo:after{display:none}.hero-photo img{filter:none}
.gallery-shell{min-width:0}.result-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;align-items:start}.gallery-column{display:grid;gap:15px;align-content:start}.gallery-tile{margin:0;overflow:hidden;border-radius:20px;background:#d9d6d2;box-shadow:0 14px 33px rgba(24,20,17,.11);will-change:transform;transform:translate3d(0,calc(var(--parallax,0px) + var(--hover-y,0px)),0);transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s ease}.gallery-tile:hover{--hover-y:-7px;box-shadow:0 22px 42px rgba(24,20,17,.17)}.gallery-tile img{width:100%;height:100%;object-fit:cover;border-radius:20px}.gallery-tile--portrait{height:345px}.gallery-tile--landscape{height:198px}.gallery-tile--square{height:255px}.gallery-tile--tall{height:405px}.gallery-tile--medium{height:280px}.results-disclaimer{max-width:580px}.results-gallery+ .results-disclaimer{margin-top:25px}
@media(max-width:980px){.result-gallery{max-width:690px}.gallery-tile--portrait{height:320px}.gallery-tile--landscape{height:185px}.gallery-tile--square{height:235px}.gallery-tile--tall{height:375px}.gallery-tile--medium{height:260px}}
@media(max-width:650px){.hero-photo{border-radius:40px 40px 18px 18px}.result-gallery{gap:9px}.gallery-column{gap:9px}.gallery-tile,.gallery-tile img{border-radius:15px}.gallery-tile--portrait{height:210px}.gallery-tile--landscape{height:120px}.gallery-tile--square{height:157px}.gallery-tile--tall{height:248px}.gallery-tile--medium{height:176px}}
</style>
</head>
<body>
<a class="skip" href="#main">Skip to content</a>
<div class="topline">24-week 1-to-1 Body + Mind Coaching — <b>for adults 35+</b></div>
<div class="nav-shell">
<nav class="wrap nav" aria-label="Primary navigation">
<a class="brand" href="#top" aria-label="Pure Body Transformation home">Pure Body <span>Transformation</span><small>Body + Mind Coaching</small></a>
<div class="nav-links">
<a href="#method">The Method</a><a href="#results">Results</a><a href="#tools">Free Tools</a><a href="#programmes">Programmes</a>
<a class="btn btn-primary" href="#apply">Apply for a Fit Call <span class="arrow">→</span></a>
</div>
<button class="menu-button" id="menuButton" aria-label="Open menu" aria-expanded="false">☰</button>
</nav>
<div class="mobile-nav" id="mobileNav"><a href="#method">The Method</a><a href="#results">Results</a><a href="#tools">Free Tools</a><a href="#programmes">Programmes</a><a class="btn btn-primary" href="#apply">Apply for a Fit Call <span class="arrow">→</span></a></div>
</div>
<main id="main">
<header class="hero" id="top">
<div class="wrap hero-grid">
<div class="reveal">
<div class="eyebrow">For men & women ready for lasting change</div>
<h1>Stop starting <em>again.</em></h1>
<p class="hero-copy">Lose weight, get stronger and build a system that still works when work, weekends and real life get in the way.</p>
<div class="hero-actions"><a class="btn btn-primary" href="#apply">Apply for a PBT Fit Call <span class="arrow">→</span></a><a class="btn btn-outline" href="#method">See how it works</a></div>
<div class="hero-note">No pressure. An application does not commit you to joining.</div>
<div class="hero-proof"><div class="avatars"><span>J</span><span>S</span><span>M</span><span>+</span></div><div><b>Built around real lives, not perfect weeks.</b>Personal coaching. Practical systems. Sustainable change.</div></div>
</div>
<div class="hero-visual reveal" aria-label="PBT client transformation">
<div class="red-orbit"></div>
<div class="hero-photo parallax-item" data-speed="-0.025"><img src="assets/client-1.jpg" alt="PBT client before and after progress" fetchpriority="high"></div>
</div>
</div>
</header>
<div class="trust-strip"><div class="wrap"><div class="trust-heading"><b>One Coach. One System.</b>Nutrition, strength, habits & mindset — working together.</div><div class="stat"><b>35+</b><span>Clear client focus</span></div><div class="stat"><b>24 weeks</b><span>Time to build change</span></div><div class="stat"><b>1-to-1</b><span>Personal accountability</span></div></div></div>
<section class="intro" id="method"><div class="wrap intro-grid"><div class="reveal"><div class="marker">01</div><div class="section-kicker">A different way forward</div><h2 class="section-title">The issue isn’t that you don’t know enough.</h2><p class="section-lead">You may already know what to eat and that you should exercise. The hard part is staying with it when life gets busy.</p><div class="problem-list"><div class="problem"><span>—</span><div><b>Plans that only work on perfect days</b><p>Rigid routines often disappear the moment life gets demanding.</p></div></div><div class="problem"><span>—</span><div><b>The all-or-nothing loop</b><p>One unplanned meal becomes a reason to start again next Monday.</p></div></div><div class="problem"><span>—</span><div><b>Going it alone</b><p>Consistency takes a clearer system and someone in your corner.</p></div></div></div></div><aside class="quote-card reveal"><blockquote>“The plan has to work with your real life — not compete with it.”</blockquote><div class="quote-person"><i></i><div><b>Dipak Joshi</b><span>Founder, Pure Body Transformation</span></div></div></aside></div></section>
<section class="dark-section"><div class="wrap"><div class="section-kicker">The PBT system</div><h2 class="section-title">Body + Mind.<br>One complete approach.</h2><p class="section-lead">We connect the pieces that make progress stick, rather than handing you another short-term plan.</p><div class="system-grid"><article class="system-card reveal"><div class="system-no">01</div><h3>Eat with freedom</h3><p>Simple nutrition around familiar food, portions and real schedules — without extreme rules.</p></article><article class="system-card reveal"><div class="system-no">02</div><h3>Get stronger</h3><p>Progressive home or gym training built around your body, ability and available time.</p></article><article class="system-card reveal"><div class="system-no">03</div><h3>Build your reset</h3><p>Tools for weekends, holidays, stress and setbacks so a difficult moment doesn’t undo your progress.</p></article><article class="system-card reveal"><div class="system-no">04</div><h3>Stay accountable</h3><p>Personal coaching that keeps the plan clear, flexible and moving forward.</p></article></div><p class="system-end">The goal: habits you can keep, not rules you can only follow for a while. →</p></div></section>
<section class="results-section" id="results"><div class="wrap results-grid"><div class="results-aside reveal"><div><div class="section-kicker">Proof first</div><h2 class="section-title">Real people.<br>Real change.</h2><p class="section-lead">Different starting points. One goal: progress that works in the real world.</p></div><a class="btn btn-dark" href="#apply">Start your own chapter <span class="arrow">→</span></a></div><div class="gallery-shell reveal"><div class="result-gallery" aria-label="PBT client before and after transformation gallery"><div class="gallery-column"><figure class="gallery-tile gallery-tile--portrait parallax-item" data-speed="-0.036"><img src="assets/client-2.jpg" alt="PBT client before and after transformation" loading="lazy"></figure><figure class="gallery-tile gallery-tile--landscape parallax-item" data-speed="0.025"><img src="assets/client-4.jpg" alt="PBT client before and after transformation" loading="lazy"></figure></div><div class="gallery-column"><figure class="gallery-tile gallery-tile--landscape parallax-item" data-speed="0.03"><img src="assets/client-3.jpg" alt="PBT client before and after transformation" loading="lazy"></figure><figure class="gallery-tile gallery-tile--tall parallax-item" data-speed="-0.026"><img src="assets/client-5.jpg" alt="PBT client before and after transformation" loading="lazy"></figure></div><div class="gallery-column"><figure class="gallery-tile gallery-tile--medium parallax-item" data-speed="-0.034"><img src="assets/client-6.jpg" alt="PBT client before and after transformation" loading="lazy"></figure><figure class="gallery-tile gallery-tile--square parallax-item" data-speed="0.028"><img src="assets/client-7.jpg" alt="PBT client before and after transformation" loading="lazy"></figure></div></div><div class="results-disclaimer">Before &amp; after images are shown cleanly, without overlays. Use only client stories and photos you have permission to publish. Individual results vary.</div></div></div></section>
<section class="tools" id="tools"><div class="wrap"><div class="tools-head reveal"><div><div class="section-kicker">Complimentary PBT tools</div><h2 class="section-title">Start with a little more clarity.</h2><p class="section-lead">These private, two-minute tools turn uncertainty into a useful starting point — then you can decide what support would help most.</p></div></div><div class="tool-grid"><article class="tool-card reveal"><div class="tool-number">Free personalised tool · 01</div><div class="tool-icon">↯</div><h3>Calorie + Macro Calculator</h3><p>Get a practical daily starting point for calories, protein, carbs, fats and fibre in under two minutes.</p><button class="btn btn-primary" data-modal="calculatorModal">Get my numbers <span class="arrow">→</span></button></article><article class="tool-card reveal"><div class="tool-number">Free personalised tool · 02</div><div class="tool-icon">◎</div><h3>Body + Mind Assessment</h3><p>See the pattern behind your stop-start cycle and uncover three personalised steps for moving forward.</p><button class="btn btn-dark" data-modal="mindModal">Take the assessment <span class="arrow">→</span></button></article></div></div></section>
<section class="path"><div class="wrap"><div class="center reveal"><div class="section-kicker">Your journey with PBT</div><h2 class="section-title">A plan made for real life.</h2><p class="section-lead">No guessing, no generic meal sheet and no pressure to be perfect.</p></div><div class="path-grid"><article class="path-card reveal"><div class="round">01</div><h3>Start with your story</h3><p>We look at what you want to change, what has held you back and what your days actually look like.</p><a class="mini-link" href="#apply">Apply for a Fit Call →</a></article><article class="path-card featured reveal"><div class="round">02</div><h3>Build your system</h3><p>Nutrition, training, mindset and habits are personalised into one clear, practical route forward.</p><a class="mini-link" href="#programmes">Explore PBT Transform →</a></article><article class="path-card reveal"><div class="round">03</div><h3>Adjust — don’t abandon</h3><p>Weekly support helps you learn, adapt and keep your routine alive through real life.</p><a class="mini-link" href="#faq">Read the FAQs →</a></article></div></div></section>
<section class="programme" id="programmes"><div class="wrap"><div class="center reveal"><div class="section-kicker">Clear ways to work together</div><h2 class="section-title">Choose the support that fits.</h2><p class="section-lead">Start with a no-pressure Fit Call to decide whether PBT is right for you.</p></div><div class="programme-grid"><article class="plan reveal"><div class="plan-top"><span class="plan-label">Core programme</span></div><h3>PBT Transform</h3><p class="intro">A 24-week 1-to-1 body + mind coaching programme for lasting change.</p><div class="price">£199 <small>/ month</small></div><div class="price-note">6 monthly payments — or £999 paid in full</div><ul><li>Weekly 1-to-1 coaching</li><li>Personalised nutrition guidance</li><li>Home or gym strength plan</li><li>Mindset & behaviour coaching</li><li>Real-life planning for weekends and setbacks</li><li>Maintenance roadmap</li></ul><a href="#apply" class="btn btn-primary">Apply for PBT Transform <span class="arrow">→</span></a></article><article class="plan hot reveal"><div class="plan-top"><span class="plan-label">Premium programme</span><span class="popular">Highest support</span></div><h3>PBT 360</h3><p class="intro">For clients who want high-touch support and deeper progress tracking.</p><div class="price">£2,500</div><div class="price-note">6-month premium programme</div><ul><li>Everything in PBT Transform</li><li>Higher-touch personal support</li><li>Before & after DEXA where included</li><li>Independent blood testing where included</li><li>Hypnotherapy where appropriate</li><li>Deeper progress review</li></ul><a href="#apply" class="btn btn-light">Ask about PBT 360 <span class="arrow">→</span></a></article></div></div></section>
<section class="about" id="about"><div class="wrap about-grid"><div class="about-mark reveal"><span>Your body. Your mind. Your next chapter.</span><i>↗</i></div><div class="about-copy reveal"><div class="section-kicker">Meet your coach</div><h2 class="section-title">A coach who sees the whole picture.</h2><p>Pure Body Transformation was built from the belief that sustainable progress is about more than food and workouts. It is also about the habits, pressure and self-talk behind your choices.</p><p>Dipak brings physical coaching, nutrition, behaviour and mindset into one focused approach — so you can become stronger in your body and in your mind.</p><div class="credentials"><span class="credential">ICF ACC Coach</span><span class="credential">Personal Trainer</span><span class="credential">Health Coach</span><span class="credential">Clinical Hypnotherapist</span><span class="credential">NLP Practitioner</span></div></div></div></section>
<section class="faq-section" id="faq"><div class="wrap faq-grid"><div class="reveal"><div class="section-kicker">Questions, answered</div><h2 class="section-title">Clear answers before you apply.</h2><p class="section-lead">The Fit Call is always the best place to ask about your own goals and situation.</p></div><div class="faq-list reveal"><div class="faq-item open"><button class="faq-q" aria-expanded="true">Do I need to give up foods I enjoy?<span>+</span></button><div class="faq-a"><div><p>No. PBT is designed around food you can live with. We work on portions, protein, fibre and balance instead of banning foods or giving you a rigid one-size-fits-all meal sheet.</p></div></div></div><div class="faq-item"><button class="faq-q" aria-expanded="false">Do I need to train every day?<span>+</span></button><div class="faq-a"><div><p>No. Your training is built around your body, starting point and the time you genuinely have. Consistency comes from a plan that can adapt to busy weeks.</p></div></div></div><div class="faq-item"><button class="faq-q" aria-expanded="false">What happens when I have a difficult week?<span>+</span></button><div class="faq-a"><div><p>We review what happened, make a smaller adjustment and keep going. One difficult week does not mean you have failed or need to start again.</p></div></div></div><div class="faq-item"><button class="faq-q" aria-expanded="false">Why does the programme run for 24 weeks?<span>+</span></button><div class="faq-a"><div><p>The goal is more than short-term weight loss. The time allows you to build strength, practise habits and create a maintenance plan that has a chance of lasting.</p></div></div></div><div class="faq-item"><button class="faq-q" aria-expanded="false">Is coaching a substitute for medical care?<span>+</span></button><div class="faq-a"><div><p>No. PBT coaching is not medical care and does not diagnose conditions or medically interpret results. Please consult a qualified healthcare professional about medical concerns.</p></div></div></div></div></div></section>
<section class="final" id="apply"><div class="wrap"><div class="final-box reveal"><div class="section-kicker">Your next step</div><h2 class="section-title">You don’t need another perfect Monday.</h2><p>Apply for a free PBT Fit Call. We’ll talk about where you are, what keeps getting in the way and whether the programme is a good fit.</p><form class="form-grid" id="leadForm" novalidate><input id="name" type="text" autocomplete="given-name" placeholder="First name" aria-label="First name" required><input id="email" type="email" autocomplete="email" placeholder="Email address" aria-label="Email address" required><button class="btn btn-primary" type="submit">Apply now <span class="arrow">→</span></button></form><div class="form-note">No pressure. Applying does not commit you to joining. You can unsubscribe at any time.</div></div></div></section>
</main>
<footer class="footer"><div class="wrap"><a class="brand" href="#top">Pure Body <span>Transformation</span><small>Body + Mind Coaching</small></a><p>© 2026 Pure Body Transformation. All rights reserved.<br>Individual results vary. Coaching is not a substitute for medical care.</p></div></footer>
<div class="modal" id="calculatorModal" role="dialog" aria-modal="true" aria-labelledby="calculatorTitle"><div class="modal-box"><div class="modal-top"><div class="modal-title" id="calculatorTitle">PBT personalised calorie + macro calculator</div><button class="modal-close" aria-label="Close calculator">×</button></div><iframe src="calorie-calculator.html" title="PBT calorie and macro calculator" loading="lazy"></iframe></div></div>
<div class="modal" id="mindModal" role="dialog" aria-modal="true" aria-labelledby="mindTitle"><div class="modal-box"><div class="modal-top"><div class="modal-title" id="mindTitle">PBT body + mind assessment</div><button class="modal-close" aria-label="Close assessment">×</button></div><iframe src="body-mind-assessment.html" title="PBT body and mind assessment" loading="lazy"></iframe></div></div>
<div class="toast" id="toast" role="status" aria-live="polite"></div>
<script>
const $ = (s,scope=document) => scope.querySelector(s);
const $$ = (s,scope=document) => [...scope.querySelectorAll(s)];
const menuButton=$('#menuButton'), mobileNav=$('#mobileNav');
menuButton.addEventListener('click',()=>{const open=mobileNav.classList.toggle('open');menuButton.setAttribute('aria-expanded',open);menuButton.textContent=open?'×':'☰'});
$$('.mobile-nav a').forEach(a=>a.addEventListener('click',()=>{mobileNav.classList.remove('open');menuButton.setAttribute('aria-expanded','false');menuButton.textContent='☰'}));
const observer=new IntersectionObserver(entries=>entries.forEach(e=>{if(e.isIntersecting){e.target.classList.add('visible');observer.unobserve(e.target)}}),{threshold:.12});$$('.reveal').forEach(el=>observer.observe(el));
// Gentle scroll parallax gives the image-only gallery depth while keeping every before/after fully unobstructed.
const reducedMotion=window.matchMedia('(prefers-reduced-motion: reduce)').matches;
const parallaxItems=$$('.parallax-item');
if(!reducedMotion && parallaxItems.length){
let parallaxQueued=false;
const updateParallax=()=>{parallaxItems.forEach(item=>{const rect=item.getBoundingClientRect();const fromCentre=rect.top+rect.height/2-window.innerHeight/2;const speed=Number(item.dataset.speed||0);const amount=Math.max(-16,Math.min(16,fromCentre*speed));item.style.setProperty('--parallax',amount.toFixed(2)+'px')});parallaxQueued=false};
const queueParallax=()=>{if(!parallaxQueued){parallaxQueued=true;requestAnimationFrame(updateParallax)}};
window.addEventListener('scroll',queueParallax,{passive:true});window.addEventListener('resize',queueParallax);updateParallax();
}
$$('.faq-q').forEach(button=>button.addEventListener('click',()=>{const item=button.closest('.faq-item'),open=item.classList.toggle('open');button.setAttribute('aria-expanded',open)}));
let lastTrigger;const closeModal=modal=>{modal.classList.remove('open');document.body.classList.remove('modal-open');lastTrigger?.focus()};
$$('[data-modal]').forEach(button=>button.addEventListener('click',()=>{lastTrigger=button;const modal=$('#'+button.dataset.modal);modal.classList.add('open');document.body.classList.add('modal-open');modal.querySelector('.modal-close').focus()}));
$$('.modal').forEach(modal=>{modal.addEventListener('click',e=>{if(e.target===modal)closeModal(modal)});$('.modal-close',modal).addEventListener('click',()=>closeModal(modal))});
document.addEventListener('keydown',e=>{if(e.key==='Escape')$$('.modal.open').forEach(closeModal)});
const toast=$('#toast');let toastTimer;function showToast(message){toast.textContent=message;toast.classList.add('show');clearTimeout(toastTimer);toastTimer=setTimeout(()=>toast.classList.remove('show'),4800)}
$('#leadForm').addEventListener('submit',e=>{e.preventDefault();const name=$('#name').value.trim(),email=$('#email').value.trim();if(!name||!/^\S+@\S+\.\S+$/.test(email)){showToast('Please enter your first name and a valid email address.');return}showToast(`Thanks, ${name}. Your Fit Call request is ready to be connected to your LeadConnector form.`);e.currentTarget.reset()});
</script>
</body>
</html>